/* ShowFlow theme — Design System v2 (shared across the Lineup Lab suite).
   Light is the default; dark is opt-in via html[data-theme="dark"].
   One accent = graphite/ink (gold retired). Flat. Header stays dark + warm in
   both modes. Every colour/font/radius is a token here; the rest of the app
   references variables only, so the whole look swaps by editing this file. */

/* ---------- LIGHT (default / hero) ---------- */
:root,
html[data-theme='light'] {
  --bg: #F4F1EC; --surface: #FFFFFF; --surface-2: #FBF9F5;
  --line: #E2DDD3; --line-soft: #EDE8DE;
  --ink: #2A2620; --ink-soft: #7A7264; --ink-faint: #A8A091;
  --ok: #2E6B47; --ok-bg: #E4F0E8;
  --warn: #8A6A1E; --warn-bg: #F3EAD2;
  --danger: #A32D2D; --danger-bg: #F7E3E3;
  /* primary accent — near-black + white text in light; inverts in dark */
  --accent: #2C2820; --accent-ink: #FFFFFF; --accent-deep: #161310; --accent-soft: rgba(44,40,32,.07);
  --headbar: #221F1A;            /* dark warm header even in light mode */
  --danger-btn: #A32D2D;
  --btn-2-bg: #EEE9DF; --btn-2-border: #D5CDBC;
  --lipstick: #8E2434;
}

/* ---------- DARK (opt-in) ---------- */
html[data-theme='dark'] {
  --bg: #17151A; --surface: #201D24; --surface-2: #2A2630;
  --line: #2E2A33; --line-soft: #2A2630;
  --ink: #EDE7DB; --ink-soft: #A39A8C; --ink-faint: #6E665C;
  --ok: #6FBF8E; --ok-bg: #16291F;
  --warn: #E0B25A; --warn-bg: #2A2415;
  --danger: #E2727F; --danger-bg: #2A171B;
  --accent: #EDE7DB; --accent-ink: #1A1712; --accent-deep: #FFFFFF; --accent-soft: rgba(237,231,219,.12);
  --headbar: #1B1920;
  --danger-btn: #B23A45;
  --btn-2-bg: #2C2832; --btn-2-border: #48424F;
  --lipstick: #C77;
}

:root {
  /* legacy aliases so existing var(--brass…) usages become the graphite accent */
  --brass: var(--accent);
  --brass-deep: var(--accent-deep);

  /* type */
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --head: 'Space Grotesk', var(--font);
  --mono: 'Spline Sans Mono', 'SF Mono', ui-monospace, 'Menlo', monospace;
  /* shape */
  --r-card: 12px;
  --r-ctrl: 8px;

  /* brand colours (dark-mode-bright hexes; JS injects the right one inline) */
  --brand-girlypop: #E98CB4;
  --brand-rnb-mania: #8A98EC;
  --brand-road-to-nashville: #E6A24C;

  /* segment-type colours — a distinct channel inside a programme (no gold) */
  --type-act: #5B6FE0;          /* indigo — the stars */
  --type-changeover: #2FA39B;   /* teal */
  --type-interval: #C0497A;     /* magenta-rose */
  --type-mc: #9B6FD6;           /* violet */
  --type-doors: #5F9B3F;        /* green */
  --type-countdown: #C77A2E;    /* amber */
  --type-custom: #8A8F98;       /* slate */
}