/* ════════════════════════════════════════════
   Quotera — Design Tokens  v1.1
   Single source of truth for all colours,
   spacing, shadows, and motion values.
   See Quotera-Style-Guide.docx for full spec.
════════════════════════════════════════════ */

:root {
  /* ── Brand Primary ───────────────────── */
  --primary:        #6366f1;
  --primary-hover:  #4f46e5;
  --primary-light:  #eef2ff;
  --primary-dark:   #3730a3;
  --gradient:       linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  --gradient-hero:  linear-gradient(145deg, #0f172a 0%, #1e1b4b 60%, #0f172a 100%);
  --gradient-text:  linear-gradient(135deg, #a5b4fc 0%, #c4b5fd 50%, #f9a8d4 100%);

  /* ── Brand Accent ────────────────────── */
  --accent:         #f97316;
  --accent-hover:   #ea580c;
  --accent-light:   #fff7ed;
  --accent-dark:    #c2410c;

  /* ── Neutrals — light mode ───────────── */
  --bg:        #f8fafc;
  --bg2:       #f1f5f9;
  --surface:   #ffffff;
  --surface2:  #f8fafc;
  --border:    #e2e8f0;
  --border2:   #cbd5e1;
  --muted:     #64748b;
  --text:      #0f172a;
  --text-sub:  #475569;

  /* ── Status ──────────────────────────── */
  --red:       #ef4444;   --red-bg:    #fef2f2;   --red-bd:    #fecaca;
  --green:     #10b981;   --green-bg:  #ecfdf5;   --green-bd:  #a7f3d0;
  --amber:     #d97706;   --amber-bg:  #fffbeb;   --amber-bd:  #fde68a;

  /* ── Geometry ────────────────────────── */
  --r:      10px;
  --r-sm:   6px;
  --r-lg:   16px;
  --r-xl:   24px;
  --r-2xl:  32px;
  --r-full: 9999px;

  /* ── Shadows ─────────────────────────── */
  --sh:            0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.04);
  --sh-md:         0 4px 16px rgba(0,0,0,.08);
  --sh-lg:         0 8px 32px rgba(0,0,0,.10);
  --sh-xl:         0 20px 60px rgba(0,0,0,.12);
  --sh-primary:    0 4px 20px rgba(99,102,241,.35);
  --sh-accent:     0 4px 20px rgba(249,115,22,.35);

  /* ── Motion ──────────────────────────── */
  --ease:   cubic-bezier(.4,0,.2,1);
  --dur:    .18s;
  --dur-md: .3s;

  /* ── Typography ──────────────────────── */
  --font:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', 'JetBrains Mono', 'Fira Code', monospace;
}

/* ── Dark mode ───────────────────────────── */
[data-theme="dark"] {
  --bg:          #0c1220;
  --bg2:         #111827;
  --surface:     #1a2235;
  --surface2:    #1e2a45;
  --border:      #2d3a50;
  --border2:     #374151;
  --muted:       #8da2b5;
  --text:        #f0f4f8;
  --text-sub:    #94a3b8;
  --primary-light: #1e2a60;
  --accent-light: #431407;
  --sh:          0 1px 3px rgba(0,0,0,.3);
  --sh-md:       0 4px 16px rgba(0,0,0,.3);
  --sh-lg:       0 8px 32px rgba(0,0,0,.4);
  --sh-xl:       0 20px 60px rgba(0,0,0,.5);
  --sh-primary:  0 4px 20px rgba(99,102,241,.4);
}