/* ==========================================================================
   Missebo — Direction "NUIT" (sombre premium)
   Reproduction de la maquette validee. Fondation + fiche produit.
   Scope : body:has(.mm-fiche) — n'affecte QUE la fiche produit pour l'instant,
   afin de ne pas casser les pages pas encore converties.
   Tokens exacts : encre #0E0F11, carte #15171A, jaune #FFC627.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');

body:has(#page-content.mm-fiche) {
    --n-fond: #0E0F11;
    --n-carte: #15171A;
    --n-carte2: #1B1E22;
    --n-or: #FFC627;
    --n-vert: #1D4B3C;
    --n-txt: #F2F3F4;
    --n-txt2: #C6CACE;
    --n-txt3: #8B9096;
    --n-trait: #22262B;
    background: var(--n-fond) !important;
    color: var(--n-txt);
}

/* ---------- Chrome (en-tete, pied) en sombre sur la fiche ---------------- */
body:has(#page-content.mm-fiche) .top-header { background:#000 !important; }
body:has(#page-content.mm-fiche) .header.header-1,
body:has(#page-content.mm-fiche) header .header {
    background: var(--n-fond) !important;
    border-bottom: 1px solid var(--n-trait) !important;
}
body:has(#page-content.mm-fiche) .site-nav .lvl1 > a,
body:has(#page-content.mm-fiche) .navigation .lvl1 > a { color: var(--n-txt) !important; }
body:has(#page-content.mm-fiche) .header .iconset,
body:has(#page-content.mm-fiche) .header svg { color: var(--n-txt) !important; }
body:has(#page-content.mm-fiche) .menubar-mobile {
    background: var(--n-carte) !important;
    border-top: 1px solid var(--n-trait) !important;
}
body:has(#page-content.mm-fiche) .menubar-item { color: var(--n-txt3) !important; }
body:has(#page-content.mm-fiche) .footer { background:#000 !important; }

/* ---------- FICHE PRODUIT "NUIT" ---------------------------------------- */
#page-content.mm-fiche {
    background: var(--n-fond) !important;
    color: var(--n-txt) !important;
    font-family: Archivo, Manrope, sans-serif !important;
}

/* Visuel : commandes rondes claires sur la photo */
#page-content.mm-fiche .mmf-rond {
    background: rgba(246,242,234,0.94) !important;
    color: #15130F !important;
}
#page-content.mm-fiche .mmf-badge {
    background: var(--n-or) !important;
    color: #15130F !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em;
}

/* Fil d'ariane */
#page-content.mm-fiche .mmf-fil {
    color: var(--n-txt3) !important;
    letter-spacing: 0.16em;
}

/* Titre en Space Grotesk */
#page-content.mm-fiche .mmf-titre {
    font-family: "Space Grotesk", sans-serif !important;
    font-weight: 700 !important;
    color: var(--n-txt) !important;
    font-size: clamp(1.5rem, 6vw, 1.75rem) !important;
}

/* Prix jaune, Space Grotesk */
#page-content.mm-fiche .mmf-prix {
    font-family: "Space Grotesk", sans-serif !important;
    color: var(--n-or) !important;
    font-weight: 700 !important;
}
#page-content.mm-fiche .mmf-prix-barre { color: var(--n-txt3) !important; }
#page-content.mm-fiche .mmf-mention { color: var(--n-txt3) !important; }

/* Cartes d'attributs : surfaces sombres */
#page-content.mm-fiche .mmf-carte {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    border-radius: 14px !important;
}
#page-content.mm-fiche .mmf-carte-lib {
    color: var(--n-txt3) !important;
    font-family: Manrope, sans-serif !important;
    letter-spacing: 0.14em;
}
#page-content.mm-fiche .mmf-carte-val {
    color: var(--n-txt) !important;
    font-family: Archivo, sans-serif !important;
    font-weight: 700 !important;
}
/* La carte "Etat" en jaune */
#page-content.mm-fiche .mmf-carte.mmf-carte-etat .mmf-carte-val { color: var(--n-or) !important; }

/* Carte vendeur */
#page-content.mm-fiche .mmf-vendeur {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
}
#page-content.mm-fiche .mmf-vendeur-pastille { background: var(--n-or) !important; color:#15130F !important; }
#page-content.mm-fiche .mmf-vendeur-txt strong { color: var(--n-txt) !important; }
#page-content.mm-fiche .mmf-vendeur-txt small { color: var(--n-txt3) !important; }
#page-content.mm-fiche .mmf-vendeur-txt ion-icon { color: var(--n-or) !important; }
#page-content.mm-fiche .mmf-vendeur-lien {
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
    background: transparent !important;
}
#page-content.mm-fiche .mmf-vendeur-lien:hover { background: var(--n-carte2) !important; }

/* Sous-titres et texte */
#page-content.mm-fiche .mmf-soustitre { color: var(--n-txt3) !important; letter-spacing: 0.14em; }
#page-content.mm-fiche .mmf-texte,
#page-content.mm-fiche .mmf-texte p { color: var(--n-txt2) !important; }

/* Puces paiement */
#page-content.mm-fiche .mmf-puce {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}

/* Bandeaux de garantie / encart : surfaces sombres */
#page-content.mm-fiche .mmf-garantie { background: var(--n-carte) !important; }
#page-content.mm-fiche .mmf-garantie strong { color: var(--n-txt) !important; }
#page-content.mm-fiche .mmf-garantie span { color: var(--n-txt3) !important; }
#page-content.mm-fiche .mmf-garantie ion-icon { color: var(--n-or) !important; }
#page-content.mm-fiche .mmf-encart {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
}
#page-content.mm-fiche .mmf-encart-tete ion-icon { color: var(--n-or) !important; }
#page-content.mm-fiche .mmf-liste li { border-bottom: 1px solid var(--n-trait) !important; color: var(--n-txt3) !important; }
#page-content.mm-fiche .mmf-val { color: var(--n-txt) !important; }

/* Avis */
#page-content.mm-fiche .mmf-avis { background: var(--n-carte) !important; border:1px solid var(--n-trait) !important; }
#page-content.mm-fiche .mmf-avis-note { color: var(--n-txt) !important; }
#page-content.mm-fiche .mmf-avis-etoiles { color: var(--n-or) !important; }
#page-content.mm-fiche .mmf-avis-txt { color: var(--n-txt3) !important; }

/* Barre d'achat fixe : fond sombre, bouton jaune */
#page-content.mm-fiche .mmf-barre {
    background: rgba(14,15,17,0.97) !important;
    border-top: 1px solid var(--n-trait) !important;
}
#page-content.mm-fiche .mmf-barre-coeur {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}
#page-content.mm-fiche .mmf-cta {
    background: var(--n-or) !important;
    color: #15130F !important;
    font-family: Archivo, sans-serif !important;
    font-weight: 700 !important;
}
#page-content.mm-fiche .mmf-cta:hover { background: #e6b31f !important; }

/* Pieces similaires : cartes sombres (les .mmc heritent, on force le fond) */
#page-content.mm-fiche .mmf-similaires .mmc { background: transparent !important; }
#page-content.mm-fiche .mmf-similaires .mmc-titre a { color: var(--n-txt) !important; }
#page-content.mm-fiche .mmf-similaires .mmc-meta { color: var(--n-txt3) !important; }
#page-content.mm-fiche .mmf-similaires .mmc-prix { color: var(--n-or) !important; }

/* ==========================================================================
   THÈME NUIT — GLOBAL (active par body.theme-nuit)
   Bascule tout le site en sombre. Composants partages : chrome, cartes,
   sections, boutons, formulaires.
   ========================================================================== */
body.theme-nuit {
    --n-fond: #0E0F11;
    --n-carte: #15171A;
    --n-carte2: #1B1E22;
    --n-or: #FFC627;
    --n-vert: #1D4B3C;
    --n-txt: #F2F3F4;
    --n-txt2: #C6CACE;
    --n-txt3: #8B9096;
    --n-trait: #22262B;
    background: var(--n-fond) !important;
    color: var(--n-txt);
    font-family: Archivo, Manrope, sans-serif;
}
body.theme-nuit .container, body.theme-nuit .container-fluid,
body.theme-nuit main, body.theme-nuit #page-content,
body.theme-nuit section, body.theme-nuit .section { background: transparent; }

