/* tokens.css ─ oklch design tokens
 * Mirrors tailwind.config.js so legacy callers that read
 * var(--accent), var(--bg-panel), etc. keep working during the
 * page-by-page migration. After all pages migrate to Tailwind
 * utility classes (wave 4 complete), this file shrinks to
 * just the few tokens that are referenced from inline styles. */
:root {
  /* Surfaces */
  --bg-deep:    oklch(8% 0.011 32);
  --bg-base:    oklch(11% 0.010 32);
  --bg-panel:   oklch(15% 0.013 32);
  --bg-surface: oklch(19% 0.014 32);
  --bg-raised:  oklch(24% 0.015 32);
  --bg-hover:   oklch(28% 0.015 32);

  /* Accent */
  --accent:        oklch(62% 0.22 32);
  --accent-subtle: oklch(62% 0.22 32 / 0.12);
  --accent-border: oklch(62% 0.22 32 / 0.36);

  /* Text — tertiary bumped to 56% for AA contrast on bg-panel */
  --text-primary:   oklch(94% 0.008 32);
  --text-secondary: oklch(72% 0.014 32);
  --text-tertiary:  oklch(56% 0.012 32);
  --text-disabled:  oklch(38% 0.010 32);

  /* Borders */
  --border-faint:   oklch(22% 0.013 32);
  --border:         oklch(28% 0.015 32);
  --border-strong:  oklch(38% 0.018 32);

  /* Semantic signal */
  --signal-good: oklch(70% 0.18 148);
  --signal-bad:  oklch(64% 0.22 25);
  --signal-warn: oklch(80% 0.16 90);
  --signal-idle: oklch(58% 0.012 32);
  --signal-good-bg: oklch(70% 0.18 148 / 0.12);
  --signal-bad-bg:  oklch(64% 0.22 25  / 0.12);
  --signal-warn-bg: oklch(80% 0.16 90  / 0.12);

  /* Spacing (mirrors Tailwind 4pt scale) */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-12: 48px;

  /* Type */
  --font:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  /* Layout */
  --sidebar-w: 200px;
  --topbar-h:  48px;

  /* Z */
  --z-dropdown: 40;
  --z-overlay:  80;
  --z-panel:    90;
  --z-toast:   200;

  /* Hover-darker variants of accent + signals — promoted from
   * inline oklch() arithmetic that was duplicated across button.css
   * and card-operational.css */
  --accent-hover:      oklch(68% 0.22 32);
  --accent-bright:     oklch(76% 0.20 32);
  --signal-bad-hover:  oklch(68% 0.22 25);
  --signal-good-hover: oklch(74% 0.18 148);
  --signal-warn-hover: oklch(84% 0.16 90);
  /* Pure-black-ish tinted toward brand hue for thumbnails & overlays. */
  --thumb-black: oklch(0% 0 32);
  --overlay:     oklch(8% 0.010 32 / 0.65);
  --shadow:      oklch(0% 0 32 / 0.5);

  /* Motion + ease tokens — promoted from raw cubic-bezier strings */
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:    120ms;
  --dur-normal:  180ms;
  --dur-slide:   240ms;

  /* Z layers — promoted from sidebar/topbar where 30 was hard-coded */
  --z-topbar:   30;
}
