/*
 * SUFFAYA — theme.css v3.0
 * Mode clair complet — toutes pages, tous composants, toutes icônes
 * Aucun fichier existant modifié — cascade pure via [data-theme="light"]
 */

/* ══ Transition douce ══ */
html[data-theme="light"] *,
html[data-theme="light"] *::before,
html[data-theme="light"] *::after {
    transition:
        background-color .22s ease,
        background .22s ease,
        border-color .22s ease,
        color .18s ease,
        box-shadow .18s ease,
        fill .18s ease,
        stroke .18s ease !important;
}
/* ══ Drawer — opacity + transform préservés ══ */
html[data-theme="light"] .mobile-nav {
    transition:
        transform .42s cubic-bezier(.22,.68,0,1.2),
        opacity .3s ease,
        background-color .22s ease,
        border-color .22s ease !important;
}
html[data-theme="light"] .mobile-nav .drawer-header,
html[data-theme="light"] .mobile-nav .drawer-search,
html[data-theme="light"] .mobile-nav .drawer-login-cta,
html[data-theme="light"] .mobile-nav .drawer-user-card,
html[data-theme="light"] .mobile-nav .drawer-section-title,
html[data-theme="light"] .mobile-nav .mn-link,
html[data-theme="light"] .mobile-nav .drawer-divider,
html[data-theme="light"] .mobile-nav .drawer-footer {
    transition:
        opacity .28s ease,
        transform .35s cubic-bezier(.22,.68,0,1.2),
        background-color .22s ease,
        border-color .22s ease,
        color .18s ease !important;
}
html[data-theme="light"] img,
html[data-theme="light"] .loading-overlay *,
html[data-theme="light"] .loading-box * { transition: none !important; }

/* ══════════════════════════════════════════════════════
   VARIABLES — toutes les familles du site
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] {
    /* style.css */
    --primary: #4f46e5; --primary-d: #3730a3;
    --ok: #16a34a; --err: #dc2626;
    --text: #0f172a; --muted: #64748b;
    --bg: #f0f4f8; --surface: #ffffff; --card: #f8fafc; --border: #e2e8f0;

    /* shop.css */
    --bg: #f0f4f8; --sur: #ffffff; --card: #ffffff; --card-h: #f8fafc;
    --brd: #dde3ec; --brd-h: #c7d0dc;
    --acc: #4f46e5; --acc-d: #3730a3; --acc2: #6366f1;
    --acc-glow: rgba(79,70,229,.1);
    --gold: #d97706; --gold-d: #b45309; --gold-glow: rgba(217,119,6,.08);
    --ok: #16a34a; --err: #dc2626;
    --tx: #0f172a; --tx2: #334155; --mu: #64748b; --mu2: #94a3b8;
    --hdr: rgba(255,255,255,.95);

    /* catalog.css */
    --cv: #4f46e5; --cv-s: rgba(79,70,229,.08); --cv-g: rgba(79,70,229,.2);
    --co: #d97706; --cr: #dc2626; --cg: #16a34a; --cgd: #d97706;
    --cbg: #f0f4f8; --cbg2: #f8fafc; --cc: #ffffff; --cc2: #f1f5f9;
    --cb: rgba(79,70,229,.15); --cb2: rgba(0,0,0,.06);
    --ct: #0f172a; --ct2: #334155; --ct3: #64748b;

    /* product.css */
    --pv: #4f46e5; --pv-s: rgba(79,70,229,.08); --pv-g: rgba(79,70,229,.2);
    --po: #d97706; --pr: #dc2626; --pg: #16a34a; --pgd: #d97706;
    --pbg: #f0f4f8; --pbg2: #f8fafc; --pc: #ffffff; --pc2: #f1f5f9;
    --pb: rgba(79,70,229,.15); --pb2: rgba(0,0,0,.06);
    --pt: #0f172a; --pt2: #334155; --pt3: #64748b;

    /* cart.css */
    --cv: #4f46e5; --cv-s: rgba(79,70,229,.08); --cv-g: rgba(79,70,229,.2);
    --co: #d97706; --cr: #dc2626; --cg: #16a34a; --cam: #d97706;
    --cbg: #f0f4f8; --cbg2: #f8fafc; --ccard: #ffffff; --ccard2: #f1f5f9;
    --cb: rgba(79,70,229,.15); --cb2: rgba(0,0,0,.06);
    --ct: #0f172a; --ct2: #334155; --ct3: #64748b;

    /* auth.css */
    --av: #4f46e5; --av-s: rgba(79,70,229,.08); --av-g: rgba(79,70,229,.2);
    --abg: #f0f4f8; --ac: #ffffff; --ab: rgba(79,70,229,.18); --ab2: rgba(0,0,0,.06);
    --at: #0f172a; --at2: #334155; --at3: #94a3b8;
    --ar: #dc2626; --ag: #16a34a; --ao: #d97706;

    /* store/vendor/customer generics */
    --vbg: #f0f4f8; --vcard: #ffffff; --vbrd: #dde3ec;
    --vt: #0f172a; --vt2: #334155; --vmu: #64748b; --vacc: #4f46e5;
}

