/* =====================================================
   THEME TOGGLE - Mode Sombre/Clair
   ===================================================== */

/* Bouton de toggle du thème */
.theme-toggle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-right: 10px;
}

.theme-toggle:hover {
    background: var(--bg-hover);
    transform: rotate(20deg);
}

.theme-toggle i {
    color: var(--primary);
    font-size: 18px;
    transition: transform 0.3s ease;
}

/* Bouton WhatsApp dans le header */
.whatsapp-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #25D366, #128C7E);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    transition: all 0.3s ease;
    animation: pulse 2s infinite;
}

.whatsapp-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(37, 211, 102, 0.5);
}

.whatsapp-btn i {
    color: white;
    font-size: 20px;
}

@keyframes pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
    }
    50% {
        box-shadow: 0 0 0 10px rgba(37, 211, 102, 0);
    }
}

/* =====================================================
   MODE CLAIR (Light Theme) - CORRIGÉ
   ===================================================== */

/* Support both selectors for compatibility */
body.light-theme,
[data-theme="light"] body,
html[data-theme="light"] {
    --bg-dark: #F8FAFC;
    --bg-darker: #F1F5F9;
    --bg-main: #FFFFFF;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F8FAFC;
    --bg-input: #F1F5F9;
    --bg-hover: #E2E8F0;
    --bg-elevated: #FFFFFF;

    --text-primary: #1E293B;
    --text-secondary: #475569;
    --text-muted: #64748B;
    --text-disabled: #94A3B8;
    --text-light: #1E293B;

    --border-color: #E2E8F0;
    --border-light: #CBD5E1;

    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.12);
    --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.08);

    /* Override crypto-com-theme.css variables */
    --background-dark: #F8FAFC;
    --background-darker: #F1F5F9;
    --background-card: #FFFFFF;
    --background-elevated: #FFFFFF;
    --background-hover: #F1F5F9;
    --gradient-hero: linear-gradient(180deg, #F8FAFC 0%, #EFF6FF 100%);
    --gradient-card: linear-gradient(135deg, rgba(17,153,250,0.05) 0%, rgba(0,45,116,0.03) 100%);
    --shadow-glow: 0 0 40px rgba(17,153,250,0.08);
    --shadow-glow-intense: 0 0 60px rgba(17,153,250,0.12);
}

body.light-theme,
[data-theme="light"] body {
    background: #F1F5F9 !important;
    color: #1E293B !important;
}

