/* ============================================================
   THEME TOKENS — Design Token Layer
   ============================================================
   Source: css/styles.css :root (lines 3-42)
   Single source of truth for all CSS custom properties.
   ============================================================ */

:root {
  /* ---------- Colors: Navy / Dark ---------- */
  --navy: #0B162A;
  --navy-light: #142240;
  --navy-lighter: #1C2E52;

  /* ---------- Colors: Gold / Accent ---------- */
  --gold: #D4AF37;
  --gold-dim: #b8962e;
  --gold-dark: #A8882B;
  --gold-light: #E8CC6E;
  --gold-alt: #C5A059;
  --gold-glow: rgba(212, 175, 55, 0.25);
  --gold-gradient: linear-gradient(135deg, #A8882B 0%, #D4AF37 40%, #E8CC6E 60%, #C5A059 100%);
  --gold-gradient-btn: linear-gradient(135deg, #8B7023 0%, #C5A059 30%, #D4AF37 55%, #E8CC6E 80%, #D4AF37 100%);

  /* ---------- Colors: Neutrals ---------- */
  --champagne: #F5F5F0;
  --champagne-dim: #d9d9d4;
  --white: #ffffff;
  --gray-300: #9ca3af;
  --gray-400: #9CA3AF;
  --gray-500: #6b7280;
  --gray-700: #374151;

  /* ---------- Colors: Semantic ---------- */
  --red: #ef4444;
  --green: #22c55e;
  --blue: #3b82f6;
  --purple: #a855f7;
  --orange: #f97316;

  /* ---------- Spacing & Layout ---------- */
  --radius: 8px;
  --radius-lg: 12px;
  --sidebar-width: 240px;
  --header-height: 56px;

  /* ---------- Shadows ---------- */
  --shadow: 0 2px 12px rgba(0,0,0,0.15);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.25);
  --shadow-gold: 0 4px 20px rgba(212,175,55,0.25);
  --card-shadow: 0 2px 12px rgba(0,0,0,0.15), 0 0 0 1px rgba(212,175,55,0.06);
  --card-hover-shadow: 0 8px 32px rgba(0,0,0,0.25), 0 0 20px rgba(212,175,55,0.12);
  --emboss-light: 1px 1px 0 rgba(255,255,255,0.15);
  --emboss-dark: -1px -1px 0 rgba(0,0,0,0.3);

  /* ---------- Motion ---------- */
  --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);

  /* ---------- Glass / Frosted ---------- */
  --glass-bg: rgba(20, 34, 64, 0.7);
  --glass-border: rgba(212, 175, 55, 0.12);
  --glass-blur: blur(12px);
}
