/* assets/css/variables.css */

:root {
    /* Fonts */
    --font-heading: 'Outfit', 'Playfair Display', serif;
    --font-body: 'Plus Jakarta Sans', 'Inter', sans-serif;

    /* Colors - Brand Palette */
    --brand-green: #0F3A20;
    --brand-green-rgb: 15, 58, 32;
    --brand-green-light: #1A5232;
    --brand-green-hover: #082112;
    --brand-gold: #CFA33A;
    --brand-gold-rgb: 207, 163, 58;
    --brand-gold-light: #F7D774;
    --brand-gold-hover: #B8871A;
    --brand-cream: #FCF9F2;
    --brand-beige: #F5EFE6;
    --brand-charcoal: #121A16;
    --brand-white: #FFFFFF;

    /* Modern Subtle Gradients */
    --gradient-green: linear-gradient(135deg, #0F3A20 0%, #1D5C35 100%);
    --gradient-green-hover: linear-gradient(135deg, #092414 0%, #0F3A20 100%);
    
    /* Rich Premium Luxury Gold Gradient */
    --gradient-gold: linear-gradient(
        135deg,
        #F7D774 0%,
        #E7C45A 25%,
        #CFA33A 50%,
        #B8871A 75%,
        #F3DB8B 100%
    );
    --gradient-gold-hover: linear-gradient(
        135deg,
        #B8871A 0%,
        #CFA33A 40%,
        #E7C45A 70%,
        #F7D774 100%
    );
    --gradient-glass: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.05) 100%);

    /* Theme Colors (Default Light Mode) */
    --bg-primary: var(--brand-cream);
    --bg-primary-grad: linear-gradient(180deg, var(--brand-cream) 0%, #F8F3E8 100%);
    --bg-secondary: var(--brand-beige);
    --bg-secondary-grad: linear-gradient(180deg, var(--brand-beige) 0%, #EADECB 100%);
    --bg-card: var(--brand-white);
    --bg-glass: rgba(252, 249, 242, 0.75);
    --border-color: #E6DDD0;

    --text-primary: #121A16;
    --text-secondary: #48544E;
    --text-muted: #788880;

    /* Status Colors */
    --accent-red: #C0392B;
    --accent-green: #27AE60;
    --accent-green-bg: rgba(39, 174, 96, 0.1);

    /* Dimensions */
    --border-radius-sm: 8px;
    --border-radius-md: 16px;
    --border-radius-lg: 24px;
    --border-radius-xl: 32px;
    --border-radius-full: 9999px;
    --header-height: 80px;

    /* Shadows */
    --shadow-sm: 0 4px 12px rgba(15, 58, 32, 0.04);
    --shadow-md: 0 12px 32px rgba(15, 58, 32, 0.08);
    --shadow-lg: 0 24px 64px rgba(15, 58, 32, 0.12);
    --shadow-gold: 0 12px 32px rgba(207, 163, 58, 0.25);
    --shadow-btn: 0 8px 20px rgba(207, 163, 58, 0.3);

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

/* Dark Mode Overrides */
[data-theme="dark"] {
    --bg-primary: #0A0F0C;
    --bg-primary-grad: linear-gradient(180deg, #0A0F0C 0%, #0E1612 100%);
    --bg-secondary: #111A15;
    --bg-secondary-grad: linear-gradient(180deg, #111A15 0%, #17241D 100%);
    --bg-card: #16241D;
    --bg-glass: rgba(10, 15, 12, 0.75);
    --border-color: #24352C;

    --text-primary: #F0F5F2;
    --text-secondary: #B1C4BA;
    --text-muted: #71857A;

    /* Shadows */
    --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 12px 32px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.5);
    --shadow-gold: 0 12px 32px rgba(207, 163, 58, 0.15);
    --shadow-btn: 0 8px 20px rgba(207, 163, 58, 0.2);
}