body.light-theme .header,
[data-theme="light"] .header {
    background: rgba(255, 255, 255, 0.98) !important;
    border-bottom: 1px solid #E2E8F0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

body.light-theme .nav-link,
[data-theme="light"] .nav-link {
    color: #475569;
}

body.light-theme .nav-link:hover,
body.light-theme .nav-link.active,
[data-theme="light"] .nav-link:hover,
[data-theme="light"] .nav-link.active {
    color: var(--primary);
}

body.light-theme .hero,
[data-theme="light"] .hero {
    background: linear-gradient(135deg, #F8FAFC 0%, #EFF6FF 50%, #F0FDF4 100%) !important;
}

body.light-theme .hero-card,
body.light-theme .formation-card,
body.light-theme .course-card,
body.light-theme .testimonial-card,
body.light-theme .blog-card,
body.light-theme .chart-card,
body.light-theme .stat-card,
[data-theme="light"] .hero-card,
[data-theme="light"] .formation-card,
[data-theme="light"] .course-card,
[data-theme="light"] .testimonial-card,
[data-theme="light"] .blog-card,
[data-theme="light"] .chart-card,
[data-theme="light"] .stat-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
}

body.light-theme .footer,
[data-theme="light"] .footer {
    background: #1E293B !important;
    color: white;
}

body.light-theme .theme-toggle,
[data-theme="light"] .theme-toggle {
    background: #F1F5F9;
    border-color: #E2E8F0;
}

body.light-theme .theme-toggle:hover,
[data-theme="light"] .theme-toggle:hover {
    background: #E2E8F0;
}

body.light-theme .modal-container,
[data-theme="light"] .modal-container {
    background: #FFFFFF;
}

body.light-theme .dashboard-sidebar,
[data-theme="light"] .dashboard-sidebar {
    background: #1E293B !important;
}

body.light-theme .dashboard-main,
[data-theme="light"] .dashboard-main {
    background: #F1F5F9 !important;
}

body.light-theme section,
[data-theme="light"] section {
    background: #FFFFFF;
}

body.light-theme .section-title,
body.light-theme .dashboard-title,
body.light-theme h1, body.light-theme h2, body.light-theme h3,
[data-theme="light"] .section-title,
[data-theme="light"] .dashboard-title,
[data-theme="light"] h1, [data-theme="light"] h2, [data-theme="light"] h3 {
    color: #1E293B !important;
}

body.light-theme p,
body.light-theme .section-description,
[data-theme="light"] p,
[data-theme="light"] .section-description {
    color: #475569 !important;
}

/* Button styles for light theme */
body.light-theme .btn-secondary,
[data-theme="light"] .btn-secondary {
    background: #F1F5F9;
    color: #1E293B;
    border: 1px solid #E2E8F0;
}

body.light-theme .btn-secondary:hover,
[data-theme="light"] .btn-secondary:hover {
    background: #E2E8F0;
}

/* =====================================================
   MODE CLAIR - OVERRIDE COMPLET DES INLINE STYLES
   !important nécessaire pour battre les styles inline
   ===================================================== */

/* --- SECTIONS avec hero-crypto-com (fond noir inline) --- */
body.light-theme .hero-crypto-com,
body.light-theme section[style*="background"] {
    background: linear-gradient(180deg, #F8FAFC 0%, #EFF6FF 100%) !important;
}

body.light-theme .formations-section,
body.light-theme section[style*="#0A0E17"],
body.light-theme section[style*="#0D1421"],
body.light-theme section[style*="#0f172a"],
body.light-theme section[style*="#1e293b"] {
    background: linear-gradient(180deg, #FFFFFF 0%, #F1F5F9 100%) !important;
}

/* Pseudo-elements glow en light mode */
body.light-theme .hero-crypto-com::before {
    background: radial-gradient(circle, rgba(17, 153, 250, 0.08) 0%, transparent 70%) !important;
}
body.light-theme .hero-crypto-com::after {
    background: radial-gradient(circle, rgba(0, 212, 170, 0.06) 0%, transparent 70%) !important;
}

/* --- TOUS LES TEXTES BLANCS → SOMBRES --- */
body.light-theme h1[style*="color: #fff"],
body.light-theme h1[style*="color:#fff"],
body.light-theme h2[style*="color: #fff"],
body.light-theme h2[style*="color:#fff"],
body.light-theme h3[style*="color: #fff"],
body.light-theme h3[style*="color:#fff"],
body.light-theme h1[style*="#FFFFFF"],
body.light-theme h2[style*="#FFFFFF"],
body.light-theme h3[style*="#FFFFFF"],
body.light-theme span[style*="color: #fff"],
body.light-theme div[style*="color: #fff"],
body.light-theme div[style*="color:#fff"] {
    color: #1E293B !important;
}

body.light-theme p[style*="color: #C3C6CF"],
body.light-theme p[style*="color:#C3C6CF"],
body.light-theme p[style*="color: #777E90"],
body.light-theme p[style*="color:#777E90"],
body.light-theme span[style*="color: #777E90"],
body.light-theme p[style*="color: rgba(255,255,255"],
body.light-theme span[style*="color: rgba(255,255,255"],
body.light-theme div[style*="color: rgba(255,255,255"] {
    color: #475569 !important;
}

/* Texte -webkit-background-clip sur h2 (gradient text) */
body.light-theme h2[style*="-webkit-background-clip"] {
    background: linear-gradient(135deg, #1E293B, #1199FA) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* --- CARTES ET CONTENEURS DARK → LIGHT --- */
body.light-theme .card-premium,
body.light-theme .video-card,
body.light-theme .investment-card,
body.light-theme .crypto-card-animated {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}

body.light-theme .investment-card.popular {
    border: 2px solid #f59e0b !important;
}

/* Video card text */
body.light-theme .video-card h3,
body.light-theme .card-premium h3 {
    color: #1E293B !important;
}
body.light-theme .video-card p,
body.light-theme .card-premium p {
    color: #64748B !important;
}

/* Investment card internals */
body.light-theme .card-content {
    background: transparent !important;
}
body.light-theme .card-title {
    color: #1E293B !important;
}
body.light-theme .card-subtitle {
    color: #64748B !important;
}
body.light-theme .detail-box {
    background: #F1F5F9 !important;
}
body.light-theme .detail-label {
    color: #64748B !important;
}
body.light-theme .feature-item {
    color: #475569 !important;
    border-bottom-color: #E2E8F0 !important;
}
body.light-theme .duration-badge {
    background: #F1F5F9 !important;
    color: #475569 !important;
}
body.light-theme .roi-display {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.05)) !important;
    border-color: rgba(16, 185, 129, 0.2) !important;
}
body.light-theme .roi-label {
    color: #64748B !important;
}

/* --- COURS / FORMATIONS CARDS (inline styled) --- */
body.light-theme div[style*="background: linear-gradient(145deg, #1a2540"] {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}
body.light-theme div[style*="background: linear-gradient(145deg, #1a2540"] h3 {
    color: #1E293B !important;
}
body.light-theme div[style*="background: linear-gradient(145deg, #1a2540"] p {
    color: #64748B !important;
}
body.light-theme div[style*="background: linear-gradient(145deg, #1a2540"] span[style*="color: #1199FA"] {
    color: #1199FA !important;
}

/* --- CRYPTO CARDS (Top 5) --- */
body.light-theme .stagger-item[style*="background: linear-gradient"] {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}
body.light-theme .stagger-item h3 {
    color: #1E293B !important;
}
body.light-theme .stagger-item p[style*="color: rgba(255,255,255"] {
    color: #64748B !important;
}

/* --- MARKET SECTION --- */
body.light-theme .market-grid > div {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}
body.light-theme #cryptoSearch,
body.light-theme #sortBy {
    background: #FFFFFF !important;
    color: #1E293B !important;
    border-color: #CBD5E1 !important;
}

/* --- BADGES (garder colorés) --- */
body.light-theme .badge-premium {
    color: #fff !important;
}
body.light-theme .section-tag {
    background: #EFF6FF !important;
    color: #1199FA !important;
}

/* --- BLOG SECTION --- */
body.light-theme .blog-section {
    background: #F8FAFC !important;
}
body.light-theme .blog-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.06) !important;
}
body.light-theme .blog-title {
    color: #1E293B !important;
}
body.light-theme .blog-excerpt {
    color: #64748B !important;
}
body.light-theme .blog-date,
body.light-theme .blog-author span {
    color: #64748B !important;
}

