/* PAHO/PHE · design tokens (see DESIGN_SYSTEM.md).
   Brand blue #0099D6 sampled from the official PAHO logo.
   Components consume the SEMANTIC tokens (--text-*, --bg-*, --brand-*,
   --primary, --on-primary, --hover-bg) so both themes stay legible. */
:root {
  /* Brand scale (fixed across themes) */
  --paho-blue-900:#003A5D; --paho-blue-700:#00629B; --paho-blue-600:#0077BE;
  --paho-blue-500:#0099D6; --paho-blue-300:#66C4E8; --paho-blue-100:#CCECF8;
  --paho-blue-050:#F0F9FD;

  --neutral-900:#1A1D21; --neutral-700:#3D4349; --neutral-500:#6B7280;
  --neutral-300:#CDD3D9; --neutral-200:#E4E8EC; --neutral-100:#F2F4F6;
  --neutral-050:#F8FAFB; --white:#FFFFFF;

  /* Ink & paper — a warmer, more authoritative near-black over a clean paper
     white, moving the surface off flat cold gray (see DESIGN_SYSTEM.md). */
  --ink:#0B2130; --paper:#FBFCFD;

  --success-600:#1B7F4B; --success-050:#E7F4ED; --success-700:#155E37;
  --warning-600:#B45309; --warning-050:#FBF1E3; --warning-700:#8A3F07;
  --danger-600:#C0392B;  --danger-050:#FBEAE8;  --danger-700:#94271C;
  --info-600:#0077BE;    --info-050:#F0F9FD;     --info-700:#00629B;

  /* Semantic (LIGHT) — components use only these. */
  --bg-app:var(--paper); --bg-surface:#FFFFFF; --surface-2:#F5F8FA;
  --text-primary:var(--ink); --text-secondary:#3D4349; --text-muted:#6B7280;
  --border:#E4E8EC;
  --primary:var(--paho-blue-600); --primary-hover:var(--paho-blue-700);
  --on-primary:#FFFFFF;
  --accent:var(--primary);                 /* highlight for left-borders, unread marks, focus */
  --brand-fg:var(--paho-blue-700);         /* brand-colored TEXT (stat #s, links-as-text) */
  --brand-subtle-bg:var(--paho-blue-100);  /* tinted fill (active nav, badges) */
  --brand-subtle-fg:var(--paho-blue-700);  /* text ON the tinted fill */
  --hover-bg:var(--paho-blue-050);
  --thead-bg:#F5F8FA; --chip-bg:#F2F4F6;
  /* Epi-curve signature — bar tints, ascending (see DESIGN_SYSTEM.md). */
  --epi-1:var(--paho-blue-100); --epi-2:var(--paho-blue-300);
  --epi-3:var(--paho-blue-500); --epi-4:var(--paho-blue-700);

  /* Type — a bulletin serif for display (headings/hero/figures), a humanist
     sans for body, a mono "registry" voice for codes & figures. Self-hosted-
     free system stacks: reliable offline, no CDN, full multilingual coverage. */
  --font-display:Georgia,"Iowan Old Style","Times New Roman","Noto Serif",serif;
  --font-sans:"Noto Sans","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --font-mono:"Noto Sans Mono","Cascadia Code",Consolas,monospace;

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px;
  --radius-sm:4px; --radius-md:8px; --radius-full:9999px;
  --shadow-sm:0 1px 2px rgba(0,58,93,.08);
  --shadow-md:0 4px 12px rgba(0,58,93,.12);
}

/* Semantic (DARK) — explicit values; never alias a token we also remap. */
:root[data-theme="dark"] {
  --bg-app:#0D1B26; --bg-surface:#12232F; --surface-2:#172C38;
  --text-primary:#EAF1F6; --text-secondary:#B4C4CE; --text-muted:#8A94A0;
  --border:#274050;
  --primary:var(--paho-blue-300); --primary-hover:#8AD3EF; --on-primary:#06283A;
  --accent:var(--primary);
  --brand-fg:var(--paho-blue-300);
  --brand-subtle-bg:#0F324A; --brand-subtle-fg:var(--paho-blue-300);
  --hover-bg:#172C38; --thead-bg:#152836; --chip-bg:#172C38;
  --epi-1:#1C3A4E; --epi-2:#2E6E93; --epi-3:var(--paho-blue-500); --epi-4:var(--paho-blue-300);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-app:#0D1B26; --bg-surface:#12232F; --surface-2:#172C38;
    --text-primary:#EAF1F6; --text-secondary:#B4C4CE; --text-muted:#8A94A0;
    --border:#274050;
    --primary:var(--paho-blue-300); --primary-hover:#8AD3EF; --on-primary:#06283A;
    --accent:var(--primary);
    --brand-fg:var(--paho-blue-300);
    --brand-subtle-bg:#0F324A; --brand-subtle-fg:var(--paho-blue-300);
    --hover-bg:#172C38; --thead-bg:#152836; --chip-bg:#172C38;
    --epi-1:#1C3A4E; --epi-2:#2E6E93; --epi-3:var(--paho-blue-500); --epi-4:var(--paho-blue-300);
  }
}