/* Modern Rebrand - Deep Violet & Electric Lime Theme */
:root {
    /* Primary Brand - Deep Violet */
    --primary-violet: #6200EA;
    --primary-violet-dark: #4A00C7;
    --primary-violet-light: #7B1FA2;
    
    /* Secondary Action - Electric Lime */
    --secondary-lime: #00E676;
    --secondary-lime-dark: #00C853;
    --secondary-lime-light: #69F0AE;
    
    /* Alternative Secondary - Cyan */
    --secondary-cyan: #00B0FF;
    --secondary-cyan-dark: #0091EA;
    --secondary-cyan-light: #40C4FF;
    
    /* Background - Very Light Purple */
    --bg-light-purple: #F3E5F5;
    --bg-almost-white: #FAFAFA;
    --bg-white: #FFFFFF;
    
    /* Text - Black */
    --text-primary: #212121;
    --text-secondary: #424242;
    --text-light: #757575;
    
    /* Support - Lavender */
    --support-lavender: #B388FF;
    --support-lavender-dark: #9C6FF7;
    --support-lavender-light: #C5A3FF;
    
    /* Legacy support for smooth transition */
    --primary-coral: #6200EA;
    --primary-coral-hover: #4A00C7;
    --brand-teal: #6200EA;
    --brand-teal-light: #7B1FA2;
    --brand-teal-dark: #4A00C7;
    --bg-mint: #F3E5F5;
    --text-primary-old: #212121;
    --text-secondary-old: #424242;
    --accent-amber: #00E676;
    --accent-amber-dark: #00C853;
    --primary-blue: #6200EA;
    --accent-blue: #6200EA;
    --dark-navy: #212121;
    --light-background: #F3E5F5;
    --soft-gray: #E0E0E0;
    --text-dark-gray: #212121;
}

/* Base Styles */
body {
    background-color: var(--bg-light-purple);
    color: var(--text-primary);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Navigation & Headings */
nav, h1, h2, h3, h4, h5, h6 {
    color: var(--text-primary);
}

/* Buttons & Links - Primary Violet for Brand, Lime/Cyan for Actions */
.btn-primary {
    background: linear-gradient(135deg, var(--primary-violet) 0%, var(--primary-violet-dark) 100%);
    color: white;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight: 600;
    border: none;
    box-shadow: 0 4px 14px rgba(98, 0, 234, 0.3);
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--primary-violet-dark) 0%, var(--primary-violet) 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(98, 0, 234, 0.4);
}

.btn-action {
    background: linear-gradient(135deg, var(--secondary-lime) 0%, var(--secondary-lime-dark) 100%);
    color: var(--text-primary);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight: 700;
    border: none;
    box-shadow: 0 4px 14px rgba(0, 230, 118, 0.3);
}

.btn-action:hover {
    background: linear-gradient(135deg, var(--secondary-lime-dark) 0%, var(--secondary-lime) 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 230, 118, 0.4);
    color: var(--text-primary);
}

.btn-outline {
    border: 2px solid var(--primary-violet);
    color: var(--primary-violet);
    background: transparent;
    transition: all 0.3s ease;
}

.btn-outline:hover {
    background-color: var(--primary-violet);
    color: white;
    transform: translateY(-2px);
}

a {
    color: var(--primary-violet);
    transition: color 0.2s ease;
}

a:hover {
    color: var(--primary-violet-dark);
}

/* Cards & Sections */
.card, .bg-white {
    background-color: var(--bg-white);
    border-color: var(--soft-gray);
    box-shadow: 0 2px 8px rgba(98, 0, 234, 0.08);
}

.bg-gray-50 {
    background-color: var(--bg-light-purple);
}

.border-gray-200 {
    border-color: var(--soft-gray);
}

/* Gradient Primary - Violet Gradient */
.gradient-primary {
    background: linear-gradient(135deg, var(--primary-violet-dark) 0%, var(--primary-violet) 50%, var(--primary-violet-light) 100%);
}

.gradient-action {
    background: linear-gradient(135deg, var(--secondary-lime-dark) 0%, var(--secondary-lime) 100%);
}

.gradient-cyan {
    background: linear-gradient(135deg, var(--secondary-cyan-dark) 0%, var(--secondary-cyan) 100%);
}

/* Text Colors */
.text-primary {
    color: var(--primary-violet);
}

.text-action {
    color: var(--secondary-lime);
}

.text-dark-navy {
    color: var(--text-primary);
}

.bg-primary {
    background-color: var(--primary-violet);
}

.border-primary {
    border-color: var(--primary-violet);
}

/* Custom utility classes */
.bg-navy {
    background-color: var(--text-primary);
}

.text-navy {
    color: var(--text-primary);
}

.bg-accent {
    background-color: var(--secondary-lime);
}

.text-accent {
    color: var(--secondary-lime);
}

.bg-support {
    background-color: var(--support-lavender);
}

.text-support {
    color: var(--support-lavender);
}

.bg-soft-gray {
    background-color: var(--soft-gray);
}

.bg-light {
    background-color: var(--bg-light-purple);
}

/* Premium/Highlight - Electric Lime */
.premium-badge {
    background: linear-gradient(135deg, var(--secondary-lime) 0%, var(--secondary-lime-dark) 100%);
    color: var(--text-primary);
    font-weight: 700;
}

.premium-highlight {
    background: linear-gradient(135deg, var(--secondary-lime-light) 0%, var(--secondary-lime) 100%);
    color: var(--text-primary);
}

/* Hover effects with lavender */
.hover-lavender:hover {
    background-color: var(--support-lavender);
    color: white;
    transition: all 0.3s ease;
}

/* Modern glass effect */
.glass-effect {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Glow effects */
.glow-violet {
    box-shadow: 0 0 20px rgba(98, 0, 234, 0.3);
}

.glow-lime {
    box-shadow: 0 0 20px rgba(0, 230, 118, 0.3);
}

.glow-lavender {
    box-shadow: 0 0 20px rgba(179, 136, 255, 0.3);
}

/* Smooth animations */
@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
}

@keyframes pulse-glow-violet {
    0%, 100% { box-shadow: 0 0 20px rgba(98, 0, 234, 0.3); }
    50% { box-shadow: 0 0 40px rgba(98, 0, 234, 0.6); }
}

@keyframes pulse-glow-lime {
    0%, 100% { box-shadow: 0 0 20px rgba(0, 230, 118, 0.3); }
    50% { box-shadow: 0 0 40px rgba(0, 230, 118, 0.6); }
}

.float-animation { animation: float 6s ease-in-out infinite; }
.pulse-glow-violet { animation: pulse-glow-violet 3s ease-in-out infinite; }
.pulse-glow-lime { animation: pulse-glow-lime 3s ease-in-out infinite; }