/* --- CURRENCY BUTTONS --- */
body.light-theme .currency-btn {
    background: #F1F5F9 !important;
    color: #1E293B !important;
    border-color: #CBD5E1 !important;
}
body.light-theme .currency-btn:hover {
    background: #E2E8F0 !important;
    border-color: #1199FA !important;
}
body.light-theme .currency-btn.active {
    background: linear-gradient(135deg, #1199FA, #0D7FD9) !important;
    color: #fff !important;
    border-color: #1199FA !important;
}

/* --- TRUST INDICATORS --- */
body.light-theme div[style*="color: rgba(255,255,255,0.8)"] span {
    color: #475569 !important;
}

/* --- PAYMENT SECTION / COUNTRY CARDS --- */
body.light-theme .country-card,
body.light-theme div[style*="background: rgba(26,29,36"] {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* --- CONSULTING / TESTIMONIALS --- */
body.light-theme .testimonial-card {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
}

/* --- INPUT FIELDS --- */
body.light-theme input[style*="background: rgba("],
body.light-theme select[style*="background: rgba("] {
    background: #FFFFFF !important;
    color: #1E293B !important;
    border-color: #CBD5E1 !important;
}

/* --- DOWNLOAD / CTA SECTION --- */
body.light-theme .download-section {
    background: linear-gradient(135deg, #EFF6FF, #F0FDF4) !important;
}

/* --- QUICK ACTION BAR --- */
body.light-theme .quick-action-bar {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%) !important;
    border-bottom-color: #E2E8F0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
body.light-theme .quick-action-bar span[style*="color: #C3C6CF"] {
    color: #475569 !important;
}
body.light-theme .quick-action-bar strong[style*="color: #16C784"] {
    color: #16C784 !important;
}

/* --- PAYMENT CARD TITLES (h4 with inline color: #fff) --- */
body.light-theme h4[style*="color: #fff"],
body.light-theme h4[style*="color:#fff"] {
    color: #1E293B !important;
}

/* --- STORE CARDS & SOCIAL CARDS (a tags with dark bg) --- */
body.light-theme a[style*="background: rgba(26,29,36"],
body.light-theme .store-card {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.06) !important;
}
body.light-theme a[style*="background: rgba(26,29,36"] h4,
body.light-theme .store-card h4 {
    color: #1E293B !important;
}
body.light-theme a[style*="background: rgba(26,29,36"] p,
body.light-theme .store-card p {
    color: #64748B !important;
}
body.light-theme a[style*="background: rgba(26,29,36"] span[style*="color: #C3C6CF"],
body.light-theme span[style*="color: #C3C6CF"] {
    color: #475569 !important;
}

/* --- CTA SECTION --- */
body.light-theme .cta-section {
    background: linear-gradient(135deg, #EFF6FF 0%, #F0FDF4 100%) !important;
    border-color: #E2E8F0 !important;
}
body.light-theme .cta-section h2 {
    color: #1E293B !important;
}
body.light-theme .cta-section p {
    color: #475569 !important;
}
body.light-theme .cta-section div[style*="position: absolute"] {
    opacity: 0.3 !important;
}

/* --- PLANS RECAP GRID --- */
body.light-theme .plan-recap-card {
    border-color: #E2E8F0 !important;
}
body.light-theme .plan-recap-card div[style*="color: rgba(255,255,255,0.9)"] {
    color: #1E293B !important;
}
body.light-theme .plan-recap-card div[style*="color: rgba(255,255,255,0.5)"],
body.light-theme .plan-recap-card span[style*="color: rgba(255,255,255,0.6)"] {
    color: #64748B !important;
}

/* --- ALL REMAINING INLINE WHITE TEXT --- */
body.light-theme div[style*="color: #fff"],
body.light-theme span[style*="color: #fff"],
body.light-theme p[style*="color: #fff"],
body.light-theme h4[style*="color: #fff"] {
    color: #1E293B !important;
}

/* --- ALL REMAINING #777E90 TEXT --- */
body.light-theme span[style*="color: #777E90"],
body.light-theme p[style*="color: #777E90"],
body.light-theme div[style*="color: #777E90"] {
    color: #64748B !important;
}

/* =====================================================
   MODE CLAIR - OVERRIDE GLOBAL COMPLET
   Attrape TOUTES les sections avec inline dark backgrounds
   ===================================================== */

/* --- TOUTES les sections avec fond sombre inline --- */
body.light-theme section[style*="#0B0E11"],
body.light-theme section[style*="#0b0e11"],
body.light-theme section[style*="#141920"],
body.light-theme section[style*="#0A0E17"],
body.light-theme section[style*="#0a0e17"],
body.light-theme section[style*="#111827"],
body.light-theme section[style*="#0f172a"],
body.light-theme section[style*="#1e293b"],
body.light-theme section[style*="#0a0e1a"],
body.light-theme section[style*="#0D1421"] {
    background: linear-gradient(180deg, #F8FAFC 0%, #F1F5F9 100%) !important;
}

/* --- Quick Action Bar (sticky dark bar) --- */
body.light-theme .quick-action-bar,
body.light-theme .quick-action-bar[style] {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%) !important;
    border-bottom-color: #E2E8F0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

/* --- Convertisseur & Market Analysis panels (rgba dark gradients) --- */
body.light-theme div[style*="linear-gradient(145deg, rgba(17, 24, 39"],
body.light-theme div[style*="linear-gradient(145deg, rgba(30, 41, 59"] {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06) !important;
}

/* --- Stat cards with colored rgba backgrounds (keep subtle color) --- */
body.light-theme div[style*="linear-gradient(135deg, rgba(17, 153, 250, 0.15)"] {
    background: linear-gradient(135deg, rgba(17, 153, 250, 0.08), rgba(17, 153, 250, 0.02)) !important;
    border-color: rgba(17, 153, 250, 0.15) !important;
}
body.light-theme div[style*="linear-gradient(135deg, rgba(16, 185, 129, 0.15)"] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.08), rgba(16, 185, 129, 0.02)) !important;
    border-color: rgba(16, 185, 129, 0.15) !important;
}
body.light-theme div[style*="linear-gradient(135deg, rgba(247, 147, 26, 0.15)"] {
    background: linear-gradient(135deg, rgba(247, 147, 26, 0.08), rgba(247, 147, 26, 0.02)) !important;
    border-color: rgba(247, 147, 26, 0.15) !important;
}
body.light-theme div[style*="linear-gradient(135deg, rgba(245, 158, 11, 0.15)"] {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.08), rgba(245, 158, 11, 0.02)) !important;
    border-color: rgba(245, 158, 11, 0.15) !important;
}

