/* Canterivo 1.9.4.1 — additive visual polish only.
   This layer must not change navigation, permissions or application logic. */

/* Predictable keyboard focus across existing interactive controls. */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid var(--gold);
  outline-offset:3px;
}

/* Shared buttons: clearer hierarchy without changing their placement. */
.button{
  max-width:100%;
  line-height:1.25;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.button:not(:disabled):active{transform:translateY(1px)}
.button.primary:not(:disabled):hover{filter:brightness(1.08);box-shadow:0 8px 20px rgba(12,48,40,.16)}
.button.secondary:not(:disabled):hover{background:var(--mint);border-color:var(--forest)}
.button.danger:not(:disabled):hover{background:#f8e4e1;border-color:var(--red)}
.button:disabled,.button[aria-disabled="true"]{opacity:.58;cursor:not-allowed;box-shadow:none;transform:none}

/* Existing empty states should read as intentional content, not a failure. */
.empty,
.empty-state,
.no-data,
.no-results{
  width:100%;
  min-height:116px;
  padding:28px 22px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:9px;
  color:var(--muted);
  background:color-mix(in srgb,var(--paper) 88%,var(--mint));
  border:1px dashed color-mix(in srgb,var(--line) 74%,var(--forest));
  border-radius:14px;
  text-align:center;
  line-height:1.55;
}
.empty :is(h2,h3,strong),.empty-state :is(h2,h3,strong),.no-data :is(h2,h3,strong),.no-results :is(h2,h3,strong){color:var(--ink)}
.empty :is(p,small),.empty-state :is(p,small),.no-data :is(p,small),.no-results :is(p,small){margin:0;max-width:54ch}
.empty .button,.empty-state .button,.no-data .button,.no-results .button{margin-top:4px}

/* Forms: consistent rhythm, errors and disabled controls. */
:where(.dialog,.panel,.login-card,.install-card,.feedback-compose) label{line-height:1.35}
:where(.dialog,.panel,.login-card,.install-card,.feedback-compose) :is(input,select,textarea){max-width:100%;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease}
:where(input,select,textarea)[aria-invalid="true"],
:where(input,select,textarea):user-invalid{
  border-color:var(--red)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 18%,transparent)!important;
}
:where(input,select,textarea):disabled{cursor:not-allowed;opacity:1}
.form-error,[role="alert"].field-error{font-weight:700;line-height:1.4}
.required-marker,[aria-hidden="true"].required{color:var(--red)}

/* Dialogs: contained on every viewport, with a clearly visible close control. */
.dialog-backdrop{overscroll-behavior:contain}
.dialog{
  max-width:calc(100vw - 32px);
  max-height:calc(100dvh - 32px);
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
:where(.dialog-close,.modal-close,[data-dialog-close],[data-modal-close]){
  display:inline-grid;
  place-items:center;
  min-width:42px;
  min-height:42px;
  padding:7px;
  color:var(--forest);
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:50%;
  cursor:pointer;
}
.dialog-actions{flex-wrap:wrap;align-items:center}

/* Notices and status labels remain understandable in every theme. */
.notice{border:1px solid transparent;font-weight:650;line-height:1.5}
.notice.success{border-color:color-mix(in srgb,#17553f 35%,transparent)}
.notice.error{border-color:color-mix(in srgb,var(--red) 35%,transparent)}
.notice.warning{border-color:color-mix(in srgb,#9b721f 35%,transparent)}
:where(.role-badge,.invite-pending,.feedback-status,.integration-status,.subscription-list em){line-height:1.3}

/* Existing search and filter controls share one visual language. */
:where(.filter-label,.status-label,.country-filter,.platform-activity-filter){line-height:1.35}
:where(.filter-label,.status-label,.country-filter,.platform-activity-filter) select{max-width:100%}
.platform-filter{max-width:100%;flex-wrap:wrap}
.table-scroll{overscroll-behavior-inline:contain;scrollbar-gutter:stable}

/* Theme-specific contrast reinforcement for legacy controls. */
:root[data-theme="noir"] :where(.empty,.empty-state,.no-data,.no-results){background:var(--theme-soft);border-color:var(--theme-border);color:var(--theme-muted)}
:root[data-theme="noir"] :where(.empty,.empty-state,.no-data,.no-results) :is(h2,h3,strong){color:var(--theme-text)}
:root[data-theme="noir"] .button.secondary:not(:disabled):hover{background:var(--theme-soft);border-color:var(--theme-link)}
:root[data-theme="noir"] .button.danger:not(:disabled):hover{background:var(--theme-danger-bg);border-color:var(--theme-danger)}
:root[data-theme="platinum"] .button.primary:not(:disabled):hover{background:#1d484d;color:#fff}
:root:is([data-theme="noir"],[data-theme="platinum"]) :where(.dialog-close,.modal-close,[data-dialog-close],[data-modal-close]){color:var(--theme-link);background:var(--theme-surface);border-color:var(--theme-border)}

@media(max-width:760px){
  .content{padding-inline:16px}
  .panel-head{align-items:flex-start;flex-wrap:wrap}
  .panel-head>.button{width:100%}
  .dialog-backdrop{padding:0;align-items:end}
  .dialog{width:100%;max-width:100%;max-height:calc(100dvh - env(safe-area-inset-top));padding:22px 18px max(22px,env(safe-area-inset-bottom));border-radius:20px 20px 0 0}
  .dialog-actions{display:flex;flex-direction:column-reverse;align-items:stretch}
  .dialog-actions .button{width:100%;min-height:48px}
  .empty,.empty-state,.no-data,.no-results{min-height:104px;padding:22px 16px}
  .platform-filter{width:100%}
  .platform-filter button{min-height:44px;flex:1 1 auto}
  .table-scroll{-webkit-overflow-scrolling:touch}
}

@media(max-width:420px){
  .content{padding-inline:12px}
  .panel-body{padding:15px}
  .button{white-space:normal;text-align:center}
}

@media(prefers-reduced-motion:reduce){
  .button,:where(input,select,textarea){transition:none!important}
}

/* 1.9.4.4 — language-safe account status and long-label resilience. */
.account-status{display:inline-flex;align-items:center;min-height:28px;padding:4px 10px;border-radius:999px;font-weight:800;line-height:1.25;white-space:normal}
.account-status.active{color:#155f4a;background:#e6f4ee;border:1px solid #b9ddcf}
.account-status.blocked{color:#9b2f36;background:#fff0f0;border:1px solid #efc4c7}
.user-assignments{min-width:150px;overflow-wrap:anywhere}
.user-table th,.user-table td{vertical-align:top}
.user-table .button{white-space:normal;text-align:center;overflow-wrap:anywhere}
@media(max-width:760px){
  .user-table{min-width:760px}
  .table-scroll{-webkit-overflow-scrolling:touch}
  .dialog .button,.panel-head .button{max-width:100%;white-space:normal}
}