/* Site design tokens - the single source of truth for the palette.
 *
 * These tokens are copied VERBATIM from the homepage's inline <style> block
 * (menard-pc-builds-website/index.html). The homepage is the brand
 * reference: every other page - the dynamic public pages, the staff
 * console, the customer portal - reads these variables instead of
 * hard-coding its own colors.
 *
 * src/site-theme-tests.ts fails if this file and the homepage ever drift
 * apart. Re-run scripts/extract-homepage-tokens.ts --write after a
 * homepage redesign.
 */

:root {
      color-scheme: dark;
      /* 2026-10 redesign tokens */
      --bg: #080f18;
      --surface: #101b28;
      --surface-2: #142233;
      --surface-3: #0d1723;
      --ink: #f3f7fc;
      --ink-secondary: #d0dae6;
      --muted: #9eafc2;
      --line: #1e3044;
      --line-light: #162638;
      --blue: #239be7;
      --cyan: #65cafb;
      --cyan-glow: #65cafb15;
      --radius-sm: 8px;
      --radius-md: 14px;
      --radius-lg: 20px;
      --radius-xl: 24px;
      --shadow-sm: 0 2px 8px rgba(0, 0, 0, .15);
      --shadow-md: 0 8px 32px rgba(0, 0, 0, .2);
      --shadow-lg: 0 24px 64px rgba(0, 0, 0, .3);
      --shadow-glow: 0 0 40px rgba(35, 155, 231, .08);
      --transition-fast: 150ms cubic-bezier(.4, 0, .2, 1);
      --transition-base: 250ms cubic-bezier(.4, 0, .2, 1);
      --transition-smooth: 400ms cubic-bezier(.16, 1, .3, 1);
      /* legacy aliases used by the sections below the hero */
      --bg-deep: #060c13;
      --text: var(--ink);
      --blue-light: #7ec8f9;
      --green: #34d399;
      --amber: #fbbf24;
      --shadow: var(--shadow-lg);
      --radius: var(--radius-lg);
      --container: 1200px;
    }