/* ============================================================
   ACC TAX PORTAL — Design tokens
   Conservative financial UI: navy + brand gold, white surfaces,
   hairline borders, flat cards, tabular figures.
   ============================================================ */

:root{
  /* ---- Brand / primary ---- */
  --navy-900:#04162e;
  --navy-800:#07203f;
  --navy-700:#0a2a50;
  --navy-600:#123a68;
  --navy-500:#1d4d80;
  --navy:#07203f;

  /* ---- Accent: brand gold, matching the marketing site ----
     Gold is a FILL colour, not a text colour — #d0a454 on white is only
     2.6:1. So fills use --accent with navy ink on top, and anything that
     is itself text/icon on a light surface uses --accent-ink (4.6:1). */
  --gold-800:#8a6524;
  --gold-700:#a87c2e;
  --gold-600:#c08f33;
  --gold:#d0a454;
  --gold-300:#e6cd96;
  --gold-100:#f7eed8;
  --gold-50:#fdf8ef;

  --accent:var(--gold);              /* fills: buttons, active dots, bars */
  --accent-hover:var(--gold-600);
  --accent-on:#07203f;               /* ink that sits ON a gold fill */
  --accent-ink:var(--gold-700);      /* gold as text/icon on light surfaces */
  --accent-ink-strong:var(--gold-800);
  --accent-tint:var(--gold-100);     /* selected-row / checked-card tint */
  --accent-tint-soft:var(--gold-50);

  /* ---- Neutrals ---- */
  --white:#ffffff;
  --gray-50:#f7f8fa;
  --gray-100:#eef1f5;
  --gray-200:#e2e6ec;
  --gray-300:#cbd2dc;
  --gray-400:#9aa5b4;
  --gray-500:#6b7686;
  --gray-600:#4d5665;
  --gray-700:#333c4a;
  --gray-800:#20272f;
  --gray-900:#111823;

  /* ---- Surfaces ---- */
  --bg:#f4f6f9;
  --surface:#ffffff;
  --surface-sunken:var(--gray-50);
  --border:#e2e6ec;
  --border-strong:#cbd2dc;

  /* ---- Text ---- */
  --text:#111823;
  --text-secondary:#4d5665;
  --text-muted:#6b7686;
  --text-on-dark:#e8edf4;
  --text-on-dark-muted:#a3b0c2;

  /* ---- Status: the six states, used identically everywhere ---- */
  --st-draft-fg:#4d5665;      --st-draft-bg:#eef1f5;      --st-draft-dot:#6b7686;
  --st-submitted-fg:#1c4ed8;  --st-submitted-bg:#e8eefc;  --st-submitted-dot:#2563eb;
  --st-info-fg:#8a5a06;       --st-info-bg:#fdf2d8;       --st-info-dot:#d69412;
  --st-filed-fg:#146c43;      --st-filed-bg:#e3f3e9;      --st-filed-dot:#1a9455;
  --st-completed-fg:#0a4830;  --st-completed-bg:#d5e9dd;  --st-completed-dot:#0f6b46;
  --st-cancelled-fg:#b42318;  --st-cancelled-bg:#fde9e7;  --st-cancelled-dot:#d92d20;

  /* ---- Feedback ---- */
  --danger:#b42318;
  --danger-bg:#fde9e7;
  --success:#146c43;
  --success-bg:#e3f3e9;
  --warning:#8a5a06;
  --warning-bg:#fdf2d8;
  --info:#1c4ed8;
  --info-bg:#e8eefc;

  /* ---- Type ---- */
  --font:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  --font-ur:'Noto Naskh Arabic','Segoe UI',serif;
  --fs-xs:.75rem;     /* 12 */
  --fs-sm:.8125rem;   /* 13 */
  --fs-base:.875rem;  /* 14 */
  --fs-md:.9375rem;   /* 15 */
  --fs-lg:1.0625rem;  /* 17 */
  --fs-xl:1.25rem;    /* 20 */
  --fs-2xl:1.5rem;    /* 24 */
  --fs-3xl:1.875rem;  /* 30 */

  /* ---- Space ---- */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px;

  /* ---- Radius ---- */
  --r-sm:4px; --r:6px; --r-md:8px; --r-lg:12px; --r-pill:999px;

  /* ---- Elevation: used sparingly, never on resting cards ---- */
  --shadow-sm:0 1px 2px rgba(17,24,35,.06);
  --shadow:0 4px 12px rgba(17,24,35,.08);
  --shadow-lg:0 12px 32px rgba(17,24,35,.14);
  --shadow-bar:0 -2px 12px rgba(17,24,35,.07);

  /* ---- Focus ring: one ring, everywhere ---- */
  --ring:0 0 0 3px rgba(168,124,46,.30);
  --ring-danger:0 0 0 3px rgba(180,35,24,.18);

  /* ---- Layout ---- */
  --topbar-h:60px;
  --sidebar-w:236px;
  --tap:44px;          /* minimum tap target */
  --container:1180px;
}