/* --- TOUS les textes blancs/clairs inline → sombres (wildcard) --- */
body.light-theme h1[style*="color: #FFFFFF"],
body.light-theme h2[style*="color: #FFFFFF"],
body.light-theme h3[style*="color: #FFFFFF"],
body.light-theme h2[style*="color: white"],
body.light-theme h3[style*="color: white"],
body.light-theme strong[style*="color: #fff"],
body.light-theme strong[style*="color: white"],
body.light-theme a[style*="color: #fff"],
body.light-theme label[style*="color: #fff"],
body.light-theme label[style*="color: rgba(255,255,255"] {
    color: #1E293B !important;
}

/* --- Textes rgba(255,255,255,...) mutés → gris foncé --- */
body.light-theme [style*="color: rgba(255,255,255,0.4)"],
body.light-theme [style*="color: rgba(255,255,255,0.5)"],
body.light-theme [style*="color: rgba(255,255,255,0.6)"],
body.light-theme [style*="color: rgba(255,255,255,0.7)"],
body.light-theme [style*="color: rgba(255,255,255,0.8)"],
body.light-theme [style*="color: rgba(255,255,255,0.85)"],
body.light-theme [style*="color: rgba(255,255,255,0.9)"] {
    color: #64748B !important;
}

/* --- #C3C6CF text (used in quick action bar etc) --- */
body.light-theme [style*="color: #C3C6CF"],
body.light-theme [style*="color:#C3C6CF"] {
    color: #475569 !important;
}

