/* ═══════════════════════════════════════════════════════
   AIAIYOO / ENGINNE — Global Design Tokens
   Single source of truth for all visual properties.
   
   Two theme contexts:
   • Dark theme: dashboards, admin, mobile (--bg, --text, --accent)
   • Light theme: website, pricing, signup (--fg, --ac, --card)
   
   Pages may override specific tokens via their own :root.
   This file provides consistent FALLBACK defaults.
   ═══════════════════════════════════════════════════════ */

:root{
  /* ── DARK THEME TOKENS (dashboards) ── */
  --bg:#fafaf7;
  --bg2:#f5f3ee;
  --bg3:#f0ede8;
  --border:#e8e5de;
  --text:#111;
  --text2:#555;
  --text3:#767676;
  --accent:#1b7a3d;
  --accent2:#22c55e;

  /* ── LIGHT THEME TOKENS (marketing pages) ── */
  --fg:#111;
  --fg2:#444;
  --fg3:#767676;
  --ac:#16a34a;
  --ac2:#15803d;
  --acL:#f0fdf4;
  --card:#fff;
  --bd:#e8e5de;
  --sf:#f5f3ee;
  --dark:#0a0a0a;
  --dark2:#111;

  /* ── SHARED SEMANTIC TOKENS ── */
  --gold:#d4a843;
  --green:#22c55e;
  --red:#ef4444;
  --cyan:#128274;
  --indigo:#6366f1;

  /* ── SPACING SCALE ── */
  --sp-2xs:2px;
  --sp-xs:4px;
  --sp-sm:8px;
  --sp-md:16px;
  --sp-lg:24px;
  --sp-xl:32px;
  --sp-2xl:48px;
  --sp-3xl:64px;

  /* ── TYPOGRAPHY ── */
  --font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --mono:'JetBrains Mono','SF Mono','Fira Code',monospace;
  --fs-2xs:9px;
  --fs-xs:11px;
  --fs-sm:13px;
  --fs-md:15px;
  --fs-lg:18px;
  --fs-xl:24px;
  --fs-2xl:30px;
  --fs-hero:clamp(28px,4vw,44px);

  /* ── FONT WEIGHTS ── */
  --fw-normal:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fw-bold:700;
  --fw-black:900;

  /* ── BORDER RADIUS ── */
  --radius:10px;
  --radius-xs:4px;
  --radius-sm:6px;
  --radius-lg:14px;
  --radius-xl:20px;
  --radius-full:9999px;

  /* ── SHADOWS ── */
  --shadow-xs:0 1px 2px rgba(0,0,0,.05);
  --shadow:0 1px 3px rgba(0,0,0,.05);
  --shadow-md:0 4px 16px rgba(0,0,0,.08);
  --shadow-lg:0 8px 28px rgba(0,0,0,.12);
  --shadow-xl:0 16px 48px rgba(0,0,0,.16);
  --shadow-accent:0 4px 16px rgba(22,163,74,.2);
  --shadow-danger:0 4px 16px rgba(239,68,68,.2);

  /* ── TRANSITIONS ── */
  --ease-default:.2s ease;
  --ease-fast:.1s ease;
  --ease-smooth:.3s cubic-bezier(.4,0,.2,1);

  /* ── Z-INDEX SCALE ── */
  --z-dropdown:100;
  --z-sticky:200;
  --z-modal:500;
  --z-toast:9999;
}
