/* ==========================================================================
   Pashdon design tokens — ONE light theme, every page, no dark flips.
   Clean paper-white canvas, one indigo accent + deep-cyan partner, soft
   shadows, brightness hierarchy through navy inks. Raw hex lives here only.
   (Dark remains only inside deliberate COMPONENTS like the code terminal.)
   ========================================================================== */
:root {
  color-scheme: light;

  /* --- Canvas layers --- */
  --bg: #F7F8FC;            /* page canvas — soft cool white */
  --bg-2: #FFFFFF;          /* raised canvas: chat body, inputs */
  --surface: #FFFFFF;       /* cards, tables, panels */
  --surface-soft: #EFF2FA;  /* alt surfaces, soft sections */
  --surface-dark: #E9EDF8;  /* deep-contrast sections (now light-deep) */

  /* --- Text: navy ink hierarchy --- */
  --ink: #0E1230;
  --ink-soft: #3D4468;
  --ink-muted: #646C92;

  /* Aliases used by newer components (widget, admin) */
  --text: var(--ink);
  --text-muted: var(--ink-muted);

  /* --- Hairlines --- */
  --border: rgba(14, 18, 48, 0.10);
  --border-strong: rgba(14, 18, 48, 0.20);
  --border-highlight: rgba(255, 255, 255, 0.85); /* inner top-edge light */

  /* --- The single accent + partner --- */
  --accent: #6366F1;
  --accent-dark: #4F46E5;
  --accent-2: #0891B2;                     /* deep cyan — readable on white */
  --accent-soft: #4F46E5;                  /* links on light MUST stay dark enough */
  --accent-glow: rgba(99, 102, 241, 0.25);

  --success: #059669;
  --warning: #B45309;

  /* --- Legacy deep-section tokens: repointed to the light language --- */
  --dark-bg: #EDF0FA;
  --dark-surface: #FFFFFF;
  --dark-surface-soft: #E7EBF7;
  --dark-ink: #0E1230;
  --dark-ink-soft: #3D4468;
  --dark-border: rgba(14, 18, 48, 0.12);
  --dark-border-strong: rgba(14, 18, 48, 0.22);

  --neon: #0891B2;
  --neon-dim: #0E7490;
  --neon-soft: rgba(8, 145, 178, 0.10);
  --neon-glow: rgba(8, 145, 178, 0.30);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 999px;

  --shadow-sm: 0 1px 2px rgba(23, 30, 74, 0.06), 0 1px 3px rgba(23, 30, 74, 0.08);
  --shadow-md: 0 6px 18px rgba(23, 30, 74, 0.10), 0 2px 6px rgba(23, 30, 74, 0.06);
  --shadow-lg: 0 20px 50px rgba(23, 30, 74, 0.16), 0 6px 16px rgba(23, 30, 74, 0.08);

  --font-display: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-body: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Menlo', 'Monaco', monospace;

  --container: 1200px;
  --container-narrow: 880px;

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --duration-fast: 160ms;
  --duration-base: 240ms;
  --duration-slow: 480ms;
}

/* Native cross-page crossfade (Chrome 126+/Safari 18.2+; no-op elsewhere). */
@view-transition {
  navigation: auto;
}