/* variables.css - Design System Tokens for Domaine de Cornefève */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

:root {
    /* Color Palette */
    --color-primary: #1C2D27;          /* Deep Pine Forest Green */
    --color-primary-rgb: 28, 45, 39;
    --color-secondary: #C5A880;        /* Muted Brass/Champagne Gold */
    --color-secondary-rgb: 197, 168, 128;
    --color-secondary-dark: #A58B65;
    --color-bg-warm: #FAF8F5;          /* Warm Paper/Sand */
    --color-bg-card: #FFFFFF;
    --color-text: #2B3531;             /* Charcoal with green undertone */
    --color-text-muted: #6B7B73;
    --color-border: #E5ECE9;
    --color-border-hover: #C5A880;
    --color-bg-sage: #EDF3F0;          /* Very light sage for tags */
    --color-accent-red: #A74E45;       /* Muted rust red for reservations */
    --color-accent-green: #4D7A68;     /* Muted positive green for availability */

    /* Typography */
    --font-heading: 'Playfair Display', Georgia, serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* Spacing System */
    --space-xs: 0.25rem;   /* 4px */
    --space-sm: 0.5rem;    /* 8px */
    --space-md: 1rem;      /* 16px */
    --space-lg: 1.5rem;    /* 24px */
    --space-xl: 2.5rem;    /* 40px */
    --space-xxl: 4rem;     /* 64px */
    --space-huge: 7rem;    /* 112px */

    /* Border Radii */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-full: 9999px;

    /* Shadows & Elevation */
    --shadow-sm: 0 2px 4px rgba(28, 45, 39, 0.04);
    --shadow-md: 0 8px 16px rgba(28, 45, 39, 0.06);
    --shadow-lg: 0 16px 32px rgba(28, 45, 39, 0.1);
    --shadow-glass: 0 8px 32px 0 rgba(28, 45, 39, 0.05);

    /* Animation Transitions */
    --transition-fast: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    --transition-slow: 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    
    /* Layout Max Width */
    --max-width: 1280px;
}
