/* ========================================
   DARK THEME - Variables complètes
   ======================================== */
:root {
    /* Dark Theme Colors */
    --bg-primary: #0a0a0f;
    --bg-secondary: #12121a;
    --bg-tertiary: #1a1a26;

    /* Gradient Colors */
    --gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --gradient-secondary: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --gradient-accent: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    --gradient-success: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);

    /* Text Colors */
    --text-primary: #ffffff;
    --text-secondary: #a0a0b8;
    --text-tertiary: #6b6b85;

    /* Accent Colors */
    --accent-purple: #667eea;
    --accent-pink: #f093fb;
    --accent-blue: #4facfe;
    --accent-green: #43e97b;

    /* Glass Effect */
    --glass-bg: rgba(255, 255, 255, 0.05);
    --glass-border: rgba(255, 255, 255, 0.1);
    --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);

    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.12);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.16);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.20);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.24);

    /* Typography */
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --container-width: 1200px;

    /* Navigation */
    --nav-bg: rgba(10, 10, 15, 0.8);
    --nav-border: rgba(255, 255, 255, 0.05);
    --nav-shadow: none;

    /* Buttons */
    --btn-hover-overlay: rgba(255, 255, 255, 0.1);
    --btn-primary-shadow: 0 4px 16px rgba(102, 126, 234, 0.4);
    --btn-primary-shadow-hover: 0 8px 24px rgba(102, 126, 234, 0.5);
    --btn-secondary-color: white;
    --btn-secondary-hover-bg: rgba(255, 255, 255, 0.1);
    --btn-secondary-hover-border: rgba(255, 255, 255, 0.2);
    --btn-hero-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    --btn-hero-shadow-hover: 0 16px 48px rgba(102, 126, 234, 0.6);

    /* Hero */
    --hero-bg: linear-gradient(180deg, #0a0a0f 0%, #12121a 100%);
    --orb-opacity: 0.6;
    --floating-stat-label-color: var(--text-primary);

    /* Featured Game Hero */
    --featured-bg-opacity: 0.3;
    --featured-bg-opacity-hover: 0.4;
    --featured-overlay-gradient: linear-gradient(
        135deg,
        rgba(10, 10, 15, 0.95) 0%,
        rgba(18, 18, 26, 0.90) 50%,
        rgba(102, 126, 234, 0.3) 100%
    );
    --featured-badge-bg: rgba(255, 255, 255, 0.1);
    --featured-badge-border: rgba(255, 255, 255, 0.2);
    --featured-badge-shadow: none;
    --featured-title-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
    --featured-underline-opacity: 0.5;
    --featured-description-color: rgba(255, 255, 255, 0.8);

    /* Countdown */
    --countdown-title-color: rgba(255, 255, 255, 0.7);
    --countdown-label-color: rgba(255, 255, 255, 0.6);
    --countdown-separator-color: rgba(255, 255, 255, 0.3);

    /* Logos */
    --logos-bg: var(--bg-secondary);
    --logo-opacity: 0.5;
    --logo-hover-bg: rgba(255, 255, 255, 0.08);
    --logo-hover-border: rgba(255, 255, 255, 0.15);

    /* Games Section */
    --games-section-bg: linear-gradient(180deg, #0a0a0f 0%, #12121a 100%);
    --games-section-gradient: radial-gradient(ellipse at top, rgba(99, 102, 241, 0.15) 0%, transparent 70%);
    --section-title-color: #ffffff;
    --showcase-bg: #1e293b /*var(--bg-secondary)*/;
    --showcase-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    --games-nav-bg: #0f172a;
    --games-nav-border: rgba(255, 255, 255, 0.1);
    --game-nav-hover-bg: rgba(255, 255, 255, 0.05);
    --game-nav-hover-color: #ffffff;
    --game-nav-active-bg: #1e293b/*var(--bg-secondary)*/;
    --game-heading-color: #ffffff;
    --benefit-item-bg: rgba(15, 23, 42, 0.6);
    --benefit-item-hover-bg: rgba(15, 23, 42, 0.9);
    --benefit-strong-color: #ffffff;
    --visual-card-bg: rgba(255, 255, 255, 0.05);
    --visual-card-border: rgba(255, 255, 255, 0.1);
    --visual-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    --visual-overlay-gradient: linear-gradient(
        135deg,
        rgba(102, 126, 234, 0.1) 0%,
        rgba(118, 75, 162, 0.1) 100%
    );
    --placeholder-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
    --placeholder-border: rgba(255, 255, 255, 0.1);
    --placeholder-text-color: #6b6b85;

    /* Pricing Card */
    --pricing-card-bg: linear-gradient(180deg,
    rgba(15, 23, 42, 0.95) 0%,
    rgba(30, 41, 59, 0.95) 100%);
    --pricing-card-border: rgba(99, 102, 241, 0.3);
    --pricing-card-border-top: rgba(99, 102, 241, 0.5);
    --pricing-card-glow: linear-gradient(90deg,
    transparent 0%,
    rgba(99, 102, 241, 0.5) 50%,
    transparent 100%);
    --pricing-badge-bg: linear-gradient(135deg,
    rgba(99, 102, 241, 0.2) 0%,
    rgba(139, 92, 246, 0.2) 100%);
    --pricing-badge-border: rgba(99, 102, 241, 0.3);
    --pricing-label-color: rgba(255, 255, 255, 0.8);
    --pricing-from-color: rgba(255, 255, 255, 0.5);
    --pricing-card-hover-border: rgba(99, 102, 241, 0.6);
    --pricing-card-hover-shadow: 0 8px 32px rgba(99, 102, 241, 0.2);

    /* Stat Divider */
    --stat-divider-color: rgba(255, 255, 255, 0.1);

    /* Mobile Menu */
    --mobile-menu-bg: rgba(10, 10, 15, 1);
    --mobile-menu-border: rgba(255, 255, 255, 0.1);
    --mobile-menu-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);

    /* Calendar/Timeline */
    --calendar-section-bg: var(--bg-primary);
    --timeline-line-gradient: linear-gradient(180deg,
    transparent 0%,
    var(--glass-border) 10%,
    var(--glass-border) 90%,
    transparent 100%
    );
    --timeline-marker-hover-bg: rgba(255, 255, 255, 0.08);
    --timeline-marker-hover-border: rgba(255, 255, 255, 0.15);
    --timeline-content-hover-bg: rgba(255, 255, 255, 0.07);
    --timeline-content-hover-border: rgba(255, 255, 255, 0.15);
    --timeline-highlight-bg: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);

    /* Features */
    --features-section-bg: var(--bg-secondary);
    --feature-card-hover-bg: rgba(255, 255, 255, 0.08);
    --feature-card-hover-border: rgba(255, 255, 255, 0.2);
    --icon-bg-gradient: var(--gradient-primary);

    /* How It Works */
    --how-it-works-bg: var(--bg-primary);

    /* WC Specifics */
    --wc-specifics-bg: var(--bg-primary);
    --wc-stat-hover-bg: rgba(255, 255, 255, 0.08);
    --wc-stat-hover-border: rgba(255, 255, 255, 0.15);

    /* Pricing */
    --pricing-section-bg: var(--bg-secondary);
    --pricing-featured-bg: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
    --pricing-card-hover-border-color: rgba(102, 126, 234, 0.5);
    --carousel-nav-hover-bg: rgba(255, 255, 255, 0.1);
    --carousel-nav-hover-border: rgba(255, 255, 255, 0.2);
    --carousel-dot-bg: rgba(255, 255, 255, 0.2);

    /* Testimonials */
    --testimonials-section-bg: var(--bg-primary);
    --testimonial-hover-bg: rgba(255, 255, 255, 0.07);
    --testimonial-hover-border: rgba(255, 255, 255, 0.15);
    --testimonial-divider: rgba(255, 255, 255, 0.1);

    /* CTA Final */
    --cta-final-bg: var(--bg-secondary);
    --cta-final-gradient: radial-gradient(ellipse at center, rgba(99, 102, 241, 0.15) 0%, transparent 70%);

    /* Breadcrumb */
    --breadcrumb-bg: var(--bg-primary);

    /* Legal Pages */
    --legal-hero-bg: var(--bg-primary);
    --legal-content-bg: var(--bg-secondary);
    --legal-nav-hover-bg: rgba(255, 255, 255, 0.05);
    --info-box-bg: rgba(79, 172, 254, 0.1);
    --data-category-bg: rgba(255, 255, 255, 0.03);
    --purpose-box-bg: rgba(255, 255, 255, 0.03);
    --purpose-box-border: rgba(255, 255, 255, 0.1);
    --data-table-bg: rgba(255, 255, 255, 0.03);
    --data-table-header-bg: rgba(255, 255, 255, 0.05);
    --data-table-border: rgba(255, 255, 255, 0.1);
    --right-card-bg: rgba(255, 255, 255, 0.03);
    --right-card-border: rgba(255, 255, 255, 0.1);
    --measure-item-bg: rgba(255, 255, 255, 0.03);
    --cookie-category-bg: rgba(255, 255, 255, 0.03);

    /* Footer */
    --footer-bg: var(--bg-primary);
    --footer-border: rgba(255, 255, 255, 0.1);
    --social-link-hover-bg: rgba(255, 255, 255, 0.1);
    --social-link-hover-border: rgba(255, 255, 255, 0.2);
}