/* 10Talents Learning — design tokens (single source of truth).
 *
 * DS-01 (plans/06_implementation_tickets.md). This file is the canonical token
 * layer for EVERY surface — the SPA (public/index.html), the marketing site
 * (landing.html), the admin console (admin.html), the co-op pages, and the
 * legal/auth pages (via brand/site-chrome.css). Edit brand values HERE and
 * nowhere else.
 *
 * Base values are copied verbatim from the SPA palette (public/index.html
 * :27-114) so adopting this file is a no-op visual change. The only additions
 * are the semantic state tokens (--success/--warn/--error/--info), which are
 * new and additive.
 *
 * NOT in this file: component CSS (buttons/cards/forms/nav) lives in
 * site-chrome.css + the SPA; behavior toggles like scripture-ribbon visibility
 * stay with the SPA. Surface-specific tokens (e.g. landing's --bg-deep, the
 * admin dark overrides) stay inline on their surface and override these.
 */

:root {
  /* Warm neutral canvas */
  --bg: oklch(98% 0.004 80);
  --bg-raised: oklch(99.5% 0.003 80);
  --bg-sunken: oklch(96% 0.006 80);
  --bg-panel: oklch(97% 0.005 80);

  /* Ink */
  --ink: oklch(22% 0.01 80);
  --ink-2: oklch(38% 0.01 80);
  --ink-3: oklch(55% 0.008 80);
  --ink-4: oklch(70% 0.006 80);

  /* Lines */
  --line: oklch(90% 0.006 80);
  --line-2: oklch(85% 0.008 80);
  --line-strong: oklch(78% 0.01 80);

  /* Accents — each with -soft (tints) and, where used, -ink (text-on-tint) */
  --sage: oklch(52% 0.06 145);
  --sage-soft: oklch(92% 0.03 145);
  --sage-ink: oklch(32% 0.05 145);

  --gold: oklch(68% 0.09 80);
  --gold-soft: oklch(94% 0.04 85);
  --gold-ink: oklch(40% 0.07 70);

  --clay: oklch(62% 0.08 40);
  --clay-soft: oklch(94% 0.03 40);
  --clay-ink: oklch(38% 0.06 40);

  --sky: oklch(60% 0.07 240);
  --sky-soft: oklch(94% 0.025 240);
  --sky-ink: oklch(34% 0.05 240);

  --plum: oklch(50% 0.07 320);
  --plum-soft: oklch(93% 0.025 320);
  --plum-ink: oklch(32% 0.05 320);

  /* Semantic states (NEW in DS-01). Distinct, higher-chroma readings so they
   * signal status clearly rather than blending into the muted brand accents;
   * hues align to the accent families (success≈sage, warn≈gold, info≈sky) and
   * --error matches the red already used by site-chrome.css form errors. */
  --success: oklch(55% 0.12 150);
  --success-soft: oklch(92% 0.05 150);
  --warn: oklch(70% 0.13 75);
  --warn-soft: oklch(94% 0.06 85);
  --error: oklch(52% 0.16 25);
  --error-soft: oklch(94% 0.04 25);
  --info: oklch(60% 0.10 240);
  --info-soft: oklch(94% 0.025 240);

  /* Type ramp */
  --font-ui: 'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-display: 'Fraunces', 'Source Serif 4', Georgia, serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* Radii */
  --r-sm: 6px;
  --r: 10px;
  --r-lg: 14px;
  --r-xl: 20px;

  /* Spacing + density */
  --pad: 16px;
  --pad-lg: 24px;
  --gap: 12px;
  --row-h: 40px;

  /* Shell (SPA) */
  --sidebar-w: 240px;
  --sidebar-w-compact: 216px;

  /* Compatibility aliases — legacy token names used by the static surfaces
   * (site-chrome.css, landing.html). Keep so those surfaces can drop their own
   * :root and source from here without renaming every usage. */
  --bg-2: var(--bg-raised);
  --font: var(--font-ui);
  --serif: var(--font-display);
}

/* Density: compact (SPA Settings → Appearance) */
[data-density="compact"] {
  --pad: 10px;
  --pad-lg: 16px;
  --gap: 8px;
  --row-h: 32px;
}

/* Theme: warm (parchment / scriptural) */
[data-theme="warm"] {
  --bg: oklch(96% 0.015 80);
  --bg-raised: oklch(98% 0.012 80);
  --bg-sunken: oklch(93% 0.018 80);
  --bg-panel: oklch(95% 0.016 80);
  --ink: oklch(25% 0.02 60);
  --line: oklch(87% 0.02 80);
  --sage: oklch(48% 0.07 60);
  --sage-soft: oklch(90% 0.04 75);
}

/* Theme: bright (family / cheerful) */
[data-theme="bright"] {
  --bg: oklch(98% 0.008 220);
  --bg-raised: oklch(99.5% 0.004 220);
  --bg-sunken: oklch(95% 0.012 220);
  --bg-panel: oklch(97% 0.008 220);
  --sage: oklch(58% 0.13 155);
  --sage-soft: oklch(92% 0.05 155);
  --gold: oklch(72% 0.14 75);
  --gold-soft: oklch(94% 0.06 85);
}