/* ══════════════════════════════════════════════════════
   CORPS ET FOND
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] body,
html[data-theme="light"] .shop-body,
html[data-theme="light"] .cl-page,
html[data-theme="light"] .pd-page,
html[data-theme="light"] .cv3-page,
html[data-theme="light"] .auth-body {
    background: #f0f4f8;
    color: #0f172a;
}

/* ══════════════════════════════════════════════════════
   HEADER PRINCIPAL
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .shop-header {
    border-bottom-color: #dde3ec;
    box-shadow: 0 1px 16px rgba(0,0,0,.07);
}
html[data-theme="light"] .shop-header-main,
html[data-theme="light"] .shop-topbar {
    background: rgba(255,255,255,.96);
}
html[data-theme="light"] .shop-topbar {
    border-bottom-color: #e8edf3;
    color: #64748b;
}
html[data-theme="light"] .stb-link { color: #64748b; }
html[data-theme="light"] .stb-link:hover { color: #4f46e5; }
html[data-theme="light"] .stb-sep { color: #dde3ec; }

/* Logo */
html[data-theme="light"] .logo-text-main { color: #0f172a; }
html[data-theme="light"] .logo-text-main em { color: #f59e0b; }

/* Boutons header */
html[data-theme="light"] .shop-action-btn,
html[data-theme="light"] .burger-btn {
    background: #ffffff;
    border-color: #dde3ec;
    color: #64748b;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
html[data-theme="light"] .shop-action-btn:hover,
html[data-theme="light"] .burger-btn:hover {
    border-color: #4f46e5;
    background: rgba(79,70,229,.06);
    color: #4f46e5;
}

/* ══ ICÔNES SVG dans le header — blanches → grises ══ */
html[data-theme="light"] .shop-action-btn svg,
html[data-theme="light"] .burger-btn svg {
    stroke: #64748b;
}
html[data-theme="light"] .shop-action-btn:hover svg,
html[data-theme="light"] .burger-btn:hover svg {
    stroke: #4f46e5;
}

/* Bouton user */
html[data-theme="light"] .user-btn {
    background: #ffffff;
    border-color: #dde3ec;
    color: #0f172a;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
html[data-theme="light"] .user-btn:hover {
    border-color: #4f46e5;
    background: rgba(79,70,229,.06);
}
html[data-theme="light"] .user-avatar-sm {
    background: rgba(79,70,229,.1);
    color: #4f46e5;
}

/* Panier badge */
html[data-theme="light"] .cart-badge {
    border-color: #f0f4f8;
}

/* Boutons connexion desktop */
html[data-theme="light"] .shop-action-btn-text {
    color: #334155;
}
html[data-theme="light"] .shop-action-btn-text:hover { color: #4f46e5; }
html[data-theme="light"] .shop-btn-register {
    background: #4f46e5;
    color: #fff;
    border-color: #4f46e5;
}

/* ══════════════════════════════════════════════════════
   NAVIGATION TABS
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .shop-nav {
    background: rgba(255,255,255,.95);
    border-bottom-color: #dde3ec;
}
html[data-theme="light"] .sn-link { color: #64748b; }
html[data-theme="light"] .sn-link:hover { color: #0f172a; border-bottom-color: #dde3ec; }
html[data-theme="light"] .sn-link.active { color: #4f46e5; border-bottom-color: #4f46e5; }

/* ══════════════════════════════════════════════════════
   BARRE DE RECHERCHE
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .search-input {
    background: #f8fafc;
    border-color: #dde3ec;
    color: #0f172a;
}
html[data-theme="light"] .search-input::placeholder { color: #94a3b8; }
html[data-theme="light"] .search-input:focus {
    border-color: #4f46e5;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(79,70,229,.1);
}
html[data-theme="light"] .search-btn { background: #4f46e5; }
html[data-theme="light"] .search-btn svg { stroke: #fff; }
html[data-theme="light"] .ls-dropdown {
    background: #ffffff;
    border-color: #dde3ec;
    box-shadow: 0 8px 32px rgba(0,0,0,.1);
}
html[data-theme="light"] .ls-item:hover { background: #f8fafc; }
html[data-theme="light"] .ls-item-name { color: #0f172a; }
html[data-theme="light"] .ls-item-sub { color: #64748b; }
html[data-theme="light"] .ls-item-price { color: #4f46e5; }

/* ══════════════════════════════════════════════════════
   DROPDOWN UTILISATEUR
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .dropdown-menu {
    background: #ffffff;
    border-color: #dde3ec;
    box-shadow: 0 8px 32px rgba(0,0,0,.12);
}
html[data-theme="light"] .dm-user-head {
    border-bottom-color: #f1f5f9;
}
html[data-theme="light"] .dm-user-name { color: #0f172a; }
html[data-theme="light"] .dm-link {
    color: #334155;
}
html[data-theme="light"] .dm-link svg { stroke: #64748b; }
html[data-theme="light"] .dm-link:hover {
    background: #f8fafc;
    color: #4f46e5;
}
html[data-theme="light"] .dm-link:hover svg { stroke: #4f46e5; }
html[data-theme="light"] .dm-sep { background: #f1f5f9; }
html[data-theme="light"] .dm-logout { color: #dc2626; }
html[data-theme="light"] .dm-logout svg { stroke: #dc2626; }

/* ══════════════════════════════════════════════════════
   DRAWER MOBILE
   ══════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════
   HERO & SECTIONS HOME
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .hero-section {
    background: linear-gradient(135deg, #eef2ff 0%, #f0f4f8 100%);
}
html[data-theme="light"] .hero-section h1,
html[data-theme="light"] .hero-title { color: #0f172a; }
html[data-theme="light"] .hero-subtitle,
html[data-theme="light"] .hero-desc { color: #64748b; }
html[data-theme="light"] .hero-badge {
    background: rgba(79,70,229,.08);
    border-color: rgba(79,70,229,.2);
    color: #4f46e5;
}
html[data-theme="light"] .hero-badge svg { stroke: #4f46e5; }
html[data-theme="light"] .hero-badge-item {
    background: #fff;
    border-color: #dde3ec;
    color: #64748b;
}
html[data-theme="light"] .hero-stats-num { color: #4f46e5; }
html[data-theme="light"] .hero-stats-label { color: #64748b; }
html[data-theme="light"] .hero-mini-card {
    background: #fff;
    border-color: #dde3ec;
}
html[data-theme="light"] .hero-mini-noimg { background: #f1f5f9; }
html[data-theme="light"] .btn-hero-secondary {
    border-color: #dde3ec;
    color: #334155;
    background: rgba(255,255,255,.8);
}

/* Trust bar */
html[data-theme="light"] .trust-bar {
    background: #f8fafc;
    border-color: #dde3ec;
}
html[data-theme="light"] .trust-bar svg { stroke: #4f46e5; }
html[data-theme="light"] .trust-label { color: #4f46e5; }
html[data-theme="light"] .trust-bar div { color: #64748b; }

/* Flash sale section */
html[data-theme="light"] .section-deals,

/* Catégories home */
/* Catégories scroll — mode clair */
html[data-theme="light"] .cat-scroll-card {
    background: #ffffff;
    border-color: #e2e8f0;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
html[data-theme="light"] .cat-scroll-card:active { transform: scale(.95); }
html[data-theme="light"] .csc-circle {
    background: rgba(255,255,255,.6);
    border-color: rgba(255,255,255,.9);
}
html[data-theme="light"] .csc-name { color: #0f172a; }
html[data-theme="light"] .csc-count { color: #6366f1; }
html[data-theme="light"] .cats-dot { background: #6366f1; }
html[data-theme="light"] .cats-hint-txt { color: #94a3b8; }

html[data-theme="light"] .cat-card {
    background: #ffffff;
    border-color: #dde3ec;
}
html[data-theme="light"] .cat-card:hover {
    border-color: rgba(79,70,229,.3);
    box-shadow: 0 6px 20px rgba(79,70,229,.1);
}
html[data-theme="light"] .cat-name { color: #0f172a; }
html[data-theme="light"] .cat-count { color: #64748b; }

/* Sections home génériques */
html[data-theme="light"] .section-heading { color: #0f172a; }
html[data-theme="light"] .section-link { color: #4f46e5; }

/* Why section */
html[data-theme="light"] .why-card {
    background: #ffffff;
    border-color: #dde3ec;
}
html[data-theme="light"] .why-card-title { color: #0f172a; }
html[data-theme="light"] .why-card-desc { color: #64748b; }

/* Boutiques section */
html[data-theme="light"] .store-card {
    background: #ffffff;
    border-color: #dde3ec;
}
html[data-theme="light"] .store-name { color: #0f172a; }
html[data-theme="light"] .store-meta { color: #64748b; }

/* Newsletter */
html[data-theme="light"] .nl-section {
    background: #1e1b4b;  /* Garder sombre pour contraste */
}

/* ══════════════════════════════════════════════════════
   CARTES PRODUITS (catalog, home, search)
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .cl-card,
html[data-theme="light"] .home-prod-card,
html[data-theme="light"] .hp-card {
    background: #ffffff;
    border-color: #dde3ec;
    box-shadow: 0 1px 6px rgba(0,0,0,.05);
}
html[data-theme="light"] .cl-card:hover,
html[data-theme="light"] .hp-card:hover {
    box-shadow: 0 8px 24px rgba(79,70,229,.12);
    border-color: rgba(79,70,229,.28);
}
html[data-theme="light"] .cl-card-name,
html[data-theme="light"] .cl-card-store { color: #0f172a; }
html[data-theme="light"] .cl-card-store { color: #4f46e5; }
html[data-theme="light"] .cl-card-cta { background: #4f46e5; }
html[data-theme="light"] .cl-card-cta svg { stroke: #fff; }
html[data-theme="light"] .cl-card-body { background: #ffffff; }

/* Stars */
html[data-theme="light"] .cl-sf { color: #d97706; }
html[data-theme="light"] .cl-se { color: #dde3ec; }

/* ══════════════════════════════════════════════════════
   PAGE CATALOGUE
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .cl-hero {
    background: linear-gradient(135deg, #eef2ff, #f8fafc);
    border-bottom-color: #dde3ec;
}
html[data-theme="light"] .cl-hero-title { color: #0f172a; }
html[data-theme="light"] .cl-hero-count {
    background: #ffffff;
    border-color: #dde3ec;
    color: #64748b;
}
html[data-theme="light"] .cl-bar {
    background: #f8fafc;
    border-bottom-color: #dde3ec;
}
html[data-theme="light"] .cl-bar-count { color: #64748b; }
html[data-theme="light"] .cl-sort-btn {
    background: #ffffff;
    border-color: #dde3ec;
    color: #334155;
}
html[data-theme="light"] .cl-sort-btn svg { stroke: #64748b; }
html[data-theme="light"] .cl-chip {
    background: rgba(79,70,229,.08);
    border-color: rgba(79,70,229,.2);
    color: #4f46e5;
}
html[data-theme="light"] .cl-chip-x { color: #4f46e5; }
html[data-theme="light"] .cl-filter-btn {
    background: #ffffff;
    border-color: #dde3ec;
    color: #334155;
}
html[data-theme="light"] .cl-filter-btn svg { stroke: #64748b; }
html[data-theme="light"] .cl-filter-panel {
    background: #ffffff;
    border-color: #dde3ec;
    box-shadow: 0 8px 32px rgba(0,0,0,.1);
}
html[data-theme="light"] .cl-filter-title { color: #0f172a; }
html[data-theme="light"] .cl-filter-label { color: #334155; }
html[data-theme="light"] .cl-view-btn {
    background: rgba(79,70,229,.08);
    border-color: rgba(79,70,229,.2);
    color: #4f46e5;
}
html[data-theme="light"] .cl-view-btn svg { stroke: #4f46e5; }
html[data-theme="light"] .cl-view-btn:not(.active) {
    background: #ffffff;
    border-color: #dde3ec;
    color: #64748b;
}
html[data-theme="light"] .cl-empty { color: #64748b; }

/* ══════════════════════════════════════════════════════
   PAGE PRODUIT DÉTAIL
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .pd-gallery-main {
    background: #fff;
    border-color: #dde3ec;
}
html[data-theme="light"] .pd-thumb {
    background: #fff;
    border-color: #dde3ec;
}
html[data-theme="light"] .pd-thumb.active { border-color: #4f46e5; }
html[data-theme="light"] .pd-store-card {
    background: #f8fafc;
    border-color: #dde3ec;
}
html[data-theme="light"] .pd-store-name { color: #0f172a; }
html[data-theme="light"] .pd-store-meta { color: #64748b; }
html[data-theme="light"] .pd-title { color: #0f172a; }
html[data-theme="light"] .pd-price { color: #4f46e5; }
html[data-theme="light"] .pd-price-old { color: #94a3b8; }
html[data-theme="light"] .pd-desc-card,
html[data-theme="light"] .pd-spec-card,
html[data-theme="light"] .pd-review-card {
    background: #ffffff;
    border-color: #dde3ec;
}
html[data-theme="light"] .pd-desc-title,
html[data-theme="light"] .pd-section-title { color: #0f172a; }
html[data-theme="light"] .pd-desc-text { color: #334155; }
html[data-theme="light"] .pd-trust-row { background: #f8fafc; border-color: #dde3ec; }
html[data-theme="light"] .pd-trust-label { color: #0f172a; }
html[data-theme="light"] .pd-trust-val { color: #64748b; }
html[data-theme="light"] .pd-stock-ok { background: rgba(22,163,74,.08); border-color: rgba(22,163,74,.2); color: #16a34a; }
html[data-theme="light"] .pd-stock-ok svg { stroke: #16a34a; }

/* Icônes dans page produit */
html[data-theme="light"] .pd-label-icon,
html[data-theme="light"] .pd-sales-icon,
html[data-theme="light"] .pd-stock-icon,
html[data-theme="light"] .pd-trust-icon,
html[data-theme="light"] .pd-sh-icon,
html[data-theme="light"] .pd-date-icon,
html[data-theme="light"] .pd-qty-icon {
    filter: brightness(0) saturate(100%) invert(40%) sepia(5%) hue-rotate(180deg) opacity(.7) !important;
}

/* ══════════════════════════════════════════════════════
   PAGE CATÉGORIE
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .cv-hero,
html[data-theme="light"] .cat-hero {
    background: linear-gradient(135deg, #eef2ff, #f8fafc);
    border-bottom-color: #dde3ec;
}
html[data-theme="light"] .cv-hero-title,
html[data-theme="light"] .cat-hero-title { color: #0f172a; }
html[data-theme="light"] .cv-sub-chip {
    background: #ffffff;
    border-color: #dde3ec;
    color: #334155;
}
html[data-theme="light"] .cv-sub-chip:hover,
html[data-theme="light"] .cv-sub-chip.active { background: #4f46e5; color: #fff; border-color: #4f46e5; }
html[data-theme="light"] .cv-empty { color: #64748b; }
html[data-theme="light"] .cv-empty svg { stroke: #94a3b8; }

/* ══════════════════════════════════════════════════════
   PANIER & CHECKOUT
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .cv3-card,
html[data-theme="light"] .cv3-recap,
html[data-theme="light"] .cv3-item {
    background: #ffffff;
    border-color: #dde3ec;
}
html[data-theme="light"] .cv3-title { color: #0f172a; }
html[data-theme="light"] .cv3-item-name { color: #0f172a; }
html[data-theme="light"] .cv3-item-meta { color: #64748b; }
html[data-theme="light"] .cv3-item-price { color: #4f46e5; }
html[data-theme="light"] .cv3-qty-btn {
    background: #f1f5f9;
    border-color: #dde3ec;
    color: #334155;
}
html[data-theme="light"] .cv3-qty-btn svg { stroke: #334155; }
html[data-theme="light"] .cv3-remove svg { stroke: #dc2626; }
html[data-theme="light"] .cv3-sep { background: #f1f5f9; }
html[data-theme="light"] .cv3-recap-label { color: #64748b; }
html[data-theme="light"] .cv3-recap-total { color: #0f172a; }

/* ══════════════════════════════════════════════════════
   PAGES AUTH
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .auth-body {
    background: #f0f4f8;
}
html[data-theme="light"] .auth-body::before {
    background:
        radial-gradient(ellipse 60% 50% at 20% 20%, rgba(79,70,229,.08) 0%, transparent 60%),
        radial-gradient(ellipse 50% 40% at 80% 80%, rgba(79,70,229,.05) 0%, transparent 60%);
}
html[data-theme="light"] .auth-body::after { opacity: .15; }
html[data-theme="light"] .auth-card {
    background: rgba(255,255,255,.94);
    border-color: rgba(79,70,229,.14);
    box-shadow: 0 8px 40px rgba(0,0,0,.08);
}
html[data-theme="light"] .auth-title { color: #0f172a; }
html[data-theme="light"] .auth-sub { color: #64748b; }
html[data-theme="light"] .form-label { color: #334155; }
html[data-theme="light"] .form-label img {
    filter: brightness(0) saturate(100%) invert(45%) sepia(5%) hue-rotate(180deg) opacity(.55) !important;
}
html[data-theme="light"] .form-input {
    background: #f8fafc;
    border-color: #dde3ec;
    color: #0f172a;
}
html[data-theme="light"] .form-input::placeholder { color: #94a3b8; }
html[data-theme="light"] .form-input:focus {
    background: #fff;
    border-color: rgba(79,70,229,.5);
    box-shadow: 0 0 0 4px rgba(79,70,229,.09);
}
html[data-theme="light"] .field-wrap .f-icon {
    filter: brightness(0) saturate(100%) invert(45%) sepia(5%) hue-rotate(180deg) opacity(.5) !important;
}
html[data-theme="light"] .field-wrap:focus-within .f-icon {
    filter: brightness(0) saturate(100%) invert(28%) sepia(80%) saturate(600%) hue-rotate(224deg) opacity(.7) !important;
}
html[data-theme="light"] .eye-btn img {
    filter: brightness(0) saturate(100%) invert(45%) sepia(5%) hue-rotate(180deg) opacity(.5) !important;
}
html[data-theme="light"] .eye-btn:hover img,
html[data-theme="light"] .eye-btn.active img {
    filter: brightness(0) saturate(100%) invert(28%) sepia(80%) saturate(600%) hue-rotate(224deg) opacity(.8) !important;
}
html[data-theme="light"] .phone-wrap {
    background: #f8fafc;
    border-color: #dde3ec;
}
html[data-theme="light"] .phone-flag {
    background: #f1f5f9;
    border-right-color: #dde3ec;
}
html[data-theme="light"] .phone-flag .code { color: #334155; }
html[data-theme="light"] .phone-input { color: #0f172a; }
html[data-theme="light"] .checkbox-box { background: #f8fafc; border-color: #c7d0dc; }
html[data-theme="light"] .checkbox-label { color: #334155; }
html[data-theme="light"] .forgot-link { color: #4f46e5; }
html[data-theme="light"] .security-note { color: #94a3b8; }
html[data-theme="light"] .security-note img {
    filter: brightness(0) saturate(100%) invert(60%) opacity(.4) !important;
}
html[data-theme="light"] .auth-switch { color: #64748b; }
html[data-theme="light"] .auth-footer { color: #94a3b8; }
html[data-theme="light"] .alert-error {
    background: rgba(220,38,38,.07);
    border-color: rgba(220,38,38,.2);
    color: #991b1b;
}
html[data-theme="light"] .alert-success {
    background: rgba(22,163,74,.07);
    border-color: rgba(22,163,74,.2);
    color: #166534;
}
html[data-theme="light"] .reset-email-box {
    background: rgba(79,70,229,.06);
    border-color: rgba(79,70,229,.18);
}
html[data-theme="light"] .reset-email-txt { color: #4f46e5; }
html[data-theme="light"] .reset-email-icon { background: rgba(79,70,229,.1); }
html[data-theme="light"] .reset-email-icon svg { stroke: #4f46e5; }

/* ══════════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════════ */
html[data-theme="light"] .site-footer,
html[data-theme="light"] .shop-footer {
    background: #f8fafc;
    border-top-color: #dde3ec;
}
html[data-theme="light"] .sf-col-title { color: #0f172a; }
html[data-theme="light"] .sf-link { color: #64748b; }
html[data-theme="light"] .sf-link:hover { color: #4f46e5; }
html[data-theme="light"] .sf-desc { color: #64748b; }
html[data-theme="light"] .sf-copy { color: #94a3b8; }
html[data-theme="light"] .sf-pay-badge {
    background: #fff;
    border-color: #dde3ec;
    color: #334155;
}
html[data-theme="light"] .sf-pay-badge svg { stroke: #64748b; }
html[data-theme="light"] .sf-social-btn {
    background: #fff;
    border-color: #dde3ec;
    color: #64748b;
}
html[data-theme="light"] .sf-social-btn:hover { color: #4f46e5; border-color: #4f46e5; }

/* ══════════════════════════════════════════════════════
   FLASH MESSAGES
   ══════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════
   ICÔNES SVG GLOBALES — Adaptive Theme System
   ══════════════════════════════════════════════════════ */

/* ── MODE SOMBRE (défaut) : icônes blanches ── */
img[src*="/assets/icons/"] {
    filter: brightness(0) invert(1);
}

/* ── Section badges colorés : icône = couleur du badge ── */
.section-badge-new img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(72%) sepia(40%) saturate(500%) hue-rotate(100deg) !important;
}
.section-badge-hot img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(45%) sepia(90%) saturate(700%) hue-rotate(320deg) brightness(1.2) !important;
}
.section-badge-sel img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(78%) sepia(70%) saturate(600%) hue-rotate(10deg) !important;
}
/* tr-badge (Tendances) et rvr-badge (Avis) */
.tr-badge img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(80%) sepia(40%) saturate(400%) hue-rotate(100deg) !important;
}
.rvr-badge img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(78%) sepia(70%) saturate(600%) hue-rotate(10deg) !important;
}
/* Flash Sale badge — icône blanche */
.fs-badge img[src*="/assets/icons/"] {
    filter: brightness(0) invert(1) !important;
}
/* App badge */
.app-badge img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(60%) sepia(40%) saturate(500%) hue-rotate(210deg) !important;
}

/* ── Exceptions : médias & avatars non filtrés ── */
img[src*="djibouti"],
img[src*="flag"],
img[src*="logo"],
img[src*="waafi"],
img[src*="payment"],
img[src*="avatar"],
img[src*="uploads/"],
img[src*="products/"],
img[src*="stores/"],
img[src*="categories/"] {
    filter: none !important;
}

/* ── MODE CLAIR : icônes gris anthracite ── */
html[data-theme="light"] img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(20%) sepia(5%) hue-rotate(180deg) opacity(.75) !important;
}

/* Badges colorés mode clair : garde la couleur du badge */
html[data-theme="light"] .section-badge-new img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(55%) sepia(50%) saturate(600%) hue-rotate(100deg) !important;
}
html[data-theme="light"] .section-badge-hot img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(35%) sepia(90%) saturate(800%) hue-rotate(320deg) !important;
}
html[data-theme="light"] .section-badge-sel img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(65%) sepia(80%) saturate(700%) hue-rotate(10deg) !important;
}
html[data-theme="light"] .tr-badge img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(55%) sepia(50%) saturate(600%) hue-rotate(100deg) !important;
}
html[data-theme="light"] .rvr-badge img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(65%) sepia(80%) saturate(700%) hue-rotate(10deg) !important;
}
html[data-theme="light"] .fs-badge img[src*="/assets/icons/"] {
    filter: brightness(0) invert(1) !important;
}
html[data-theme="light"] .app-badge img[src*="/assets/icons/"] {
    filter: brightness(0) saturate(100%) invert(35%) sepia(80%) saturate(600%) hue-rotate(210deg) !important;
}

/* Exceptions mode clair : médias non filtrés */
html[data-theme="light"] img[src*="djibouti"],
html[data-theme="light"] img[src*="flag"],
html[data-theme="light"] img[src*="logo"],
html[data-theme="light"] img[src*="waafi"],
html[data-theme="light"] img[src*="payment"],
html[data-theme="light"] img[src*="avatar"],
html[data-theme="light"] img[src*="uploads/"],
html[data-theme="light"] img[src*="products/"],
html[data-theme="light"] img[src*="stores/"],
html[data-theme="light"] img[src*="categories/"] {
    filter: none !important;
}

/* Boutons avec fond coloré : icône toujours blanche */
html[data-theme="light"] .btn-auth img[src*="/assets/icons/"],
html[data-theme="light"] .search-btn img[src*="/assets/icons/"],
html[data-theme="light"] .cl-card-cta img[src*="/assets/icons/"] {
    filter: brightness(0) invert(1) !important;
}

/* Shop action SVG inline */
html[data-theme="light"] .shop-nav svg,
html[data-theme="light"] .sn-link svg { stroke: #64748b; }
html[data-theme="light"] .sn-link.active svg { stroke: #4f46e5; }

/* ══════════════════════════════════════════════════════
   BOUTON TOGGLE THÈME
   ══════════════════════════════════════════════════════ */
.theme-toggle-btn {
    width: 38px; height: 38px;
    border-radius: 10px;
    border: 1.5px solid var(--brd, rgba(255,255,255,.1));
    background: rgba(255,255,255,.05);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
    overflow: hidden;
    color: var(--mu, #94a3b8);
    transition: all .2s !important;
}
.theme-toggle-btn:hover {
    border-color: var(--acc, #6366f1);
    background: var(--acc-glow, rgba(99,102,241,.12));
    color: var(--acc, #6366f1);
    transform: scale(1.05);
}
.theme-icon {
    position: absolute;
    width: 17px; height: 17px;
    transition: opacity .3s ease, transform .4s cubic-bezier(.34,1.56,.64,1) !important;
    flex-shrink: 0;
}
.theme-icon-moon { opacity: 1; transform: rotate(0deg) scale(1); }
.theme-icon-sun  { opacity: 0; transform: rotate(-90deg) scale(.6); }

html[data-theme="light"] .theme-icon-moon { opacity: 0; transform: rotate(90deg) scale(.6); }
html[data-theme="light"] .theme-icon-sun  { opacity: 1; transform: rotate(0deg) scale(1); }

html[data-theme="light"] .theme-toggle-btn {
    background: #fff;
    border-color: #dde3ec;
    color: #64748b;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
html[data-theme="light"] .theme-toggle-btn svg { stroke: #64748b; }
html[data-theme="light"] .theme-toggle-btn:hover {
    border-color: #4f46e5;
    background: rgba(79,70,229,.06);
    color: #4f46e5;
}
html[data-theme="light"] .theme-toggle-btn:hover svg { stroke: #4f46e5; }

/* ══════════════════════════════════════════════════════
   COMPOSANTS DIVERS
   ══════════════════════════════════════════════════════ */

/* Breadcrumbs */
html[data-theme="light"] .breadcrumb,
html[data-theme="light"] .bc-item { color: #64748b; }
html[data-theme="light"] .bc-sep { color: #94a3b8; }
html[data-theme="light"] .bc-item.active { color: #0f172a; }
html[data-theme="light"] .bc-chevron {
    filter: brightness(0) saturate(100%) invert(60%) opacity(.5) !important;
}

/* Badges */
html[data-theme="light"] .badge-new { background: #4f46e5; color: #fff; }
html[data-theme="light"] .badge-top { background: #d97706; color: #fff; }
html[data-theme="light"] .badge-sel { background: #16a34a; color: #fff; }

/* Scrollbar */
html[data-theme="light"] ::-webkit-scrollbar-track { background: #f1f5f9; }
html[data-theme="light"] ::-webkit-scrollbar-thumb { background: #cbd5e1; border-color: #f1f5f9; }
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Input, select, textarea génériques */
html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
html[data-theme="light"] textarea,
html[data-theme="light"] select {
    background: #f8fafc;
    border-color: #dde3ec;
    color: #0f172a;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #94a3b8; }

/* ══════════════════════════════════════════════════════
   CORRECTIONS SUPPLÉMENTAIRES v4
   Sections identifiées sur captures d'écran
   ══════════════════════════════════════════════════════ */

/* ── Search Live (#lsPortal) ── */
html[data-theme="light"] #lsPortal {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    box-shadow: 0 8px 40px rgba(0,0,0,.12) !important;
}
html[data-theme="light"] .ls-header {
    color: #94a3b8;
    border-bottom-color: #f1f5f9;
}
html[data-theme="light"] .ls-item {
    color: #0f172a;
    border-bottom-color: #f8fafc;
}
html[data-theme="light"] .ls-item:hover,
html[data-theme="light"] .ls-item.ls-focused {
    background: #f1f5f9;
}
html[data-theme="light"] .ls-img {
    background: #f8fafc;
    border-color: #dde3ec;
}
html[data-theme="light"] .ls-img-placeholder {
    background: #f1f5f9;
}
html[data-theme="light"] .ls-name { color: #0f172a; }
html[data-theme="light"] .ls-name mark {
    color: #4f46e5;
    background: rgba(79,70,229,.08);
}
html[data-theme="light"] .ls-meta { color: #64748b; }
html[data-theme="light"] .ls-price { color: #4f46e5; }
html[data-theme="light"] .ls-price-old { color: #94a3b8; }
html[data-theme="light"] .ls-disc { background: #dc2626; color: #fff; }
html[data-theme="light"] .ls-footer {
    background: #f8fafc;
    border-top-color: #f1f5f9;
    color: #64748b;
}
html[data-theme="light"] .ls-footer:hover { background: rgba(79,70,229,.08); }
html[data-theme="light"] .ls-empty { color: #64748b; }

/* ── Section "OFFRES DU MOMENT" (home-section-dark) ── */
/* --sur devient blanc en mode clair via les variables, mais au cas où */
html[data-theme="light"] .home-section-dark {
    background: #ffffff !important;
}
html[data-theme="light"] .home-section-dark .section-heading { color: #0f172a; }

/* Flash sale inner cards (fond sombre hardcodé dans home.php) */
html[data-theme="light"] .hp-card,
html[data-theme="light"] .deal-card,

/* ── Newsletter ── */
html[data-theme="light"] .newsletter-section {
    background: linear-gradient(135deg, #eef2ff 0%, #e8eeff 50%, #eef2ff 100%) !important;
    border-color: #dde3ec !important;
}
html[data-theme="light"] .nl-title { color: #0f172a !important; }
html[data-theme="light"] .nl-sub { color: #64748b !important; }
html[data-theme="light"] .nl-icon-wrap {
    background: rgba(79,70,229,.1) !important;
    border-color: rgba(79,70,229,.25) !important;
}
html[data-theme="light"] .nl-icon-wrap svg,
html[data-theme="light"] .nl-icon-wrap img { filter: none; stroke: #4f46e5; }
html[data-theme="light"] .nl-input {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    color: #0f172a !important;
}
html[data-theme="light"] .nl-input::placeholder { color: #94a3b8 !important; }

/* ── Catalog filtre bar — variables CSS + override ── */
html[data-theme="light"] .cl-bar {
    background: #f8fafc !important;
    border-bottom-color: #dde3ec !important;
    backdrop-filter: none;
}
html[data-theme="light"] .cl-bar-left { color: #64748b !important; }
html[data-theme="light"] .cl-bar-left strong { color: #0f172a !important; }
html[data-theme="light"] .cl-sort-form {
    background: #ffffff !important;
    border-color: #dde3ec !important;
}
html[data-theme="light"] .cl-sort-sel { color: #334155 !important; background: transparent; }
html[data-theme="light"] .cl-sort-ico {
    filter: brightness(0) saturate(100%) invert(40%) sepia(5%) hue-rotate(180deg) opacity(.6) !important;
}
html[data-theme="light"] .cl-fbtn {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    color: #334155 !important;
}
html[data-theme="light"] .cl-fbtn svg { stroke: #64748b !important; }
html[data-theme="light"] .cl-fbtn.on,
html[data-theme="light"] .cl-fbtn:hover {
    border-color: #4f46e5 !important;
    color: #4f46e5 !important;
    background: rgba(79,70,229,.06) !important;
}
html[data-theme="light"] .cl-vb {
    background: #ffffff !important;
    border-color: #dde3ec !important;
}
html[data-theme="light"] .cl-vb img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(5%) hue-rotate(180deg) opacity(.6) !important;
}
html[data-theme="light"] .cl-vb.on,
html[data-theme="light"] .cl-vb:hover { border-color: #4f46e5 !important; }
html[data-theme="light"] .cl-chips { background: #f1f5f9 !important; border-bottom-color: #dde3ec !important; }
html[data-theme="light"] .cl-fpanel-inner { background: #f8fafc !important; border-bottom-color: #dde3ec !important; }
html[data-theme="light"] .cl-cat {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    color: #334155 !important;
}
html[data-theme="light"] .cl-cat:hover { border-color: rgba(79,70,229,.3) !important; color: #4f46e5 !important; }
html[data-theme="light"] .cl-cat.active {
    background: rgba(79,70,229,.08) !important;
    border-color: rgba(79,70,229,.3) !important;
    color: #4f46e5 !important;
}
html[data-theme="light"] .cl-price-f {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    color: #0f172a !important;
}
html[data-theme="light"] .cl-hero {
    background: linear-gradient(135deg, rgba(79,70,229,.08) 0%, transparent 60%), #f8fafc !important;
    border-bottom-color: #dde3ec !important;
}
html[data-theme="light"] .cl-hero-title { color: #0f172a !important; }
html[data-theme="light"] .cl-hero-count {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    color: #64748b !important;
}
html[data-theme="light"] .cl-hero-tag { background: rgba(79,70,229,.08) !important; }
html[data-theme="light"] .cl-card {
    background: #ffffff !important;
    border-color: #dde3ec !important;
}
html[data-theme="light"] .cl-card-body { background: #ffffff !important; }
html[data-theme="light"] .cl-card-name { color: #0f172a !important; }
html[data-theme="light"] .cl-card-store { color: #4f46e5 !important; }

/* ── Wish (cœur favori) ── */
html[data-theme="light"] .cl-wish {
    background: rgba(255,255,255,.85) !important;
    border-color: #dde3ec !important;
}
html[data-theme="light"] .cl-wish svg { stroke: #64748b; }

/* ── Icônes SVG dans les boutons/images ── */
/* Override global : toutes images d'icônes en mode clair */
html[data-theme="light"] img[src*="/icons/"] {
    filter: brightness(0) saturate(100%) invert(35%) sepia(8%) hue-rotate(175deg) opacity(.75) !important;
}
/* Icônes dans boutons colorés → restent blanches */
html[data-theme="light"] .btn-auth img[src*="/icons/"],
html[data-theme="light"] .cl-card-cta img[src*="/icons/"],
html[data-theme="light"] .drawer-btn-login img[src*="/icons/"],
html[data-theme="light"] .search-btn img[src*="/icons/"],
html[data-theme="light"] a[class*="register"] img[src*="/icons/"] {
    filter: brightness(0) invert(1) !important;
}
/* Logo jamais filtré */
html[data-theme="light"] img[src*="logo"],
html[data-theme="light"] img[src*="avatar"],
html[data-theme="light"] img[src*="/uploads/"],
html[data-theme="light"] .logo-img {
    filter: none !important;
}
/* Icônes SVG dans drawer */
html[data-theme="light"] .mn-link img[src*="/icons/"],
html[data-theme="light"] .dm-link img[src*="/icons/"] {
    filter: brightness(0) saturate(100%) invert(55%) sepia(5%) hue-rotate(180deg) opacity(.7) !important;
}
html[data-theme="light"] .mn-link:hover img[src*="/icons/"],
html[data-theme="light"] .dm-link:hover img[src*="/icons/"] {
    filter: brightness(0) saturate(100%) invert(28%) sepia(80%) saturate(600%) hue-rotate(224deg) opacity(.9) !important;
}

/* ══════════════════════════════════════════════════════
   DRAWER MOBILE — Mode clair
   ══════════════════════════════════════════════════════ */

/* Fond blanc — override du gradient hardcodé */
html[data-theme="light"] .mobile-nav {
    background: #ffffff !important;
    border-right-color: #dde3ec !important;
    box-shadow: 4px 0 32px rgba(0,0,0,.1) !important;
}

/* Header */
html[data-theme="light"] .drawer-header {
    background: #ffffff;
    border-bottom-color: #f1f5f9;
}
html[data-theme="light"] .drawer-logo-text { color: #0f172a; }
html[data-theme="light"] .drawer-logo-text em { color: #f59e0b; }

/* Bouton fermer */
html[data-theme="light"] .drawer-close {
    background: #f1f5f9;
    border-color: #dde3ec;
    color: #64748b;
}
html[data-theme="light"] .drawer-close svg { stroke: #64748b; }
html[data-theme="light"] .drawer-close:hover {
    background: rgba(220,38,38,.07);
    border-color: rgba(220,38,38,.2);
    color: #dc2626;
}
html[data-theme="light"] .drawer-close:hover svg { stroke: #dc2626; }

/* Recherche */
html[data-theme="light"] .drawer-search .search-input {
    background: #f1f5f9 !important;
    border-color: #dde3ec !important;
    color: #0f172a !important;
}
html[data-theme="light"] .drawer-search .search-input::placeholder { color: #94a3b8 !important; }

/* Carte utilisateur */
html[data-theme="light"] .drawer-user-card {
    background: #f8fafc;
    border-color: #dde3ec;
}
html[data-theme="light"] .drawer-user-name { color: #0f172a; }
html[data-theme="light"] .drawer-user-role { color: #64748b; }

/* Boutons connexion */
html[data-theme="light"] .drawer-btn-login {
    background: #4f46e5 !important;
    color: #fff !important;
}
html[data-theme="light"] .drawer-btn-login:hover {
    background: #3730a3 !important;
}
html[data-theme="light"] .drawer-btn-register {
    background: #ffffff;
    border-color: #dde3ec;
    color: #334155;
}
html[data-theme="light"] .drawer-btn-register:hover {
    border-color: #4f46e5;
    color: #4f46e5;
}

/* Corps du drawer */
html[data-theme="light"] .drawer-body { background: #ffffff; }
html[data-theme="light"] .drawer-section-title { color: #94a3b8; }
html[data-theme="light"] .drawer-divider {
    background: linear-gradient(90deg, transparent, #e2e8f0, transparent);
}

/* Liens du menu */
html[data-theme="light"] .mn-link {
    color: #334155 !important;
}
html[data-theme="light"] .mn-link svg { stroke: #94a3b8 !important; }
html[data-theme="light"] .mn-link:hover {
    background: #f1f5f9 !important;
    color: #4f46e5 !important;
}
html[data-theme="light"] .mn-link:hover svg { stroke: #4f46e5 !important; }
html[data-theme="light"] .mn-link.active {
    background: rgba(79,70,229,.07) !important;
    color: #4f46e5 !important;
    border-left-color: #4f46e5 !important;
}
html[data-theme="light"] .mn-link.danger { color: #dc2626 !important; }
html[data-theme="light"] .mn-link.danger svg { stroke: #dc2626 !important; }

/* Footer */
html[data-theme="light"] .drawer-footer {
    background: #ffffff;
    border-top-color: #f1f5f9;
    color: #94a3b8;
}

/* Overlay */
html[data-theme="light"] .drawer-overlay {
    background: rgba(15,23,42,.35);
}

/* Icônes dans les liens */
html[data-theme="light"] .mn-link img {
    filter: brightness(0) saturate(100%) invert(55%) sepia(5%) hue-rotate(180deg) opacity(.7) !important;
}
html[data-theme="light"] .mn-link:hover img {
    filter: brightness(0) saturate(100%) invert(28%) sepia(80%) saturate(600%) hue-rotate(224deg) opacity(.9) !important;
}
html[data-theme="light"] .drawer-btn-login img {
    filter: brightness(0) invert(1) !important;
}

/* ══ Flash Sale — classes CSS (remplacent les styles inline de home.php) ══ */

/* Mode sombre (défaut) */
.flash-section-wrap{padding:0 0 8px;background:linear-gradient(135deg,#1a0a00,#0f0f1a)}
.flash-card{flex-shrink:0;width:150px;background:#111827;border:1px solid #1f2937;border-radius:12px;overflow:hidden;text-decoration:none;display:block;transition:transform .2s,border-color .2s}
.flash-card:hover{transform:translateY(-3px);border-color:rgba(245,158,11,.4)}
.flash-card-body{padding:8px 10px}
.flash-store{font-size:.7rem;font-weight:800;color:#f59e0b;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flash-name{font-size:.78rem;font-weight:600;color:#e2e8f0;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px}
.flash-old{font-size:.68rem;color:#6b7280;text-decoration:line-through;margin-bottom:1px}
.flash-price{font-size:.88rem;font-weight:900;color:#fbbf24}

/* Mode clair */
[data-theme="light"] .flash-section-wrap{background:#f8fafc!important;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}
[data-theme="light"] .flash-card{background:#ffffff!important;border-color:#dde3ec!important;box-shadow:0 1px 6px rgba(0,0,0,.05)}
[data-theme="light"] .flash-card:hover{border-color:rgba(79,70,229,.3)!important;box-shadow:0 6px 20px rgba(79,70,229,.1)!important}
[data-theme="light"] .flash-store{color:#4f46e5!important}
[data-theme="light"] .flash-name{color:#0f172a!important}
[data-theme="light"] .flash-old{color:#94a3b8!important}
[data-theme="light"] .flash-price{color:#d97706!important}

/* ══ Catégories — fond icône mode clair ══ */
[data-theme="light"] .cat-icon-bg{--cat-bg:#eef2ff;background:#eef2ff!important}
[data-theme="light"] .cat-icon-bg img{filter:brightness(0) saturate(100%) invert(28%) sepia(80%) saturate(600%) hue-rotate(224deg) opacity(.8)!important}

/* ══════════════════════════════════════════════════════════════
   THEME.CSS — PATCH PANELS COMPLET v7.0
   Correction : variables --pa-* et --sa-* manquantes en mode clair
   Cause du bug : sidebar "transparente" + fonds blancs sur dashboards
   ══════════════════════════════════════════════════════════════ */

html[data-theme="light"] {

    /* ── Variables Super Admin (sa-*) ── */
    --sa-bg:       #f0f4f8;
    --sa-sur:      #e8edf3;   /* sidebar distincte du fond */
    --sa-card:     #ffffff;
    --sa-card2:    #f8fafc;
    --sa-brd:      #dde3ec;
    --sa-brd2:     #c7d0dc;
    --sa-gold:     #d97706;
    --sa-gold2:    #b45309;
    --sa-gold-bg:  rgba(217,119,6,.1);
    --sa-acc:      #4f46e5;
    --sa-acc2:     #6366f1;
    --sa-ok:       #16a34a;
    --sa-err:      #dc2626;
    --sa-warn:     #d97706;
    --sa-tx:       #0f172a;
    --sa-tx2:      #334155;
    --sa-tx3:      #64748b;
    --sa-shadow:   0 2px 16px rgba(0,0,0,.08);

    /* ── Variables Panel Admin/Vendeur/Client (pa-*) ── */
    --pa-bg:       #f0f4f8;
    --pa-sur:      #e8edf3;   /* sidebar distincte du fond */
    --pa-card:     #ffffff;
    --pa-card2:    #f8fafc;
    --pa-brd:      #dde3ec;
    --pa-brd2:     #c7d0dc;
    --pa-gold:     #d97706;
    --pa-gold2:    #b45309;
    --pa-gold-bg:  rgba(217,119,6,.1);
    --pa-acc:      #4f46e5;
    --pa-acc2:     #6366f1;
    --pa-ok:       #16a34a;
    --pa-err:      #dc2626;
    --pa-warn:     #d97706;
    --pa-tx:       #0f172a;
    --pa-tx2:      #334155;
    --pa-tx3:      #64748b;
    --pa-shadow:   0 2px 16px rgba(0,0,0,.08);
}

/* ─────────────────────────────────────────────────────────────
   CORPS DES PAGES PANEL — fond légèrement coloré
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .pa-body,
html[data-theme="light"] .pa-body-grid { background: #f0f4f8; color: #0f172a; }

html[data-theme="light"] .sa-body,
html[data-theme="light"] .sa-body-grid { background: #f0f4f8; color: #0f172a; }

html[data-theme="light"] .admin-body   { background: #f0f4f8 !important; color: #0f172a; }
html[data-theme="light"] .vendor-body  { background: #f0f4f8 !important; color: #0f172a; }
html[data-theme="light"] .customer-body { background: #f0f4f8 !important; color: #0f172a; }
html[data-theme="light"] .delivery-body { background: #f0f4f8 !important; color: #0f172a; }

/* ─────────────────────────────────────────────────────────────
   SIDEBAR — fond distinct du corps pour être visible
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-sidebar {
    background: #1e293b !important;   /* Sidebar reste SOMBRE en mode clair */
    border-right-color: #334155 !important;
    box-shadow: 4px 0 24px rgba(0,0,0,.12) !important;
}
html[data-theme="light"] .pa-sidebar {
    background: #1e293b !important;   /* Sidebar reste SOMBRE en mode clair */
    border-right-color: #334155 !important;
    box-shadow: 4px 0 24px rgba(0,0,0,.12) !important;
}
html[data-theme="light"] .admin-sidebar  { background: #1e293b !important; border-right-color: #334155 !important; }
html[data-theme="light"] .vendor-sidebar { background: #1e293b !important; border-right-color: #334155 !important; }

/* ── Textes et liens dans la sidebar sombre (mode clair) ── */
html[data-theme="light"] .sa-sidebar .sa-logo-text,
html[data-theme="light"] .pa-sidebar .pa-logo-text,
html[data-theme="light"] .pa-sidebar .vendor-logo-text,
html[data-theme="light"] .pa-sidebar .admin-logo-text { color: #f1f5f9 !important; }

html[data-theme="light"] .sa-sidebar .sa-logo-text em,
html[data-theme="light"] .pa-sidebar .pa-logo-text em,
html[data-theme="light"] .pa-sidebar .vendor-logo-text em { color: #f59e0b !important; }

html[data-theme="light"] .sa-sidebar .sa-link,
html[data-theme="light"] .pa-sidebar .pa-link,
html[data-theme="light"] .pa-sidebar .as-link,
html[data-theme="light"] .pa-sidebar .vendor-link { color: #94a3b8 !important; }

html[data-theme="light"] .sa-sidebar .sa-link:hover,
html[data-theme="light"] .sa-sidebar .sa-link.active,
html[data-theme="light"] .pa-sidebar .pa-link:hover,
html[data-theme="light"] .pa-sidebar .pa-link.active,
html[data-theme="light"] .pa-sidebar .as-link:hover,
html[data-theme="light"] .pa-sidebar .as-link.active,
html[data-theme="light"] .pa-sidebar .vendor-link:hover,
html[data-theme="light"] .pa-sidebar .vendor-link.active {
    background: rgba(248,250,252,.1) !important;
    color: #f8fafc !important;
    border-left-color: #f59e0b !important;
}

html[data-theme="light"] .sa-sidebar .sa-nav-title,
html[data-theme="light"] .pa-sidebar .pa-nav-title,
html[data-theme="light"] .pa-sidebar .pa-nav-label { color: #64748b !important; }

html[data-theme="light"] .sa-sidebar .sa-logout,
html[data-theme="light"] .pa-sidebar .pa-logout,
html[data-theme="light"] .pa-sidebar .vh-logout { color: #fca5a5 !important; }

html[data-theme="light"] .sa-sidebar .sa-logout:hover,
html[data-theme="light"] .pa-sidebar .pa-logout:hover { background: rgba(220,38,38,.15) !important; }

/* Utilisateur en bas de sidebar */
html[data-theme="light"] .sa-sidebar .sa-user-box,
html[data-theme="light"] .pa-sidebar .pa-user-box {
    background: rgba(255,255,255,.06) !important;
    border-top-color: rgba(255,255,255,.1) !important;
}
html[data-theme="light"] .sa-sidebar .sa-user-name,
html[data-theme="light"] .pa-sidebar .pa-user-name { color: #f1f5f9 !important; }
html[data-theme="light"] .sa-sidebar .sa-user-role,
html[data-theme="light"] .pa-sidebar .pa-user-role { color: #94a3b8 !important; }

/* Logout dans sidebar */
html[data-theme="light"] .sa-sidebar .sa-link.danger,
html[data-theme="light"] .pa-sidebar .pa-link.danger { color: #fca5a5 !important; }
html[data-theme="light"] .sa-sidebar .sa-link.danger:hover,
html[data-theme="light"] .pa-sidebar .pa-link.danger:hover { background: rgba(220,38,38,.15) !important; color: #fca5a5 !important; }

/* Barre décorative en haut de sidebar */
html[data-theme="light"] .sa-sidebar::before,
html[data-theme="light"] .pa-sidebar::before { opacity: 1 !important; }

/* Scrollbar sidebar mode clair */
html[data-theme="light"] .sa-sidebar::-webkit-scrollbar-track,
html[data-theme="light"] .pa-sidebar::-webkit-scrollbar-track { background: rgba(255,255,255,.05); }
html[data-theme="light"] .sa-sidebar::-webkit-scrollbar-thumb,
html[data-theme="light"] .pa-sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); }

/* ─────────────────────────────────────────────────────────────
   TOPBAR PANEL — fond clair avec ombre
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-topbar,
html[data-theme="light"] .pa-topbar,
html[data-theme="light"] .vendor-topbar,
html[data-theme="light"] .admin-topbar {
    background: #ffffff !important;
    border-bottom-color: #dde3ec !important;
    box-shadow: 0 1px 8px rgba(0,0,0,.07) !important;
}
html[data-theme="light"] .sa-topbar-title,
html[data-theme="light"] .pa-topbar-title { color: #0f172a !important; }
html[data-theme="light"] .sa-topbar-sub,
html[data-theme="light"] .pa-topbar-sub   { color: #64748b !important; }
html[data-theme="light"] .sa-burger,
html[data-theme="light"] .pa-burger { color: #334155 !important; border-color: #dde3ec !important; background: #f8fafc !important; }
html[data-theme="light"] .sa-burger:hover,
html[data-theme="light"] .pa-burger:hover { background: #f1f5f9 !important; border-color: #c7d0dc !important; }

/* ─────────────────────────────────────────────────────────────
   TOPBAR MOBILE (bottom nav) — super admin
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-mobile-nav,
html[data-theme="light"] .pa-mobile-nav {
    background: #ffffff !important;
    border-top-color: #dde3ec !important;
    box-shadow: 0 -2px 12px rgba(0,0,0,.07) !important;
}
html[data-theme="light"] .sa-mobile-nav a,
html[data-theme="light"] .pa-mobile-nav a { color: #64748b !important; }
html[data-theme="light"] .sa-mobile-nav a.active,
html[data-theme="light"] .pa-mobile-nav a.active { color: #d97706 !important; }

/* ─────────────────────────────────────────────────────────────
   OVERLAY / BACKDROP sidebar mobile
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-overlay,
html[data-theme="light"] .pa-overlay { background: rgba(0,0,0,.4) !important; }

/* ─────────────────────────────────────────────────────────────
   CARTES sa-card et pa-card — fond blanc sur fond gris
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-card,
html[data-theme="light"] .pa-card {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    box-shadow: 0 1px 6px rgba(0,0,0,.05) !important;
}
html[data-theme="light"] .sa-card-header,
html[data-theme="light"] .pa-card-header { background: #ffffff !important; border-bottom-color: #f1f5f9 !important; }
html[data-theme="light"] .sa-card-title,
html[data-theme="light"] .pa-card-title  { color: #0f172a !important; }
html[data-theme="light"] .sa-card-body,
html[data-theme="light"] .pa-card-body   { background: #ffffff !important; color: #334155 !important; }
html[data-theme="light"] .sa-card-link,
html[data-theme="light"] .pa-card-link   { color: #4f46e5 !important; }
html[data-theme="light"] .sa-card-link:hover,
html[data-theme="light"] .pa-card-link:hover { color: #3730a3 !important; }
html[data-theme="light"] .sa-info-row,
html[data-theme="light"] .pa-info-row    { border-bottom-color: #f1f5f9 !important; color: #334155 !important; }

/* ─────────────────────────────────────────────────────────────
   KPI CARDS
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-kpi,
html[data-theme="light"] .pa-kpi {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    box-shadow: 0 1px 6px rgba(0,0,0,.05) !important;
}
html[data-theme="light"] .sa-kpi-val,  html[data-theme="light"] .pa-kpi-val  { color: #0f172a !important; }
html[data-theme="light"] .sa-kpi-lbl,  html[data-theme="light"] .pa-kpi-lbl  { color: #64748b !important; }
html[data-theme="light"] .sa-kpi-sub,  html[data-theme="light"] .pa-kpi-sub  { color: #94a3b8 !important; }

/* Icônes KPI */
html[data-theme="light"] .kpi-gold   .sa-kpi-icon, html[data-theme="light"] .kpi-gold   .pa-kpi-icon { background: rgba(217,119,6,.1) !important; }
html[data-theme="light"] .kpi-indigo .sa-kpi-icon, html[data-theme="light"] .kpi-indigo .pa-kpi-icon { background: rgba(79,70,229,.1) !important; }
html[data-theme="light"] .kpi-green  .sa-kpi-icon, html[data-theme="light"] .kpi-green  .pa-kpi-icon { background: rgba(22,163,74,.1) !important; }
html[data-theme="light"] .kpi-teal   .sa-kpi-icon, html[data-theme="light"] .kpi-teal   .pa-kpi-icon { background: rgba(20,184,166,.1) !important; }
html[data-theme="light"] .kpi-purple .sa-kpi-icon, html[data-theme="light"] .kpi-purple .pa-kpi-icon { background: rgba(139,92,246,.1) !important; }
html[data-theme="light"] .kpi-red    .sa-kpi-icon, html[data-theme="light"] .kpi-red    .pa-kpi-icon { background: rgba(220,38,38,.1) !important; }
html[data-theme="light"] .kpi-cyan   .sa-kpi-icon, html[data-theme="light"] .kpi-cyan   .pa-kpi-icon { background: rgba(6,182,212,.1) !important; }
html[data-theme="light"] .kpi-orange .sa-kpi-icon, html[data-theme="light"] .kpi-orange .pa-kpi-icon { background: rgba(249,115,22,.1) !important; }

/* ─────────────────────────────────────────────────────────────
   TABLEAUX dans les panels
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-table th,
html[data-theme="light"] .pa-table th,
html[data-theme="light"] .admin-table th,
html[data-theme="light"] .orders-table th,
html[data-theme="light"] .vendor-table th { background: #f8fafc !important; color: #64748b !important; border-color: #dde3ec !important; }
html[data-theme="light"] .sa-table td,
html[data-theme="light"] .pa-table td,
html[data-theme="light"] .admin-table td,
html[data-theme="light"] .orders-table td,
html[data-theme="light"] .vendor-table td { border-color: #f1f5f9 !important; color: #334155 !important; background: #ffffff !important; }
html[data-theme="light"] .sa-table tr:hover td,
html[data-theme="light"] .pa-table tr:hover td,
html[data-theme="light"] .admin-table tr:hover td,
html[data-theme="light"] .orders-table tr:hover td,
html[data-theme="light"] .vendor-table tr:hover td { background: #fafbff !important; }

/* ─────────────────────────────────────────────────────────────
   QUICK ACTIONS (sa-qa / pa-qa)
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-qa,
html[data-theme="light"] .pa-qa { background: #ffffff !important; border-color: #dde3ec !important; color: #334155 !important; }
html[data-theme="light"] .sa-qa:hover,
html[data-theme="light"] .pa-qa:hover { background: #f8fafc !important; border-color: #c7d0dc !important; }
html[data-theme="light"] .sa-qa-gold,   html[data-theme="light"] .pa-qa-gold   { background: rgba(217,119,6,.07) !important;  color: #92400e !important; border-color: rgba(217,119,6,.25) !important; }
html[data-theme="light"] .sa-qa-indigo, html[data-theme="light"] .pa-qa-indigo { background: rgba(79,70,229,.07) !important;  color: #3730a3 !important; border-color: rgba(79,70,229,.25) !important; }
html[data-theme="light"] .sa-qa-green,  html[data-theme="light"] .pa-qa-green  { background: rgba(22,163,74,.07) !important;  color: #166534 !important; border-color: rgba(22,163,74,.25) !important; }
html[data-theme="light"] .sa-qa-red,    html[data-theme="light"] .pa-qa-red    { background: rgba(220,38,38,.07) !important;  color: #991b1b !important; border-color: rgba(220,38,38,.25) !important; }
html[data-theme="light"] .sa-qa-purple, html[data-theme="light"] .pa-qa-purple { background: rgba(139,92,246,.07) !important; color: #5b21b6 !important; border-color: rgba(139,92,246,.25) !important; }
html[data-theme="light"] .sa-qa-gray,   html[data-theme="light"] .pa-qa-gray   { background: #f8fafc !important;              color: #334155 !important; border-color: #dde3ec !important; }
html[data-theme="light"] .sa-qa-teal                                            { background: rgba(20,184,166,.07) !important; color: #0f766e !important; border-color: rgba(20,184,166,.25) !important; }
html[data-theme="light"] .sa-qa-cyan                                            { background: rgba(6,182,212,.07) !important;  color: #0e7490 !important; border-color: rgba(6,182,212,.25) !important; }
html[data-theme="light"] .sa-qa-orange                                          { background: rgba(249,115,22,.07) !important; color: #9a3412 !important; border-color: rgba(249,115,22,.25) !important; }

html[data-theme="light"] .sa-qa-gold:hover,   html[data-theme="light"] .pa-qa-gold:hover   { background: #d97706 !important; color: #fff !important; }
html[data-theme="light"] .sa-qa-indigo:hover, html[data-theme="light"] .pa-qa-indigo:hover { background: #4f46e5 !important; color: #fff !important; }
html[data-theme="light"] .sa-qa-green:hover,  html[data-theme="light"] .pa-qa-green:hover  { background: #16a34a !important; color: #fff !important; }
html[data-theme="light"] .sa-qa-red:hover,    html[data-theme="light"] .pa-qa-red:hover    { background: #dc2626 !important; color: #fff !important; }
html[data-theme="light"] .sa-qa-purple:hover, html[data-theme="light"] .pa-qa-purple:hover { background: #7c3aed !important; color: #fff !important; }

/* ─────────────────────────────────────────────────────────────
   PILLS / ALERTES / BADGES
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-pill.ok,   html[data-theme="light"] .pa-pill.ok   { background: rgba(22,163,74,.1) !important;  color: #16a34a !important; }
html[data-theme="light"] .sa-pill.warn, html[data-theme="light"] .pa-pill.warn { background: rgba(217,119,6,.1) !important;  color: #d97706 !important; }
html[data-theme="light"] .sa-pill.err,  html[data-theme="light"] .pa-pill.err  { background: rgba(220,38,38,.1) !important;  color: #dc2626 !important; }
html[data-theme="light"] .sa-pill.info, html[data-theme="light"] .pa-pill.info { background: rgba(79,70,229,.1) !important;  color: #4f46e5 !important; }
html[data-theme="light"] .sa-pill.gold, html[data-theme="light"] .pa-pill.gold { background: rgba(217,119,6,.1) !important;  color: #d97706 !important; }

html[data-theme="light"] .sa-alert,     html[data-theme="light"] .pa-alert     { background: rgba(22,163,74,.06) !important; border-color: rgba(22,163,74,.2) !important;  color: #166534 !important; }
html[data-theme="light"] .sa-alert.success, html[data-theme="light"] .pa-alert.success { background: rgba(22,163,74,.06) !important; border-color: rgba(22,163,74,.2) !important; color: #166534 !important; }
html[data-theme="light"] .sa-alert.error,   html[data-theme="light"] .pa-alert.error   { background: rgba(220,38,38,.06) !important; border-color: rgba(220,38,38,.2) !important; color: #991b1b !important; }

/* ─────────────────────────────────────────────────────────────
   INPUTS / FORMULAIRES dans panels
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .pa-input,
html[data-theme="light"] .sa-input,
html[data-theme="light"] .form-input,
html[data-theme="light"] .pa-select,
html[data-theme="light"] .sa-select,
html[data-theme="light"] .pa-textarea,
html[data-theme="light"] .sa-textarea {
    background: #f8fafc !important;
    border-color: #dde3ec !important;
    color: #0f172a !important;
}
html[data-theme="light"] .pa-input:focus,
html[data-theme="light"] .sa-input:focus,
html[data-theme="light"] .form-input:focus {
    border-color: #4f46e5 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(79,70,229,.1) !important;
}
html[data-theme="light"] .pa-input::placeholder,
html[data-theme="light"] .sa-input::placeholder,
html[data-theme="light"] .form-input::placeholder { color: #94a3b8 !important; }

/* ─────────────────────────────────────────────────────────────
   FILTRES / SEARCH dans les pages listes
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-filter-input,
html[data-theme="light"] .pa-filter-input,
html[data-theme="light"] .admin-search-input {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    color: #0f172a !important;
}
html[data-theme="light"] .sa-filter-select,
html[data-theme="light"] .pa-filter-select,
html[data-theme="light"] .admin-filter-select {
    background: #ffffff !important;
    border-color: #dde3ec !important;
    color: #0f172a !important;
}

/* ─────────────────────────────────────────────────────────────
   TEXTES GÉNÉRAUX dans pages admin/super admin
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-page-title,
html[data-theme="light"] .pa-page-title { color: #0f172a !important; }
html[data-theme="light"] .sa-page-sub,
html[data-theme="light"] .pa-page-sub   { color: #64748b !important; }
html[data-theme="light"] .sa-label,
html[data-theme="light"] .pa-label      { color: #334155 !important; }
html[data-theme="light"] .sa-muted,
html[data-theme="light"] .pa-muted      { color: #94a3b8 !important; }

/* ─────────────────────────────────────────────────────────────
   LOGS PAGE — couleurs spécifiques
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-log-table { background: #ffffff !important; border-color: #dde3ec !important; }
html[data-theme="light"] .sa-log-table th { background: #f8fafc !important; color: #64748b !important; border-color: #dde3ec !important; }
html[data-theme="light"] .sa-log-table td { border-color: #f1f5f9 !important; color: #334155 !important; background: #ffffff !important; }
html[data-theme="light"] .sa-log-badge { background: rgba(79,70,229,.1) !important; color: #4f46e5 !important; border: none !important; }

/* ─────────────────────────────────────────────────────────────
   ACTIONS DE MAINTENANCE
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-action-item { background: #ffffff !important; border-color: #dde3ec !important; }
html[data-theme="light"] .sa-action-item:hover { background: #f8fafc !important; }
html[data-theme="light"] .sa-action-title { color: #0f172a !important; }
html[data-theme="light"] .sa-action-desc  { color: #64748b !important; }
html[data-theme="light"] .sa-action-icon  { background: rgba(79,70,229,.1) !important; }

/* ─────────────────────────────────────────────────────────────
   SYSTÈME INFO — page paramètres
   ───────────────────────────────────────────────────────────── */
html[data-theme="light"] .sa-sys-row { border-bottom-color: #f1f5f9 !important; }
html[data-theme="light"] .sa-sys-key { color: #64748b !important; }
html[data-theme="light"] .sa-sys-val { color: #334155 !important; }
html[data-theme="light"] .sa-badge-green  { background: rgba(22,163,74,.1) !important;  color: #16a34a !important; }
html[data-theme="light"] .sa-badge-indigo { background: rgba(79,70,229,.1) !important;  color: #4f46e5 !important; }
html[data-theme="light"] .sa-badge-teal   { background: rgba(20,184,166,.1) !important; color: #0f766e !important; }
html[data-theme="light"] .sa-badge-gold   { background: rgba(217,119,6,.1) !important;  color: #d97706 !important; }