/* ---- Bandeau haut + en-tete ---- */
body.theme-nuit .top-header { background:#000 !important; color:var(--n-txt2) !important; }
body.theme-nuit .top-header a, body.theme-nuit .top-header * { color:var(--n-txt2) !important; }
body.theme-nuit .header.header-1,
body.theme-nuit header, body.theme-nuit .header {
    background: var(--n-fond) !important;
    border-bottom: 1px solid var(--n-trait) !important;
    box-shadow: none !important;
}
body.theme-nuit .site-nav .lvl1 > a,
body.theme-nuit .navigation .lvl1 > a,
body.theme-nuit .header a { color: var(--n-txt) !important; }
body.theme-nuit .header .iconset, body.theme-nuit .header svg,
body.theme-nuit .header ion-icon { color: var(--n-txt) !important; }
body.theme-nuit .cart-count, body.theme-nuit .wishlist-count,
body.theme-nuit .header-cart .badge { background: var(--n-or) !important; color:#15130F !important; }

/* ---- Titre / fil de fer secondaires ---- */
body.theme-nuit .page-header { background: var(--n-carte) !important; }
body.theme-nuit .breadcrumbs, body.theme-nuit .breadcrumbs a { color: var(--n-txt3) !important; }
body.theme-nuit .breadcrumbs .main-title { color: var(--n-txt) !important; }

/* ---- Titres de section (Space Grotesk) ---- */
body.theme-nuit .section-header h2,
body.theme-nuit .section-header-left h2,
body.theme-nuit h1, body.theme-nuit h2, body.theme-nuit h3 {
    font-family: "Space Grotesk", sans-serif !important;
    color: var(--n-txt) !important;
}
body.theme-nuit .section-header p { color: var(--n-txt3) !important; }

/* ---- Cartes produit (.mmc) en sombre ---- */
body.theme-nuit .mmc { background: transparent !important; }
body.theme-nuit .mmc-visuel { background: var(--n-carte) !important; }
body.theme-nuit .mmc-meta { color: var(--n-txt3) !important; }
body.theme-nuit .mmc-titre a { color: var(--n-txt) !important; }
body.theme-nuit .mmc-titre a:hover { color: var(--n-or) !important; }
body.theme-nuit .mmc-prix { color: var(--n-or) !important; }
body.theme-nuit .mmc-prix-barre { color: var(--n-txt3) !important; }
body.theme-nuit .mmc-etiquette { background: var(--n-or) !important; color:#15130F !important; }
body.theme-nuit .mmc-etiquette.mmc-remise { background:#c0392b !important; color:#fff !important; }
body.theme-nuit .mmc-cta {
    background: transparent !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}
body.theme-nuit .mmc-cta:hover { background: var(--n-or) !important; color:#15130F !important; border-color:var(--n-or) !important; }
body.theme-nuit .mmc-coeur .btn-icon,
body.theme-nuit .mmc-coeur button, body.theme-nuit .mmc-coeur a {
    background: rgba(21,23,26,0.9) !important; color: var(--n-txt) !important;
}

/* ---- Cartes / blocs generiques ---- */
body.theme-nuit .card, body.theme-nuit .product-box,
body.theme-nuit .bg-block, body.theme-nuit .address-box {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}

/* ---- Boutons ---- */
body.theme-nuit .btn-primary, body.theme-nuit .cart-btn {
    background: var(--n-or) !important; border-color: var(--n-or) !important; color:#15130F !important;
}
body.theme-nuit .btn-secondary {
    background: transparent !important; border:1px solid var(--n-trait) !important; color: var(--n-txt) !important;
}
body.theme-nuit .btn-secondary:hover { background: var(--n-carte2) !important; }

/* ---- Formulaires ---- */
body.theme-nuit .form-control, body.theme-nuit .input-text,
body.theme-nuit select.form-select, body.theme-nuit input[type=text] {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}
body.theme-nuit .form-control::placeholder { color: var(--n-txt3) !important; }
body.theme-nuit .form-label { color: var(--n-txt2) !important; }

/* ---- Filtres catalogue ---- */
body.theme-nuit .filter-widget, body.theme-nuit .sidebar,
body.theme-nuit .filter-box { background: var(--n-carte) !important; border-color: var(--n-trait) !important; }

/* ---- Nav basse mobile ---- */
body.theme-nuit .menubar-mobile {
    background: var(--n-carte) !important;
    border-top: 1px solid var(--n-trait) !important;
}
body.theme-nuit .menubar-item { color: var(--n-txt3) !important; }
body.theme-nuit .menubar-item.active { color: var(--n-or) !important; }

/* ---- Pied de page ---- */
body.theme-nuit .footer { background:#000 !important; }
body.theme-nuit .footer h4 { color: var(--n-or) !important; }
body.theme-nuit .footer a { color: var(--n-txt2) !important; }
body.theme-nuit .footer a:hover { color: var(--n-or) !important; }

/* ---- Pagination ---- */
body.theme-nuit .pagination .page-link {
    background: var(--n-carte) !important; border-color: var(--n-trait) !important; color: var(--n-txt) !important;
}
body.theme-nuit .pagination .page-item.active .page-link {
    background: var(--n-or) !important; border-color: var(--n-or) !important; color:#15130F !important;
}

/* ---- Panier invite (rendu client) ---- */
body.theme-nuit #mm-guest-cart .cart-box .mm-gc-info .product-name { color: var(--n-txt) !important; }
body.theme-nuit #mm-guest-cart .cart-info,
body.theme-nuit #mm-guest-cart .cart-order-detail { background: var(--n-carte) !important; border-color: var(--n-trait) !important; }

/* ---- Contraste : textes qui restaient sombres sur fond noir ---- */
body.theme-nuit .category-title,
body.theme-nuit .ctg-title,
body.theme-nuit .collection-title,
body.theme-nuit .product-name,
body.theme-nuit .products-title,
body.theme-nuit p, body.theme-nuit span, body.theme-nuit li,
body.theme-nuit .text-dark, body.theme-nuit .text-muted {
    color: var(--n-txt2) !important;
}
body.theme-nuit .category-title, body.theme-nuit .ctg-title { color: var(--n-txt) !important; font-weight:600; }
/* garder les accents jaunes/verts existants */
body.theme-nuit .mmc-prix, body.theme-nuit .price-primary,
body.theme-nuit .text-primary, body.theme-nuit .money { color: var(--n-or) !important; }
body.theme-nuit .text-success, body.theme-nuit .badge-instock { color:#37b26a !important; }
/* liens de nav clairs */
body.theme-nuit .header .lvl1 > a, body.theme-nuit nav a { color: var(--n-txt) !important; }

/* ---- Selecteurs (tri, pagination) : fond sombre ---- */
body.theme-nuit select,
body.theme-nuit .nice-select,
body.theme-nuit .select-wrapper,
body.theme-nuit .sort-select,
body.theme-nuit .per-page-select,
body.theme-nuit .dropdown-toggle {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}
body.theme-nuit select option { background: var(--n-carte) !important; color: var(--n-txt) !important; }
body.theme-nuit .nice-select .list { background: var(--n-carte) !important; }
body.theme-nuit .nice-select .option { color: var(--n-txt) !important; }
body.theme-nuit .nice-select .option:hover,
body.theme-nuit .nice-select .option.selected { background: var(--n-carte2) !important; }
/* boutons vue grille/liste */
body.theme-nuit .view-mode a, body.theme-nuit .grid-list-toggle a { border-color: var(--n-trait) !important; color: var(--n-txt) !important; }

/* ==========================================================================
   NUIT — pages restantes (panier, checkout, compte, commandes, suivi)
   Surcharge les surfaces "verre clair" de missebo-checkout.css en sombre.
   ========================================================================== */

/* ---- Panier invite (rendu client) ---- */
body.theme-nuit #mm-guest-cart .cart-box,
body.theme-nuit #mm-guest-cart .cart-header { border-color: var(--n-trait) !important; color: var(--n-txt3) !important; }
body.theme-nuit #mm-guest-cart .mm-gc-info .product-name { color: var(--n-txt) !important; }
body.theme-nuit #mm-guest-cart .mm-gc-info .product-price { color: var(--n-or) !important; }
body.theme-nuit #mm-guest-cart .mm-gc-item.row { border-bottom-color: var(--n-trait) !important; }
body.theme-nuit #mm-guest-cart .qtyField { border-color: var(--n-trait) !important; }
body.theme-nuit #mm-guest-cart .qtyField .qtyBtn,
body.theme-nuit #mm-guest-cart .qtyField .qty { color: var(--n-txt) !important; }
body.theme-nuit #mm-guest-cart .mm-gc-remove { background: var(--n-carte) !important; border-color: var(--n-trait) !important; }
body.theme-nuit #mm-guest-cart .cart-info,
body.theme-nuit #mm-guest-cart .cart-order-detail {
    background: var(--n-carte) !important; border: 1px solid var(--n-trait) !important;
    backdrop-filter: none !important;
}
body.theme-nuit #mm-guest-cart .cart-total { color: var(--n-or) !important; }
body.theme-nuit #mm-guest-cart .cart-shipping,
body.theme-nuit #mm-guest-cart .mm-gc-note,
body.theme-nuit #mm-guest-cart .cart-subtotal-title { color: var(--n-txt3) !important; }
body.theme-nuit #mm-guest-cart .cart-subtotal-title strong { color: var(--n-txt) !important; }

/* ---- Panier / checkout serveur : neutraliser le verre clair ---- */
body.theme-nuit .cart-info.sidebar-sticky,
body.theme-nuit .order-summary,
body.theme-nuit .address-box,
body.theme-nuit .payment-accordion,
body.theme-nuit .cart-footer .cart-order-detail,
body.theme-nuit .cart-box,
body.theme-nuit .bg-block {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    backdrop-filter: none !important;
    color: var(--n-txt) !important;
    box-shadow: none !important;
}
body.theme-nuit .order-summary::before,
body.theme-nuit .cart-info.sidebar-sticky::before { display: none !important; }
body.theme-nuit .cart-row.cart-header { color: var(--n-txt3) !important; border-bottom-color: var(--n-trait) !important; }
body.theme-nuit .cart-box .row.border-bottom { border-bottom-color: var(--n-trait) !important; }
body.theme-nuit .cart-box .row.border-bottom:hover { background: rgba(255,198,39,0.05) !important; }
body.theme-nuit .cart-order-detail .cart-total,
body.theme-nuit .order-summary .grand-total,
body.theme-nuit .order-summary .total,
body.theme-nuit .cart-subtotal { color: var(--n-or) !important; }
body.theme-nuit .cart-shipping { color: var(--n-txt3) !important; }

/* Adresse selectionnee : anneau jaune */
body.theme-nuit .address-select-box { border-color: var(--n-trait) !important; }
body.theme-nuit .address-select-box.active,
body.theme-nuit .address-select-box:has(.address-radio:checked) {
    border-color: var(--n-or) !important;
    background: rgba(255,198,39,0.06) !important;
    box-shadow: 0 0 0 3px rgba(255,198,39,0.15) !important;
}
body.theme-nuit .address, body.theme-nuit .address-box .text-muted { color: var(--n-txt3) !important; }

/* Bouton commander : jaune plein (deja) + garantir contraste */
body.theme-nuit .btn.checkout, body.theme-nuit .btn-lg.checkout,
body.theme-nuit #place_order, body.theme-nuit .place-order-btn {
    background: var(--n-or) !important; color:#15130F !important; border:0 !important;
}

/* Onglets etapes panier (1 Panier / 2 Paiement / 3) */
body.theme-nuit .checkout-steps .step,
body.theme-nuit .step-indicator .step { color: var(--n-txt3) !important; }
body.theme-nuit .checkout-steps .step.active,
body.theme-nuit .step-indicator .step.active { color: var(--n-or) !important; }

/* ---- Compte / tableau de bord ---- */
body.theme-nuit .dashboard-content,
body.theme-nuit .account-sidebar,
body.theme-nuit .my-account-content,
body.theme-nuit .dashboard-card,
body.theme-nuit .account-menu,
body.theme-nuit .profile-card {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}
body.theme-nuit .account-menu a,
body.theme-nuit .dashboard-menu a { color: var(--n-txt2) !important; }
body.theme-nuit .account-menu a.active,
body.theme-nuit .account-menu a:hover { color: var(--n-or) !important; }

/* ---- Commandes (listing + details) ---- */
body.theme-nuit .order-card,
body.theme-nuit .order-listing-item,
body.theme-nuit .orders-list .order-item,
body.theme-nuit .order-detail-box,
body.theme-nuit .transaction-row {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
    box-shadow: none !important;
}
body.theme-nuit .order-status, body.theme-nuit .status-badge {
    background: rgba(255,198,39,0.12) !important; color: var(--n-or) !important;
    border: 1px solid rgba(255,198,39,0.3) !important;
}
body.theme-nuit .order-status.delivered,
body.theme-nuit .status-delivered { background: rgba(55,178,106,0.15) !important; color:#37b26a !important; border-color: rgba(55,178,106,0.35) !important; }

/* ---- Suivi de livraison : timeline ---- */
body.theme-nuit .tracking-timeline,
body.theme-nuit .delivery-tracking { background: var(--n-carte) !important; border:1px solid var(--n-trait) !important; }
body.theme-nuit .tracking-step .dot { background: var(--n-trait) !important; }
body.theme-nuit .tracking-step.done .dot,
body.theme-nuit .tracking-step.active .dot { background: var(--n-or) !important; }
body.theme-nuit .tracking-line { background: var(--n-trait) !important; }

/* ---- Modales (choix boutique, etc.) ---- */
body.theme-nuit .modal-content,
body.theme-nuit .newsletter-wrap,
body.theme-nuit .store-popup-box,
body.theme-nuit .modal-body { background: var(--n-fond) !important; color: var(--n-txt) !important; }
body.theme-nuit .modal-content h1, body.theme-nuit .modal-content h2,
body.theme-nuit .modal-content h6 { color: var(--n-txt) !important; }
body.theme-nuit .modal-content .text { color: var(--n-txt3) !important; }
body.theme-nuit .btn-close, body.theme-nuit .modal .close { filter: invert(1); }

/* ---- Divers : tableaux, hr, textes ---- */
body.theme-nuit table, body.theme-nuit th, body.theme-nuit td { color: var(--n-txt2) !important; border-color: var(--n-trait) !important; }
body.theme-nuit hr, body.theme-nuit .light-hr { border-color: var(--n-trait) !important; }
body.theme-nuit .text-primary { color: var(--n-or) !important; }
body.theme-nuit strong, body.theme-nuit b, body.theme-nuit h4, body.theme-nuit h5, body.theme-nuit h6 { color: var(--n-txt) !important; }

/* ---- Barre d'achat fixe fiche (deja Nuit via :has, renforcer sous theme-nuit) ---- */
body.theme-nuit .mmf-barre { background: rgba(14,15,17,0.97) !important; border-top-color: var(--n-trait) !important; }
body.theme-nuit .mmf-cta { background: var(--n-or) !important; color:#15130F !important; }

/* ---- Tous les champs de saisie (mot de passe, email, tel...) ---- */
body.theme-nuit input[type=password],
body.theme-nuit input[type=email],
body.theme-nuit input[type=tel],
body.theme-nuit input[type=number],
body.theme-nuit input[type=search],
body.theme-nuit input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),
body.theme-nuit textarea {
    background: var(--n-carte) !important;
    border: 1px solid var(--n-trait) !important;
    color: var(--n-txt) !important;
}
body.theme-nuit input::placeholder, body.theme-nuit textarea::placeholder { color: var(--n-txt3) !important; }
/* groupe telephone (react-phone) */
body.theme-nuit .react-tel-input .form-control,
body.theme-nuit .flag-dropdown,
body.theme-nuit .selected-flag { background: var(--n-carte) !important; border-color: var(--n-trait) !important; }
/* separateur OU */
body.theme-nuit .divider span, body.theme-nuit .or-divider,
body.theme-nuit .separator span { background: var(--n-fond) !important; color: var(--n-txt3) !important; }
/* liens secondaires lisibles */
body.theme-nuit .forgot-password, body.theme-nuit a.text-muted,
body.theme-nuit .signup-link, body.theme-nuit .register-link { color: var(--n-txt2) !important; }
body.theme-nuit .forgot-password:hover, body.theme-nuit .signup-link:hover { color: var(--n-or) !important; }
/* checkbox "se souvenir" visible */
body.theme-nuit input[type=checkbox] { accent-color: var(--n-or); }


/* Restaurer les boutons d'action jaunes (submit login, etc.) */
body.theme-nuit input[type=submit],
body.theme-nuit button[type=submit].btn-primary,
body.theme-nuit .login-btn, body.theme-nuit .signin-btn,
body.theme-nuit .btn.btn-primary[type=submit] {
    background: var(--n-or) !important; border-color: var(--n-or) !important; color:#15130F !important;
}
body.theme-nuit .btn-primary, body.theme-nuit button.btn-primary {
    background: var(--n-or) !important; border-color: var(--n-or) !important; color:#15130F !important;
}

/* ===== Pages Missebo : masquer les barres de l'ANCIEN en-tête (si présent),
   MAIS garder le modal de choix boutique fonctionnel. Le chrome Missebo (mmx-*)
   du headerMissebo n'est pas concerné par ces règles. ===== */
body:has(#mm-home-root) .site-header-wrap .top-header,
body:has(#mm-home-root) .site-header-wrap > div > header.header,
body:has(#mm-cat-root) .site-header-wrap .top-header,
body:has(#mm-cat-root) .site-header-wrap > div > header.header,
body:has(#mm-fiche-root) .site-header-wrap .top-header,
body:has(#mm-fiche-root) .site-header-wrap > div > header.header,
body:has(#mm-account-root) .site-header-wrap .top-header,
body:has(#mm-account-root) .site-header-wrap > div > header.header,
body:has(#mm-track-root) .site-header-wrap .top-header,
body:has(#mm-track-root) .site-header-wrap > div > header.header,
body:has([id^="mm-"][id$="-root"]) .site-header-wrap .top-header,
body:has([id^="mm-"][id$="-root"]) .site-header-wrap > div > header.header { display:none !important; }
/* Pied de page : masqué sur MOBILE pour les pages avec leur propre barre du bas,
   visible sur desktop (fonctionnalités du site : liens, contact, politiques). */
@media (max-width:899px){
  body:has(#mm-home-root) .site-footer-wrap,
  body:has(#mm-cat-root) .site-footer-wrap,
  body:has(#mm-fiche-root) .site-footer-wrap,
  body:has(#mm-account-root) .site-footer-wrap,
  body:has(#mm-track-root) .site-footer-wrap { display:none !important; }
}
/* Sur desktop, la barre mobile .menubar-mobile est déjà d-lg-none (Bootstrap). */
/* le wrapper d'en-tête reste affiché pour ne pas masquer le popup (enfant du wrapper) */
body:has(#mm-home-root) .site-header-wrap,
body:has(#mm-cat-root) .site-header-wrap,
body:has(#mm-fiche-root) .site-header-wrap,
body:has(#mm-account-root) .site-header-wrap,
body:has(#mm-track-root) .site-header-wrap,
body:has([id^="mm-"][id$="-root"]) .site-header-wrap { display:block !important; }
/* Fond sombre réservé au thème nuit. Sans « .theme-nuit », ces sélecteurs (spécificité d'un
   identifiant) l'emportaient aussi sur body.theme-jour : en thème clair, les marges de part et
   d'autre du contenu restaient noires sur ordinateur. */
body.theme-nuit:has(#mm-home-root), body.theme-nuit:has(#mm-cat-root), body.theme-nuit:has(#mm-fiche-root),
body.theme-nuit:has(#mm-account-root), body.theme-nuit:has(#mm-track-root),
body.theme-nuit:has([id^="mm-"][id$="-root"]) { background:#0E0F11 !important; }

/* ===== Panier (restyle Nuit de la vue existante — mécanique inchangée) ===== */
body.theme-nuit .cart-box .table,
body.theme-nuit .cart-box thead { border:none !important; }
body.theme-nuit .cart-header { display:none !important; }
body.theme-nuit .cart-box .cart-row.cart-flex,
body.theme-nuit .cart-row.cart-flex {
    display:flex !important; align-items:center; gap:11px;
    background:#15171A !important; border:1px solid #22262B !important; border-radius:12px !important;
    padding:10px !important; margin-bottom:10px !important;
}
body.theme-nuit .cart-row.cart-flex td { border:none !important; padding:4px !important; background:transparent !important; }
body.theme-nuit .cart-row .cart-image img { width:62px !important; height:62px !important; border-radius:9px !important; object-fit:cover !important; }
body.theme-nuit .cart-row .list-view-item-title a { color:#F2F3F4 !important; font:600 13px/1.2 Archivo,sans-serif !important; }
body.theme-nuit .cart-row .cart-meta-text,
body.theme-nuit .cart-row .cart-meta-text * { color:#8B9096 !important; font-size:10px !important; }
body.theme-nuit .cart-row .cart-price .money,
body.theme-nuit .cart-row .cart-price .price { color:#FFC627 !important; font-weight:700 !important; }
body.theme-nuit .cart-row .qtyField,
body.theme-nuit .cart-row .qtyBtn { background:#1F2226 !important; border-color:#2A2E34 !important; color:#F2F3F4 !important; }
body.theme-nuit .cart-remove ion-icon,
body.theme-nuit .cart-remove { color:#8B9096 !important; }
/* Encart total */
body.theme-nuit .cart-footer .cart-info,
body.theme-nuit .cart-order-detail {
    background:#15171A !important; border:1px solid #22262B !important; border-radius:13px !important; padding:16px !important;
}
body.theme-nuit .cart-subtotal .money,
body.theme-nuit .cart-subtotal b { color:#FFC627 !important; }
body.theme-nuit .cart-shipping { color:#6C7278 !important; font-size:10.5px !important; }
body.theme-nuit .cart-info .checkout,
body.theme-nuit a#cartCheckout,
body.theme-nuit #mm-guest-cart .checkout {
    background:#FFC627 !important; border:none !important; color:#15130F !important;
    font:700 13px/1 Archivo,sans-serif !important; border-radius:10px !important; padding:16px 0 !important;
}
/* ----- Panier invité (rendu par missebo-cart-guest.js) ----- */
body.theme-nuit #mm-guest-cart .cart-row.cart-header {
    color:#6C7278 !important; font:600 9.5px/1 Archivo,sans-serif !important; letter-spacing:.06em;
    text-transform:uppercase; border:none !important; padding:4px 2px 12px !important; background:transparent !important;
}
body.theme-nuit .mm-gc-item {
    display:flex !important; align-items:center; gap:11px; margin:0 0 10px 0 !important;
    background:#15171A !important; border:1px solid #22262B !important; border-radius:12px !important;
    padding:10px !important;
}
body.theme-nuit .mm-gc-img{width:62px;height:62px;border-radius:9px;overflow:hidden;background:#1F2226;flex:none;display:block}
body.theme-nuit .mm-gc-img img{width:100%;height:100%;object-fit:cover;display:block}
body.theme-nuit .mm-gc-info{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0}
body.theme-nuit .mm-gc-info .product-name{color:#F2F3F4 !important;font:600 13px/1.2 Archivo,sans-serif !important;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.theme-nuit .mm-gc-info .product-price{color:#FFC627 !important;font:700 13px/1 'Space Grotesk',sans-serif !important}
body.theme-nuit .mm-gc-actions{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:8px;flex:none}
/* Friperie : pièces uniques → pas de stepper de quantité, on garde juste "Retirer" */
body.theme-nuit .mm-gc-qty{display:none !important}
body.theme-nuit .mm-gc-remove{background:none !important;border:none !important;color:#8B9096 !important;font:500 10.5px/1 Archivo,sans-serif !important;display:flex;align-items:center;gap:4px;cursor:pointer;padding:6px 4px !important}
body.theme-nuit .mm-gc-remove ion-icon{font-size:14px}
body.theme-nuit .mm-gc-remove::after{content:"Retirer"}
body.theme-nuit .mm-gc-note{color:#6C7278 !important;font-size:10px !important;text-align:center;margin-top:6px}

/* ===== Checkout (restyle Nuit de la vue existante — logique paiement inchangée) ===== */
body.theme-nuit .shipping-address .address-box,
body.theme-nuit .address-select-box,
body.theme-nuit .payment-accordion,
body.theme-nuit .block.payment-methods,
body.theme-nuit .order-summary .cart-info {
    background:#15171A !important; border:1px solid #22262B !important; border-radius:12px !important;
}
body.theme-nuit .address-select-box.active,
body.theme-nuit .payment-accordion.active,
body.theme-nuit .payment-accordion:has(input:checked) {
    background:#1A1D21 !important; border-color:#FFC627 !important;
}
body.theme-nuit .shipping-address h2,
body.theme-nuit .payment-methods h2,
body.theme-nuit .order-summary h2,
body.theme-nuit .block > .title,
body.theme-nuit .checkout-title { color:#F2F3F4 !important; }
body.theme-nuit .checkout .address,
body.theme-nuit .checkout .text-muted { color:#8B9096 !important; }
body.theme-nuit .payment-image img { background:#fff; border-radius:6px; padding:2px; }
body.theme-nuit .order-summary .cart-subtotal .money,
body.theme-nuit .order-summary .cart-subtotal b,
body.theme-nuit .grand-total .money,
body.theme-nuit .order-summary .text-primary { color:#FFC627 !important; }
body.theme-nuit #place_order_btn,
body.theme-nuit #place_order_btn.checkout {
    background:#FFC627 !important; border:none !important; color:#15130F !important;
    font:700 13px/1 Archivo,sans-serif !important; border-radius:10px !important; padding:16px 0 !important;
}

/* ===== Autofill Chrome : garder les champs sombres (connexion, inscription, checkout…) ===== */
body.theme-nuit input:-webkit-autofill,
body.theme-nuit input:-webkit-autofill:hover,
body.theme-nuit input:-webkit-autofill:focus,
body.theme-nuit input:-webkit-autofill:active,
body.theme-nuit textarea:-webkit-autofill,
body.theme-nuit select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #1F2226 inset !important;
    box-shadow: 0 0 0 1000px #1F2226 inset !important;
    -webkit-text-fill-color: #F2F3F4 !important;
    caret-color: #F2F3F4 !important;
    border: 1px solid #2A2E34 !important;
    border-radius: 10px !important;
}
/* intlTelInput (champ téléphone avec drapeau) en sombre */
body.theme-nuit .iti, body.theme-nuit .iti input, body.theme-nuit .iti__selected-flag {
    background: #1F2226 !important; color: #F2F3F4 !important;
}
body.theme-nuit .iti__country-list { background:#15171A !important; color:#F2F3F4 !important; border:1px solid #22262B !important; }
body.theme-nuit .iti__country.iti__highlight { background:#2A2E34 !important; }
body.theme-nuit .iti__dial-code { color:#8B9096 !important; }

/* ==========================================================================
   MODE JOUR (blanc) — activé par body.theme-jour (bascule mmxToggleTheme,
   persistée en localStorage, nuit par défaut). Même design, palette claire.
   ========================================================================== */
/* Bascule jour/nuit : icône soleil en mode nuit, lune en mode jour */
.mmx-theme-toggle{background:none;border:none;color:#C6CACE;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:4px 6px}
.mmx-theme-toggle:hover{color:#F2F3F4}
body.theme-nuit .mmx-theme-toggle .ico-moon{display:none}
body.theme-jour .mmx-theme-toggle .ico-sun{display:none}
body.theme-jour .mmx-theme-toggle{color:#6B7075}
body.theme-jour .mmx-theme-toggle:hover{color:#17181A}

/* Palette claire : on redéfinit les tokens partout où ils sont consommés */
body.theme-jour,
body.theme-jour .mmx,
body.theme-jour .mmx-choose,
body.theme-jour #mm-home-root, body.theme-jour #mm-cat-root, body.theme-jour #mm-fiche-root,
body.theme-jour #mm-account-root, body.theme-jour #mm-track-root, body.theme-jour #mm-cart-root,
body.theme-jour #mm-checkout-root, body.theme-jour #mm-orders-root, body.theme-jour #mm-seller-root,
body.theme-jour #mm-sellers-root, body.theme-jour #mm-login-root, body.theme-jour #mm-register-root,
body.theme-jour #mm-help-root, body.theme-jour #mm-fav-root, body.theme-jour #mm-status-root,
body.theme-jour [id^="mm-"][id$="-root"] {
    --n-encre:#F6F6F3; --n-fond:#F6F6F3;
    --n-carte:#FFFFFF; --n-carte2:#ECECE8;
    --n-tx:#17181A; --n-txt:#17181A;
    --n-tx2:#3F4348; --n-txt2:#3F4348;
    --n-tx3:#6B7075; --n-txt3:#6B7075;
    --n-tx4:#8A8F94;
    --n-bord:#E3E3DE; --n-trait:#E3E3DE; --n-bord2:#CBCBC4;
    --n-or:#FFC627; --n-or-tx:#8A6400;
}
body.theme-jour{background:#F6F6F3 !important;color:#17181A}
/* Chrome clair : bordures et surfaces codées en dur */
body.theme-jour .mmx{background:#F6F6F3;color:#17181A}
body.theme-jour .mmx-top,body.theme-jour .mmx-main,body.theme-jour .mmx-nav,body.theme-jour .mmx-mob{border-color:#E3E3DE}
body.theme-jour .mmx-top{color:#3F4348}
body.theme-jour .mmx-top a{color:#3F4348}
body.theme-jour .mmx-nav{background:#F6F6F3}
body.theme-jour .mmx-nav a{color:#3F4348}
body.theme-jour .mmx-nav a:hover{color:#17181A}
body.theme-jour .mmx-nav a.on{color:#8A6400;border-bottom-color:#FFC627}
body.theme-jour .mmx-toggle{background:#ECECE8;border-color:#E3E3DE}
body.theme-jour .mmx-toggle a{color:#6B7075}
body.theme-jour .mmx-toggle a.on{background:#FFFFFF;color:#17181A}
body.theme-jour .mmx-mob{background:#F6F6F3}
body.theme-jour .mmx-seg button{color:#8A8F94}
body.theme-jour .mmx-seg button.on{color:#8A6400}
body.theme-jour .mmx-vr{background:#CBCBC4}
body.theme-jour .mmx-badge{background:#FFC627;color:#17181A}
body.theme-jour .mmx-choose{background:#F6F6F3;color:#17181A}
body.theme-jour .mmx-ch-card{background:linear-gradient(160deg,#FFFFFF 0%,#F1F1EC 70%)}
body.theme-jour .mmx-ch-top,body.theme-jour .mmx-ch-head a{color:#3F4348}
body.theme-jour .mmx-ch-desc,body.theme-jour .mmx-ch-chip{color:#3F4348}
body.theme-jour .mmx-ch-eyebrow{color:#8A6400}
body.theme-jour .mmx-ch-btn.o{border-color:#CBCBC4;color:#17181A}
/* En mode jour, les overrides sombres globaux (body.theme-nuit …) ne s'appliquent
   plus : les pages partagées retrouvent le thème clair d'origine du site. */

/* ==========================================================================
   FINITION — polish global (loader, footer, mini-panier, toasts, selection,
   scrollbar, focus-visible, quickview). Sobre, lisible en nuit ET en jour.
   ========================================================================== */

/* ---------- 1) LOADER plein écran (.loading-state.screen du layout) ------- */
body.theme-nuit .loading-state.screen {
    background: #0E0F11 !important;
}
body.theme-nuit .loading-state .dot:before {
    background: #FFC627 !important;
}
body.theme-nuit .loading-state .dot:after {
    background: #000 !important;
    box-shadow: 0 0 1px #000 !important;
    opacity: .35;
}
body.theme-jour .loading-state.screen {
    background: #F6F6F3 !important;
}
body.theme-jour .loading-state .dot:before {
    background: #FFC627 !important;
}

/* ---------- 2) PIED DE PAGE sobre (desktop, les 2 modes) ------------------ */
/* Nuit : fond encre, motifs pointillés neutralisés, typo discrète */
body.theme-nuit .site-footer-wrap .footer { background: #0E0F11 !important; }
body.theme-nuit .site-footer-wrap .footer .footer-top {
    background: #0E0F11 !important;          /* écrase url(footer-dot.svg) */
    border-top: 1px solid #1B1E22 !important;
    color: #8B9096 !important;
}
body.theme-nuit .site-footer-wrap .footer .footer-top .h4 {
    color: #6C7278 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
}
body.theme-nuit .site-footer-wrap .footer-links a,
body.theme-nuit .site-footer-wrap .footer-contact a {
    color: #8B9096 !important;
    transition: color .18s ease;
}
body.theme-nuit .site-footer-wrap .footer-links a:hover,
body.theme-nuit .site-footer-wrap .footer-contact a:hover { color: #F2F3F4 !important; }
body.theme-nuit .site-footer-wrap .footer-contact p { color: #8B9096 !important; }
body.theme-nuit .site-footer-wrap .footer .social-icons li a,
body.theme-nuit .site-footer-wrap .footer .social-icons .icon {
    color: #8B9096 !important;
    transition: color .18s ease;
}
body.theme-nuit .site-footer-wrap .footer .social-icons li a:hover,
body.theme-nuit .site-footer-wrap .footer .social-icons li a:hover .icon { color: #F2F3F4 !important; }
body.theme-nuit .site-footer-wrap .footer hr.horizontal.light {
    border-color: #1B1E22 !important;
    opacity: 1;
}
body.theme-nuit .site-footer-wrap .footer .footer-bottom {
    background: #0E0F11 !important;
    color: #6C7278 !important;
    border-top: 1px solid #1B1E22 !important;
}
body.theme-nuit .site-footer-wrap .footer .payment-icons .icon { color: #6C7278 !important; }
/* Fond/bandeaux criards éventuels neutralisés (jaune primaire, newsletter) */
body.theme-nuit .site-footer-wrap .footer .footer-middle,
body.theme-nuit .site-footer-wrap .footer .newsletterbg {
    background: #0E0F11 !important;
    color: #8B9096 !important;
}
/* Jour : équivalent clair, même hiérarchie discrète */
body.theme-jour .site-footer-wrap .footer { background: #F6F6F3 !important; }
body.theme-jour .site-footer-wrap .footer .footer-top {
    background: #F6F6F3 !important;
    border-top: 1px solid #E3E3DE !important;
    color: #6B7075 !important;
}
body.theme-jour .site-footer-wrap .footer .footer-top .h4 {
    color: #8A8F94 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
}
body.theme-jour .site-footer-wrap .footer-links a,
body.theme-jour .site-footer-wrap .footer-contact a {
    color: #6B7075 !important;
    transition: color .18s ease;
}
body.theme-jour .site-footer-wrap .footer-links a:hover,
body.theme-jour .site-footer-wrap .footer-contact a:hover { color: #17181A !important; }
body.theme-jour .site-footer-wrap .footer-contact p { color: #6B7075 !important; }
body.theme-jour .site-footer-wrap .footer .social-icons li a,
body.theme-jour .site-footer-wrap .footer .social-icons .icon {
    color: #8A8F94 !important;
    transition: color .18s ease;
}
body.theme-jour .site-footer-wrap .footer .social-icons li a:hover,
body.theme-jour .site-footer-wrap .footer .social-icons li a:hover .icon { color: #17181A !important; }
body.theme-jour .site-footer-wrap .footer hr.horizontal.light {
    border-color: #E3E3DE !important;
    opacity: 1;
}
body.theme-jour .site-footer-wrap .footer .footer-bottom {
    background: #F6F6F3 !important;
    color: #8A8F94 !important;
    border-top: 1px solid #E3E3DE !important;
}
body.theme-jour .site-footer-wrap .footer .payment-icons .icon { color: #8A8F94 !important; }
body.theme-jour .site-footer-wrap .footer .footer-middle,
body.theme-jour .site-footer-wrap .footer .newsletterbg {
    background: #F6F6F3 !important;
    color: #6B7075 !important;
}

/* ---------- 3) MINI-PANIER offcanvas (#minicart-drawer) — nuit seulement -- */
body.theme-nuit #minicart-drawer {
    background: #15171A !important;
    color: #F2F3F4 !important;
    border-left: 1px solid #22262B;
}
body.theme-nuit #minicart-drawer .minicart-header {
    border-bottom: 1px solid #22262B !important;
    background: transparent !important;
}
body.theme-nuit #minicart-drawer h4,
body.theme-nuit #minicart-drawer .fs-6 { color: #F2F3F4 !important; }
body.theme-nuit #minicart-drawer .close-cart {
    background: transparent !important;
    color: #C6CACE !important;
    transition: color .18s ease;
}
body.theme-nuit #minicart-drawer .close-cart:hover { color: #F2F3F4 !important; }
body.theme-nuit #minicart-drawer .minicart-content li.item {
    border-bottom: 1px solid #22262B !important;
    background: transparent !important;
}
body.theme-nuit #minicart-drawer .product-title { color: #F2F3F4 !important; transition: color .18s ease; }
body.theme-nuit #minicart-drawer .product-title:hover { color: #FFC627 !important; }
body.theme-nuit #minicart-drawer .variant-cart { color: #8B9096 !important; }
body.theme-nuit #minicart-drawer .price { color: #F2F3F4 !important; }
body.theme-nuit #minicart-drawer .price.old-price {
    color: #8B9096 !important;
    text-decoration: line-through;
}
body.theme-nuit #minicart-drawer .qtyField .qtyBtn,
body.theme-nuit #minicart-drawer .qtyField .qty {
    background: #1B1E22 !important;
    color: #F2F3F4 !important;
    border-color: #22262B !important;
}
body.theme-nuit #minicart-drawer .remove_from_cart .icon { color: #8B9096 !important; transition: color .18s ease; }
body.theme-nuit #minicart-drawer .remove_from_cart:hover .icon { color: #F2F3F4 !important; }
body.theme-nuit #minicart-drawer .minicart-bottom {
    border-top: 1px solid #22262B !important;
    background: transparent !important;
}
body.theme-nuit #minicart-drawer .subtotal,
body.theme-nuit #minicart-drawer .totalInfo span { color: #F2F3F4 !important; }
body.theme-nuit #minicart-drawer .agree-check label { color: #C6CACE !important; }
body.theme-nuit #minicart-drawer .text-link { color: #FFC627 !important; }
body.theme-nuit #minicart-drawer .text-muted { color: #8B9096 !important; }
body.theme-nuit #minicart-drawer .btn-primary {
    background: #FFC627 !important;
    border-color: #FFC627 !important;
    color: #15130F !important;
    transition: filter .18s ease;
}
body.theme-nuit #minicart-drawer .btn-primary:hover { filter: brightness(.95); }
body.theme-nuit #minicart-drawer .btn-secondary {
    background: #1B1E22 !important;
    border: 1px solid #2A2E34 !important;
    color: #F2F3F4 !important;
    transition: border-color .18s ease;
}
body.theme-nuit #minicart-drawer .btn-secondary:hover { border-color: #3A3F46 !important; }

/* ---------- 4) TOASTS iziToast — nuit ------------------------------------ */
body.theme-nuit .iziToast {
    background: #15171A !important;
    border: 1px solid #22262B !important;
    color: #F2F3F4 !important;
}
body.theme-nuit .iziToast > .iziToast-body .iziToast-title { color: #F2F3F4 !important; }
body.theme-nuit .iziToast > .iziToast-body .iziToast-message { color: #C6CACE !important; }
body.theme-nuit .iziToast > .iziToast-close { filter: invert(1); opacity: .5; }
body.theme-nuit .iziToast > .iziToast-close:hover { opacity: .9; }

/* ---------- 5) ::selection (les 2 modes) ---------------------------------- */
body.theme-nuit ::selection,
body.theme-jour ::selection {
    background: #FFC627;
    color: #15130F;
}

/* ---------- 6) Scrollbar webkit — nuit (jour : défaut) -------------------- */
body.theme-nuit::-webkit-scrollbar,
body.theme-nuit ::-webkit-scrollbar { width: 10px; height: 10px; }
body.theme-nuit::-webkit-scrollbar-track,
body.theme-nuit ::-webkit-scrollbar-track { background: #0E0F11; }
body.theme-nuit::-webkit-scrollbar-thumb,
body.theme-nuit ::-webkit-scrollbar-thumb {
    background: #2A2E34;
    border-radius: 8px;
    border: 2px solid #0E0F11;
}
body.theme-nuit::-webkit-scrollbar-thumb:hover,
body.theme-nuit ::-webkit-scrollbar-thumb:hover { background: #3A3F46; }

/* ---------- 7) :focus-visible global (les 2 modes) ------------------------ */
body.theme-nuit :is(a, button, input, select, textarea, [role="button"]):focus-visible,
body.theme-jour :is(a, button, input, select, textarea, [role="button"]):focus-visible {
    outline: 2px solid #FFC627 !important;
    outline-offset: 2px !important;
}

/* ---------- 8) Modale quickview (#quickview_modal) — nuit ----------------- */
body.theme-nuit #quickview_modal .modal-content {
    background: #15171A !important;
    color: #F2F3F4 !important;
    border: 1px solid #22262B !important;
}
body.theme-nuit #quickview_modal .product-title { color: #F2F3F4 !important; }
body.theme-nuit #quickview_modal .btn-close {
    filter: invert(1) grayscale(100%) brightness(1.6);
}
body.theme-nuit #quickview_modal .tag-filter {
    border-color: #22262B !important;
    color: #C6CACE !important;
    background: transparent !important;
}
body.theme-nuit #quickview_modal .price,
body.theme-nuit #quickview_modal .product_price { color: #F2F3F4 !important; }
body.theme-nuit #quickview_modal .old-price { color: #8B9096 !important; }
body.theme-nuit #quickview_modal .reviews a,
body.theme-nuit #quickview_modal .text-link { color: #FFC627 !important; transition: color .18s ease; }
body.theme-nuit #quickview_modal label,
body.theme-nuit #quickview_modal p { color: #C6CACE; }
body.theme-nuit #quickview_modal .form-select,
body.theme-nuit #quickview_modal .form-control,
body.theme-nuit #quickview_modal .qtyField .qtyBtn,
body.theme-nuit #quickview_modal .qtyField .qty {
    background-color: #1B1E22 !important;
    color: #F2F3F4 !important;
    border-color: #22262B !important;
}
body.theme-nuit #quickview_modal .btn-primary,
body.theme-nuit #quickview_modal .btn.add_cart,
body.theme-nuit #quickview_modal button[type="submit"] {
    background: #FFC627 !important;
    border-color: #FFC627 !important;
    color: #15130F !important;
    transition: filter .18s ease;
}
body.theme-nuit #quickview_modal .btn-primary:hover,
body.theme-nuit #quickview_modal .btn.add_cart:hover { filter: brightness(.95); }
body.theme-nuit #quickview_modal .carousel-arrow {
    background: #1B1E22 !important;
    color: #F2F3F4 !important;
    transition: background .18s ease;
}
/* Fin FINITION */

/* ==========================================================================
   COQUILLE DE PAGE MISSEBO (.mmp-*) — socle partagé des pages secondaires
   (catégories, marques, offres, blog, comparateur, pages légales, compte…)
   Utilisée via <x-missebo.page>. Tous les styles consomment les tokens --n-*
   donc le mode Jour s'applique automatiquement.
   ========================================================================== */
.mmp-root{
    --n-encre:#0E0F11; --n-carte:#15171A; --n-carte2:#1F2226; --n-or:#FFC627;
    --n-tx:#F2F3F4; --n-tx2:#C6CACE; --n-tx3:#8B9096; --n-tx4:#6C7278;
    --n-bord:#22262B; --n-bord2:#2A2E34; --n-bord3:#3A3F45;
    background:var(--n-encre); color:var(--n-tx);
    font-family:'Archivo','Manrope',sans-serif;
    min-height:60vh;
    /* bas : hauteur de la barre mobile fixe (47px) + marge + encoche iOS */
    padding:22px 16px calc(88px + env(safe-area-inset-bottom, 0px));
}
.mmp-root *{box-sizing:border-box}
.mmp-wrap{max-width:480px;margin:0 auto;display:flex;flex-direction:column;gap:16px}

/* ---- Fil d'ariane ---- */
.mmp-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:11.5px;color:var(--n-tx4);margin:0 0 2px}
.mmp-crumb a{color:var(--n-tx4);text-decoration:none}
.mmp-crumb a:hover{color:var(--n-tx2)}
.mmp-crumb .sep{opacity:.55}
.mmp-crumb .cur{color:var(--n-tx2)}

/* ---- En-tête de page ---- */
.mmp-head{display:flex;flex-direction:column;gap:6px}
.mmp-eyebrow{color:var(--n-or-tx,#FFC627);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.mmp-title{font-family:'Space Grotesk','Archivo',sans-serif;font-weight:700;font-size:30px;line-height:1.08;letter-spacing:-.02em;color:var(--n-tx);margin:0}
.mmp-sub{color:var(--n-tx3);font-size:13px;margin:0;line-height:1.55;max-width:62ch}
.mmp-rule{height:1px;background:var(--n-bord);border:0;margin:2px 0 0}

/* ---- Cartes / surfaces ---- */
.mmp-card{background:var(--n-carte);border:1px solid var(--n-bord);border-radius:14px;padding:16px}
.mmp-card + .mmp-card{margin-top:0}
.mmp-card-t{font-family:'Space Grotesk','Archivo',sans-serif;font-weight:700;font-size:16px;color:var(--n-tx);margin:0 0 10px;letter-spacing:-.01em}
.mmp-tile{background:var(--n-carte);border:1px solid var(--n-bord);border-radius:12px;padding:13px 14px;display:flex;flex-direction:column;gap:3px}
.mmp-tile .v{font-family:'Space Grotesk','Archivo',sans-serif;font-weight:700;font-size:20px;color:var(--n-tx);line-height:1}
.mmp-tile .k{font-size:11px;color:var(--n-tx3);letter-spacing:.02em}

/* ---- Grilles ---- */
.mmp-grid{display:grid;gap:12px;grid-template-columns:repeat(var(--mmp-cols,2),minmax(0,1fr))}
.mmp-grid-1{--mmp-cols:1}
.mmp-grid-3{--mmp-cols:2}
.mmp-cols{display:flex;flex-direction:column;gap:16px}

/* ---- Texte long (pages légales, blog) ---- */
.mmp-prose{color:var(--n-tx2);font-size:14.5px;line-height:1.78}
.mmp-prose > *:first-child{margin-top:0}
.mmp-prose > *:last-child{margin-bottom:0}
.mmp-prose p{margin:0 0 14px}
.mmp-prose h1,.mmp-prose h2,.mmp-prose h3,.mmp-prose h4{font-family:'Space Grotesk','Archivo',sans-serif;font-weight:700;color:var(--n-tx);letter-spacing:-.01em;margin:26px 0 10px;line-height:1.22}
.mmp-prose h1{font-size:23px}
.mmp-prose h2{font-size:19px}
.mmp-prose h3{font-size:16px}
.mmp-prose h4{font-size:14.5px}
.mmp-prose ul,.mmp-prose ol{margin:0 0 14px;padding-left:20px}
.mmp-prose li{margin:0 0 7px}
.mmp-prose a{color:var(--n-or-tx,#FFC627);text-decoration:none;border-bottom:1px solid rgba(255,198,39,.35)}
.mmp-prose a:hover{border-bottom-color:currentColor}
.mmp-prose strong,.mmp-prose b{color:var(--n-tx);font-weight:700}
.mmp-prose img{max-width:100%;height:auto;border-radius:12px;margin:6px 0 16px}
.mmp-prose table{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:13.5px}
.mmp-prose th,.mmp-prose td{border:1px solid var(--n-bord);padding:9px 11px;text-align:left}
.mmp-prose th{background:var(--n-carte2);color:var(--n-tx);font-weight:700}
.mmp-prose blockquote{margin:0 0 16px;padding:12px 14px;border-left:3px solid var(--n-or);background:var(--n-carte);border-radius:0 10px 10px 0;color:var(--n-tx2)}
.mmp-prose hr{border:0;height:1px;background:var(--n-bord);margin:22px 0}

/* ---- Boutons ---- */
.mmp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:11px;border:1px solid var(--n-bord2);background:var(--n-carte2);color:var(--n-tx);font-size:13.5px;font-weight:600;text-decoration:none;cursor:pointer;transition:.16s ease}
.mmp-btn:hover{border-color:var(--n-bord3);color:var(--n-tx)}
.mmp-btn-y{background:var(--n-or);border-color:var(--n-or);color:#15130F}
.mmp-btn-y:hover{filter:brightness(1.06);color:#15130F}
.mmp-btn-g{background:transparent;border-color:var(--n-bord2)}
.mmp-btn-sm{height:36px;padding:0 13px;font-size:12.5px;border-radius:9px}
.mmp-btn-block{width:100%}

/* ---- Formulaires ---- */
.mmp-field{display:flex;flex-direction:column;gap:6px;margin-bottom:13px}
.mmp-label{font-size:12px;color:var(--n-tx3);font-weight:600;letter-spacing:.01em}
.mmp-input,.mmp-root select.mmp-input,.mmp-root textarea.mmp-input{
    width:100%;background:var(--n-carte2);border:1px solid var(--n-bord2);border-radius:11px;
    color:var(--n-tx);font-size:14px;font-family:inherit;padding:12px 14px;min-height:46px;transition:border-color .16s ease}
.mmp-root textarea.mmp-input{min-height:118px;resize:vertical;line-height:1.6}
.mmp-input::placeholder{color:var(--n-tx4)}
.mmp-input:focus{outline:none;border-color:var(--n-or)}
.mmp-help{font-size:11.5px;color:var(--n-tx4)}
.mmp-err{font-size:11.5px;color:#FF6B6B}

/* ---- Puces / états ---- */
.mmp-chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--n-bord2);background:var(--n-carte);color:var(--n-tx2);font-size:12.5px;text-decoration:none;white-space:nowrap;transition:.16s ease}
.mmp-chip:hover{border-color:var(--n-bord3);color:var(--n-tx)}
.mmp-chip.on{background:var(--n-or);border-color:var(--n-or);color:#15130F;font-weight:600}
.mmp-chips{display:flex;flex-wrap:wrap;gap:8px}
.mmp-badge{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--n-carte2);color:var(--n-tx2);border:1px solid var(--n-bord2)}
.mmp-badge-y{background:var(--n-or);color:#15130F;border-color:var(--n-or)}

/* ---- Vide / erreurs ---- */
.mmp-empty{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;padding:44px 18px;background:var(--n-carte);border:1px solid var(--n-bord);border-radius:14px}
.mmp-empty .t{font-family:'Space Grotesk','Archivo',sans-serif;font-weight:700;font-size:17px;color:var(--n-tx)}
.mmp-empty .s{font-size:13px;color:var(--n-tx3);max-width:40ch;line-height:1.6}

/* ---- Listes clé/valeur ---- */
.mmp-kv{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--n-bord)}
.mmp-kv:last-child{border-bottom:0}
.mmp-kv .k{color:var(--n-tx3);font-size:13px}
.mmp-kv .v{color:var(--n-tx);font-size:13.5px;font-weight:600;text-align:right}

/* ---- Onglets ---- */
.mmp-tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--n-bord);padding-bottom:0;-ms-overflow-style:none;scrollbar-width:none}
.mmp-tabs::-webkit-scrollbar{display:none}
.mmp-tabs a,.mmp-tabs button{flex:0 0 auto;padding:11px 14px;font-size:13px;color:var(--n-tx3);text-decoration:none;background:none;border:0;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap}
.mmp-tabs a.on,.mmp-tabs button.on{color:var(--n-tx);border-bottom-color:var(--n-or);font-weight:600}

/* ---- Pagination ---- */
.mmp-pager{display:flex;justify-content:center;padding-top:6px}
.mmp-pager .pagination{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.mmp-pager .page-link{display:flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;border-radius:10px;background:var(--n-carte);border:1px solid var(--n-bord);color:var(--n-tx2);font-size:13px;text-decoration:none}
.mmp-pager .page-item.active .page-link{background:var(--n-or);border-color:var(--n-or);color:#15130F;font-weight:700}
.mmp-pager .page-item.disabled .page-link{opacity:.4}

/* ==================== DESKTOP (≥ 900px) ==================== */
@media (min-width:900px){
    .mmp-root{padding:30px 32px 88px}
    .mmp-wrap{max-width:1180px;gap:22px}
    .mmp-title{font-size:42px;letter-spacing:-.028em}
    .mmp-sub{font-size:15px}
    .mmp-card{padding:22px 24px;border-radius:16px}
    .mmp-grid{gap:18px;grid-template-columns:repeat(var(--mmp-cols-d,var(--mmp-cols,3)),minmax(0,1fr))}
    .mmp-grid-3{--mmp-cols-d:3}
    .mmp-grid-4{--mmp-cols-d:4}
    .mmp-cols-2{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start}
    .mmp-cols-2-l{display:grid;grid-template-columns:260px minmax(0,1fr);gap:26px;align-items:start}
    .mmp-prose{font-size:15.5px;line-height:1.8;max-width:78ch}
    .mmp-prose h1{font-size:29px}
    .mmp-prose h2{font-size:22px}
    .mmp-crumb{font-size:12.5px}
}
@media (max-width:899px){
    .mmp-cols-2,.mmp-cols-2-l{display:flex;flex-direction:column;gap:16px}
    .mmp-grid-4{--mmp-cols:2}
}

/* ---- Image manquante : le placeholder livré par le back-end est BLANC, ce qui
   troue le fond sombre. On l'inverse pour obtenir une tuile sombre discrète.
   (En mode Jour on n'y touche pas : le placeholder d'origine y est correct.) ---- */
body.theme-nuit img[src*="no-image"],
body.theme-nuit img[data-src*="no-image"],
body.theme-nuit img[src$="no-image.jpg"],
body.theme-nuit img[src$="no_image.png"]{
    background:#15171A;
    filter:invert(1) brightness(.82) saturate(0);
}

/* ==========================================================================
   LISIBILITE — regle de marque : sur le jaune #FFC627, le texte est l'encre
   #15130F, jamais du blanc ni du gris clair.

   Pourquoi cette liste : la regle generale du theme nuit, plus haut dans ce
   fichier — « body.theme-nuit p, body.theme-nuit span, body.theme-nuit li …
   { color: var(--n-txt2) !important } » — repeint TOUS les p / span / li en
   gris clair #C6CACE. Or les libelles poses sur un fond jaune sont presque
   tous ecrits dans un <span> : pastille de prix du panier, bouton
   « Enregistrer l'adresse », barre « TOTAL A PAYER », bouton de la modale de
   choix de boutique. Ils heritaient donc du gris — rapport de contraste
   mesure sur la production : 1,05 sur 21, illisible.

   A COMPLETER a chaque nouveau composant pose sur le jaune de marque.
   ========================================================================== */
:is(#minicart-drawer .btn-primary,
    #mm-addr-root .address-select-box.active .address-box .lbl,
    #mm-addr-root .mmac-ava,
    #mm-addr-root .select2-results__option--highlighted,
    #mm-blog-root .sidebar_categories a.site-nav.active,
    #mm-cart-root .mmv-cta,
    #mm-cart-root .mmv-e16-card .pr,
    #mm-cart-root .mmv-e16-cta,
    #mm-cart-root .mmv-rprice,
    #mm-chat-root .mmc-dot,
    #mm-chat-root .mmn-ava,
    #mm-checkout-root #place_order_btn,
    #mm-checkout-root .apply-coupon-btn,
    #mm-checkout-root .mmk-empty a,
    #mm-checkout-root .mmk-mprog span.on,
    #mm-checkout-root .modal .btn-primary,
    #mm-contact-root .mmc-wa,
    #mm-fav-root .mmv-add,
    #mm-fav-root .mmv-allbtn,
    #mm-fav-root .mmv-empty .cta,
    #mm-fav-root .mmv-pag .active .page-link,
    #mm-fav-root .mmv-pag .page-item.active span,
    #mm-fav-root .mmv-price,
    #mm-fav-root .mmv-tab.active,
    #mm-forgot-root #changePassword,
    #mm-help-root .mmh-wa,
    #mm-home-root .mmh-act-cart,
    #mm-home-root .mmh-badge,
    #mm-home-root .mmh-cta .p,
    #mm-home-root .mmh-kick .d,
    #mm-home-root .mmh-price,
    #mm-login-root .mml-btn,
    #mm-notif-root .dropdown-menu .dropdown-item.active,
    #mm-notif-root .fixed-table-pagination .page-item.active .page-link,
    #mm-notif-root .mmac-ava,
    #mm-profile-root .mmac-ava,
    #mm-profile-root .profileImg .thumb-edit label,
    #mm-profile-root .select2-results__option--highlighted,
    #mm-register-root #register-form-submit,
    #mm-seller-root .mms-avatar,
    #mm-seller-root .mms-catalog,
    #mm-seller-root .mms-pag .active .page-link,
    #mm-seller-root .mms-pag .page-item.active span,
    #mm-seller-root .mms-price,
    #mm-seller-root .mms-wa,
    #mm-sellers-root .mmsl-avatar,
    #mm-sellers-root .mmsl-pag .active .page-link,
    #mm-sellers-root .mmsl-pag .page-item.active span,
    #mm-status-root .mms-badge--ok,
    #mm-status-root .mms-btn--yellow,
    #mm-support-root .message-input-area .btn-primary,
    #mm-support-root .mmn-ava,
    #mm-support-root .modal-footer .btn-primary,
    #mm-tx-root .fixed-table-pagination .pagination .active .page-link,
    #mm-tx-root .mmn-ava,
    #mm-wallet-root .fixed-table-pagination .pagination .active .page-link,
    #mm-wallet-root .mmn-ava,
    #mm-wallet-root .modal-footer .btn-primary,
    #page-content.mm-fiche .mmf-badge,
    #page-content.mm-fiche .mmf-cta,
    #page-content.mm-fiche .mmf-vendeur-pastille,
    #quickview_modal .mmqv-actions .mmqv-cta.add_cart,
    #quickview_modal .mmqv-off,
    #quickview_modal button[type="submit"],
    .mma-ava,
    .mma-route .btn,
    .mmad-ava,
    .mmad-empty a,
    .mmad-route .btn,
    .mmc-add,
    .mmc-empty a,
    .mmc-etiquette,
    .mmc-pag .active .page-link,
    .mmc-pag .page-item.active span,
    .mmc-price,
    .mmd-btn-y,
    .mmd-chip-open,
    .mmd-help a,
    .mmd-seller .av,
    .mmf-check-btn,
    .mmf-cta,
    .mmf-revlist .spr-button,
    .mmf-rprice,
    .mmk-check-btn,
    .mmk-cta,
    .mmk-revlist .spr-button,
    .mmk-rprice,
    .mmo-empty a,
    .mmo-mtab.on,
    .mmo-pages .on button,
    .mmo-pill.on,
    .mmp-badge-y,
    .mmp-btn-y,
    .mmp-chip.on,
    .mmp-pager .page-item.active .page-link,
    .mmt-bar i.on,
    .mmt-dot.done,
    .mmt-kick .d,
    .mmt-line.on,
    .mmtd-boyav,
    .mmtd-dot.done,
    .mmtd-pill .d,
    .mmtd-tlrail .l.on,
    .mmtd-wa,
    .mmx-badge,
    .mmx-ch-btn.p,
    .mmx-ch-flag,
    .mmx-ch-sticky-btn,
    .mmx-sov-go button),
:is(#minicart-drawer .btn-primary,
    #mm-addr-root .address-select-box.active .address-box .lbl,
    #mm-addr-root .mmac-ava,
    #mm-addr-root .select2-results__option--highlighted,
    #mm-blog-root .sidebar_categories a.site-nav.active,
    #mm-cart-root .mmv-cta,
    #mm-cart-root .mmv-e16-card .pr,
    #mm-cart-root .mmv-e16-cta,
    #mm-cart-root .mmv-rprice,
    #mm-chat-root .mmc-dot,
    #mm-chat-root .mmn-ava,
    #mm-checkout-root #place_order_btn,
    #mm-checkout-root .apply-coupon-btn,
    #mm-checkout-root .mmk-empty a,
    #mm-checkout-root .mmk-mprog span.on,
    #mm-checkout-root .modal .btn-primary,
    #mm-contact-root .mmc-wa,
    #mm-fav-root .mmv-add,
    #mm-fav-root .mmv-allbtn,
    #mm-fav-root .mmv-empty .cta,
    #mm-fav-root .mmv-pag .active .page-link,
    #mm-fav-root .mmv-pag .page-item.active span,
    #mm-fav-root .mmv-price,
    #mm-fav-root .mmv-tab.active,
    #mm-forgot-root #changePassword,
    #mm-help-root .mmh-wa,
    #mm-home-root .mmh-act-cart,
    #mm-home-root .mmh-badge,
    #mm-home-root .mmh-cta .p,
    #mm-home-root .mmh-kick .d,
    #mm-home-root .mmh-price,
    #mm-login-root .mml-btn,
    #mm-notif-root .dropdown-menu .dropdown-item.active,
    #mm-notif-root .fixed-table-pagination .page-item.active .page-link,
    #mm-notif-root .mmac-ava,
    #mm-profile-root .mmac-ava,
    #mm-profile-root .profileImg .thumb-edit label,
    #mm-profile-root .select2-results__option--highlighted,
    #mm-register-root #register-form-submit,
    #mm-seller-root .mms-avatar,
    #mm-seller-root .mms-catalog,
    #mm-seller-root .mms-pag .active .page-link,
    #mm-seller-root .mms-pag .page-item.active span,
    #mm-seller-root .mms-price,
    #mm-seller-root .mms-wa,
    #mm-sellers-root .mmsl-avatar,
    #mm-sellers-root .mmsl-pag .active .page-link,
    #mm-sellers-root .mmsl-pag .page-item.active span,
    #mm-status-root .mms-badge--ok,
    #mm-status-root .mms-btn--yellow,
    #mm-support-root .message-input-area .btn-primary,
    #mm-support-root .mmn-ava,
    #mm-support-root .modal-footer .btn-primary,
    #mm-tx-root .fixed-table-pagination .pagination .active .page-link,
    #mm-tx-root .mmn-ava,
    #mm-wallet-root .fixed-table-pagination .pagination .active .page-link,
    #mm-wallet-root .mmn-ava,
    #mm-wallet-root .modal-footer .btn-primary,
    #page-content.mm-fiche .mmf-badge,
    #page-content.mm-fiche .mmf-cta,
    #page-content.mm-fiche .mmf-vendeur-pastille,
    #quickview_modal .mmqv-actions .mmqv-cta.add_cart,
    #quickview_modal .mmqv-off,
    #quickview_modal button[type="submit"],
    .mma-ava,
    .mma-route .btn,
    .mmad-ava,
    .mmad-empty a,
    .mmad-route .btn,
    .mmc-add,
    .mmc-empty a,
    .mmc-etiquette,
    .mmc-pag .active .page-link,
    .mmc-pag .page-item.active span,
    .mmc-price,
    .mmd-btn-y,
    .mmd-chip-open,
    .mmd-help a,
    .mmd-seller .av,
    .mmf-check-btn,
    .mmf-cta,
    .mmf-revlist .spr-button,
    .mmf-rprice,
    .mmk-check-btn,
    .mmk-cta,
    .mmk-revlist .spr-button,
    .mmk-rprice,
    .mmo-empty a,
    .mmo-mtab.on,
    .mmo-pages .on button,
    .mmo-pill.on,
    .mmp-badge-y,
    .mmp-btn-y,
    .mmp-chip.on,
    .mmp-pager .page-item.active .page-link,
    .mmt-bar i.on,
    .mmt-dot.done,
    .mmt-kick .d,
    .mmt-line.on,
    .mmtd-boyav,
    .mmtd-dot.done,
    .mmtd-pill .d,
    .mmtd-tlrail .l.on,
    .mmtd-wa,
    .mmx-badge,
    .mmx-ch-btn.p,
    .mmx-ch-flag,
    .mmx-ch-sticky-btn,
    .mmx-sov-go button) :is(span, p, li, b, strong, small, em, div, a) {
    color: #15130F !important;
}

/* Memes boutons cote pages non converties : le jaune n'y est pose qu'en nuit. */
:is(body.theme-nuit #mm-guest-cart .checkout,
    body.theme-nuit #place_order,
    body.theme-nuit #place_order_btn.checkout,
    body.theme-nuit .btn-primary,
    body.theme-nuit .btn.btn-primary[type=submit],
    body.theme-nuit .cart-btn,
    body.theme-nuit .header-cart .badge,
    body.theme-nuit .mm-bank-send,
    body.theme-nuit .pagination .page-item.active .page-link,
    body.theme-nuit .place-order-btn,
    body.theme-nuit button.btn-primary),
:is(body.theme-nuit #mm-guest-cart .checkout,
    body.theme-nuit #place_order,
    body.theme-nuit #place_order_btn.checkout,
    body.theme-nuit .btn-primary,
    body.theme-nuit .btn.btn-primary[type=submit],
    body.theme-nuit .cart-btn,
    body.theme-nuit .header-cart .badge,
    body.theme-nuit .mm-bank-send,
    body.theme-nuit .pagination .page-item.active .page-link,
    body.theme-nuit .place-order-btn,
    body.theme-nuit button.btn-primary) :is(span, p, li, b, strong, small, em, div, a) {
    color: #15130F !important;
}


/* ==========================================================================
   LISIBILITE — textes gris trop pales, mesures sur la production au 20/09.
   Seuil retenu : 4,5 sur 1 (texte courant), 3 sur 1 (grands titres).
   ========================================================================== */

/* Pied de page, theme nuit : titres 3,94 et copyright 3,94 sur fond #0E0F11. */
body.theme-nuit .site-footer-wrap .footer .footer-top .h4 { color: #9AA0A6 !important; }   /* 7,3 */
body.theme-nuit .site-footer-wrap .footer .footer-bottom,
body.theme-nuit .site-footer-wrap .footer .footer-bottom .copytext,
body.theme-nuit .site-footer-wrap .footer .payment-icons .icon { color: #8B9096 !important; }  /* 5,9 */

/* Pied de page, theme jour : titres, liens et copyright a 3,01 sur fond #F6F6F3. */
body.theme-jour .site-footer-wrap .footer .footer-top .h4,
body.theme-jour .site-footer-wrap .footer .footer-bottom,
body.theme-jour .site-footer-wrap .footer .footer-bottom .copytext,
body.theme-jour .site-footer-wrap .footer-links a,
body.theme-jour .site-footer-wrap .footer-contact a,
body.theme-jour .site-footer-wrap .footer-contact p { color: #5A6068 !important; }   /* 5,9 */

/* Coordonnees du pied de page (telephone, courriel) : elles vivent dans .footer-top
   et non dans .footer-contact, la regle precedente ne les atteignait pas (3,0). */
body.theme-nuit .site-footer-wrap .footer .footer-top a { color: #9AA0A6 !important; }   /* 7,3 */
body.theme-jour .site-footer-wrap .footer .footer-top a { color: #5A6068 !important; }   /* 5,9 */

/* Barre de navigation du bas, theme jour : libelles a 1,75 sur blanc — invisibles. */
body.theme-jour .menubar-mobile .menubar-label,
body.theme-jour .menubar-item .menubar-label { color: #5A6068 !important; }   /* 6,1 */
body.theme-jour .menubar-item.active .menubar-label,
body.theme-jour .menubar-item .menubar-label.active { color: #15130F !important; }

/* Etiquettes secondaires des ecrans Missebo : #6C7278 donne 3,9 sur l'encre. */
/* !important : chaque ecran Missebo redefinit ce jeton dans son propre <style>,
   avec la specificite d'un identifiant. Seule l'importance passe devant. */
body.theme-nuit [id^="mm-"], body.theme-nuit .mmx, body.theme-nuit .mmp-root { --n-tx4: #7E848A !important; }   /* 5,1 */

/* ==========================================================================
   ERGONOMIE — pied de page (constate en theme jour sur mobile).
   ========================================================================== */

/* 1. Le chevron de l'accordeon etait etire sur toute la largeur du titre
      (left:0 ET right:15px) : le glyphe se posait sur la premiere lettre.
      Il reprend sa place a droite. */
.site-footer-wrap .footer .footer-top .h4::after {
    left: auto !important;
    right: 15px !important;
    width: auto !important;
    text-align: right;
}

/* 2. Badges « Google Play » / « App Store » : le lien etait contraint a 38 px de
      cote (style des icones sociales) alors qu'il contient une pastille de
      125 px — les deux badges se chevauchaient, illisibles. Le lien prend la
      taille de son contenu. */
.site-footer-wrap .footer a[href*="play.google"],
.site-footer-wrap .footer a[href*="apps.apple"] {
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    border-radius: 999px;
    line-height: 1.2;
}
.site-footer-wrap .footer .app-store-badge { opacity: 1 !important; }
/* Ces liens vivent dans .social-icons, dont la regle de couleur est plus precise :
   on la depasse explicitement, sinon le libelle reste a 3,01. */
body.theme-jour .site-footer-wrap .footer .social-icons li a[href*="play.google"],
body.theme-jour .site-footer-wrap .footer .social-icons li a[href*="apps.apple"] { color: #5A6068 !important; }   /* 5,9 */
body.theme-nuit .site-footer-wrap .footer .social-icons li a[href*="play.google"],
body.theme-nuit .site-footer-wrap .footer .social-icons li a[href*="apps.apple"] { color: #9AA0A6 !important; }   /* 7,3 */

/* ==========================================================================
   BOITES DE DIALOGUE (SweetAlert) — annulation d'une piece, suppression d'une
   adresse, retrait d'un favori. Le theme nuit eclaircit les titres de la page ;
   la fenetre SweetAlert, elle, reste blanche : le titre sortait en blanc sur
   blanc, illisible. On lui donne la peau Missebo dans les deux themes, avec le
   bouton de confirmation en jaune a encre noire.
   ========================================================================== */
body.theme-nuit .swal2-popup {
    background: #15171A !important;
    border: 1px solid #22262B;
    border-radius: 14px;
}
body.theme-nuit .swal2-title { color: #F2F3F4 !important; }
body.theme-nuit .swal2-html-container,
body.theme-nuit .swal2-content { color: #C6CACE !important; }
body.theme-jour .swal2-popup { border-radius: 14px; }
body.theme-jour .swal2-title { color: #15130F !important; }
body.theme-jour .swal2-html-container,
body.theme-jour .swal2-content { color: #3A3F45 !important; }

.swal2-actions .swal2-confirm.swal2-styled {
    background: #FFC627 !important;
    color: #15130F !important;
    box-shadow: none !important;
    font-weight: 700;
    border-radius: 10px;
}
.swal2-actions .swal2-cancel.swal2-styled {
    background: transparent !important;
    border: 1px solid #8B9096 !important;
    box-shadow: none !important;
    font-weight: 600;
    border-radius: 10px;
}
body.theme-nuit .swal2-actions .swal2-cancel.swal2-styled { color: #F2F3F4 !important; }
body.theme-jour .swal2-actions .swal2-cancel.swal2-styled { color: #15130F !important; }

/* ==========================================================================
   ÉCRAN DE CHARGEMENT — retiré.
   Le layout ouvre chaque page sur un voile plein écran avec trois points qui
   rebondissent (.loading-state.screen), que custom.js retire une fois chargé et
   exécuté : la page restait donc masquée le temps de télécharger et d'exécuter
   le JavaScript, pour un simple effet. Le contenu s'affiche maintenant dès que
   le HTML arrive.
   ========================================================================== */
.loading-state.screen { display: none !important; }

/* ==========================================================================
   INDICATEURS DE CHARGEMENT
   L'écran d'attente plein page ayant disparu (bloc ci-dessus), il fallait dire
   autrement qu'une page arrive. Une barre fine en haut suffit : elle ne masque
   rien de ce qui est déjà lisible et n'attend pas le JavaScript pour laisser
   voir le contenu.
     - #nprogress : la barre de Livewire, affichée sur les liens wire:navigate.
       On ne fait que la teinter au jaune Missebo et l'épaissir d'un pixel.
     - #mm-prog : la même barre, pour ce que Livewire ne couvre pas — clic sur
       un lien classique, envoi d'un formulaire, requête Livewire en cours.
   Les deux ne se déclenchent jamais ensemble : custom.js laisse les liens
   wire:navigate à Livewire.
   ========================================================================== */
:root { --livewire-progress-bar-color: #FFC627; }
#nprogress .bar { height: 3px !important; }

#mm-prog {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 100000;
    pointer-events: none;
    opacity: 0;
    transition: opacity .2s ease;
}
#mm-prog.on { opacity: 1; }
#mm-prog span {
    display: block;
    height: 100%;
    width: 30%;
    background: #FFC627;
    box-shadow: 0 0 10px #FFC627, 0 0 5px #FFC627;
    transform: translateX(-100%);
}
#mm-prog.on span { animation: mm-prog-court 1.1s ease-in-out infinite; }
@keyframes mm-prog-court {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(340%); }
}

/* Requête Livewire en cours (tri, filtres, pagination) : la grille s'estompe
   le temps de la réponse, pour qu'on voie qu'elle va changer. */
body.mm-charge .mmc-grid,
body.mm-charge .mmh-grid { opacity: .5; transition: opacity .15s ease; }

@media (prefers-reduced-motion: reduce) {
    #mm-prog.on span { animation: none; transform: none; width: 100%; }
    body.mm-charge .mmc-grid,
    body.mm-charge .mmh-grid { transition: none; }
}

/* ==========================================================================
   BULLES JAUNES QUI SAUTENT — coupées partout.
   Le thème d'origine (style.css) donne à TOUTE classe .dot la balle de son
   écran de chargement : un ::before de 15 px à la couleur de la boutique, qui
   rebondit de 50 px en boucle (animation dotHover), et une ombre en ::after.
   Or .dot sert aussi, dans nos vues, au petit point qui sépare « marque ·
   catégorie » sur les cartes, les favoris, la page vendeur, l'espace client :
   chacun de ces points devenait une bulle jaune animée. Chaque vue donne déjà
   à son .dot la taille et la couleur voulues ; on retire seulement la balle.
   ========================================================================== */
.dot::before,
.dot::after {
    content: none !important;
    animation: none !important;
    display: none !important;
}
.dot {
    animation: none !important;
}

/* ==========================================================================
   LISTES SANS FIN — catalogue, catégories, recherche, page vendeur.
   Plus de pagination : custom.js ajoute les lots suivants au défilement
   ([data-mm-infini]). Pendant la requête, quatre cartes grises tiennent la
   place du lot ; « Voir plus de pièces » reste en secours si le défilement
   automatique ne se déclenche pas (réseau coupé, navigateur ancien).
   ========================================================================== */
.mm-infini-etat {
    padding: 22px 20px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-height: 44px;
}
.mm-infini-plus {
    background: transparent;
    border: 1px solid var(--n-bord2, #3A3F45);
    color: var(--n-tx, #F2F3F4);
    border-radius: 11px;
    padding: 12px 22px;
    font: 700 13px/1 Archivo, sans-serif;
    cursor: pointer;
    /* C'est un lien vers la page suivante (Google la suit) que le script intercepte. */
    display: inline-block;
    text-decoration: none;
}
.mm-infini-plus:hover { border-color: var(--n-or, #FFC627); }
.mm-infini-plus[disabled], .mm-infini-plus.mm-charge { opacity: .6; cursor: default; }
.mm-infini-fin {
    font: 500 12px/1.4 Archivo, sans-serif;
    color: var(--n-tx3, #8B9096);
    text-align: center;
}
.mm-skel { pointer-events: none; }
.mm-skel .mmc-ph,
.mm-skel .mms-ph,
.mm-skel .l {
    background: linear-gradient(90deg, var(--n-carte2, #1F2226) 25%, var(--n-bord, #22262B) 37%, var(--n-carte2, #1F2226) 63%);
    background-size: 400% 100%;
    animation: mm-luire 1.3s ease-in-out infinite;
}
.mm-skel .l { display: block; height: 9px; border-radius: 5px; margin-top: 6px; }
.mm-skel .l2 { width: 48%; height: 8px; }
@keyframes mm-luire {
    0% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}
@media (prefers-reduced-motion: reduce) {
    .mm-skel .mmc-ph, .mm-skel .mms-ph, .mm-skel .l { animation: none; }
}

/* ==========================================================================
   BOUTONS PRIMAIRES DES FENÊTRES — jaunes, écriture noire, dans les deux thèmes.
   En thème nuit, ces boutons sont jaunes et la liste « écriture noire sur le
   jaune » ci-dessus force leur texte en noir. En thème jour, missebo-refonte.css
   les peint en noir : texte noir sur fond noir, bouton muet (« Sélectionner »
   de la fenêtre « Choisir une adresse », au paiement). Ils restent donc jaunes
   partout, comme les autres boutons de la marque.
   ========================================================================== */
body.theme-jour :is(#mm-checkout-root .modal .btn-primary,
    #minicart-drawer .btn-primary,
    #mm-support-root .message-input-area .btn-primary,
    #mm-support-root .modal-footer .btn-primary,
    #mm-wallet-root .modal-footer .btn-primary) {
    background: #FFC627 !important;
    border-color: #FFC627 !important;
    color: #15130F !important;
}
body.theme-jour :is(#mm-checkout-root .modal .btn-primary,
    #minicart-drawer .btn-primary,
    #mm-support-root .message-input-area .btn-primary,
    #mm-support-root .modal-footer .btn-primary,
    #mm-wallet-root .modal-footer .btn-primary):hover {
    background: #F2B705 !important;
    border-color: #F2B705 !important;
}

/* ==========================================================================
   CONNEXION, INSCRIPTION, MOT DE PASSE OUBLIÉ — typographie sobre.
   Titres en Space Grotesk serrée, étiquettes et boutons en capitales espacées :
   l'ensemble avait l'air d'une maquette générique (« ça fait IA »). Même famille
   que le reste du texte, casse normale, espacement naturel. Les chiffres du code
   SMS gardent leur espacement, qui aide à les lire.
   ========================================================================== */
:is(#mm-login-root, #mm-register-root, #mm-forgot-root) :is(.mml-title, .mmr-title, .mmf-title) {
    font: 700 28px/1.2 Archivo, Manrope, sans-serif !important;
    letter-spacing: 0 !important;
}
:is(#mm-login-root, #mm-register-root, #mm-forgot-root) :is(.mml-hero, .mmr-hero, .mmf-hero) {
    font: 700 34px/1.2 Archivo, Manrope, sans-serif !important;
    letter-spacing: 0 !important;
}
:is(#mm-login-root, #mm-register-root, #mm-forgot-root) :is(.mml-label, .mmr-step, .mmf-step, .mml-divide, .mmr-divide, .mmf-divide, label) {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: 13px !important;
}
:is(#mm-login-root, #mm-register-root, #mm-forgot-root) :is(.mml-btn, .btn, #register-form-submit, #changePassword) {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: 15px !important;
}
:is(#mm-register-root, #mm-forgot-root) :is(#verificationCode, .mmr-otp-cell) {
    font-family: Archivo, Manrope, sans-serif !important;
}