/* ===========================================================================
   Dark theme
   ---------------------------------------------------------------------------
   Applied to the signed-in app and the sign-in / sign-up screens when
   <html data-theme="dark"> is set. A tiny script in the page head sets it
   before first paint from the customer's choice: follow the device
   (default), always light, or always dark. Marketing pages and the staff
   console keep their own light design.
   ======================================================================== */

[data-theme="dark"] {
  color-scheme: dark;

  --ink: #e6edf7;
  --ink-muted: #a9b7cc;
  --ink-subtle: #7f8fa7;
  --line: #22324b;
  --surface: #111c2e;
  --canvas: #0a1322;
  --brand: #3b82f6;
  --brand-dark: #2563eb;
  --brand-soft: rgba(59, 130, 246, .16);
  --brand-light: #93b4f5;
  --accent: #3b82f6;
  --accent-soft: rgba(59, 130, 246, .16);
  --positive: #34d399;
  --negative: #f87171;
  --danger-soft: rgba(248, 113, 113, .12);
  --success-soft: rgba(52, 211, 153, .12);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .35), 0 1px 3px rgba(0, 0, 0, .25);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, .35);

  /* Local helpers for this file. */
  --dk-raise: #16233a;        /* inputs, hovered rows, chips */
  --dk-raise-2: #1b2a44;      /* hover on raised things */
  --dk-glass: rgba(17, 28, 46, .74);
  --dk-glass-line: rgba(148, 163, 184, .14);
  --dk-amber: #fbbf24;
  --dk-amber-soft: rgba(251, 191, 36, .14);
  --dk-violet: #c4b5fd;
  --dk-violet-soft: rgba(167, 139, 250, .16);
  --dk-green-soft: rgba(52, 211, 153, .14);
  --dk-rose: #fda4af;
  --dk-rose-soft: rgba(251, 113, 133, .14);
  --dk-teal: #5eead4;
}

/* --- Page backgrounds ------------------------------------------------------ */
[data-theme="dark"] body,
[data-theme="dark"] .chrome-app { background: var(--canvas); color: var(--ink); }
[data-theme="dark"] .glass-bg span:first-child { background: rgba(37, 99, 235, .22); }
[data-theme="dark"] .glass-bg span:last-child { background: rgba(99, 102, 241, .16); }

