/**
 * A-ONE SPA & BEAUTY - Design Tokens & Variables
 * Color palette: Warm cream, beige, soft gold, white, dark brown/charcoal
 */
:root {
  /* Color Palette */
  --color-cream-base: #FAF7F2;
  --color-cream-surface: #F5EFEB;
  --color-cream-card: #FFFFFF;
  --color-cream-card-subtle: #FDFBF8;
  --color-beige-sand: #EAE0D5;
  --color-beige-border: #E2D7C8;
  --color-beige-muted: #D3C3B0;

  /* Gold Accents */
  --color-gold-light: #F4E8D4;
  --color-gold-primary: #C5A059;
  --color-gold-hover: #B38E46;
  --color-gold-deep: #8E6E32;
  --color-gold-gradient: linear-gradient(135deg, #D9B777 0%, #C5A059 50%, #9F7932 100%);
  --color-gold-glow: rgba(197, 160, 89, 0.28);

  /* Neutrals & Typography */
  --color-dark-charcoal: #1C1713;
  --color-dark-brown: #2D231B;
  --color-dark-muted: #5C4F44;
  --color-dark-subtle: #847568;
  --color-pure-white: #FFFFFF;

  /* State & Accents */
  --color-whatsapp: #25D366;
  --color-whatsapp-dark: #1EBE5D;
  --color-whatsapp-glow: rgba(37, 211, 102, 0.32);
  --color-success: #2E7D32;
  --color-star-gold: #F59E0B;

  /* Typography */
  --font-royal: 'Cinzel', Georgia, serif;
  --font-heading: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --font-accent: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Outfit', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Spacing */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4.5rem;
  --space-4xl: 6rem;

  /* Radius */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 9999px;

  /* Shadows */
  --shadow-subtle: 0 4px 18px rgba(36, 28, 21, 0.05);
  --shadow-card: 0 10px 30px rgba(36, 28, 21, 0.07);
  --shadow-elevated: 0 18px 45px rgba(36, 28, 21, 0.12);
  --shadow-gold: 0 8px 24px var(--color-gold-glow);
  --shadow-wa: 0 8px 28px var(--color-whatsapp-glow);

  /* Transitions */
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 0.35s cubic-bezier(0.25, 1, 0.5, 1);
  --transition-spring: 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);

  /* Layout */
  --max-width: 1240px;
  --navbar-height: 62px;
}

/* ==========================================================================
   DARK THEME COLOR TOKENS (ULTRA-LUXURY SANCTUARY PALETTE)
   ========================================================================== */
[data-theme="dark"] {
  /* Dark Mode Base Palette */
  --color-cream-base: #110E0C;
  --color-cream-surface: #181310;
  --color-cream-card: #1F1914;
  --color-cream-card-subtle: #1A1410;
  --color-beige-sand: #2A211A;
  --color-beige-border: #3A2E24;
  --color-beige-muted: #8E7D6F;

  /* Radiant Warm Gold Accents */
  --color-gold-light: #F8E6CA;
  --color-gold-primary: #D9B777;
  --color-gold-hover: #ECC77D;
  --color-gold-deep: #ECC77D;
  --color-gold-gradient: linear-gradient(135deg, #ECC77D 0%, #D9B777 50%, #A68037 100%);
  --color-gold-glow: rgba(236, 199, 125, 0.32);

  /* Neutrals & Typography */
  --color-dark-charcoal: #F5EFEB;
  --color-dark-brown: #EAE1D5;
  --color-dark-muted: #BDB0A2;
  --color-dark-subtle: #948577;
  --color-pure-white: #201913;

  /* Dark Mode Elevation Shadows */
  --shadow-subtle: 0 4px 20px rgba(0, 0, 0, 0.4);
  --shadow-card: 0 10px 32px rgba(0, 0, 0, 0.55);
  --shadow-elevated: 0 20px 50px rgba(0, 0, 0, 0.7);
  --shadow-gold: 0 8px 28px rgba(217, 183, 119, 0.35);
}