/* ==========================================================================
   DAPPER LUXURY DESIGN SYSTEM — CSS TOKENS
   Calm, eye-friendly luxury palette inspired by color ref 5 & color ref 6
   ========================================================================== */

:root {
  /* Brand Accents — Soft, rich, understated (color ref 5) */
  --color-wine-dark: #2A0F13;
  --color-wine-primary: #4A1B22;
  --color-wine-hover: #5E232B;
  --color-wine-subtle: rgba(74, 27, 34, 0.08);
  --color-wine-soft: #F4ECEE;
  
  /* Cashmere & Warm Sand Accents (color ref 5) */
  --color-sand-light: #F4EFEB;
  --color-sand-champagne: #E6DCD1;
  --color-sand-muted: #D3C2B3;
  --color-sand-text: #614F44;
  --color-sand-accent: #785F4F;
  --color-gold-accent: #9A773C;
  --color-gold-subtle: rgba(154, 119, 60, 0.12);

  /* Surfaces & Backgrounds — Calm & Eye-friendly (color ref 6) */
  --color-bg-base: #F7F8FA;
  --color-bg-surface: #FFFFFF;
  --color-bg-elevated: #FFFFFF;
  --color-bg-subtle: #F0F2F5;
  --color-bg-card-hover: #FCFDFE;
  --color-bg-overlay: rgba(28, 32, 37, 0.55);

  /* Borders & Dividers */
  --border-subtle: #E8ECEF;
  --border-medium: #DCE1E5;
  --border-wine: rgba(74, 27, 34, 0.22);
  --border-gold: rgba(176, 141, 87, 0.35);

  /* Typography Colors — High readability, zero glare */
  --text-primary: #1C2025;
  --text-pure-white: #FFFFFF;
  --text-secondary: #535C68;
  --text-muted: #828B96;
  --text-on-wine: #FFFFFF;
  --text-on-sand: #2A0F13;

  /* Status Colors */
  --color-success: #059669;
  --color-warning: #D97706;
  --color-danger: #DC2626;
  --color-info: #2563EB;

  /* Brand Gradients — Calm & Eye-friendly */
  --gradient-wine-sand: linear-gradient(135deg, #3E161C 0%, #4A1B22 100%);
  --gradient-sand-gold: linear-gradient(135deg, #F4EFEB 0%, #E6DCD1 100%);
  --gradient-card: #FFFFFF;
  --gradient-cta-wine: linear-gradient(135deg, #4A1B22 0%, #2A0F13 100%);
  --gradient-soft-banner: linear-gradient(135deg, #F4EFEB 0%, #EFE8E1 50%, #F7F8FA 100%);

  /* Shadows — Soft, natural, diffuse light */
  --shadow-sm: 0 1px 3px rgba(28, 32, 37, 0.05), 0 1px 2px rgba(28, 32, 37, 0.03);
  --shadow-md: 0 4px 14px rgba(28, 32, 37, 0.06), 0 1px 4px rgba(28, 32, 37, 0.04);
  --shadow-lg: 0 12px 28px rgba(28, 32, 37, 0.08), 0 4px 10px rgba(28, 32, 37, 0.04);
  --glow-wine: 0 4px 16px rgba(74, 27, 34, 0.12);
  --glow-sand: 0 4px 16px rgba(230, 220, 209, 0.4);

  /* Typography Families */
  --font-serif: 'Playfair Display', 'Cinzel', 'Amiri', 'Georgia', serif;
  --font-sans: 'Cairo', 'Alexandria', 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Radii */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-full: 9999px;

  /* Transitions */
  --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);

  /* Z-indices */
  --z-header: 100;
  --z-drawer: 200;
  --z-modal: 300;
  --z-toast: 400;
}