/* Design tokens.
   The palette is chosen on <html data-palette="..."> (see config/site_flags.py). Every
   color pairing below was checked against WCAG AA: body and muted text on the backgrounds,
   button text on the accent, white on the anchor, and accent-text on the backgrounds
   (and over the hero's glow). --field-line, the edge of a text box, and both focus colors
   are at least 3:1 against what sits next to them (WCAG 1.4.11). */

:root {
  --font-sans: "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;

  --container: 72rem;
  --gutter: clamp(1rem, 4vw, 2rem);
  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  --dur: 220ms;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);

  --shadow-sm: 0 1px 2px rgb(10 37 64 / 0.06), 0 1px 3px rgb(10 37 64 / 0.05);
  --shadow: 0 10px 28px rgb(10 37 64 / 0.09), 0 2px 6px rgb(10 37 64 / 0.05);
  --shadow-lg: 0 28px 56px rgb(10 37 64 / 0.14), 0 6px 14px rgb(10 37 64 / 0.06);

  --error: #b42318;
  --error-soft: #fdecea;
  --mark-bg: #fff1a8;
  --mark-ink: #4a3a00;

  /* Default palette: Navy + warm (the current lean). */
  --bg: #faf8f5;
  --bg-alt: #ffffff;
  --surface: #ffffff;
  --ink: #0a2540;
  --ink-muted: #4b5b70;
  --anchor: #0a2540;
  --anchor-ink: #ffffff;
  --anchor-muted: #b8c4d4;
  --anchor-soft: rgb(10 37 64 / 0.06);
  --accent: #ff6b5c;
  --accent-ink: #0a2540;
  --accent-text: #ad3826;
  --accent-soft: #ffeeea;
  --line: #e6e0d8;
  --field-line: #7d8a9a;
  --focus: #ad3826;
  --focus-on-dark: #ff9d92;
  --hero-glow: rgb(255 107 92 / 0.22);
  --hero-glow-2: rgb(10 37 64 / 0.08);
}

html[data-palette="clinical"] {
  --bg: #f5f7fa;
  --bg-alt: #ffffff;
  --surface: #ffffff;
  --ink: #0a2540;
  --ink-muted: #4b5b70;
  --anchor: #0a2540;
  --anchor-ink: #ffffff;
  --anchor-muted: #b8c4d4;
  --anchor-soft: rgb(10 37 64 / 0.06);
  --accent: #00c2b2;
  --accent-ink: #0a2540;
  --accent-text: #008075;
  --accent-soft: #d5f5f1;
  --line: #d9e0e8;
  --focus: #008075;
  --hero-glow: rgb(0 194 178 / 0.22);
  --hero-glow-2: rgb(10 37 64 / 0.08);
}

html[data-palette="warm"] {
  --bg: #fbf7f2;
  --bg-alt: #ffffff;
  --surface: #ffffff;
  --ink: #1b3a5b;
  --ink-muted: #56657a;
  --anchor: #1b3a5b;
  --anchor-ink: #ffffff;
  --anchor-muted: #bcc8d8;
  --anchor-soft: rgb(27 58 91 / 0.07);
  --accent: #ff6b5c;
  --accent-ink: #0a2540;
  --accent-text: #ad3826;
  --accent-soft: #ffeeea;
  --line: #e9e0d6;
  --focus: #ad3826;
  --hero-glow: rgb(255 107 92 / 0.24);
  --hero-glow-2: rgb(27 58 91 / 0.08);
}

html[data-palette="fresh"] {
  --bg: #ffffff;
  --bg-alt: #f4f6fb;
  --surface: #ffffff;
  --ink: #1f2933;
  --ink-muted: #52606d;
  --anchor: #2541b2;
  --anchor-ink: #ffffff;
  --anchor-muted: #c3cbf0;
  --anchor-soft: rgb(37 65 178 / 0.07);
  --accent: #16c784;
  --accent-ink: #1f2933;
  --accent-text: #0e7e53;
  --accent-soft: #d9f7ea;
  --line: #e1e5ec;
  --focus: #0e7e53;
  --hero-glow: rgb(22 199 132 / 0.2);
  --hero-glow-2: rgb(37 65 178 / 0.1);
}

html[data-palette="brand"] {
  --bg: #ffffff;
  --bg-alt: #f0f8fd;
  --surface: #ffffff;
  --ink: #012b3d;
  --ink-muted: #486574;
  --anchor: #012b3d;
  --anchor-ink: #ffffff;
  --anchor-muted: #b6cad6;
  --anchor-soft: rgb(1 43 61 / 0.06);
  --accent: #0076dd;
  --accent-ink: #ffffff;
  --accent-text: #0071d3;
  --accent-soft: #e1f3fc;
  --line: #d4e3ec;
  --focus: #0071d3;
  --hero-glow: rgb(0 205 233 / 0.22);
  --hero-glow-2: rgb(0 118 221 / 0.1);
}

/* Swatches for the review-only palette switcher. */
.swatch--navy-warm { background: linear-gradient(135deg, #0a2540 50%, #ff6b5c 50%); }
.swatch--clinical { background: linear-gradient(135deg, #0a2540 50%, #00c2b2 50%); }
.swatch--warm { background: linear-gradient(135deg, #1b3a5b 50%, #ff6b5c 50%); }
.swatch--fresh { background: linear-gradient(135deg, #2541b2 50%, #16c784 50%); }
.swatch--brand { background: linear-gradient(135deg, #012b3d 50%, #0076dd 50%); }
