/* ==========================================================================
   LUME AURA - DESIGN TOKENS & LUXURY VARIABLES
   "Little Luxuries, Beautifully Chosen."
   ========================================================================== */

:root {
  /* ==========================================================================
     LUXURY COLOR PALETTE (Ivory, Cream, Champagne Gold, Deep Charcoal)
     ========================================================================== */
  --color-bg: #F7F3EE;                 /* Base Warm Luxury Ivory */
  --color-cream: #EFE8DF;              /* Soft Cashmere Cream */
  --color-warm-beige: #E6DCCE;         /* Warm Linen Beige Accent */
  
  /* Champagne Gold Accents */
  --color-gold: #C5A059;               /* Primary Champagne Gold */
  --color-gold-hover: #A37C33;         /* Deep Rich Gold Hover */
  --color-gold-light: rgba(197, 160, 89, 0.12); /* Subtle Champagne Tint */
  --color-gold-glow: rgba(197, 160, 89, 0.28);
  --color-gold-gradient: linear-gradient(135deg, #E6CA8F 0%, #C5A059 50%, #9E772F 100%);
  --color-gold-border: rgba(197, 160, 89, 0.32);
  --color-gold-border-strong: #C5A059;

  /* Deep Charcoal & High-Contrast Typography */
  --color-text: #1C1917;               /* Deep Espresso Charcoal Primary Text */
  --color-text-secondary: #4A433D;     /* Dark Stone Secondary Text (High Readability) */
  --color-text-muted: #6B625B;         /* Warm Muted Stone Text */
  --color-text-light: #8E847C;         /* Subtle Metadata Text */
  
  /* Surfaces & Cards */
  --color-white: #FFFFFF;              /* Pure Crisp White */
  --color-card-bg: #FFFFFF;            /* Pure Crisp Card Surface */
  --color-card-surface: #FCFAF7;       /* Elevated Ivory Card Surface */
  --color-surface-hover: #F6EFE6;      /* Soft Warm Hover Surface */
  
  /* Borders & Dividers */
  --color-border: rgba(28, 25, 23, 0.09);
  --color-border-subtle: rgba(28, 25, 23, 0.05);
  --color-border-card: rgba(197, 160, 89, 0.2);

  /* ==========================================================================
     TYPOGRAPHY TOKENS
     ========================================================================== */
  --font-serif: 'Cormorant Garamond', Garamond, Georgia, 'Times New Roman', serif;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Cormorant Garamond', Georgia, serif;

  /* Font Weights */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* ==========================================================================
     ELEVATIONS & SHADOWS
     ========================================================================== */
  --shadow-sm: 0 4px 12px rgba(28, 25, 23, 0.03);
  --shadow-md: 0 10px 30px rgba(28, 25, 23, 0.06);
  --shadow-lg: 0 20px 48px rgba(28, 25, 23, 0.09);
  --shadow-gold: 0 10px 28px rgba(197, 160, 89, 0.28);
  --shadow-drawer: -12px 0 40px rgba(28, 25, 23, 0.18);

  /* ==========================================================================
     GENEROUS LUXURY SPACINGS
     ========================================================================== */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 14px;
  --space-md: 24px;
  --space-lg: 38px;
  --space-xl: 56px;
  --space-2xl: 80px;
  --space-3xl: 120px;
  --space-4xl: 160px;

  /* ==========================================================================
     LAYOUT & DIMENSIONS
     ========================================================================== */
  --container-max-width: 1360px;
  --header-height: 90px;
  --announcement-height: 42px;
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-pill: 9999px;

  /* Transitions */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-luxury: 0.65s cubic-bezier(0.16, 1, 0.3, 1);

  /* Z-indices */
  --z-sticky: 100;
  --z-dropdown: 200;
  --z-overlay: 300;
  --z-drawer: 400;
  --z-modal: 500;
  --z-toast: 600;
}
