/* ═══════════════════════════════════════════════════════════════
   F&T AUTO CENTER — THEMES
   Semantic color tokens, switchable via html[data-theme="…"].
   Default (:root) = White / Blue (the current build).
   Legacy token names (--gold, --dark, --white …) are aliased to the
   semantic tokens so existing rules keep working untouched.
═══════════════════════════════════════════════════════════════ */

:root,
html[data-theme="white"] {
  /* accent */
  --accent: #1d4ed8;
  --accent-strong: #1e40af;
  --accent-rgb: 29, 78, 216;
  --on-accent: #ffffff;
  /* surfaces */
  --bg: #ffffff;
  --header-bg: rgba(255,255,255,0.97);
  --surface: #ffffff;
  --surface-alt: #f1f5f9;
  --surface-3: #e2e8f0;
  --checker-base: #e2e8f0;
  --input-bg: #ffffff;
  --dot: #cbd5e1;
  /* text */
  --fg: #0f172a;
  --fg-2: #334155;
  --fg-muted: #64748b;
  /* footer (kept dark on every theme) */
  --footer-bg: #0f172a;
  --footer-stripe-base: #1e3a5f;
  --footer-fg: #ffffff;
  --footer-muted: #94a3b8;
  /* hero wash gradient ends */
  --hero-wash-1: rgba(241,245,249,0.5);
  --hero-wash-2: rgba(255,255,255,0.85);
  /* 3D car palette (read by car.js) */
  --car-bright: #1d4ed8;
  --car-soft: #3b82f6;
  --car-grid: #93c5fd;
  --car-bg: #f1f5f9;
}

/* ── BLACK / GOLD — heritage F&T racing look ──────────────────── */
html[data-theme="gold"] {
  --accent: #e8b400;
  --accent-strong: #ffc933;
  --accent-rgb: 232, 180, 0;
  --on-accent: #111111;
  --bg: #0d0d0d;
  --header-bg: rgba(13,13,13,0.9);
  --surface: #1f1f1f;
  --surface-alt: #161616;
  --surface-3: #2a2a2a;
  --checker-base: #111111;
  --input-bg: #161616;
  --dot: #3a3a3a;
  --fg: #f5f5f5;
  --fg-2: #e8e8e8;
  --fg-muted: #8a8a8a;
  --footer-bg: #080808;
  --footer-stripe-base: #1a1a1a;
  --footer-fg: #ffffff;
  --footer-muted: #8a8a8a;
  --hero-wash-1: rgba(13,13,13,0.55);
  --hero-wash-2: rgba(13,13,13,0.92);
  --car-bright: #e8b400;
  --car-soft: #b8901a;
  --car-grid: #4a4233;
  --car-bg: #0d0d0d;
}

/* ── BLACK / BLUE — modern tech ───────────────────────────────── */
html[data-theme="blue"] {
  --accent: #3b82f6;
  --accent-strong: #2563eb;
  --accent-rgb: 59, 130, 246;
  --on-accent: #ffffff;
  --bg: #0b1220;
  --header-bg: rgba(11,18,32,0.9);
  --surface: #131c2e;
  --surface-alt: #0f1827;
  --surface-3: #1c2940;
  --checker-base: #0a0f1a;
  --input-bg: #0f1827;
  --dot: #2a3a52;
  --fg: #f1f5f9;
  --fg-2: #cbd5e1;
  --fg-muted: #7c8aa0;
  --footer-bg: #070b14;
  --footer-stripe-base: #14233b;
  --footer-fg: #ffffff;
  --footer-muted: #7c8aa0;
  --hero-wash-1: rgba(11,18,32,0.5);
  --hero-wash-2: rgba(11,18,32,0.9);
  --car-bright: #3b82f6;
  --car-soft: #1d4ed8;
  --car-grid: #1e3a5f;
  --car-bg: #0b1220;
}

/* ── BONE / RACING GREEN — premium heritage ───────────────────── */
html[data-theme="green"] {
  --accent: #15803d;
  --accent-strong: #166534;
  --accent-rgb: 21, 128, 61;
  --on-accent: #ffffff;
  --bg: #f6f4ee;
  --header-bg: rgba(246,244,238,0.95);
  --surface: #fffdf8;
  --surface-alt: #efece3;
  --surface-3: #e3ded1;
  --checker-base: #d8d2c4;
  --input-bg: #fffdf8;
  --dot: #cdc7b8;
  --fg: #1c2620;
  --fg-2: #3c4a40;
  --fg-muted: #6b7568;
  --footer-bg: #14201a;
  --footer-stripe-base: #25342b;
  --footer-fg: #ffffff;
  --footer-muted: #9aa89c;
  --hero-wash-1: rgba(239,236,227,0.45);
  --hero-wash-2: rgba(246,244,238,0.85);
  --car-bright: #15803d;
  --car-soft: #3f9d63;
  --car-grid: #aebaa5;
  --car-bg: #efece3;
}

/* ── Legacy aliases → semantic tokens (so old rules keep working) ─ */
:root {
  --gold: var(--accent);
  --gold-dim: var(--accent-strong);
  --white: var(--fg);          /* misnamed in the original = primary text */
  --gray: var(--fg-muted);
  --light: var(--fg-2);
  --dark: var(--surface-alt);
  --dark2: var(--surface);
  --dark3: var(--surface-3);
  --black: var(--footer-bg);
}

/* Smooth the whole-page recolor when switching themes */
body, .site-header, .services, .about, .reviews, .contact, .footer,
.service-card, .review-card, .contact-form, .hours-bar, .hero-overlay {
  transition: background-color .4s ease, color .4s ease, border-color .4s ease;
}