/*
 * Final admin-only theme guard.
 *
 * This layer is intentionally loaded after every earlier theme audit.  It does
 * not redesign the application; it connects late-added admin components to the
 * active theme tokens and guarantees readable interactive states.
 */

/* An initial avatar is a separate surface. Do not inherit the selected row's
   foreground (white in light mode, black in NOX/luxury) onto that surface.
   Two container IDs keep this pair above the shared interaction-state layer. */
html[data-theme] body #customers #customer-search-results > button .customer-avatar {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  background: var(--admin-surface) !important;
  border-color: var(--admin-line) !important;
}

/* Store settings: keep legends inside their cards, not half over the old
   gradient. Floating a legend makes it a regular grid item in the fieldset. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .store-detail-shell {
  min-width: 0;
  color: var(--admin-text);
  background: var(--admin-raised) !important;
  border: 1px solid var(--admin-line);
}
html[data-theme] body .store-detail-form {
  min-width: 0;
  gap: 16px;
}
html[data-theme] body .store-detail-form > fieldset {
  min-inline-size: 0;
  padding: 18px;
  gap: 14px;
  color: var(--admin-text) !important;
  background: var(--admin-surface) !important;
  border: 1px solid var(--admin-line) !important;
  overflow: visible;
}
html[data-theme] body .store-detail-form > fieldset > legend {
  float: left;
  grid-column: 1 / -1;
  width: 100%;
  margin: 0;
  padding: 0 0 4px;
  color: var(--admin-text) !important;
  font-size: 15px;
  line-height: 1.5;
}
html[data-theme] body .store-detail-form :is(label, .store-logo-setting, .store-logo-picker, .store-logo-picker-actions) {
  min-width: 0;
}
html[data-theme] body .store-detail-form label {
  align-content: start;
  font-size: 13px;
  line-height: 1.5;
}
html[data-theme] body .store-detail-shell :is(h3, legend, label > span, .store-logo-setting > span) {
  color: var(--admin-text) !important;
}
html[data-theme] body .store-detail-shell :is(p, small, #store-detail-status) {
  color: var(--admin-muted) !important;
  line-height: 1.6;
}
html[data-theme] body .store-detail-form :is(input:not([type="checkbox"]):not([type="hidden"]):not([type="file"]), select) {
  min-width: 0;
  min-height: 44px;
  font-size: 14px;
}
html[data-theme] body .store-detail-form .feature-flags label {
  min-height: 44px;
  padding: 8px 12px;
}
html[data-theme] body .store-logo-picker-actions > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  color: var(--admin-text);
  background: var(--admin-control);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
html[data-theme] body .store-detail-form .feature-flags input {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin: 0;
}
html[data-theme] body .store-detail-form .crm-feature-flags > small {
  align-items: flex-start;
}
html[data-theme] body .store-detail-form .crm-feature-flags > small svg {
  flex: 0 0 16px;
  margin-top: 3px;
}
html[data-theme] body .store-logo-picker {
  background: var(--admin-raised) !important;
  border-color: var(--admin-line) !important;
}
html[data-theme] body .store-detail-form .store-logo-file-button {
  color: var(--admin-on-accent) !important;
  background: var(--admin-accent) !important;
}
html[data-theme] body .store-detail-form .store-logo-file-button :is(span, svg) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}
html[data-theme] body .store-detail-actions {
  flex-wrap: wrap;
}
@media (max-width: 760px) {
  html[data-theme] body .store-detail-shell { margin-inline: 10px; padding: 12px; }
  html[data-theme] body .store-detail-form > fieldset { padding: 14px; }
  html[data-theme] body .store-logo-setting { grid-column: 1 / -1; }
  html[data-theme] body .store-detail-form :is(input:not([type="checkbox"]):not([type="hidden"]):not([type="file"]), select) { font-size: 16px; }
}

html[data-theme="nox"] {
  --admin-surface: #211827;
  --admin-raised: #2d2533;
  --admin-control: #182432;
  --admin-text: #f7f8fa;
  --admin-muted: #c2cad4;
  --admin-line: #687b8f;
  --admin-accent: #73a9d4;
  --admin-accent-strong: #dfe3e7;
  --admin-on-accent: #0b1117;
  --admin-hover: #263c50;
  --admin-focus: #8fc5ee;
  --admin-success: #9be8c6;
  --admin-success-bg: #173e32;
  --admin-warning: #ffe09a;
  --admin-warning-bg: #493817;
  --admin-danger: #ffc2c8;
  --admin-danger-bg: #51252d;
  --admin-calendar-grid: #71869b;
  --admin-icon: #b9ddff;
}

html[data-theme="light"] {
  --admin-surface: #ffffff;
  --admin-raised: #edf3fa;
  --admin-control: #ffffff;
  --admin-text: #172033;
  --admin-muted: #596579;
  --admin-line: #aebdd0;
  --admin-accent: #1463d6;
  --admin-accent-strong: #244b8f;
  --admin-on-accent: #ffffff;
  --admin-hover: #e9f3ff;
  --admin-focus: #1463d6;
  --admin-success: #087044;
  --admin-success-bg: #e5f4ee;
  --admin-warning: #714900;
  --admin-warning-bg: #fff0c7;
  --admin-danger: #a5203d;
  --admin-danger-bg: #fff0f3;
  --admin-calendar-grid: #8b9db4;
  --admin-icon: #1f5ea8;
}

html[data-theme="dark"] {
  --admin-surface: #21162d;
  --admin-raised: #2b1c39;
  --admin-control: #171020;
  --admin-text: #fff7ff;
  --admin-muted: #d6bddc;
  --admin-line: #765184;
  --admin-accent: #75419a;
  --admin-accent-strong: #4f2d78;
  --admin-on-accent: #ffffff;
  --admin-hover: #4a285c;
  --admin-focus: #c8a8ff;
  --admin-success: #9debc7;
  --admin-success-bg: #173c31;
  --admin-warning: #ffe09a;
  --admin-warning-bg: #493817;
  --admin-danger: #ffc1ca;
  --admin-danger-bg: #51232d;
  --admin-calendar-grid: #916994;
  --admin-icon: #ffb8df;
}

html[data-theme="luxury"] {
  --admin-surface: #15130e;
  --admin-raised: #211d13;
  --admin-control: #0a0906;
  --admin-text: #fff8e8;
  --admin-muted: #d7c8a8;
  --admin-line: #907744;
  --admin-accent: #f1cf67;
  --admin-accent-strong: #a87913;
  --admin-on-accent: #171104;
  --admin-hover: #3a3019;
  --admin-focus: #ffe69a;
  --admin-success: #9de5b8;
  --admin-success-bg: #193728;
  --admin-warning: #ffe08b;
  --admin-warning-bg: #463411;
  --admin-danger: #ffb1bb;
  --admin-danger-bg: #3a171d;
  --admin-calendar-grid: #9a8148;
  --admin-icon: #f1cf67;
}

/* Only the administration application is affected. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) {
  --theme-input: var(--admin-control);
}

/* Every monthly calendar keeps visible day-cell boundaries in all themes. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .shift-calendar {
  gap: 1px !important;
  border-color: var(--admin-calendar-grid) !important;
  background-color: var(--admin-calendar-grid) !important;
  background-image: none !important;
}

/* Form affordances must never inherit the legacy purple used by the old UI. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .field > :where(svg,[data-lucide]) {
  color: var(--admin-icon) !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(button,a,[role="button"]) :where(svg,[data-lucide]) {
  color: inherit !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

/* Keep only the themed calendar glyph; the browser's native glyph stays
   clickable but invisible underneath it. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .field input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0 !important;
  cursor: pointer;
}

/* Late-added report, inventory-category and agency surfaces. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .inventory-category-summary button,
  .report-sales-overview,
  .report-combined-legend-group,
  .report-combined-legend-group article,
  .report-kpi-grid article,
  .report-panel,
  .report-top-items > div,
  .agency-master-row,
  .money-input
) {
  color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
  background-color: var(--admin-surface) !important;
  background-image: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .report-combined-legend-group,
  .report-top-items > div,
  .agency-master-row
) {
  background-color: var(--admin-raised) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .inventory-category-summary button,
  .report-combined-legend-group article,
  .report-kpi-grid article,
  .report-panel,
  .agency-master-row
):hover {
  border-color: var(--admin-focus) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .inventory-category-summary button:hover {
  color: var(--admin-text) !important;
  background: var(--admin-hover) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .inventory-category-summary span,
  .inventory-category-summary strong,
  .report-chart-center strong,
  .report-combined-legend-group h4,
  .report-combined-legend-group article strong,
  .report-combined-legend-group article em,
  .report-kpi-grid strong,
  .report-panel h3,
  .report-table-scroll td,
  .report-table-scroll tfoot th,
  .report-top-items strong,
  .report-top-items em,
  .money-input > b
) {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .inventory-category-summary small,
  .inventory-category-empty,
  .report-chart-center span,
  .report-chart-center small,
  .report-combined-legend-group h4 small,
  .report-combined-legend-group article span,
  .report-combined-legend-group article small,
  .report-kpi-grid span,
  .report-kpi-grid small,
  .report-panel-head small,
  .report-table-scroll th,
  .report-top-items small,
  .report-actions > span,
  .agency-master-row > b,
  .agency-save-status,
  .agency-report-note
) {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-chart-center {
  inset: 18% !important;
  display: grid !important;
  place-content: center !important;
  justify-items: center !important;
  gap: 5px !important;
  padding: 10px !important;
  color: var(--admin-text) !important;
  background: var(--admin-surface) !important;
  box-shadow: 0 0 0 1px var(--admin-line), 0 6px 18px rgba(11, 27, 48, .1) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-chart-center span {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  letter-spacing: .04em !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-chart-center strong {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  font-size: clamp(23px, 2.2vw, 29px) !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.025em !important;
  white-space: nowrap !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-chart-center.compact strong {
  font-size: 21px !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-chart-center.compact-xl strong {
  font-size: 18px !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-chart-center small {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  letter-spacing: .02em !important;
}

@media (max-width: 520px) {
  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-chart-center strong {
    font-size: 23px !important;
  }
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-table-scroll {
  border-color: var(--admin-line) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-table-scroll :where(th, td) {
  border-color: var(--admin-line) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-table-scroll th {
  background: var(--admin-raised) !important;
}

/* Inventory category labels are not light-theme pills in dark modes. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .inventory-category-badge {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
  background: var(--admin-raised) !important;
}

html[data-theme="light"] body:not(.ipad-app):not(.staff-portal-app) .inventory-category-badge {
  color: #17325f !important;
  -webkit-text-fill-color: #17325f !important;
  border-color: #9ab8dd !important;
  background: #e9f3ff !important;
}

html[data-theme="nox"] body:not(.ipad-app):not(.staff-portal-app) .inventory-category-badge {
  color: #eaf4fb !important;
  border-color: #607f99 !important;
  background: #1e3447 !important;
}

html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .inventory-category-badge {
  color: #ffe8f5 !important;
  border-color: #8d4d7d !important;
  background: #3c2146 !important;
}

html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .inventory-category-badge {
  color: #ffe9af !important;
  border-color: #907744 !important;
  background: #2c2416 !important;
}

/* Controls and their text/icons always follow the active palette. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .inventory-category-filter select,
  .report-toolbar input,
  .report-toolbar select,
  .agency-register-form input,
  .agency-master-row input,
  .money-input input
) {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  caret-color: var(--admin-focus) !important;
  border-color: var(--admin-line) !important;
  background: var(--admin-control) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .inventory-category-filter span,
  .report-toolbar label,
  .agency-register-form label,
  .agency-master-row label
) {
  color: var(--admin-muted) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .report-primary-button,
  .report-refresh-button
) {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border-color: var(--admin-accent) !important;
  background: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .report-secondary-button,
  .agency-delete-button
) {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
  background: var(--admin-raised) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-delete-button {
  color: var(--admin-danger) !important;
  -webkit-text-fill-color: var(--admin-danger) !important;
  border-color: var(--admin-danger) !important;
  background: var(--admin-danger-bg) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(button, a, [role="button"]) :where(svg, [data-lucide]) {
  color: inherit !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

/* Selected, hover, disabled and focus states were the main cascade escapees. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .segmented-control button.selected,
  .settings-tab.active,
  .table-settings-floor-list > button.active,
  .admin-ticket-config-tabs > button.active,
  .ticket-settings-mode-tabs > button.active,
  .ticket-floor-tabs > button.active,
  .receipt-kind-switch button.active,
  .back-mode-switch button.active,
  .payroll-view-switch button.active,
  .payroll-layout-presets button.active,
  [role="tab"][aria-selected="true"]
) {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border-color: var(--admin-accent) !important;
  background: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  background-image: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--admin-accent) 24%, transparent) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .segmented-control button.selected,
  .settings-tab.active,
  .table-settings-floor-list > button.active,
  .admin-ticket-config-tabs > button.active,
  .ticket-settings-mode-tabs > button.active,
  .ticket-floor-tabs > button.active,
  .receipt-kind-switch button.active,
  .back-mode-switch button.active,
  .payroll-view-switch button.active,
  .payroll-layout-presets button.active,
  [role="tab"][aria-selected="true"]
) :where(span, strong, small, svg, [data-lucide]) {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  stroke: currentColor !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  button, a, [role="button"], input, select, textarea, summary
):focus-visible {
  outline: 3px solid var(--admin-focus) !important;
  outline-offset: 3px !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(button, input, select, textarea):disabled {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  border-color: var(--admin-line) !important;
  background: var(--admin-raised) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(input, textarea)::placeholder {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  opacity: 1 !important;
}

/* Semantic states remain distinguishable without falling back to one theme. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .success, .positive, .status-ok, .status-success, .status-open, .connected, .synced
) {
  color: var(--admin-success) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .warning, .status-warning, .is-understaffed
) {
  color: var(--admin-warning) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .danger, .negative, .status-danger, .status-error
) {
  color: var(--admin-danger) !important;
}

/* White paper previews are deliberately theme-independent and printable. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .salary-document-sheet, .receipt-paper, .receipt-preview-paper
) {
  color: #151515 !important;
  border-color: #c9c9c9 !important;
  background: #ffffff !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .salary-document-sheet, .receipt-paper, .receipt-preview-paper
) :where(h1, h2, h3, h4, p, span, strong, small, th, td, label) {
  color: #151515 !important;
  -webkit-text-fill-color: #151515 !important;
}

/*
 * Final legacy-colour cleanup.
 * Several older dashboard, payroll and salary components set text colours on
 * their own children.  Those declarations survived a theme switch even when
 * the parent surface had already changed.  Keep every late component on the
 * same four-theme token contract.
 */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .portfolio-store-sales span,
  .dashboard-active-ticket-meta,
  .salary-builder-control,
  .salary-summary-card span,
  .salary-document-designer-head span,
  .salary-document-templates span,
  .salary-document-templates label,
  .payroll-summary-days header span,
  .payroll-detail-heading span,
  .payroll-detail-heading small,
  .payroll-card small,
  .shift-empty
) {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .portfolio-ranking-title span,
  .shift-focus-card > span,
  .eyebrow,
  .spark,
  .shift-day-more
) {
  color: var(--admin-focus) !important;
  -webkit-text-fill-color: var(--admin-focus) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .portfolio-store-foot span,
  .dashboard-active-ticket-table em
) {
  color: var(--admin-success) !important;
  -webkit-text-fill-color: var(--admin-success) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .portfolio-sales-kpi :where(dd,b,strong) {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .inventory-category-filter > span {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .payroll-manual-toggle {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
  background: var(--admin-control) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .payroll-manual-toggle b {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  background: transparent !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .crm-source-badge {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border-color: var(--admin-accent) !important;
  background: var(--admin-accent) !important;
}

/* Avatar initials always use a dark-enough fill for white text. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.42) !important;
}
html[data-theme="nox"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip { background: #315b7b !important; }
html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.coral,
html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.pink { background: #8b2d5e !important; }
html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.blue,
html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.violet { background: #65378c !important; }
html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.amber { background: #76511e !important; }
html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.mint,
html[data-theme="dark"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.green { background: #2f6b56 !important; }
html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.coral,
html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.pink { background: #7d4430 !important; }
html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.blue,
html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.violet { background: #5b456e !important; }
html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.amber { background: #6f5422 !important; }
html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.mint,
html[data-theme="luxury"] body:not(.ipad-app):not(.staff-portal-app) .avatar-chip.green { background: #365c46 !important; }

/* The report/portfolio banners keep a dark brand header even in Light mode. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .portfolio-hero .eyebrow,
  .report-hero .eyebrow
) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .portfolio-ranking-head .eyebrow,
  .report-panel-head .eyebrow
) {
  color: var(--admin-focus) !important;
  -webkit-text-fill-color: var(--admin-focus) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #inventory .inventory-category-filter > span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .payroll-summary-metrics span,
  .payroll-summary-columns span,
  .payroll-summary-days span,
  .salary-document-preview-label span,
  .salary-document-drag
) {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .salary-document-editor-head span {
  color: var(--admin-success) !important;
  -webkit-text-fill-color: var(--admin-success) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .portfolio-sales-kpi dd,
  .portfolio-sales-kpi small b,
  .portfolio-store-card dd,
  #customer-result-count,
  .inventory-quantity
) {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .shift-day-more,
  .portfolio-ranking-title span,
  .inventory-quantity
) {
  border-color: var(--admin-line) !important;
  background: var(--admin-raised) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  .salary-builder-control span,
  .salary-builder-period span
) {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :where(
  #add-manual-attendance,
  #add-manual-ticket,
  #admin-add-table,
  #salary-document-save,
  #payroll-layout-open,
  .portfolio-store-card button
) {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border-color: var(--admin-accent) !important;
  background: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
}

/*
 * Payroll sheet contrast guard.
 *
 * The responsive sticky-header rules in styles.css intentionally use a light
 * blue fallback.  In dark themes that late fallback was paired with the dark
 * theme's white text, which made every grouped heading nearly disappear.
 * Keep all three sticky header rows, the frozen date column and editable cells
 * on one theme-aware palette, including the WebKit text fill used on iPad.
 */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view {
  border-color: var(--admin-line) !important;
  background: var(--admin-surface) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table {
  color: var(--admin-text) !important;
  background: var(--admin-surface) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table :where(th, td) {
  border-color: var(--admin-line) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead th {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
  background-color: var(--admin-raised) !important;
  background-image: none !important;
  text-shadow: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead th :where(span, strong, small, b) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead tr:nth-child(1) th {
  background-color: color-mix(in srgb, var(--admin-accent) 18%, var(--admin-raised)) !important;
  border-top-color: var(--admin-accent) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead tr:nth-child(2) th {
  background-color: var(--admin-raised) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead tr:nth-child(3) th {
  background-color: color-mix(in srgb, var(--admin-control) 78%, var(--admin-raised)) !important;
  box-shadow: 0 2px 0 var(--admin-line) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table tbody tr > :first-child,
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table tfoot tr > :first-child {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
  background-color: var(--admin-raised) !important;
  box-shadow: 2px 0 0 var(--admin-line) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table .payroll-input {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  caret-color: var(--admin-focus) !important;
  border-color: var(--admin-line) !important;
  background-color: var(--admin-control) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table .payroll-input:focus {
  border-color: var(--admin-focus) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--admin-focus) 34%, transparent) !important;
}

html[data-theme="light"] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead tr:nth-child(1) th {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-color: #244b8f !important;
}

html[data-theme="light"] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead tr:nth-child(2) th {
  color: #172033 !important;
  -webkit-text-fill-color: #172033 !important;
  background-color: #dce8f6 !important;
}

html[data-theme="light"] body:not(.ipad-app):not(.staff-portal-app) #payroll-table-view .payroll-table thead tr:nth-child(3) th {
  color: #172033 !important;
  -webkit-text-fill-color: #172033 !important;
  background-color: #edf3fa !important;
}

/* Admin selection states: one shared three-cue treatment (fill, border, text)
   loaded after every legacy theme rule. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .segmented-control button,
  .sales-series-controls button,
  .report-chart-switcher button,
  .settings-tab,
  .ticket-settings-mode-tabs button,
  .back-mode-switch button,
  .receipt-kind-switch button,
  .payroll-view-switch button,
  .payroll-layout-presets button,
  .salary-document-templates button,
  .inventory-view-tabs button,
  .liquor-order-tabs button,
  .transport-group-switch button,
  .printer-result-card,
  #customer-search-results > button,
  .inventory-category-summary button
) {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  border: 1px solid var(--admin-line) !important;
  background-color: var(--admin-control) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .segmented-control button.selected,
  .segmented-control button[aria-pressed="true"],
  .sales-series-controls button.selected,
  .sales-series-controls button[aria-pressed="true"],
  .report-chart-switcher button.active,
  .report-chart-switcher button[aria-pressed="true"],
  .settings-tab.active,
  .settings-tab[aria-selected="true"],
  .ticket-settings-mode-tabs button.active,
  .ticket-settings-mode-tabs button[aria-pressed="true"],
  .back-mode-switch button.active,
  .back-mode-switch button[aria-pressed="true"],
  .receipt-kind-switch button.active,
  .receipt-kind-switch button[aria-selected="true"],
  .payroll-view-switch button.active,
  .payroll-view-switch button[aria-pressed="true"],
  .payroll-layout-presets button.active,
  .payroll-layout-presets button[aria-pressed="true"],
  .salary-document-templates button.active,
  .salary-document-templates button[aria-pressed="true"],
  .inventory-view-tabs button.active,
  .inventory-view-tabs button[aria-selected="true"],
  .liquor-order-tabs button.active,
  .liquor-order-tabs button[aria-selected="true"],
  .transport-group-switch button.active,
  .transport-group-switch button[aria-pressed="true"],
  .printer-result-card.selected,
  .printer-result-card[aria-checked="true"],
  #customer-search-results > button.active,
  #customer-search-results > button[aria-pressed="true"],
  .inventory-category-summary button.selected,
  .inventory-category-summary button[aria-pressed="true"]
) {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border-width: 2px !important;
  border-color: var(--admin-focus) !important;
  background-color: var(--admin-accent) !important;
  background-image: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  box-shadow: inset 0 0 0 1px var(--admin-focus), 0 0 0 2px color-mix(in srgb, var(--admin-focus) 24%, transparent) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .segmented-control button.selected,
  .segmented-control button[aria-pressed="true"],
  .sales-series-controls button[aria-pressed="true"],
  .report-chart-switcher button[aria-pressed="true"],
  .settings-tab[aria-selected="true"],
  .ticket-settings-mode-tabs button[aria-pressed="true"],
  .back-mode-switch button[aria-pressed="true"],
  .receipt-kind-switch button[aria-selected="true"],
  .payroll-view-switch button[aria-pressed="true"],
  .payroll-layout-presets button[aria-pressed="true"],
  .salary-document-templates button[aria-pressed="true"],
  .inventory-view-tabs button[aria-selected="true"],
  .liquor-order-tabs button[aria-selected="true"],
  .transport-group-switch button[aria-pressed="true"],
  .printer-result-card[aria-checked="true"],
  #customer-search-results > button[aria-pressed="true"],
  .inventory-category-summary button[aria-pressed="true"]
) :is(span, strong, small, b, em, svg, [data-lucide]) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  stroke: currentColor !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .payroll-manual-toggle {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  border-color: var(--admin-line) !important;
  background-color: var(--admin-control) !important;
  background-image: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .payroll-manual-toggle[aria-pressed="true"] {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border: 2px solid var(--admin-focus) !important;
  background-color: var(--admin-accent) !important;
  background-image: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  box-shadow: inset 0 0 0 1px var(--admin-focus) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .feature-flags label,
  .receipt-toggle,
  .salary-document-field-list > label,
  .salary-document-custom-field,
  .cast-profile-transport-toggle,
  .cast-profile-transport-fee-modes label,
  .report-adjustment-sign label,
  .ark-auth-permission-grid label
) {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  border: 1px solid var(--admin-line) !important;
  background-color: var(--admin-control) !important;
  background-image: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .feature-flags label,
  .receipt-toggle,
  .salary-document-field-list > label,
  .salary-document-custom-field,
  .cast-profile-transport-toggle,
  .cast-profile-transport-fee-modes label,
  .ark-auth-permission-grid label
):has(input:checked) {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border-width: 2px !important;
  border-color: var(--admin-focus) !important;
  background-color: var(--admin-accent) !important;
  background-image: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  box-shadow: inset 0 0 0 1px var(--admin-focus) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .feature-flags label,
  .receipt-toggle,
  .salary-document-field-list > label,
  .salary-document-custom-field,
  .cast-profile-transport-toggle,
  .cast-profile-transport-fee-modes label,
  .ark-auth-permission-grid label
):has(input:checked) :is(span, strong, small, b, svg, [data-lucide]) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  stroke: currentColor !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-adjustment-sign label:has(input:checked) {
  border: 2px solid var(--admin-focus) !important;
  box-shadow: inset 0 0 0 1px var(--admin-focus) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-adjustment-sign label.plus:has(input:checked) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-color: #087044 !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .report-adjustment-sign label.minus:has(input:checked) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-color: #a5203d !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .crm-store-card.selected {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border: 2px solid var(--admin-focus) !important;
  background-color: var(--admin-accent) !important;
  background-image: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  box-shadow: inset 0 0 0 1px var(--admin-focus) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .crm-store-card.selected :is(strong, small, dt, dd, span, svg) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .theme-toggle[data-theme-current] {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border: 2px solid var(--admin-focus) !important;
  background-color: var(--admin-raised) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-focus) 34%, transparent) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .segmented-control button,
  .sales-series-controls button,
  .report-chart-switcher button,
  .settings-tab,
  .ticket-settings-mode-tabs button,
  .back-mode-switch button,
  .receipt-kind-switch button,
  .payroll-view-switch button,
  .payroll-layout-presets button,
  .salary-document-templates button,
  .inventory-view-tabs button,
  .liquor-order-tabs button,
  .transport-group-switch button,
  .printer-result-card,
  #customer-search-results > button,
  .inventory-category-summary button,
  .payroll-manual-toggle,
  .theme-toggle
):focus-visible {
  outline: 3px solid var(--admin-focus) !important;
  outline-offset: 3px !important;
}

/* Late admin selectors that also represent persisted choices. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .table-settings-floor-list > button.active,
  .admin-ticket-config-tabs > button.active,
  .ticket-floor-tabs > button.active,
  [role="tab"][aria-selected="true"],
  .nav-item[aria-current="page"]
) {
  box-sizing: border-box;
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border: 2px solid var(--admin-focus) !important;
  background-color: var(--admin-accent) !important;
  background-image: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-focus) 48%, transparent), 0 0 0 2px color-mix(in srgb, var(--admin-focus) 20%, transparent) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .table-settings-floor-list > button.active,
  .admin-ticket-config-tabs > button.active,
  .ticket-floor-tabs > button.active,
  [role="tab"][aria-selected="true"],
  .nav-item[aria-current="page"]
) :is(span, strong, small, b, em, svg, [data-lucide]) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  stroke: currentColor !important;
}

/* Disabled controls and destructive actions must not resemble a selection. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app):not(#admin-field-app) :is(button, [role="button"]):disabled {
  color: var(--admin-muted) !important;
  -webkit-text-fill-color: var(--admin-muted) !important;
  border: 1px dashed var(--admin-line) !important;
  background-color: var(--admin-raised) !important;
  background-image: none !important;
  box-shadow: none !important;
  opacity: .72 !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .agency-delete-button,
  .row-action.delete,
  [data-action="delete"]
) {
  color: var(--admin-danger) !important;
  -webkit-text-fill-color: var(--admin-danger) !important;
  border-color: var(--admin-danger) !important;
  background-color: var(--admin-danger-bg) !important;
  background-image: none !important;
}

/* Admin mobile P1: persistent choices stay fully visible and finger-sized. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .settings-tab,
  .back-mode-switch button,
  .ticket-settings-mode-tabs button,
  .transport-group-switch button,
  .report-chart-switcher button,
  .receipt-kind-switch button,
  .payroll-view-switch button,
  .payroll-layout-presets button,
  .salary-document-templates button,
  .payroll-manual-toggle,
  .report-adjustment-sign label
) {
  box-sizing: border-box;
  min-height: 44px !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .settings-tabs,
  .settings-tab,
  .back-mode-switch,
  .back-mode-switch button,
  .ticket-settings-mode-tabs,
  .ticket-settings-mode-tabs button,
  .transport-group-switch,
  .transport-group-switch button,
  .report-chart-switcher,
  .report-chart-switcher > div,
  .report-chart-switcher button,
  .receipt-kind-switch,
  .receipt-kind-switch button,
  .payroll-view-switch,
  .payroll-view-switch button,
  .payroll-layout-presets,
  .payroll-layout-presets button
) {
  min-width: 0;
}

@media (max-width: 620px) {
  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .settings-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 8px;
    overflow: visible;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .settings-tab {
    width: 100%;
    padding-inline: 7px;
    line-height: 1.25;
    white-space: normal;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .ticket-admin-settings .menu-settings-title {
    align-items: stretch;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .ticket-admin-settings .menu-settings-title > div {
    min-width: 0;
    width: 100%;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .back-mode-switch {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-width: 100%;
    gap: 4px;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .back-mode-switch > span {
    grid-column: 1 / -1;
    padding: 3px 4px 1px;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .back-mode-switch button {
    width: 100%;
    padding-inline: 5px;
    line-height: 1.2;
    white-space: normal;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .back-mode-switch .back-points-toggle {
    margin-left: 0;
    border-left-color: var(--admin-line) !important;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .ticket-settings-mode-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 6px;
    padding: 8px 10px;
    overflow: visible;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .ticket-settings-mode-tabs button {
    width: 100%;
    padding-inline: 6px;
    line-height: 1.2;
    white-space: normal;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
    .transport-group-switch,
    .report-chart-switcher > div,
    .receipt-kind-switch,
    .payroll-view-switch
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 100%;
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .receipt-kind-switch {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
    .transport-group-switch button,
    .report-chart-switcher button,
    .receipt-kind-switch button,
    .payroll-view-switch button
  ) {
    padding-inline: 6px;
    line-height: 1.2;
    white-space: normal;
  }
}

/* Admin form geometry: agency name, amount and submit action share one baseline. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form {
  align-items: end;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form > label {
  grid-template-rows: 14px 44px;
  align-self: end;
  gap: 6px;
  min-width: 0;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form > label > span:first-child {
  min-height: 14px;
  line-height: 14px;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .agency-register-form input,
  .agency-register-form .money-input,
  .agency-register-form > button
) {
  box-sizing: border-box;
  height: 44px;
  min-height: 44px;
  max-height: 44px;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form .money-input {
  overflow: hidden;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form .money-input input {
  height: 100%;
  min-height: 0;
  max-height: none;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form > button {
  align-self: end;
  line-height: 1;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form > button :is(svg, [data-lucide]) {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}

@media (max-width: 760px) {
  html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-register-form > button {
    width: 100%;
  }
}

/* Final interaction guard: hover remains readable and never replaces selection. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(button, a, [role="button"]):not(.avatar-chip):not(:disabled):hover {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border-color: var(--admin-focus) !important;
  background-color: var(--admin-hover) !important;
  background-image: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .report-primary-button,
  .report-refresh-button,
  .payroll-pdf-button,
  .salary-export-button
):not(:disabled):hover {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border-color: var(--admin-focus) !important;
  background-color: var(--admin-accent-strong) !important;
  background-image: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .report-secondary-button,
  .receipt-printer-test-actions button,
  .printer-discovery-actions button,
  .printer-sii-guide a
):not(:disabled):hover {
  color: var(--admin-text) !important;
  -webkit-text-fill-color: var(--admin-text) !important;
  border-color: var(--admin-focus) !important;
  background-color: var(--admin-hover) !important;
  background-image: none !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .segmented-control button.selected,
  .segmented-control button[aria-pressed="true"],
  .sales-series-controls button[aria-pressed="true"],
  .report-chart-switcher button[aria-pressed="true"],
  .settings-tab[aria-selected="true"],
  .ticket-settings-mode-tabs button[aria-pressed="true"],
  .table-settings-floor-list > button[aria-pressed="true"],
  .back-mode-switch button[aria-pressed="true"],
  .receipt-kind-switch button[aria-selected="true"],
  .payroll-view-switch button[aria-pressed="true"],
  .payroll-layout-presets button[aria-pressed="true"],
  .salary-document-templates button[aria-pressed="true"],
  .inventory-view-tabs button[aria-selected="true"],
  .liquor-order-tabs button[aria-selected="true"],
  .transport-group-switch button[aria-pressed="true"],
  .printer-result-card[aria-checked="true"],
  #customer-search-results > button[aria-pressed="true"],
  .inventory-category-summary button[aria-pressed="true"],
  .payroll-manual-toggle[aria-pressed="true"],
  .nav-item[aria-current="page"]
):hover {
  color: var(--admin-on-accent) !important;
  -webkit-text-fill-color: var(--admin-on-accent) !important;
  border: 2px solid var(--admin-focus) !important;
  background-color: var(--admin-accent) !important;
  background-image: linear-gradient(135deg, var(--admin-accent), var(--admin-accent-strong)) !important;
  box-shadow: inset 0 0 0 1px var(--admin-focus), 0 0 0 2px color-mix(in srgb, var(--admin-focus) 24%, transparent) !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .agency-delete-button,
  .row-action.delete,
  [data-action="delete"]
):not(:disabled):hover {
  color: var(--admin-danger) !important;
  -webkit-text-fill-color: var(--admin-danger) !important;
  border-color: var(--admin-danger) !important;
  background-color: var(--admin-danger-bg) !important;
  background-image: none !important;
}

/* Registered agency rows: only the direct label heading owns the label gap. */
html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-master-row > label {
  grid-template-rows: 14px 44px;
  align-self: end;
  gap: 6px;
  min-width: 0;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-master-row > label > span:first-child {
  min-height: 14px;
  margin: 0 !important;
  line-height: 14px;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) :is(
  .agency-master-row > label > input,
  .agency-master-row > label > .money-input,
  .agency-master-row > .agency-delete-button
) {
  box-sizing: border-box;
  height: 44px;
  min-height: 44px;
  max-height: 44px;
  margin: 0 !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-master-row > label > .money-input {
  overflow: hidden;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-master-row > label > .money-input > b {
  margin: 0 !important;
  line-height: 1;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-master-row > label > .money-input > input {
  height: 100%;
  min-height: 0;
  max-height: none;
  margin: 0 !important;
}

html[data-theme] body:not(.ipad-app):not(.staff-portal-app) .agency-master-row > .agency-delete-button {
  align-self: end;
  line-height: 1;
}