/* ============================================================
   AAA WebFiling — portal-aaa-v1.css  (theme layer, v1.0.0)
   Loaded LAST, after portal.css, billing.css, admin-dashboard.css
   and pwa.css. It re-points the design tokens of portal.css and
   restyles the shell, so every page follows without being edited:
   the AAA admin-console concept (dark navy rail with grouped menu,
   glass top bar, KPI tiles with icon chips and serif figures, soft
   white cards, gold accent) on a BRIGHT paper surface (owner,
   2026-10-06: "same concept as the admin panel, keep the background
   bright"). Typefaces: Hanken Grotesk (UI) and Fraunces (figures,
   accent words) from Google Fonts, which the CSP already allows.
   Gold is decoration and state only — never body text on white.
   ============================================================ */

/* ---------- 1. tokens (override portal.css :root by order) ---------- */
:root {
  --aaa-navy-950: #0a1420;
  --aaa-navy-900: #0e1b29;
  --aaa-navy-800: #16273a;
  --aaa-navy-700: #22384d;
  --aaa-gold-600: #8a6a2f;
  --aaa-gold-500: #b8924e;
  --aaa-gold-400: #c9a15c;
  --aaa-gold-300: #dcb97e;
  --aaa-gold-100: #f4ecdc;
  --aaa-gold-grad: linear-gradient(135deg, #ead0a0 0%, #c9a15c 55%, #b8924e 100%);
  --aaa-paper: #f6f3ee;
  --aaa-ink: #14202e;
  --aaa-muted: #4d5a68;
  --aaa-faint: #7f8c9a;
  --aaa-line: #e3ddd2;
  --aaa-line-strong: #cfc7b8;
  --aaa-ok: #176b45;      --aaa-ok-bg: #e5f5ed;
  --aaa-warn: #7b5716;    --aaa-warn-bg: #fff0cf;
  --aaa-danger: #a7353d;  --aaa-danger-bg: #fdebec;
  --aaa-info: #245c86;    --aaa-info-bg: #eaf2f8;
  --aaa-ease: cubic-bezier(.22, 1, .36, 1);
  --aaa-shadow-sm: 0 1px 2px rgba(10, 20, 32, .04), 0 10px 26px -22px rgba(10, 20, 32, .35);
  --aaa-shadow: 0 1px 2px rgba(10, 20, 32, .04), 0 18px 40px -26px rgba(10, 20, 32, .45);
  --aaa-shadow-lg: 0 30px 70px -30px rgba(10, 20, 32, .55);

  /* portal.css tokens, re-pointed */
  --primary: var(--aaa-navy-950);
  --primary-container: var(--aaa-navy-900);
  --on-primary: #ffffff;
  --on-primary-container: var(--aaa-gold-300);
  --primary-fixed: #e9eef5;
  --primary-fixed-dim: #d7dfe9;
  --on-primary-fixed: var(--aaa-navy-950);
  --on-primary-fixed-variant: var(--aaa-navy-700);
  --inverse-primary: var(--aaa-gold-300);
  --secondary: var(--aaa-muted);
  --secondary-container: #f1ede6;
  --secondary-fixed: #e9e3d8;
  --secondary-fixed-dim: #dcd4c6;
  --on-secondary: #ffffff;
  --on-secondary-container: #3b4754;
  --on-secondary-fixed: var(--aaa-ink);
  --on-secondary-fixed-variant: var(--aaa-muted);
  --error: var(--aaa-danger);
  --error-container: var(--aaa-danger-bg);
  --on-error-container: #7a2027;
  --background: var(--aaa-paper);
  --on-background: var(--aaa-ink);
  --surface: var(--aaa-paper);
  --surface-dim: var(--aaa-line);
  --surface-bright: #fbfaf7;
  --surface-container-lowest: #ffffff;
  --surface-container-low: #faf8f4;
  --surface-container: #f1ede6;
  --surface-container-high: #e9e3d8;
  --surface-container-highest: var(--aaa-line);
  --surface-variant: #f5f2ec;
  --on-surface: var(--aaa-ink);
  --on-surface-variant: var(--aaa-muted);
  --outline: #8e9aa8;
  --outline-variant: var(--aaa-line);
  --inverse-surface: var(--aaa-navy-900);
  --inverse-on-surface: var(--aaa-paper);
  --radius-sm: 6px;
  --radius-md: 9px;
  --radius-lg: 14px;
  --radius-xl: 18px;
  --font-main: "Hanken Grotesk", "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --sidebar-width: 264px;
  --topbar-height: 66px;
  --max-width: 1320px;
  --transition: .2s var(--aaa-ease);
  /* admin-dashboard.css */
  --adm-font: var(--font-main);
  --adm-radius-card: 18px;
  --adm-radius-inner: 12px;
  --adm-shadow-card: var(--aaa-shadow-sm);
  --adm-shadow-hover: var(--aaa-shadow);
  --adm-live-accent: var(--aaa-navy-900);
  --adm-planned-bg: #f1ede6;
}

/* ---------- 2. base ---------- */
body {
  font-family: var(--font-main);
  color: var(--aaa-ink);
  background:
    radial-gradient(circle at 100% 0, rgba(201, 161, 92, .11), transparent 28rem),
    radial-gradient(circle at 0 100%, rgba(184, 146, 78, .08), transparent 30rem),
    var(--aaa-paper);
}
::selection { background: rgba(201, 161, 92, .35); color: #fff; }
:focus-visible { outline: 2px solid var(--aaa-gold-400); outline-offset: 2px; border-radius: 6px; }
h1, h2, h3, h4 { letter-spacing: -.015em; }   /* colour comes from the tokens; dark banners keep their own */
.material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

/* ---------- 3. the rail ---------- */
.sidebar {
  background:
    radial-gradient(120% 50% at 0 0, rgba(201, 161, 92, .12), transparent 60%),
    linear-gradient(180deg, #0c1826 0%, #08111b 100%) !important;
  border-right: 1px solid rgba(201, 161, 92, .18) !important;
  color: #d5dbe2;
  scrollbar-width: thin;
  scrollbar-color: #1e3045 transparent;
}
.sidebar-top { padding: 18px 16px 10px; gap: 12px; }
.brand-logo-image, .brand-subtitle { display: block; }
.wf-brand { display: flex; align-items: center; gap: 12px; margin: 0 2px 6px; color: #f6f3ee; text-decoration: none; }
.wf-brand img, .sidebar-top .brand-img {
  width: 44px !important; height: 44px !important; max-height: none !important; object-fit: contain;
  border-radius: 12px; background: #fff; padding: 3px;
  box-shadow: 0 0 0 1px rgba(201, 161, 92, .35), 0 10px 22px -10px rgba(0, 0, 0, .9);
}
.wf-brand-name { display: block; font-size: 15.5px; font-weight: 650; letter-spacing: -.015em; line-height: 1.2; color: #f6f3ee; }
.wf-brand-name small { display: block; margin-top: 2px; font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #8e9aa8; }
.btn-new-filing {
  margin-top: 4px !important; min-height: 42px; justify-content: center; gap: 8px;
  background: var(--aaa-gold-grad) !important; color: var(--aaa-navy-950) !important;
  border-radius: 12px; font-size: 13.5px; font-weight: 700; letter-spacing: .01em;
  box-shadow: 0 12px 26px -14px rgba(201, 161, 92, .9); transition: filter .2s, transform .2s var(--aaa-ease);
}
.btn-new-filing:hover { filter: brightness(1.06); transform: translateY(-1px); }
.btn-new-filing .material-symbols-outlined { font-size: 18px; color: var(--aaa-navy-950); }
.sidebar-mode-badge {
  margin-top: 4px; padding: 7px 12px; border-radius: 999px; text-align: center;
  background: rgba(201, 161, 92, .12); border: 1px solid rgba(201, 161, 92, .4);
  color: var(--aaa-gold-100); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
.sidebar-menu { padding: 0 10px 8px; gap: 2px; }
.wf-nav-h {
  margin: 14px 12px 5px; font-size: 10.5px; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: #7f8c9a; list-style: none;
}
.sidebar-menu > li:first-child > .wf-nav-h, .wf-nav-h:first-child { margin-top: 4px; }
.sidebar-link {
  position: relative; display: flex; align-items: center; gap: 12px; min-height: 40px;
  padding: 8px 12px !important; border-radius: 11px !important; border-right: 0 !important;
  color: #d5dbe2 !important; font-size: 14px; font-weight: 500; line-height: 1.3;
  transition: background .2s var(--aaa-ease), color .2s var(--aaa-ease);
}
.sidebar-link .material-symbols-outlined { font-size: 20px; color: #7f8c9a; transition: color .2s; }
.sidebar-link:hover { background: rgba(255, 255, 255, .05) !important; color: #f6f3ee !important; }
.sidebar-link:hover .material-symbols-outlined { color: var(--aaa-gold-300); }
.sidebar-link.active {
  background: linear-gradient(90deg, rgba(201, 161, 92, .22), rgba(201, 161, 92, .05)) !important;
  color: var(--aaa-gold-100) !important; font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(201, 161, 92, .26);
}
.sidebar-link.active::before {
  content: ""; position: absolute; left: -10px; top: 10px; bottom: 10px; width: 3px;
  border-radius: 0 3px 3px 0; background: var(--aaa-gold-400);
}
.sidebar-link.active .material-symbols-outlined { color: var(--aaa-gold-300); }
.sidebar-divider { margin: 10px 4px; border-top: 1px solid rgba(255, 255, 255, .08) !important; }
.sidebar-footer { padding: 10px 10px 12px !important; border-top: 1px solid rgba(255, 255, 255, .08) !important; gap: 2px; }
.sidebar-footer form { margin: 0; }
.sidebar-footer .sidebar-link { min-height: 38px; }
.sidebar-footer > div[style] { display: none !important; }   /* the plain e-mail line: replaced by the who-card below */
.wf-who {
  display: flex; align-items: center; gap: 10px; margin: 8px 0 0; padding: 10px;
  border: 1px solid #1e3045; border-radius: 13px; background: rgba(255, 255, 255, .03);
}
.wf-who-avatar {
  display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 50%;
  background: rgba(201, 161, 92, .16); color: var(--aaa-gold-300); font-size: 12.5px; font-weight: 700;
  letter-spacing: .02em; box-shadow: inset 0 0 0 1px rgba(201, 161, 92, .3);
}
.wf-who-name { flex: 1; min-width: 0; overflow: hidden; color: #f6f3ee; font-size: 12.5px; font-weight: 600; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.wf-who-name small { display: block; overflow: hidden; color: #8e9aa8; font-size: 11px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; text-overflow: ellipsis; }

/* ---------- 4. the bar ---------- */
.topbar {
  padding: 0 28px; gap: 12px;
  background: rgba(255, 255, 255, .78) !important;
  -webkit-backdrop-filter: saturate(1.3) blur(12px); backdrop-filter: saturate(1.3) blur(12px);
  border-bottom: 1px solid var(--aaa-line) !important;
  box-shadow: 0 10px 30px -24px rgba(10, 20, 32, .25);
}
.topbar-title { font-size: 17px !important; font-weight: 600 !important; letter-spacing: -.015em !important; text-transform: none !important; color: var(--aaa-ink) !important; }
.topbar-nav a { color: var(--aaa-muted); }
.topbar-nav a:hover, .topbar-nav a.active { color: var(--aaa-navy-900); border-color: var(--aaa-gold-400); }
.topbar-right { gap: 10px; }
.icon-btn {
  width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--aaa-line);
  background: #fff !important; color: var(--aaa-muted) !important;
  transition: background .2s, color .2s, border-color .2s;
}
.icon-btn:hover { background: rgba(201, 161, 92, .1) !important; color: var(--aaa-gold-600) !important; border-color: rgba(201, 161, 92, .5); }
.topbar .icon-btn > span[style] { background: var(--aaa-danger) !important; box-shadow: 0 0 0 2px #fff !important; }
.user-id {
  display: inline-flex; align-items: center; min-height: 36px; padding: 6px 12px; border-radius: 999px;
  border: 1px solid var(--aaa-line); background: #fff; color: var(--aaa-navy-900) !important;
  font-size: 13px; font-weight: 600; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---------- 5. page frame ---------- */
.main-content { padding: 28px 32px 40px; scrollbar-width: thin; scrollbar-color: var(--aaa-line-strong) transparent; }
.container { gap: 24px; }
.footer { background: transparent !important; border-top: 1px solid var(--aaa-line) !important; color: var(--aaa-faint) !important; font-size: 12.5px; }
.footer-copy { color: var(--aaa-muted); font-weight: 600; }
.page-header, .page-header-row { margin-bottom: 24px; }
.page-header h1, .page-title, .admin-page-header__title {
  font-size: 28px !important; font-weight: 600 !important; letter-spacing: -.03em !important; line-height: 1.15; color: var(--aaa-ink) !important;
}
.page-header p, .admin-page-header__subtitle { color: var(--aaa-muted) !important; font-size: 15px; }
.count-badge {
  display: inline-grid; place-items: center; min-width: 30px; height: 26px; padding: 0 9px; margin-left: 8px;
  border-radius: 999px; background: rgba(201, 161, 92, .14); color: var(--aaa-gold-600);
  font-family: var(--font-display); font-size: 16px; font-weight: 500; vertical-align: middle;
}
.page-header-actions { gap: 8px; }

/* the dashboard greeting band (markup in dashboard/index.blade.php) */
.wf-hero {
  position: relative; isolation: isolate; overflow: hidden; padding: 28px 30px; border-radius: 22px;
  border: 1px solid rgba(201, 161, 92, .3); color: #f6f3ee;
  background:
    linear-gradient(90deg, rgba(10, 20, 32, .96) 0%, rgba(10, 20, 32, .82) 48%, rgba(10, 20, 32, .3) 100%),
    url(../images/portal-liquid-v1.webp) right center / cover no-repeat, var(--aaa-navy-900);
  box-shadow: var(--aaa-shadow-lg);
}
.wf-hero h1 { margin: 0; color: #f6f3ee; font-size: clamp(26px, 3vw, 36px); font-weight: 600; letter-spacing: -.03em; line-height: 1.12; }
.wf-hero h1 em, .wf-serif {
  font-family: var(--font-display); font-style: italic; font-weight: 400; letter-spacing: -.01em; padding-right: .06em;
  background: linear-gradient(100deg, #f3dcae 0%, #c9a15c 60%, #b8924e 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.wf-hero p { margin: 8px 0 0; max-width: 60ch; color: #c3c9d0; font-size: 15px; }
.wf-hero-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.wf-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .14); background: rgba(10, 20, 32, .55); color: #d5dbe2;
  font-size: 12.5px; font-weight: 600; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.wf-chip .material-symbols-outlined { font-size: 16px; color: var(--aaa-gold-300); }
.wf-chip.good { color: #9ad9b9; border-color: rgba(111, 208, 161, .35); }
.wf-chip.warn { color: #f0bf6a; border-color: rgba(240, 191, 106, .4); }
.wf-chip.bad { color: #f19aa0; border-color: rgba(239, 107, 115, .45); }

/* ---------- 6. KPI tiles ---------- */
.stat-grid { gap: 16px; }
.stat-card {
  position: relative; overflow: hidden; display: block;
  padding: 18px 20px 16px !important; border-radius: 18px !important;
  background: #fff !important; border: 1px solid var(--aaa-line) !important;
  box-shadow: var(--aaa-shadow-sm) !important;
  transition: transform .25s var(--aaa-ease), box-shadow .25s var(--aaa-ease), border-color .25s;
}
.stat-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--stat-tone, var(--aaa-gold-400)); }
.stat-card:has(.stat-err) { --stat-tone: var(--aaa-danger); --stat-chip: var(--aaa-danger-bg); }
.stat-card:has(.stat-warn) { --stat-tone: #b8860b; --stat-chip: var(--aaa-warn-bg); }
.stat-card:has(.stat-up) { --stat-tone: var(--aaa-ok); --stat-chip: var(--aaa-ok-bg); }
.stat-card-link:hover { transform: translateY(-2px); border-color: rgba(201, 161, 92, .55) !important; box-shadow: var(--aaa-shadow) !important; }
.stat-label { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--aaa-muted) !important; padding-right: 48px; }
.stat-value {
  margin-top: 8px; font-family: var(--font-display); font-size: 36px !important; font-weight: 500 !important;
  line-height: 1.05; letter-spacing: -.02em; color: var(--aaa-navy-900); font-variant-numeric: lining-nums tabular-nums;
}
.stat-err { color: var(--aaa-danger) !important; }
.stat-warn { color: var(--aaa-gold-600) !important; }
.stat-up { color: var(--aaa-ok) !important; }
.stat-ic {
  position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 40px; height: 40px;
  border-radius: 12px; background: var(--stat-chip, rgba(201, 161, 92, .14)); color: var(--stat-tone, var(--aaa-gold-500));
  font-size: 21px;
}

/* ---------- 7. cards, lists, tables ---------- */
.card, .filter-bar, .table-container, .admin-status-strip, .admin-metric-card, .admin-ops-card {
  background: #fff !important; border: 1px solid var(--aaa-line) !important; border-radius: 18px !important;
  box-shadow: var(--aaa-shadow-sm) !important;
}
.card { padding: 22px; }
.card-title { font-size: 17px !important; font-weight: 600 !important; letter-spacing: -.015em; color: var(--aaa-ink) !important; }
.card-icon { color: var(--aaa-gold-500) !important; }
.card-title-row { gap: 10px; }
.card > div[style*="border-bottom"] { border-bottom-color: var(--aaa-line) !important; }
.data-table thead tr { background: #faf8f4 !important; border-bottom: 1px solid var(--aaa-line) !important; }
.data-table th, .filings-table th {
  padding: 12px 16px !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .12em !important;
  text-transform: uppercase !important; color: #5b6675 !important; white-space: nowrap;
}
.data-table td { padding: 13px 16px !important; font-size: 14px !important; color: var(--aaa-ink); border-bottom: 1px solid #f1ede6; }
.data-table tbody tr { border-bottom: 1px solid #f1ede6 !important; transition: background .15s; }
.data-table tbody tr.row-alt { background: transparent !important; }
.data-table tbody tr:hover, .data-table tbody tr.row-alt:hover, .filings-table tbody tr:hover { background: rgba(201, 161, 92, .06) !important; }
.td-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px !important; color: var(--aaa-muted) !important; }
.td-warn { color: var(--aaa-gold-600) !important; }
.td-error { color: var(--aaa-danger) !important; }
.pg-btn { min-width: 36px; height: 36px; border-radius: 10px !important; border: 1px solid var(--aaa-line); background: #fff; color: var(--aaa-muted); font-weight: 600; }
.pg-btn:hover { border-color: rgba(201, 161, 92, .55); color: var(--aaa-navy-900); }
.pg-btn.active { background: var(--aaa-navy-900) !important; color: #fff !important; border-color: var(--aaa-navy-900); }
.todo-item { background: #fff !important; border: 1px solid var(--aaa-line) !important; border-radius: 14px !important; transition: border-color .2s, transform .2s var(--aaa-ease); }
.todo-item:hover { border-color: rgba(201, 161, 92, .5) !important; transform: translateX(2px); }
.todo-dot-amber { background: #b8860b !important; }
.todo-label-due { color: var(--aaa-gold-600) !important; }
.inline-link { color: var(--aaa-navy-900) !important; font-weight: 600; }
.inline-link:hover { color: var(--aaa-gold-600) !important; }
.log-success { color: var(--aaa-ok) !important; }

/* ---------- 8. badges ---------- */
.badge {
  display: inline-flex !important; align-items: center; gap: 6px; padding: 3px 10px !important; border-radius: 999px !important;
  font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: .02em; line-height: 1.6; white-space: nowrap;
  border: 1px solid transparent !important;
}
.badge-active, .badge-success, .badge-green { background: var(--aaa-ok-bg) !important; color: var(--aaa-ok) !important; border-color: rgba(23, 107, 69, .22) !important; }
.badge-warning { background: var(--aaa-warn-bg) !important; color: var(--aaa-warn) !important; border-color: rgba(123, 87, 22, .22) !important; }
.badge-dormant { background: #fff7e0 !important; color: var(--aaa-gold-600) !important; border-color: rgba(138, 106, 47, .25) !important; }
.badge-liquidation, .badge-danger, .badge-error { background: var(--aaa-danger-bg) !important; color: var(--aaa-danger) !important; border-color: rgba(167, 53, 61, .22) !important; }
.badge-dissolved, .badge-neutral { background: #f1ede6 !important; color: var(--aaa-muted) !important; border-color: var(--aaa-line) !important; }
.badge-info { background: var(--aaa-info-bg) !important; color: var(--aaa-info) !important; }
:is(.badge-active, .badge-success, .badge-warning, .badge-dormant, .badge-liquidation, .badge-dissolved, .badge-neutral)::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .85;
}

/* ---------- 9. buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px;
  padding: 8px 16px !important; border-radius: 11px !important; font-size: 14px !important; font-weight: 600 !important;
  line-height: 1.2; cursor: pointer; white-space: nowrap;
  transition: background .2s, border-color .2s, color .2s, box-shadow .2s, transform .2s var(--aaa-ease), filter .2s;
}
.btn .material-symbols-outlined { font-size: 18px; }
.btn-primary {
  background: var(--aaa-gold-grad) !important; color: var(--aaa-navy-950) !important; border: 1px solid transparent !important;
  box-shadow: 0 10px 24px -14px rgba(201, 161, 92, .85);
}
.btn-primary:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 14px 30px -14px rgba(201, 161, 92, .95); }
.btn-primary .material-symbols-outlined { color: var(--aaa-navy-950); }
.btn-secondary, .btn-outline {
  background: #fff !important; color: var(--aaa-ink) !important; border: 1px solid var(--aaa-line-strong) !important;
}
.btn-secondary:hover, .btn-outline:hover { border-color: rgba(201, 161, 92, .6) !important; background: rgba(201, 161, 92, .07) !important; }
.btn-danger { background: #fff !important; color: var(--aaa-danger) !important; border: 1px solid rgba(167, 53, 61, .35) !important; }
.btn-danger:hover { background: var(--aaa-danger-bg) !important; }
.btn-ghost { color: var(--aaa-navy-900) !important; padding: 0 !important; min-height: 0; }
.btn-ghost:hover { color: var(--aaa-gold-600) !important; }
.btn-sm { min-height: 32px; padding: 5px 11px !important; font-size: 12.5px !important; border-radius: 9px !important; }
.btn-sm .material-symbols-outlined { font-size: 16px; }

/* ---------- 10. forms ---------- */
.input, .select, .form-input, .filter-bar input, .filter-bar select, .card input[type="text"], .card input[type="email"], .card input[type="search"], .card select, .card textarea {
  min-height: 44px; padding: 10px 12px; border-radius: 11px !important; border: 1px solid var(--aaa-line-strong) !important;
  background: #fff !important; color: var(--aaa-ink); font: inherit; transition: border-color .2s, box-shadow .2s;
}
.input:focus, .select:focus, .form-input:focus, .filter-bar input:focus, .filter-bar select:focus, .card input:focus, .card select:focus, .card textarea:focus {
  outline: 0; border-color: var(--aaa-gold-400) !important; box-shadow: 0 0 0 3px rgba(201, 161, 92, .2);
}
.input-error, .form-input.input-error { border-color: var(--aaa-danger) !important; }
.form-label { font-size: 13px !important; font-weight: 600 !important; color: var(--aaa-muted) !important; margin-bottom: 6px; }
.input-icon { color: var(--aaa-faint); }
.select-arrow { color: var(--aaa-faint); }

/* ---------- 11. admin command centre ---------- */
.admin-page-header { font-family: var(--font-main); border-bottom: 0 !important; padding-bottom: 0 !important; }
.admin-page-header__eyebrow { color: var(--aaa-gold-600) !important; font-size: 11px !important; letter-spacing: .14em; text-transform: uppercase; }
.admin-status-item__icon { color: var(--aaa-gold-500) !important; }
.admin-status-item__label { color: var(--aaa-faint) !important; letter-spacing: .12em; }
.admin-status-item__value { color: var(--aaa-ink); font-weight: 600; }
.admin-status-strip__divider { background: var(--aaa-line) !important; }
.admin-section__title { font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.admin-section__description { color: var(--aaa-muted); }
.admin-metric-card { transition: transform .25s var(--aaa-ease), box-shadow .25s var(--aaa-ease), border-color .25s; }
a.admin-metric-card:hover { transform: translateY(-2px); border-color: rgba(201, 161, 92, .55) !important; box-shadow: var(--aaa-shadow) !important; }
.admin-metric-card__label { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--aaa-muted); }
.admin-metric-card__value { font-family: var(--font-display); font-size: 34px; font-weight: 500; letter-spacing: -.02em; color: var(--aaa-navy-900); }
.admin-metric-card__cta { color: var(--aaa-gold-600); font-weight: 600; }
.admin-ops-card__header { border-bottom: 1px solid var(--aaa-line); }
.admin-ops-card__icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: rgba(201, 161, 92, .14); color: var(--aaa-gold-600) !important; font-size: 20px; }
.admin-ops-card__title { font-weight: 600; letter-spacing: -.01em; }
.admin-ops-row { border-bottom: 1px solid #f1ede6; }
.admin-ops-row__name { font-weight: 600; color: var(--aaa-ink); }
.admin-ops-row__meta { color: var(--aaa-muted); }
.admin-ops-empty { color: var(--aaa-faint); }

/* ---------- 12. sign-in and guest pages ---------- */
body.guest-page, .login-page, .login-wrap { font-family: var(--font-main); }
.login-left {
  background:
    radial-gradient(circle at 100% 0, rgba(201, 161, 92, .12), transparent 28rem),
    radial-gradient(circle at 0 100%, rgba(184, 146, 78, .08), transparent 30rem),
    var(--aaa-paper) !important;
}
.login-box { max-width: 420px; padding: 32px 30px; border-radius: 22px; background: #fff; border: 1px solid var(--aaa-line); box-shadow: var(--aaa-shadow-lg); }
.login-brand-row { margin-bottom: 22px; }
.login-brand-image { width: 48px; height: 48px; border-radius: 13px; object-fit: contain; box-shadow: 0 0 0 1px rgba(201, 161, 92, .3); }
.login-brand-text { font-size: 16px; font-weight: 650; letter-spacing: -.015em; color: var(--aaa-ink); }
.login-brand-sub { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--aaa-gold-600); }
.login-heading { font-size: 28px !important; font-weight: 600 !important; letter-spacing: -.03em !important; color: var(--aaa-ink) !important; }
.login-subheading { color: var(--aaa-muted); font-size: 15px; }
.login-form .form-input { min-height: 48px; }
.btn-login {
  min-height: 48px !important; border-radius: 12px !important; background: var(--aaa-gold-grad) !important; color: var(--aaa-navy-950) !important;
  font-size: 15px !important; font-weight: 700 !important; box-shadow: 0 14px 32px -14px rgba(201, 161, 92, .9); transition: filter .2s, transform .2s var(--aaa-ease);
}
.btn-login:hover { filter: brightness(1.06); transform: translateY(-1px); background: var(--aaa-gold-grad) !important; }
.login-remember label { color: var(--aaa-muted); }
.login-left a { color: var(--aaa-navy-900); font-weight: 600; }
.login-error { border-radius: 12px; }
.login-right {
  position: relative; isolation: isolate; overflow: hidden; color: #f6f3ee;
  background:
    linear-gradient(180deg, rgba(10, 20, 32, .55) 0%, rgba(10, 20, 32, .8) 60%, rgba(10, 20, 32, .92) 100%),
    url(../images/portal-liquid-v1.webp) center / cover no-repeat, var(--aaa-navy-900) !important;
  border-left: 1px solid rgba(201, 161, 92, .25);
}
.login-right-image { width: 72px; height: 72px; border-radius: 18px; object-fit: contain; background: #fff; padding: 4px; box-shadow: 0 0 0 1px rgba(240, 160, 32, .3), 0 20px 40px -16px rgba(0, 0, 0, .9); }
.login-right-brand { font-size: 20px; font-weight: 650; letter-spacing: -.02em; }
.login-right-brand span { display: block; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--aaa-gold-300); margin-top: 4px; }
.login-right-text { font-size: 26px !important; font-weight: 600; letter-spacing: -.025em; line-height: 1.18; color: #f6f3ee !important; max-width: 420px; }
.login-right-text em { font-family: var(--font-display); font-style: italic; font-weight: 400; color: var(--aaa-gold-300); }
.login-feature-item { color: #c3c9d0; font-size: 14.5px; }
.login-feature-item .material-symbols-outlined { color: var(--aaa-gold-300); }

/* ---------- 13. flash messages (inline-styled in the layout) ---------- */
.container > div[style*="#e6f4ea"] { background: var(--aaa-ok-bg) !important; color: var(--aaa-ok) !important; border-color: rgba(23, 107, 69, .25) !important; border-radius: 14px !important; }
.container > div[style*="#fce8e6"] { background: var(--aaa-danger-bg) !important; color: var(--aaa-danger) !important; border-color: rgba(167, 53, 61, .25) !important; border-radius: 14px !important; }

/* ---------- 14. mobile (the drawer rules of portal.css/pwa.css stay) ---------- */
@media (max-width: 1024px) {
  .main-content { padding: 20px 18px 32px; }
  .topbar { padding: 0 16px; }
  .wf-hero { padding: 22px 20px; border-radius: 18px; }
  .user-id { max-width: 160px; }
}
@media (max-width: 768px) {
  .sidebar { box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .85); }
  .stat-value { font-size: 30px !important; }
  .page-header h1, .page-title, .admin-page-header__title { font-size: 24px !important; }
  .user-id { display: none; }
}
@media (pointer: coarse) { .btn { min-height: 44px; } .sidebar-link { min-height: 44px; } .icon-btn { width: 44px; height: 44px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }
@media print { .sidebar, .topbar, .wf-hero { display: none !important; } body { background: #fff; } .card, .stat-card, .table-container { box-shadow: none !important; } }

/* ---------- 15. page banners that carried the old blue (settings) ---------- */
.settings-hero {
  position: relative; isolation: isolate; overflow: hidden; border-radius: 22px !important; color: #f6f3ee !important;
  border: 1px solid rgba(201, 161, 92, .3) !important; box-shadow: var(--aaa-shadow-lg) !important;
  background:
    linear-gradient(90deg, rgba(10, 20, 32, .96) 0%, rgba(10, 20, 32, .82) 48%, rgba(10, 20, 32, .3) 100%),
    url(../images/portal-liquid-wave-v1.webp) right center / cover no-repeat, var(--aaa-navy-900) !important;
}
.settings-hero h1 { color: #f6f3ee !important; font-size: clamp(26px, 3vw, 36px) !important; font-weight: 600 !important; letter-spacing: -.03em !important; }
.settings-hero p { color: #c3c9d0 !important; }
.settings-hero-eyebrow { color: var(--aaa-gold-300) !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .16em !important; text-transform: uppercase !important; }
.settings-hero-eyebrow::before, .settings-hero-eyebrow::after { background: var(--aaa-gold-400) !important; border-color: var(--aaa-gold-400) !important; }
.settings-section-label { color: var(--aaa-faint) !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase !important; }

/* ---------- 16. fixes found in the preview ---------- */
.input-wrap .input, .input-padded { padding-left: 40px !important; }
.input-wrap .input-icon { left: 12px; }
.login-form input[type="password"], .login-form .form-input { width: 100% !important; }

/* ---------- 17. PWA prompts carried the old blue ---------- */
.pwa-install-banner, .pwa-btn-primary, .pwa-btn-primary { background: linear-gradient(135deg, var(--aaa-navy-800) 0%, var(--aaa-navy-950) 100%) !important; color: #f6f3ee !important; }
.pwa-btn-primary { background: var(--aaa-gold-grad) !important; color: var(--aaa-navy-950) !important; }

/* ============================================================
   18. Admin Command Centre v2 (admin/dashboard.blade.php, 2026-10-06)
   ============================================================ */
.adm-hero {
  position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;
  padding: 30px 32px; border-radius: 24px; color: #f6f3ee; border: 1px solid rgba(201, 161, 92, .32);
  background:
    linear-gradient(90deg, rgba(10, 20, 32, .97) 0%, rgba(10, 20, 32, .84) 50%, rgba(10, 20, 32, .3) 100%),
    url(../images/portal-liquid-v1.webp) right center / cover no-repeat, var(--aaa-navy-900);
  box-shadow: var(--aaa-shadow-lg);
}
.adm-hero__text { max-width: 720px; }
.adm-hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--aaa-gold-300); }
.adm-hero__eyebrow .material-symbols-outlined { font-size: 16px; }
.adm-hero h1 { margin: 0; color: #f6f3ee !important; font-size: clamp(26px, 2.8vw, 36px) !important; font-weight: 600 !important; letter-spacing: -.03em !important; line-height: 1.12 !important; }
.adm-hero h1 em { font-family: var(--font-display); font-style: italic; font-weight: 400; letter-spacing: -.01em; background: linear-gradient(100deg, #f3dcae 0%, #c9a15c 60%, #b8924e 100%); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; }
.adm-hero__sub { margin: 10px 0 0; max-width: 60ch; color: #c3c9d0; font-size: 15px; }
.adm-hero__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.adm-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(10, 20, 32, .55); color: #d5dbe2; font-size: 12.5px; font-weight: 600; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.adm-chip .material-symbols-outlined { font-size: 16px; color: var(--aaa-gold-300); }
.adm-chip.good { color: #9ad9b9; border-color: rgba(111, 208, 161, .35); } .adm-chip.good .material-symbols-outlined { color: #6fd0a1; }
.adm-chip.warn { color: #f0bf6a; border-color: rgba(240, 191, 106, .4); } .adm-chip.warn .material-symbols-outlined { color: #f0bf6a; }
.adm-hero__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; flex: none; }
.adm-btn-glass { background: rgba(255, 255, 255, .08) !important; color: #f6f3ee !important; border: 1px solid rgba(255, 255, 255, .18) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.adm-btn-glass:hover { background: rgba(255, 255, 255, .14) !important; border-color: rgba(201, 161, 92, .5) !important; }
.adm-btn-glass.is-danger { color: #f6b8bd !important; } .adm-btn-glass.is-danger:hover { border-color: rgba(239, 107, 115, .5) !important; }
.adm-btn-glass .material-symbols-outlined { color: var(--aaa-gold-300); } .adm-btn-glass.is-danger .material-symbols-outlined { color: #f19aa0; }

.adm-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.adm-kpi {
  --k-tone: var(--aaa-gold-400); --k-chip: rgba(201, 161, 92, .14);
  position: relative; display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 18px 18px 16px; overflow: hidden;
  border: 1px solid var(--aaa-line); border-radius: 18px; background: #fff; box-shadow: var(--aaa-shadow-sm); color: var(--aaa-ink); text-decoration: none;
  transition: transform .25s var(--aaa-ease), box-shadow .25s var(--aaa-ease), border-color .25s;
}
.adm-kpi::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--k-tone); }
.adm-kpi.is-warn { --k-tone: #c98500; --k-chip: #fff0cf; } .adm-kpi.is-bad { --k-tone: var(--aaa-danger); --k-chip: var(--aaa-danger-bg); }
.adm-kpi:hover { transform: translateY(-2px); border-color: rgba(201, 161, 92, .55); box-shadow: var(--aaa-shadow); }
.adm-kpi__ic { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--k-chip); color: var(--k-tone); }
.adm-kpi__ic .material-symbols-outlined { font-size: 20px; }
.adm-kpi__l { padding-right: 46px; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--aaa-muted); }
.adm-kpi__n { font-family: var(--font-display); font-size: 34px; font-weight: 500; line-height: 1.05; letter-spacing: -.02em; color: var(--aaa-navy-900); font-variant-numeric: lining-nums tabular-nums; }
.adm-kpi__s { font-size: 12.5px; color: var(--aaa-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-meter { display: block; height: 5px; margin-top: 4px; border-radius: 999px; background: #f1ede6; overflow: hidden; }
.adm-meter i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--aaa-gold-500), var(--aaa-gold-300)); }

.adm-grid { display: grid; gap: 18px; }
.adm-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.adm-grid--ops { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
.adm-ops { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; min-width: 0; }
.adm-rail { display: grid; gap: 18px; min-width: 0; }
.adm-card { min-width: 0; padding: 20px 22px 22px; border: 1px solid var(--aaa-line); border-radius: 18px; background: #fff; box-shadow: var(--aaa-shadow-sm); }
.adm-card.is-priority { border-color: rgba(201, 161, 92, .5); box-shadow: 0 0 0 3px rgba(201, 161, 92, .08), var(--aaa-shadow-sm); }
.adm-card__h { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.adm-card__h h2 { margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -.015em; color: var(--aaa-ink); }
.adm-card__h p { margin: 2px 0 0; font-size: 12.5px; color: var(--aaa-muted); }
.adm-more { display: inline-flex; align-items: center; gap: 4px; flex: none; margin-top: 2px; color: var(--aaa-gold-600); font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.adm-more .material-symbols-outlined { font-size: 15px; } .adm-more:hover { color: var(--aaa-navy-900); }

.adm-chart { display: flex; align-items: center; gap: 18px; }
.adm-donut { flex: none; width: 138px; height: 138px; }
.adm-donut__n { font: 500 24px var(--font-display); fill: var(--aaa-navy-900); }
.adm-donut__l { font: 700 9px var(--font-main); letter-spacing: .12em; text-transform: uppercase; fill: var(--aaa-faint); }
.adm-legend { display: grid; flex: 1; gap: 4px; margin: 0; padding: 0; list-style: none; min-width: 0; }
.adm-legend li > a, .adm-legend__row { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; color: var(--aaa-ink); text-decoration: none; font-size: 13.5px; transition: background .15s; }
.adm-legend li > a:hover { background: rgba(201, 161, 92, .08); } .adm-legend li > a:hover .adm-legend__go { opacity: 1; transform: none; }
.adm-legend__k { display: inline-flex; align-items: center; gap: 8px; flex: 1; min-width: 0; color: var(--aaa-muted); }
.adm-legend__k i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.adm-legend b { font-weight: 600; font-variant-numeric: tabular-nums; }
.adm-legend__go { font-size: 15px; color: var(--aaa-gold-600); opacity: 0; transform: translateX(-4px); transition: opacity .15s, transform .15s; }

.adm-split { display: flex; gap: 2px; height: 10px; margin: 2px 0 14px; border-radius: 999px; overflow: hidden; background: #e9e3d8; }
.adm-split i { display: block; height: 100%; min-width: 0; }
.adm-rows { margin: 0; padding: 0; list-style: none; }
.adm-rows li + li { border-top: 1px solid #f1ede6; }
.adm-rows li > a, .adm-rows__plain { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 2px; color: var(--aaa-ink); text-decoration: none; font-size: 14px; }
.adm-rows li > a:hover { color: var(--aaa-gold-600); }
.adm-rows li > a > span, .adm-rows__plain > span { display: inline-flex; align-items: center; gap: 8px; color: var(--aaa-muted); }
.adm-rows li > a:hover > span { color: var(--aaa-gold-600); }
.adm-rows b { font-weight: 600; font-variant-numeric: tabular-nums; }
.adm-rows__plain.is-planned > span { color: var(--aaa-faint); }
.adm-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.adm-planned { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; background: #f1ede6; color: var(--aaa-faint); font-size: 11.5px; font-weight: 700; }
.adm-planned .material-symbols-outlined { font-size: 14px; }

.adm-list { margin: 0; padding: 0; list-style: none; }
.adm-list li { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid #f1ede6; }
.adm-list li:first-child { border-top: 0; padding-top: 2px; }
.adm-list__body { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.adm-list__body a, .adm-list__body b { font-weight: 600; font-size: 14px; color: var(--aaa-ink); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-list__body a:hover { color: var(--aaa-gold-600); }
.adm-list__body small { font-size: 12.5px; color: var(--aaa-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-list form { margin: 0; flex: none; }
.adm-list .badge { flex: none; }
.adm-avatar { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 11px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; }
.adm-avatar.t1 { background: #e8edf5; color: #1f477b; } .adm-avatar.t2 { background: #e5f5ed; color: #176b45; } .adm-avatar.t3 { background: #fff0cf; color: #7b5716; }
.adm-avatar.t4 { background: #efecfd; color: #5b43c4; } .adm-avatar.t5 { background: #e2f4f8; color: #0e7490; } .adm-avatar.t6 { background: #fde8ef; color: #b0245a; }
.adm-avatar.is-doc { background: rgba(201, 161, 92, .14); color: var(--aaa-gold-600); } .adm-avatar.is-doc .material-symbols-outlined { font-size: 19px; }
.adm-empty { display: flex; align-items: center; gap: 8px; padding: 18px 0 8px !important; border-top: 0 !important; color: var(--aaa-faint); font-size: 13.5px; }
.adm-empty .material-symbols-outlined { color: var(--aaa-ok); }

.adm-timeline { margin: 0; padding: 0 0 0 4px; list-style: none; }
.adm-timeline li { position: relative; display: flex; gap: 12px; padding: 0 0 16px 18px; }
.adm-timeline li:not(.adm-empty)::before { content: ""; position: absolute; left: 4px; top: 14px; bottom: -2px; width: 1px; background: var(--aaa-line); }
.adm-timeline li:last-child::before { display: none; }
.adm-timeline li > i { position: absolute; left: 0; top: 5px; width: 9px; height: 9px; border-radius: 50%; background: var(--aaa-gold-400); box-shadow: 0 0 0 3px rgba(201, 161, 92, .18); }
.adm-timeline li > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.adm-timeline b { font-size: 13.5px; font-weight: 600; color: var(--aaa-ink); }
.adm-timeline small { font-size: 12px; color: var(--aaa-muted); }
.adm-timeline .adm-empty { padding-left: 0 !important; }
.adm-quick { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.adm-quick a { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 7px 10px; border-radius: 11px; color: var(--aaa-ink); font-size: 13.5px; font-weight: 500; text-decoration: none; transition: background .15s; }
.adm-quick a .material-symbols-outlined { font-size: 19px; color: var(--aaa-gold-600); }
.adm-quick a:hover { background: rgba(201, 161, 92, .09); }
.adm-quick a.is-danger { color: var(--aaa-danger); } .adm-quick a.is-danger .material-symbols-outlined { color: var(--aaa-danger); }

@media (max-width: 1400px) { .adm-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1180px) { .adm-grid--ops { grid-template-columns: 1fr; } .adm-grid--3 { grid-template-columns: 1fr 1fr; } .adm-hero { flex-direction: column; align-items: flex-start; } .adm-hero__actions { justify-content: flex-start; } }
@media (max-width: 820px) { .adm-grid--3, .adm-ops { grid-template-columns: 1fr; } .adm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .adm-hero { padding: 24px 20px; border-radius: 18px; } .adm-chart { flex-direction: column; align-items: stretch; } .adm-donut { margin: 0 auto; } }
@media (max-width: 480px) { .adm-kpis { gap: 10px; } .adm-kpi { padding: 14px 14px 12px; } .adm-kpi__ic { width: 32px; height: 32px; top: 11px; right: 11px; border-radius: 10px; } .adm-kpi__ic .material-symbols-outlined { font-size: 18px; } .adm-kpi__l { padding-right: 38px; font-size: 10px; letter-spacing: .08em; } .adm-kpi__n { font-size: 28px; } .adm-kpi__s { font-size: 12px; white-space: normal; } .adm-card { padding: 16px; } .adm-hero h1 { font-size: 24px !important; } }

/* ============================================================
   19. Customer dashboard components v2 (add-company, todo-list, companies-table, 2026-10-06)
   ============================================================ */
.dashboard-two-col { grid-template-columns: minmax(0, 400px) minmax(0, 1fr); }
.wf-card__h { display: flex; align-items: center; gap: 12px; padding: 16px 22px; border-bottom: 1px solid #f1ede6; }
.wf-card__ic { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 12px; background: rgba(201, 161, 92, .14); color: var(--aaa-gold-600); }
.wf-card__ic .material-symbols-outlined { font-size: 20px; }
.wf-card__ic.warn { background: #fff0cf; color: #9a6a0a; } .wf-card__ic.good { background: var(--aaa-ok-bg); color: var(--aaa-ok); }
.wf-card__t { flex: 1; min-width: 0; } .wf-card__t .card-title { margin: 0 !important; font-size: 16px !important; font-weight: 600 !important; letter-spacing: -.015em; }
.wf-card__t p { margin: 1px 0 0; font-size: 12.5px; color: var(--aaa-muted); }
.wf-card__h .badge { flex: none; }
.wf-card__f { padding: 12px 22px; border-top: 1px solid #f1ede6; text-align: center; }
.wf-card__f .inline-link { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; color: var(--aaa-gold-600) !important; }
.wf-card__f .inline-link .material-symbols-outlined { font-size: 15px; }
.wf-card__f .inline-link:hover { color: var(--aaa-navy-900) !important; }
.wf-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 20px; margin: 0; text-align: center; color: var(--aaa-muted); font-size: 13.5px; }
.wf-empty p { margin: 0; } .wf-empty p b { color: var(--aaa-ink); font-weight: 600; }
.wf-empty--tall { padding: 44px 20px; }
.wf-empty__ic { display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 8px; border-radius: 18px; background: var(--aaa-ok-bg); color: var(--aaa-ok); }
.wf-empty__ic .material-symbols-outlined { font-size: 28px; }
.wf-empty > .material-symbols-outlined { color: var(--aaa-faint); }
.wf-mono { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 11px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; }
.wf-mono.t1 { background: #e8edf5; color: #1f477b; } .wf-mono.t2 { background: #e5f5ed; color: #176b45; } .wf-mono.t3 { background: #fff0cf; color: #7b5716; }
.wf-mono.t4 { background: #efecfd; color: #5b43c4; } .wf-mono.t5 { background: #e2f4f8; color: #0e7490; } .wf-mono.t6 { background: #fde8ef; color: #b0245a; }
.wf-mono.is-gone { background: #efece6 !important; color: var(--aaa-faint) !important; }
.wf-pill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.wf-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.wf-pill.good { background: var(--aaa-ok-bg); color: var(--aaa-ok); } .wf-pill.warn { background: #fff0cf; color: #8a5a00; }
.wf-pill.bad { background: var(--aaa-danger-bg); color: var(--aaa-danger); } .wf-pill.neutral { background: #efece6; color: var(--aaa-muted); }

/* add-company strip */
.wf-add { padding: 0 !important; overflow: hidden; }
.wf-add__row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 22px; }
.wf-add__ic { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 15px; color: #f4ecdc; background: linear-gradient(135deg, var(--aaa-navy-800), var(--aaa-navy-950)); box-shadow: inset 0 0 0 1px rgba(201, 161, 92, .35); }
.wf-add__ic .material-symbols-outlined { font-size: 24px; color: var(--aaa-gold-300); }
.wf-add__text { flex: 1; min-width: 220px; }
.wf-add__text h2 { margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -.015em; color: var(--aaa-ink); }
.wf-add__text p { margin: 2px 0 0; font-size: 13px; color: var(--aaa-muted); }
.wf-add__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.wf-add__actions .btn .material-symbols-outlined { font-size: 18px; }
.wf-panel { padding: 18px 22px 22px; border-top: 1px solid #f1ede6; background: #fbf9f6; }
.wf-panel__h { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--aaa-muted); }
.wf-panel__h .material-symbols-outlined { font-size: 17px; color: var(--aaa-gold-600); }
.wf-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.wf-form .form-group { margin: 0; } .wf-form .form-label { margin: 0; }
.wf-form__actions { display: flex; justify-content: flex-start; margin-top: 4px; }
.wf-form--search { grid-template-columns: minmax(0, 220px) minmax(0, 1fr) auto; align-items: end; }
.wf-form__actions--inline { margin: 0; } .wf-form__actions--inline .btn { min-height: 44px; }
.wf-results { margin-top: 18px; }
.wf-results h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 14px; font-weight: 600; color: var(--aaa-ink); }
.wf-result { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; margin-bottom: 8px; border: 1px solid var(--aaa-line); border-radius: 14px; background: #fff; }
.wf-result__body { flex: 1; min-width: 200px; }
.wf-result__title { font-weight: 600; color: var(--aaa-ink); }
.wf-result__meta { font-size: 12.5px; color: var(--aaa-muted); }
.wf-result__form { margin: 0; }
.wf-result .btn-sm .material-symbols-outlined { font-size: 16px; }

/* todo list */
.wf-todo { padding: 0 !important; overflow: hidden; }
.wf-todo__sum { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #f1ede6; background: #fbf9f6; }
.wf-todo__sum span { display: flex; align-items: center; gap: 8px; padding: 10px 16px; font-size: 12px; font-weight: 600; color: var(--aaa-muted); }
.wf-todo__sum span + span { border-left: 1px solid #f1ede6; }
.wf-todo__sum b { font-family: var(--font-display); font-size: 20px; font-weight: 500; line-height: 1; }
.wf-todo__sum .is-overdue b { color: var(--aaa-danger); } .wf-todo__sum .is-due b { color: #a86f00; } .wf-todo__sum .is-action b { color: #2a78d6; }
.wf-todo__list { list-style: none; margin: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.wf-todo__item { --t-tone: #2a78d6; --t-bg: #eef4fc; --t-chip: #dbe8fa; display: flex; align-items: center; gap: 12px; padding: 11px 12px 11px 14px; border-radius: 14px; border: 1px solid transparent; background: var(--t-bg); position: relative; overflow: hidden; }
.wf-todo__item::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--t-tone); }
.wf-todo__item.is-overdue { --t-tone: var(--aaa-danger); --t-bg: #fdf1f0; --t-chip: #f9dcd9; }
.wf-todo__item.is-due { --t-tone: #c98500; --t-bg: #fff8e8; --t-chip: #fbe9bf; }
.wf-todo__ic { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--t-chip); color: var(--t-tone); }
.wf-todo__ic .material-symbols-outlined { font-size: 18px; }
.wf-todo__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.wf-todo__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.wf-todo__type { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--t-tone); }
.wf-todo__tag { font-size: 10.5px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: var(--t-chip); color: var(--t-tone); }
.wf-todo__name { font-size: 14px; font-weight: 600; color: var(--aaa-ink); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wf-todo__name:hover { color: var(--aaa-gold-600); }
.wf-todo__no { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11.5px; color: var(--aaa-muted); }
.wf-todo__go { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 10px; color: var(--t-tone); background: #fff; border: 1px solid var(--t-chip); text-decoration: none; transition: transform .2s; }
.wf-todo__go .material-symbols-outlined { font-size: 17px; } .wf-todo__go:hover { transform: translateX(2px); }

/* companies table */
.wf-companies .table-scroll { padding: 0; }
.wf-ctable th:first-child, .wf-ctable td:first-child { padding-left: 22px !important; }
.wf-ctable th:last-child, .wf-ctable td:last-child { padding-right: 22px !important; }
.wf-ctable td { vertical-align: middle !important; }
.wf-co__link { display: flex; align-items: center; gap: 12px; min-width: 0; color: inherit; text-decoration: none; }
.wf-co__text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.wf-co__name { font-weight: 600; font-size: 14px; color: var(--aaa-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 360px; }
.wf-co__link:hover .wf-co__name { color: var(--aaa-gold-600); }
.wf-co__no { font-size: 11.5px !important; color: var(--aaa-muted) !important; }
.wf-due { display: inline-flex; flex-direction: column; gap: 3px; font-size: 13.5px; font-variant-numeric: tabular-nums; color: var(--aaa-ink); }
.wf-due.text-overdue { color: var(--aaa-danger) !important; font-weight: 600; }
.wf-due__rel { align-self: flex-start; padding: 1px 7px; border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: .02em; }
.wf-due__rel.ok { background: #efece6; color: var(--aaa-muted); } .wf-due__rel.warn { background: #fff0cf; color: #8a5a00; } .wf-due__rel.bad { background: var(--aaa-danger-bg); color: var(--aaa-danger); }
.wf-status { display: inline-flex !important; align-items: center; gap: 6px; }
.wf-status .dashboard-company-status-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; display: inline-block; }
.wf-status.good { background: var(--aaa-ok-bg) !important; color: var(--aaa-ok) !important; }
.wf-status.warn { background: #fff0cf !important; color: #8a5a00 !important; }
.wf-status.bad { background: var(--aaa-danger-bg) !important; color: var(--aaa-danger) !important; }
.wf-status.neutral { background: #efece6 !important; color: var(--aaa-muted) !important; }
.wf-ctable .dashboard-company-action-btn .material-symbols-outlined { font-size: 16px; }
@media (max-width: 1100px) { .dashboard-two-col { grid-template-columns: 1fr; } }
@media (max-width: 820px) { .wf-form, .wf-form--search { grid-template-columns: 1fr; } .wf-form .span-2 { grid-column: auto; } .wf-card__h { padding: 14px 16px; } .wf-add__row { padding: 16px; } .wf-panel { padding: 16px; } .wf-ctable th:first-child, .wf-ctable td:first-child { padding-left: 14px !important; } .wf-ctable th:last-child, .wf-ctable td:last-child { padding-right: 14px !important; } .wf-co__name { max-width: 46vw; } }

/* ============================================================
   20. Whole-portal polish (2026-10-06): tables, filters, bands, stepper
   ============================================================ */
/* Tables: never break a word in the middle; let the column grow and the wrapper scroll instead. */
.table td, .table th, .admin-table td, .admin-table th, .data-table td, .data-table th, .au-table td, .au-table th, .xfs-table td, .ap-table td {
  overflow-wrap: normal !important; word-break: normal !important; hyphens: manual !important;
}
.table th, .admin-table th, .data-table th, .au-table th { white-space: nowrap !important; }
.table td.td-mono, .table .td-mono, .admin-table .td-mono, .data-table .td-mono, .td-mono, .mono, .company-number-mono, .company-number-link { white-space: nowrap !important; word-break: normal !important; overflow-wrap: normal !important; }
.table, .admin-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.table thead th, .admin-table thead th { padding: 11px 14px !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .1em; text-transform: uppercase; color: #5b6675 !important; background: #faf8f4 !important; border-bottom: 1px solid var(--aaa-line) !important; }
.table tbody td, .admin-table tbody td { padding: 12px 14px !important; border-bottom: 1px solid #f1ede6 !important; vertical-align: middle !important; font-size: 13.5px; }
.table tbody tr:hover td, .admin-table tbody tr:hover td { background: rgba(201, 161, 92, .05); }
.table-responsive, .table-wrap, .table-wrapper, .table-scroll { border-radius: 14px; }
/* Filter rows: a filter form lays its fields side by side (portal.css stacks .filter-bar as a column). */
form.filter-bar { flex-direction: row !important; flex-wrap: wrap; align-items: flex-end !important; gap: 12px !important; }
form.filter-bar .form-group { margin: 0; flex: 1 1 180px; }
form.filter-bar label { display: block; margin-bottom: 6px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--aaa-muted); }
.filter-bar .form-control, form.filter-bar .form-control { width: 100%; }
.filter-search-input, .input-padded { padding-left: 40px !important; }
.filter-search-icon { color: var(--aaa-faint) !important; }
/* Notification pages: the blue band becomes the navy liquid band. */
.notif-hero { background: linear-gradient(90deg, rgba(10, 20, 32, .97) 0%, rgba(10, 20, 32, .82) 55%, rgba(10, 20, 32, .3) 100%), url(../images/portal-liquid-wave-v1.webp) right center / cover no-repeat, var(--aaa-navy-900) !important; border: 1px solid rgba(201, 161, 92, .32) !important; border-radius: 22px !important; box-shadow: var(--aaa-shadow-lg) !important; }
.notif-hero-eyebrow { color: var(--aaa-gold-300) !important; } .notif-hero-eyebrow::before { background: var(--aaa-gold-400) !important; }
.notif-hero h1 { color: #f6f3ee !important; letter-spacing: -.03em; }
.notif-hero-actions .btn, .notif-hero-actions a, .notif-hero-actions button { background: rgba(255, 255, 255, .08) !important; color: #f6f3ee !important; border: 1px solid rgba(255, 255, 255, .18) !important; }
.notif-hero-actions .btn:hover, .notif-hero-actions a:hover, .notif-hero-actions button:hover { border-color: rgba(201, 161, 92, .55) !important; background: rgba(255, 255, 255, .14) !important; }
.notif-hero-actions .material-symbols-outlined { color: var(--aaa-gold-300) !important; }
/* Incorporation wizard stepper */
.wf-wizard { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; margin: 0 0 24px; padding: 6px; list-style: none; background: #fff; border: 1px solid var(--aaa-line); border-radius: 16px; box-shadow: var(--aaa-shadow-sm); }
.wf-wizard__step { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 9px 12px; border-radius: 11px; color: var(--aaa-faint); font-size: 12.5px; font-weight: 500; }
.wf-wizard__n { display: grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid var(--aaa-line); font-size: 12px; font-weight: 700; color: var(--aaa-muted); background: #fff; }
.wf-wizard__n .material-symbols-outlined { font-size: 16px; }
.wf-wizard__l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wf-wizard__step.is-complete { color: var(--aaa-ink); font-weight: 600; }
.wf-wizard__step.is-complete .wf-wizard__n { background: var(--aaa-ok-bg); border-color: transparent; color: var(--aaa-ok); }
.wf-wizard__step.is-active { color: #f6f3ee; font-weight: 600; background: linear-gradient(135deg, var(--aaa-navy-800), var(--aaa-navy-950)); box-shadow: inset 0 0 0 1px rgba(201, 161, 92, .4); }
.wf-wizard__step.is-active .wf-wizard__n { background: var(--aaa-gold-grad); border-color: transparent; color: var(--aaa-navy-950); }
@media (max-width: 900px) { .wf-wizard { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 520px) { .wf-wizard { grid-template-columns: repeat(2, minmax(0, 1fr)); } .wf-wizard__step { padding: 8px 10px; font-size: 12px; } }
/* Dashboard companies table inside a narrower column: icon-only action and shorter names. */
.wf-companies { container-type: inline-size; }
.wf-ctable { min-width: 0 !important; width: 100%; }
@container (max-width: 860px) {
  .wf-ctable th, .wf-ctable td { padding-left: 10px !important; padding-right: 10px !important; }
  .wf-ctable th:first-child, .wf-ctable td:first-child { padding-left: 16px !important; }
  .wf-ctable th:last-child, .wf-ctable td:last-child { padding-right: 16px !important; }
  .wf-co__name { max-width: 170px; }
  .wf-ctable .dashboard-company-action-text { display: none; }
  .wf-ctable .dashboard-company-action-btn { width: 36px; min-width: 36px; height: 36px; padding: 0 !important; justify-content: center; border-radius: 10px; }
  .wf-ctable .dashboard-company-action-btn .material-symbols-outlined { margin: 0; font-size: 18px; }
}
.dashboard-two-col { grid-template-columns: minmax(0, 360px) minmax(0, 1fr); }
/* Profile alerts: inline text flows beside the icon instead of becoming separate flex items. */
.pf-alert { display: block !important; line-height: 1.55; }
.pf-alert > .material-symbols-outlined { float: left; margin: 1px 10px 0 0; }
.pf-alert::after { content: ""; display: block; clear: both; }
/* Company page: detail rows and side panels on the paper tint, not a dark beige. */
.detail-row:nth-child(odd) { background: #faf8f4 !important; }
.detail-key { color: var(--aaa-muted) !important; }

/* 2026-10-09 (2.0.2): long page titles or e-mail chips must never widen the page (WCAG 1.4.10 reflow at 320 px). */
.topbar { min-width: 0; overflow: hidden; }
.topbar-left { min-width: 0; flex: 1 1 auto; }
.topbar-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.topbar-right { flex: 0 1 auto; min-width: 0; }
.topbar-right .user-chip, .topbar-right [class*="user"] { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 2026-10-09 (2.0.3): text-input boundaries at 3:1 or better against their background (WCAG 1.4.11). */
.form-control, .form-input, .pf-input, .filter-select, select.form-control, textarea.form-control, .code-input, .login-form input:not([type="checkbox"]):not([type="radio"]), .auth-form input:not([type="checkbox"]):not([type="radio"]), .auth-form select, .auth-form textarea { border-color: #6b7684 !important; }
.form-control:focus, .form-input:focus, .pf-input:focus, .filter-select:focus { border-color: #101828 !important; }
/* 2026-10-09 (2.0.4): every text control inside the portal content area keeps a ≥3:1 boundary, whatever its class (WCAG 1.4.11). */
.main-content input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="file"]):not([type="hidden"]), .main-content select, .main-content textarea, .login-page input[type="text"], .login-page input[type="email"], .login-page input[type="password"] { border-color: #6b7684 !important; }
/* 2026-10-09 (2.0.5): PWA update prompt — 12 px white text needs ≥4.5:1 (was #3b82f6, 3.7:1); "Later" keeps a 3:1 boundary (WCAG 1.4.3, 1.4.11). */
.pwa-update-action-btn { background: #1d4ed8 !important; }
.pwa-update-action-btn:hover, .pwa-update-action-btn:focus { background: #1e40af !important; }
.pwa-update-later-btn { color: #4b5563 !important; border-color: #6b7684 !important; }