/* ExpressVPN Template - Official Brand Colors */
/* Primary: #001D2F (Daintree), Accent: #DA3940 (Valencia), Light: #F0EACF */

:root[data-template="expressvpn"] {
    /* Primary Colors - ExpressVPN Red & Navy */
    --color-primary: #DA3940;
    --color-primary-hover: #E54850;
    --color-secondary: #001D2F;
    --color-secondary-hover: #002840;
    --color-accent: #E8444B;
    --color-accent-hover: #F25058;

    /* Backgrounds - ExpressVPN Dark Theme */
    --bg-primary: #001D2F;
    --bg-secondary: #002840;
    --bg-tertiary: #003555;
    --bg-card: rgba(0, 40, 64, 0.95);
    --bg-glass: rgba(0, 40, 64, 0.85);
    --bg-hover: rgba(218, 57, 64, 0.12);

    /* Text Colors */
    --text-primary: #F0EACF;
    --text-secondary: #B8C4CC;
    --text-tertiary: #8A9AA8;

    /* Borders */
    --border-color: rgba(218, 57, 64, 0.25);
    --border-hover: rgba(218, 57, 64, 0.45);

    /* Shadows & Glows */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.6);
    --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.7);

    /* Template Specific */
    --template-bg-gradient: linear-gradient(135deg, #001D2F 0%, #002840 50%, #001D2F 100%);
    --template-glow-primary: 0 0 25px rgba(218, 57, 64, 0.35);
    --template-glow-accent: 0 0 20px rgba(232, 68, 75, 0.30);

    /* Gradients */
    --gradient-primary: linear-gradient(135deg, #DA3940 0%, #E8444B 100%);
    --gradient-hero: linear-gradient(135deg, #001D2F 0%, #002840 100%);
}

/* ExpressVPN Dark Mode (Default) */
:root[data-template="expressvpn"][data-theme="dark"] {
    --bg-primary: #001D2F;
    --bg-secondary: #002840;
    --bg-card: rgba(0, 40, 64, 0.95);
    --text-primary: #F0EACF;
    --text-secondary: #B8C4CC;
}

/* ExpressVPN Light Mode */
:root[data-template="expressvpn"][data-theme="light"] {
    --color-primary: #C82F36;
    --color-primary-hover: #DA3940;
    --bg-primary: #F0EACF;
    --bg-secondary: #FFFFFF;
    --bg-tertiary: #E8E2C7;
    --bg-card: rgba(255, 255, 255, 0.95);
    --bg-glass: rgba(255, 255, 255, 0.85);
    --text-primary: #001D2F;
    --text-secondary: #3A4A58;
    --text-tertiary: #5A6A78;
    --border-color: rgba(200, 47, 54, 0.15);
    --border-hover: rgba(200, 47, 54, 0.30);
    --shadow-sm: 0 1px 3px rgba(0, 29, 47, 0.08);
    --shadow-md: 0 4px 12px rgba(0, 29, 47, 0.12);
    --shadow-lg: 0 10px 25px rgba(0, 29, 47, 0.16);
}