[data-theme="dark"] .route-loader { background: rgba(10, 19, 34, .94); }
[data-theme="dark"] .route-loader-bar { background: #1e2d47; }

/* --- Sidebar, top bar, bottom tab bar --------------------------------------- */
[data-theme="dark"] .sidebar { background: #0d1726; border-color: var(--line); }
[data-theme="dark"] .sidebar-user { background: var(--dk-raise); border-color: var(--line); }
[data-theme="dark"] .sidebar-link:hover { background: var(--dk-raise); }
[data-theme="dark"] .sidebar-link.is-active { background: var(--brand-soft); color: #bfd5ff; }
[data-theme="dark"] .sidebar-foot svg { color: var(--positive); }
[data-theme="dark"] .appbar { background: rgba(10, 19, 34, .82); border-color: var(--line); }
[data-theme="dark"] .tabbar { background: rgba(13, 23, 38, .96); border-color: var(--line); }
[data-theme="dark"] .icon-btn { background: var(--dk-raise); border-color: var(--line); color: var(--ink); }
[data-theme="dark"] .icon-btn:hover { background: var(--dk-raise-2); }
[data-theme="dark"] .user-dropdown { background: #122036; border-color: var(--line); box-shadow: var(--shadow-md); }
[data-theme="dark"] .user-dropdown a:hover { background: var(--dk-raise-2); }
[data-theme="dark"] .verify-pill { background: rgba(248, 113, 113, .12); color: #fca5a5; border-color: rgba(248, 113, 113, .25); }
[data-theme="dark"] .verify-pill:hover { background: rgba(248, 113, 113, .2); }
[data-theme="dark"] .verify-pill.is-done { color: var(--positive); background: var(--dk-green-soft); border-color: rgba(52, 211, 153, .25); }

/* --- Cards, panels, glass ---------------------------------------------------- */
[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .chrome-app .card,
[data-theme="dark"] .chrome-app .panel,
[data-theme="dark"] .page-glass .card,
[data-theme="dark"] .page-glass .panel {
  background: var(--dk-glass);
  border-color: var(--dk-glass-line);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 12px 32px rgba(0, 0, 0, .22);
}
[data-theme="dark"] .chrome-app .page-head,
[data-theme="dark"] .chrome-app .detail-head {
  background: rgba(17, 28, 46, .6);
  border-color: var(--dk-glass-line);
}
[data-theme="dark"] .page-head-icon,
[data-theme="dark"] .chrome-app .page-head-icon,
[data-theme="dark"] .verify-avatar,
[data-theme="dark"] .info-ico,
[data-theme="dark"] .empty-state-icon,
[data-theme="dark"] .chrome-app .stat-tile-icon,
[data-theme="dark"] .chrome-app .stat-row-icon,
[data-theme="dark"] .chrome-app .method .action-icon,
[data-theme="dark"] .action-rail-flat .action-icon {
  background: linear-gradient(160deg, #1b2a44, #142037);
  border-color: var(--dk-glass-line);
  color: #c7d4e8;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
[data-theme="dark"] .action-rail-flat .action:hover .action-icon,
[data-theme="dark"] .chrome-app .method.is-selected .action-icon {
  background: linear-gradient(160deg, #1e3358, rgba(59, 130, 246, .28)) !important;
  color: #bfd5ff;
}

[data-theme="dark"] .stat-card,
[data-theme="dark"] .stat-tile,
[data-theme="dark"] .chrome-app .stat-tile,
[data-theme="dark"] .tile,
[data-theme="dark"] .quick-action,
[data-theme="dark"] .action-rail,
[data-theme="dark"] .product,
[data-theme="dark"] .feature,
[data-theme="dark"] .step,
[data-theme="dark"] .method,
[data-theme="dark"] .type-card,
[data-theme="dark"] .faq details {
  background: var(--dk-glass);
  border-color: var(--dk-glass-line);
}
[data-theme="dark"] .method.is-selected { background: rgba(59, 130, 246, .12); border-color: rgba(96, 165, 250, .55); }
[data-theme="dark"] .type-card:hover,
[data-theme="dark"] .action:hover,
[data-theme="dark"] .account-card-new:hover { background: var(--dk-raise); }
[data-theme="dark"] .stat-card-attention { background: var(--dk-amber-soft); }
[data-theme="dark"] .stat-positive { background: rgba(52, 211, 153, .07); }
[data-theme="dark"] .stat-negative { background: rgba(248, 113, 113, .07); }
[data-theme="dark"] .stat-info { background: rgba(59, 130, 246, .08); }
[data-theme="dark"] .chrome-app .stat-positive .stat-tile-value { color: var(--positive); }
[data-theme="dark"] .chrome-app .stat-negative .stat-tile-value { color: var(--negative); }

/* Coloured icon tiles keep their hue, on a dark tint. */
[data-theme="dark"] .stat-neutral .stat-tile-icon,
[data-theme="dark"] .tx-icon,
[data-theme="dark"] .type-icon,
[data-theme="dark"] .account-card-plus { background: var(--dk-raise); color: #c7d4e8; }
[data-theme="dark"] .stat-positive .stat-tile-icon,
[data-theme="dark"] .tile-green .tile-icon,
[data-theme="dark"] .tile-green .action-icon,
[data-theme="dark"] .row-green { background: var(--dk-green-soft); color: var(--positive); }
[data-theme="dark"] .stat-negative .stat-tile-icon { background: rgba(248, 113, 113, .14); color: var(--negative); }
[data-theme="dark"] .tile-amber .tile-icon,
[data-theme="dark"] .tile-amber .action-icon,
[data-theme="dark"] .row-amber { background: var(--dk-amber-soft); color: var(--dk-amber); }
[data-theme="dark"] .tile-violet .tile-icon,
[data-theme="dark"] .tile-violet .action-icon,
[data-theme="dark"] .row-violet { background: var(--dk-violet-soft); color: var(--dk-violet); }
[data-theme="dark"] .tile-rose .action-icon { background: var(--dk-rose-soft); color: var(--dk-rose); }
[data-theme="dark"] .tile-teal .action-icon { color: var(--dk-teal); }
[data-theme="dark"] .feature-icon { color: var(--dk-teal); }

/* --- Forms --------------------------------------------------------------- */
[data-theme="dark"] .input,
[data-theme="dark"] .select,
[data-theme="dark"] textarea.input,
[data-theme="dark"] .chrome-app .input,
[data-theme="dark"] .chrome-app .select,
[data-theme="dark"] .chrome-app textarea.input,
[data-theme="dark"] .page-glass .input,
[data-theme="dark"] .page-glass .select,
[data-theme="dark"] .split-form .input,
[data-theme="dark"] .split-form .select,
[data-theme="dark"] .split-form textarea.input,
[data-theme="dark"] .chrome-bare .input {
  background: var(--dk-raise);
  border-color: #2a3c59;
  color: var(--ink);
}
[data-theme="dark"] .input::placeholder,
[data-theme="dark"] textarea.input::placeholder { color: #6b7c95; }
[data-theme="dark"] .input:focus,
[data-theme="dark"] .select:focus { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, .28); }
[data-theme="dark"] .input:disabled,
[data-theme="dark"] .input[readonly] { background: #111c2e; color: var(--ink-subtle); }
[data-theme="dark"] .input-file { background: var(--dk-raise); border-color: #2a3c59; color: var(--ink-muted); }
[data-theme="dark"] .input-file::file-selector-button { background: var(--dk-raise-2); color: var(--ink); border-color: #2a3c59; }
[data-theme="dark"] .input-file::file-selector-button:hover { background: #22345a; }
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(.8); }
[data-theme="dark"] .req,
[data-theme="dark"] .wizard-error { color: #fca5a5; }

/* Custom dropdowns and the phone bottom sheet. */
[data-theme="dark"] .nbs-btn,
[data-theme="dark"] .chrome-app .nbs-btn,
[data-theme="dark"] .page-glass .nbs-btn { background: var(--dk-raise); border-color: #2a3c59; color: var(--ink); }
[data-theme="dark"] .nbs-pop { background: rgba(18, 30, 50, .98); border-color: var(--line); box-shadow: 0 18px 44px rgba(0, 0, 0, .5); }
[data-theme="dark"] .nbs-opt { color: var(--ink); }
[data-theme="dark"] .nbs-opt:hover,
[data-theme="dark"] .nbs-opt.is-active { background: var(--dk-raise-2); }
[data-theme="dark"] .nbs-opt[aria-selected="true"] { color: #bfd5ff; }
[data-theme="dark"] .nbs-close { background: var(--dk-raise-2); color: var(--ink-muted); }
[data-theme="dark"] .nbs-search { background: var(--dk-raise); color: var(--ink); border-color: #2a3c59; }

/* Password strength and wizard steps. */
[data-theme="dark"] .strength-track,
[data-theme="dark"] .wizard-progress,
[data-theme="dark"] .wizard-step-dot { background: #1e2d47; }
[data-theme="dark"] .wizard-step.is-active .wizard-step-dot { background: var(--brand); color: #fff; }
[data-theme="dark"] .progress-dot { background: var(--dk-raise); border-color: var(--line); }
[data-theme="dark"] .is-fair,
[data-theme="dark"] .match.is-off { color: var(--dk-amber); }
[data-theme="dark"] .is-good { color: #93c5fd; }
[data-theme="dark"] .is-strong,
[data-theme="dark"] .strength-rules li.is-met,
[data-theme="dark"] .match.is-ok { color: var(--positive); }
[data-theme="dark"] .is-weak { color: #fca5a5; }
[data-theme="dark"] .reveal:hover { background: var(--dk-raise-2); }

/* --- Buttons --------------------------------------------------------------- */
[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .chip,
[data-theme="dark"] .tab {
  background: var(--dk-raise);
  border-color: #2a3c59;
  color: var(--ink);
}
[data-theme="dark"] .btn-secondary:hover,
[data-theme="dark"] .chip:hover { background: var(--dk-raise-2); border-color: #365080; }
[data-theme="dark"] .tab.is-active { background: var(--brand-soft); color: #bfd5ff; border-color: rgba(96, 165, 250, .45); }
[data-theme="dark"] .btn-ghost-dark { color: var(--ink-muted); }
[data-theme="dark"] .btn-ghost-dark:hover { background: var(--dk-raise); color: var(--ink); }
[data-theme="dark"] .btn-danger-ghost { background: rgba(248, 113, 113, .08); color: #fca5a5; border-color: rgba(248, 113, 113, .3); }
[data-theme="dark"] .btn-topup { background: var(--dk-green-soft); color: var(--positive); border-color: rgba(52, 211, 153, .3); }
[data-theme="dark"] .btn-light { background: rgba(255, 255, 255, .92); color: #0b1b33; }

/* --- Tables, lists, badges, tags ------------------------------------------- */
[data-theme="dark"] .table th,
[data-theme="dark"] .chrome-app .table th { background: rgba(22, 35, 58, .7); color: var(--ink-subtle); border-color: var(--line); }
[data-theme="dark"] .table td { border-color: var(--line); }
[data-theme="dark"] .table tbody tr:hover,
[data-theme="dark"] .tx-list .tx-item:hover { background: rgba(59, 130, 246, .06); }
[data-theme="dark"] .tx-item,
[data-theme="dark"] .tx-list li { border-color: var(--line); }
[data-theme="dark"] .spend-bar { background: #1e2d47; }
[data-theme="dark"] .detail-list code,
[data-theme="dark"] .demo-note code { background: var(--dk-raise-2); color: var(--ink); }
[data-theme="dark"] .demo-note,
[data-theme="dark"] .section-note { background: var(--dk-raise); color: var(--ink-muted); border-color: var(--line); }

[data-theme="dark"] .tag { background: var(--brand-soft); color: #bfd5ff; }
[data-theme="dark"] .tag-credit { background: var(--dk-violet-soft); color: var(--dk-violet); }
[data-theme="dark"] .tag-savings { background: rgba(59, 130, 246, .16); color: #93c5fd; }
[data-theme="dark"] .badge-approved,
[data-theme="dark"] .badge-active { background: var(--dk-green-soft); color: #6ee7b7; }
[data-theme="dark"] .badge-pending { background: var(--dk-amber-soft); color: #fcd34d; }
[data-theme="dark"] .badge-rejected,
[data-theme="dark"] .badge-suspended { background: rgba(248, 113, 113, .14); color: #fca5a5; }
[data-theme="dark"] .badge-unverified { background: rgba(148, 163, 184, .16); color: #cbd5e1; }

/* --- Notices and banners ---------------------------------------------------- */
[data-theme="dark"] .alert-error { background: rgba(248, 113, 113, .1); border-color: rgba(248, 113, 113, .3); color: #fecaca; }
[data-theme="dark"] .alert-success { background: rgba(52, 211, 153, .1); border-color: rgba(52, 211, 153, .3); color: #a7f3d0; }
[data-theme="dark"] .alert-info { background: rgba(59, 130, 246, .1); border-color: rgba(96, 165, 250, .3); color: #bfdbfe; }
[data-theme="dark"] .kyc-banner,
[data-theme="dark"] .kyc-banner-unverified,
[data-theme="dark"] .kyc-banner-pending,
[data-theme="dark"] .kyc-banner-rejected { background: rgba(17, 28, 46, .74); border-color: var(--dk-glass-line); color: var(--ink); }
[data-theme="dark"] .kyc-banner-icon { background: linear-gradient(160deg, #1b2a44, #142037); color: #93c5fd; }
[data-theme="dark"] .kyc-banner-pending .kyc-banner-icon { background: linear-gradient(160deg, #2a2412, #1b2a44); color: var(--dk-amber); }
[data-theme="dark"] .kyc-banner-rejected .kyc-banner-icon { background: linear-gradient(160deg, #2e1a22, #1b2a44); color: #fca5a5; }
[data-theme="dark"] .verify-mail { background: linear-gradient(160deg, #16233a, rgba(59, 130, 246, .2)); }

/* --- Sign-in, sign-up and email confirmation --------------------------------- */
[data-theme="dark"] .chrome-bare { background: #08111f; }
[data-theme="dark"] .chrome-bare::before { opacity: .55; }
[data-theme="dark"] .chrome-bare::after { background: rgba(8, 17, 31, .45); }
[data-theme="dark"] .chrome-bare .auth-card { background: rgba(15, 25, 42, .78); border-color: var(--dk-glass-line); }
[data-theme="dark"] .chrome-bare .footer { color: var(--ink-subtle); }
[data-theme="dark"] .chrome-bare .demo-note { background: rgba(22, 35, 58, .6); }
[data-theme="dark"] .chrome-split { background: var(--canvas); }
[data-theme="dark"] .split-form { background: #0c1627; }
[data-theme="dark"] .wizard-card { background: rgba(17, 28, 46, .78); border-color: var(--dk-glass-line); }
[data-theme="dark"] .split-form .type-card { background: rgba(22, 35, 58, .7); border-color: var(--dk-glass-line); }

/* Smooth hand-over when the device theme changes while a page is open. */
[data-theme] body { transition: background-color .25s ease, color .25s ease; }
@media (prefers-reduced-motion: reduce) { [data-theme] body { transition: none; } }

/* Text that uses the navy brand colour directly. */
[data-theme="dark"] .auth-brand,
[data-theme="dark"] .notify-head strong,
[data-theme="dark"] .notify-text strong,
[data-theme="dark"] .legal-note strong { color: var(--ink); }

/* Sign-in backdrop: same colour blobs, on a deep navy base instead of pale blue. */
[data-theme="dark"] .chrome-bare::before {
  background:
    radial-gradient(38% 34% at 18% 22%, rgba(37, 99, 235, .42), transparent 68%),
    radial-gradient(34% 32% at 84% 18%, rgba(124, 58, 237, .3), transparent 66%),
    radial-gradient(42% 38% at 70% 86%, rgba(14, 165, 233, .28), transparent 70%),
    radial-gradient(30% 30% at 12% 88%, rgba(37, 99, 235, .3), transparent 70%),
    #08111f;
  opacity: 1;
}
[data-theme="dark"] .chrome-bare::after { background: rgba(8, 17, 31, .35); }

/* The app's neutral icon chips are set with !important in refine.css. */
[data-theme="dark"] .chrome-app .stat-tile-icon,
[data-theme="dark"] .chrome-app .stat-row-icon,
[data-theme="dark"] .chrome-app .method .action-icon {
  color: #c7d4e8 !important;
  background: linear-gradient(160deg, #1d2d49, #142037) !important;
  border-color: rgba(148, 163, 184, .16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

/* Notification panel (bell) and the notifications page. */
[data-theme="dark"] .notify-panel { background: #111d31; border-color: var(--line); box-shadow: 0 24px 60px rgba(0, 0, 0, .5); }
[data-theme="dark"] .notify-head { border-color: var(--line); }
[data-theme="dark"] .notify-new { background: var(--brand-soft); color: #bfd5ff; }
[data-theme="dark"] .notify-item:hover { background: rgba(59, 130, 246, .07); }
[data-theme="dark"] .notify-item.is-unread { background: rgba(59, 130, 246, .1); }
[data-theme="dark"] .notify-icon { background: var(--dk-raise-2); color: #c7d4e8; }
[data-theme="dark"] .notify-positive { background: var(--dk-green-soft); color: var(--positive); }
[data-theme="dark"] .notify-negative { background: rgba(248, 113, 113, .14); color: var(--negative); }
[data-theme="dark"] .notify-all { border-color: var(--line); }
[data-theme="dark"] .notify-all:hover { background: var(--dk-raise); }
[data-theme="dark"] .notify-count { box-shadow: 0 0 0 2px var(--canvas); }

/* Hairlines and outlines that were drawn in light grey. */
[data-theme="dark"] .account-card,
[data-theme="dark"] .form-section-title,
[data-theme="dark"] .detail-list > div,
[data-theme="dark"] .info-rows li,
[data-theme="dark"] .info-rows > * { border-color: var(--line); }
[data-theme="dark"] .method-radio { border-color: #3a4d6b; background: var(--dk-raise); }
[data-theme="dark"] .verify-tick { border-color: var(--canvas); }
[data-theme="dark"] .notice { border-color: rgba(96, 165, 250, .28); }
[data-theme="dark"] .nbs-pop.is-sheet .nbs-opt + .nbs-opt { border-top-color: var(--line); }
[data-theme="dark"] .nbs-pop.is-sheet .nbs-sheet-grip { background: #3a4d6b; }

/* ===========================================================================
   The staff console in dark mode
   ======================================================================== */
[data-theme="dark"] .ax { background: var(--canvas); }
[data-theme="dark"] .ax-main { background: var(--canvas); }
[data-theme="dark"] .ax-bg span:first-child { background: rgba(37, 99, 235, .18); }
[data-theme="dark"] .ax-bg span:last-child { background: rgba(99, 102, 241, .14); }
[data-theme="dark"] .ax-top { background: rgba(10, 19, 34, .8); border-bottom-color: var(--line); }
[data-theme="dark"] .ax-crumb { color: var(--ink-subtle); }
[data-theme="dark"] .ax-crumb strong { color: var(--ink); }
[data-theme="dark"] .ax-burger { background: var(--dk-raise); border-color: var(--line); }
[data-theme="dark"] .ax-burger span { background: var(--ink); }
[data-theme="dark"] .ax-pending { background: var(--dk-amber-soft); border-color: rgba(251, 191, 36, .3); color: #fcd34d; }
[data-theme="dark"] .ax-foot { color: var(--ink-subtle); }

/* Page furniture */
[data-theme="dark"] .ax-head {
  background: var(--dk-glass);
  border-color: var(--dk-glass-line);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 12px 32px rgba(0, 0, 0, .22);
}
[data-theme="dark"] .ax-page .card,
[data-theme="dark"] .ax-kpi {
  background: var(--dk-glass);
  border-color: var(--dk-glass-line);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 30px rgba(0, 0, 0, .2);
}
[data-theme="dark"] .ax-kpi:hover { border-color: rgba(96, 165, 250, .45); box-shadow: 0 16px 36px rgba(0, 0, 0, .34); }
[data-theme="dark"] .ax-kpi-icon { background: linear-gradient(135deg, #17253d, #1b2a44); color: #93c5fd; }
[data-theme="dark"] .ax-kpi-value { color: var(--ink); }
[data-theme="dark"] .ax-kpi.is-attention { background: rgba(251, 191, 36, .08); border-color: rgba(251, 191, 36, .28); }
[data-theme="dark"] .ax-kpi.is-attention .ax-kpi-icon { background: rgba(251, 191, 36, .16); color: var(--dk-amber); }
[data-theme="dark"] .ax-kpi.is-attention .ax-kpi-hint { color: var(--dk-amber); }
[data-theme="dark"] .ax-page .table th { background: rgba(22, 35, 58, .7); color: var(--ink-subtle); }
[data-theme="dark"] .ax-page .table tbody tr:hover { background: rgba(59, 130, 246, .07); }
[data-theme="dark"] .ax-page .tabs { background: rgba(22, 35, 58, .8); }
[data-theme="dark"] .ax-page .tab { color: var(--ink-muted); }
[data-theme="dark"] .ax-page .tab.is-active { background: #1e3358; color: #bfd5ff; box-shadow: none; }
[data-theme="dark"] .ax-page .bill-editor { background: rgba(22, 35, 58, .6) !important; }
[data-theme="dark"] .act-pill { background: rgba(99, 102, 241, .16); color: #c7d2fe; }
[data-theme="dark"] .act-pill.is-good { background: var(--dk-green-soft); color: #6ee7b7; }
[data-theme="dark"] .act-pill.is-danger { background: rgba(248, 113, 113, .14); color: #fca5a5; }
[data-theme="dark"] .act-pill.is-muted { background: rgba(148, 163, 184, .14); color: #cbd5e1; }
[data-theme="dark"] .chip-you { background: rgba(99, 102, 241, .18); color: #c7d2fe; }
[data-theme="dark"] .msg-frame { background: #fff; border-color: var(--line); }
[data-theme="dark"] .msg-frame-empty { border-color: var(--line); color: var(--ink-subtle); }
[data-theme="dark"] .mail-status-dot.is-live { box-shadow: 0 0 0 4px rgba(52, 211, 153, .12); }

/* Admin buttons: the light greys become dark. */
[data-theme="dark"] .ax .btn-secondary,
[data-theme="dark"] .ax .btn-ghost-dark {
  background: rgba(22, 35, 58, .9);
  border-color: #2e4160;
  color: var(--ink);
}
[data-theme="dark"] .ax .btn-secondary:hover:not(:disabled),
[data-theme="dark"] .ax .btn-ghost-dark:hover:not(:disabled) {
  background: #1e3358;
  border-color: #3f6099;
  color: #bfd5ff;
}
[data-theme="dark"] .ax .btn-danger-ghost {
  background: rgba(248, 113, 113, .1);
  border-color: rgba(248, 113, 113, .3);
  color: #fca5a5;
}

/* The appearance toggle in the top bar. */
.ax-theme {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: none;
  border: 1px solid #dde3ec;
  border-radius: 11px;
  background: #fff;
  color: #475569;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.ax-theme:hover { color: var(--brand); border-color: #93c5fd; }
.ax-theme svg { width: 18px; height: 18px; display: none; }
[data-theme-shows="auto"] .ax-theme-auto,
[data-theme-shows="light"] .ax-theme-light,
[data-theme-shows="dark"] .ax-theme-dark { display: block; }
.ax-theme svg.ax-theme-auto { display: block; }
[data-theme-shows] .ax-theme svg.ax-theme-auto { display: none; }
[data-theme-shows="auto"] .ax-theme svg.ax-theme-auto { display: block; }
[data-theme="dark"] .ax-theme { background: var(--dk-raise); border-color: var(--line); color: var(--ink-muted); }
[data-theme="dark"] .ax-theme:hover { color: #93c5fd; border-color: #3f6099; }

/* Staff sign-in screen is already dark; keep it steady in either theme. */
[data-theme="dark"] .ax-auth { color-scheme: dark; }
[data-theme="dark"] .tab-count { background: rgba(148, 163, 184, .18); color: var(--ink-muted); }
[data-theme="dark"] .quick-fund-input { background: var(--dk-raise); border-color: #2a3c59; color: var(--ink); }
[data-theme="dark"] .ax-page .tab.is-active { border-color: rgba(96, 165, 250, .45); }
[data-theme="dark"] .doc { background: var(--dk-raise); border-color: var(--line); }
[data-theme="dark"] .doc-meta, [data-theme="dark"] .doc-name { color: var(--ink-muted); }