/* --- Photo showcase section --- */
body.light-theme .photo-showcase-grid > div[style] {
    border-color: #E2E8F0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08) !important;
}

/* --- Input/Select fields in converter (rgba dark bg) --- */
body.light-theme input[style*="background: rgba("],
body.light-theme select[style*="background: rgba("],
body.light-theme input[style*="background:rgba("],
body.light-theme select[style*="background:rgba("] {
    background: #F1F5F9 !important;
    color: #1E293B !important;
    border-color: #CBD5E1 !important;
}

/* --- Border with rgba(255,255,255 → light border --- */
body.light-theme div[style*="border: 1px solid rgba(255,255,255"],
body.light-theme div[style*="border:1px solid rgba(255,255,255"],
body.light-theme div[style*="border-top: 1px solid rgba(255,255,255"] {
    border-color: #E2E8F0 !important;
}

/* --- Border with #0A0E17 (swap button border) --- */
body.light-theme button[style*="border: 4px solid #0A0E17"],
body.light-theme button[style*="border:4px solid #0A0E17"] {
    border-color: #F1F5F9 !important;
}

/* --- Crypto card backgrounds (Top 5 section) --- */
body.light-theme .crypto-card-animated[style*="background: linear-gradient"] {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}

/* --- SVG overlays → more transparent in light --- */
body.light-theme div[style*="opacity: 0.03"],
body.light-theme div[style*="opacity: 0.05"],
body.light-theme div[style*="opacity:0.03"],
body.light-theme div[style*="opacity:0.05"] {
    opacity: 0.02 !important;
}

