/**
 * variables.css - Premium CSS variables & design system tokens
 */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

:root {
    /* Color System (Light Theme Default) */
    --bg-primary: hsl(0, 0%, 98%);
    --bg-secondary: hsl(0, 0%, 95%);
    --bg-tertiary: hsl(0, 0%, 91%);
    --card-bg: hsl(0, 0%, 100%);
    --card-hover: hsl(0, 0%, 99%);
    
    --text-primary: hsl(240, 10%, 10%);
    --text-secondary: hsl(240, 4%, 40%);
    --text-tertiary: hsl(240, 4%, 60%);
    
    --accent: hsl(220, 85%, 48%);
    --accent-light: hsl(220, 85%, 94%);
    --accent-hover: hsl(220, 90%, 40%);
    --accent-gradient: linear-gradient(135deg, hsl(220, 85%, 48%) 0%, hsl(265, 80%, 50%) 100%);
    --accent-glow: rgba(20, 115, 230, 0.15);
    
    --border-color: hsl(240, 6%, 90%);
    --border-light: hsl(240, 6%, 95%);
    
    --danger: hsl(0, 72%, 51%);
    --success: hsl(142, 72%, 29%);
    --warning: hsl(38, 92%, 50%);
    
    --gold: hsl(43, 90%, 50%);
    --gold-light: hsl(43, 90%, 95%);

    /* Fonts */
    --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-serif: 'Playfair Display', Georgia, Cambria, "Times New Roman", serif;

    /* Spacing */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 2rem;
    --spacing-xl: 4rem;
    --spacing-xxl: 8rem;

    /* BorderRadius */
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-full: 9999px;

    /* Shadows (Smooth & Subtle) */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 12px 30px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.08);
    --shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.02);
    
    /* Layout */
    --max-width-content: 1200px;
    --max-width-nav: 1400px;
    --header-height: 100px;

    /* Transitions */
    --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Dark Theme Variables */
[data-theme="dark"] {
    --bg-primary: hsl(240, 10%, 4%);
    --bg-secondary: hsl(240, 10%, 8%);
    --bg-tertiary: hsl(240, 8%, 12%);
    --card-bg: hsl(240, 8%, 10%);
    --card-hover: hsl(240, 8%, 13%);
    
    --text-primary: hsl(0, 0%, 96%);
    --text-secondary: hsl(240, 4%, 72%);
    --text-tertiary: hsl(240, 4%, 50%);
    
    --accent: hsl(220, 95%, 62%);
    --accent-light: hsl(220, 30%, 15%);
    --accent-hover: hsl(220, 95%, 70%);
    --accent-gradient: linear-gradient(135deg, hsl(220, 95%, 62%) 0%, hsl(265, 90%, 65%) 100%);
    --accent-glow: rgba(100, 160, 255, 0.25);
    
    --border-color: hsl(240, 8%, 18%);
    --border-light: hsl(240, 8%, 13%);
    
    --danger: hsl(0, 84%, 60%);
    --success: hsl(142, 69%, 58%);
    --warning: hsl(38, 92%, 60%);

    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 12px 36px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.5);
    --shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}