/* --- Gradient text titles (converter etc) --- */
body.light-theme h2[style*="-webkit-background-clip: text"] {
    background: linear-gradient(135deg, #1E293B, #1199FA) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* --- Formation cards with inline dark bg --- */
body.light-theme div[style*="background: linear-gradient(145deg, #1a2540"],
body.light-theme div[style*="linear-gradient(135deg, #1a2540"] {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* --- Cours/Video cards with dark bg --- */
body.light-theme div[style*="background: linear-gradient(135deg, #1199FA, #0066CC)"] {
    background: linear-gradient(135deg, #1199FA, #0066CC) !important;
}

/* --- Badge live in light mode --- */
body.light-theme .badge-live {
    background: rgba(17, 153, 250, 0.1) !important;
    border-color: rgba(17, 153, 250, 0.2) !important;
}

/* --- Stat card premium --- */
body.light-theme .stat-card-premium {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
}
body.light-theme .stat-card-premium .stat-label,
body.light-theme .stat-card-premium .stat-growth {
    color: #64748B !important;
}

/* --- Hero stats premium --- */
body.light-theme .hero-stats-premium {
    background: transparent !important;
}

/* --- Deposit page --- */
body.light-theme .deposit-page,
body.light-theme div[style*="min-height: 100vh"][style*="background: linear-gradient"] {
    background: linear-gradient(135deg, #F1F5F9 0%, #F8FAFC 100%) !important;
}
body.light-theme .deposit-card,
body.light-theme div[style*="background: rgba(13, 17, 28"],
body.light-theme div[style*="background:rgba(13,17,28"] {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* --- Dashboard page --- */
body.light-theme .dashboard-page {
    background: #F1F5F9 !important;
}
body.light-theme .dashboard-sidebar {
    background: #1E293B !important;
}
body.light-theme .dashboard-main {
    background: #F1F5F9 !important;
}
body.light-theme .dashboard-card,
body.light-theme .balance-card,
body.light-theme .investment-item {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* --- Login page --- */
body.light-theme .login-container,
body.light-theme .register-container {
    background: #F1F5F9 !important;
}
body.light-theme .login-card,
body.light-theme .auth-card {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* --- Country grid in deposit (clickable cards) --- */
body.light-theme .country-option {
    background: #F8FAFC !important;
    border-color: #E2E8F0 !important;
    color: #1E293B !important;
}
body.light-theme .country-option:hover,
body.light-theme .country-option.selected {
    border-color: #1199FA !important;
}
body.light-theme .country-option .country-name-text {
    color: #1E293B !important;
}

/* --- Plan options in deposit --- */
body.light-theme .plan-option {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}
body.light-theme .plan-option:hover,
body.light-theme .plan-option.selected {
    border-color: #1199FA !important;
}

/* --- Converter tab buttons --- */
body.light-theme .converter-tab {
    background: #F1F5F9 !important;
    color: #475569 !important;
}
body.light-theme .converter-tab.active {
    background: linear-gradient(135deg, #10b981, #059669) !important;
    color: #fff !important;
}

/* --- SMOOTH TRANSITION --- */
body, body * {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Exclude elements that shouldn't transition */
iframe, img, video, .fa, .fas, .fab, .far,
[class*="fa-"], .badge-premium, .invest-btn,
.btn-primary, a[style*="background: linear-gradient"] {
    transition: none !important;
}

/* --- LOGO en mode clair --- */
body.light-theme .logo img {
    filter: brightness(0.2) !important;
}

/* =====================================================
   MODE CLAIR - FORCE GLOBAL (attrape tout)
   ===================================================== */

/* Force light background on EVERYTHING */
body.light-theme {
    background: #F1F5F9 !important;
    color: #1E293B !important;
}

body.light-theme section {
    background: #F8FAFC !important;
    color: #1E293B !important;
}

body.light-theme section:nth-child(even) {
    background: #FFFFFF !important;
}

/* Override ALL dark inline backgrounds globally */
body.light-theme [style*="background: #0"],
body.light-theme [style*="background:#0"],
body.light-theme [style*="background: #1"],
body.light-theme [style*="background:#1"],
body.light-theme [style*="background: rgb(10"],
body.light-theme [style*="background: rgb(11"],
body.light-theme [style*="background: rgb(13"],
body.light-theme [style*="background: rgb(26"] {
    background: #FFFFFF !important;
}

/* Override ALL white/light text to dark */
body.light-theme [style*="color: #fff"],
body.light-theme [style*="color:#fff"],
body.light-theme [style*="color: #FFF"],
body.light-theme [style*="color: white"],
body.light-theme [style*="color: #FFFFFF"],
body.light-theme [style*="color: #F7F8FA"],
body.light-theme [style*="color: #f7f8fa"],
body.light-theme [style*="color: #E8EAED"] {
    color: #1E293B !important;
}

/* Mobile bottom nav in light mode */
body.light-theme .mobile-bottom-nav {
    background: rgba(255, 255, 255, 0.98) !important;
    border-top: 1px solid #E2E8F0 !important;
}

body.light-theme .mobile-nav-item {
    color: #64748B !important;
}

body.light-theme .mobile-nav-item.active,
body.light-theme .mobile-nav-item:hover {
    color: #1199FA !important;
}

/* Marquee ticker in light mode */
body.light-theme .crypto-marquee-bar,
body.light-theme [style*="position: sticky"][style*="top: 60px"] {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* Notification popups in light mode */
body.light-theme .user-notif,
body.light-theme .crypto-notif {
    background: linear-gradient(135deg, rgba(255,255,255,0.97), rgba(248,250,252,0.97)) !important;
    border-color: #E2E8F0 !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
}

body.light-theme .user-notif-name,
body.light-theme .crypto-notif-name {
    color: #1E293B !important;
}

body.light-theme .user-notif-message,
body.light-theme .crypto-notif-message {
    color: #475569 !important;
}

body.light-theme .user-notif-footer,
body.light-theme .crypto-notif-footer {
    color: #94A3B8 !important;
}

/* Chatbot in light mode */
body.light-theme .chatbot-container {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* WhatsApp float */
body.light-theme .whatsapp-float {
    box-shadow: 0 4px 20px rgba(37, 211, 102, 0.3) !important;
}

/* Footer stays dark in light mode (intentional design choice) */
body.light-theme footer,
body.light-theme .footer {
    background: #1E293B !important;
    color: #F1F5F9 !important;
}

body.light-theme .footer h3,
body.light-theme .footer h4,
body.light-theme .footer a {
    color: #F1F5F9 !important;
}

body.light-theme .footer p,
body.light-theme .footer span,
body.light-theme .footer li {
    color: #94A3B8 !important;
}

/* =====================================================
   BADGES ET TAGS
   ===================================================== */

.badge-new {
    background: linear-gradient(135deg, #00D4FF, #00A8CC);
    color: white;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: glow 2s ease-in-out infinite;
}

@keyframes glow {
    0%, 100% {
        box-shadow: 0 0 10px rgba(0, 212, 255, 0.5);
    }
    50% {
        box-shadow: 0 0 20px rgba(0, 212, 255, 0.8);
    }
}

.new-plan {
    position: relative;
    overflow: visible;
    animation: slideUp 0.6s ease-out;
}

@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* =====================================================
   STATISTIQUES AMÉLIORÉES
   ===================================================== */

.stat-item {
    text-align: center;
    padding: 20px;
    background: rgba(240, 185, 11, 0.05);
    border-radius: 12px;
    border: 1px solid rgba(240, 185, 11, 0.1);
    transition: all 0.3s ease;
}

.stat-item:hover {
    transform: translateY(-5px);
    border-color: var(--primary);
    box-shadow: 0 10px 20px rgba(240, 185, 11, 0.1);
}

.stat-icon {
    font-size: 32px;
    color: var(--primary);
    margin-bottom: 10px;
}

.stat-icon i {
    animation: float 3s ease-in-out infinite;
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

.stat-number {
    font-size: 36px;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 8px;
}

.stat-label {
    font-size: 14px;
    color: var(--text-secondary);
    font-weight: 500;
}

/* =====================================================
   FORMATIONS GRID RESPONSIVE
   ===================================================== */

.formations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    margin-top: 50px;
}

/* =====================================================
   RESPONSIVE POUR NOUVEAUX ÉLÉMENTS
   ===================================================== */

@media (max-width: 768px) {
    .theme-toggle,
    .whatsapp-btn {
        width: 36px;
        height: 36px;
        margin-right: 5px;
    }

    .theme-toggle i {
        font-size: 16px;
    }

    .whatsapp-btn i {
        font-size: 18px;
    }
}

@media (max-width: 576px) {
    .nav-actions .whatsapp-btn {
        display: none; /* On utilise le bouton flottant sur mobile */
    }
}
