/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */

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

:root {
  --wfd-bg: #0f0f12;
  --wfd-panel: #17171b;
  --wfd-border: #26262c;
  --wfd-text: #f2f2f0;
  --wfd-text-muted: #9a9aa2;
  /* Rouge du logo (09/10/2026, remplace le turquoise #2dd4bf) :
     --wfd-accent    = rouge du logo, pour les fonds, bordures, cases cochées
     --wfd-accent-fg = même rouge éclairci, pour le TEXTE sur fond sombre
                       (le rouge du logo n'a pas assez de contraste en texte fin)
     --wfd-accent-text = texte posé sur un fond rouge (boutons) */
  --wfd-accent: #e3101e;
  --wfd-accent-fg: #ff3b47;
  --wfd-accent-text: #ffffff;
}

html, body {
  background-color: var(--wfd-bg) !important;
  color: var(--wfd-text) !important;
  font-family: 'Space Grotesk', system-ui, sans-serif !important;
}

/* Conteneurs de mise en page : sans ça le fond blanc du thème classic
   recouvre celui du body sur toute la zone de contenu */
#wrapper,
#content,
#content-wrapper,
.page-wrapper,
.page-content,
main,
#main,
#index,
.container,
.container-fluid,
section {
  background-color: var(--wfd-bg) !important;
}

a {
  color: var(--wfd-accent-fg) !important;
}
a:hover {
  color: var(--wfd-text) !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.page-content .h1, .products-section-title {
  color: var(--wfd-text) !important;
  font-family: 'Space Grotesk', system-ui, sans-serif !important;
}

/* Header */
#header,
#header .header-top,
#header .header-nav {
  background-color: var(--wfd-bg) !important;
  border-color: var(--wfd-border) !important;
}

/* Sélecteurs langue / devise dans le header (souvent en texte gris foncé
   #232323 codé en dur, invisible sur un header sombre) */
.language-selector-wrapper,
.language-selector-wrapper *,
.currency-selector,
.currency-selector *,
#header .dropdown .expand-more,
#header .btn-unstyle {
  color: var(--wfd-text) !important;
}
.language-selector-wrapper .dropdown-menu,
.currency-selector .dropdown-menu {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}
.language-selector-wrapper .dropdown-menu a,
.currency-selector .dropdown-menu a {
  color: var(--wfd-text-muted) !important;
}
.language-selector-wrapper .dropdown-menu a:hover,
.currency-selector .dropdown-menu a:hover {
  color: var(--wfd-accent-fg) !important;
}

/* Menus déroulants génériques (tri "Pertinence", compte, panier...) :
   Bootstrap les affiche en blanc par défaut */
.dropdown-menu,
.select-title,
.btn-unstyle.select-title {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-text) !important;
  border-color: var(--wfd-border) !important;
}
.dropdown-menu a,
.dropdown-menu .dropdown-item,
.dropdown-menu li {
  color: var(--wfd-text-muted) !important;
}
.dropdown-menu a:hover,
.dropdown-menu .dropdown-item:hover {
  color: var(--wfd-accent-fg) !important;
  background-color: var(--wfd-bg) !important;
}

/* Footer */
#footer,
.footer-container {
  background-color: var(--wfd-panel) !important;
  border-top: 1px solid var(--wfd-border) !important;
  color: var(--wfd-text-muted) !important;
}
#footer a, .footer-container a {
  color: var(--wfd-text-muted) !important;
}
#footer a:hover, .footer-container a:hover {
  color: var(--wfd-text) !important;
}

/* Cartes produit (page d'accueil, listing catégorie) */
.product-miniature,
.thumbnail-container,
.js-product-miniature-wrapper,
.product-description,
.highlighted-informations,
.card, .card-block {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.product-miniature .product-title,
.product-miniature .product-title a,
.product-description .product-title,
.product-description .product-title a {
  color: var(--wfd-text) !important;
}
.product-miniature .product-price-and-shipping,
.product-description .product-price-and-shipping,
.product-price {
  color: var(--wfd-accent-fg) !important;
}

/* Page produit : zone image (identifiée via l'inspecteur Chrome) */
.images-container,
.product-cover,
.js-qv-mask,
.js-qv-mask .mask,
.mask,
#content.page-content {
  background-color: var(--wfd-panel) !important;
}

/* Page produit : bloc "Détail du produit" (onglets description/specs) */
.product-information {
  color: var(--wfd-text) !important;
}
.tabs,
.nav-tabs,
.tab-content,
#tab-content {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}
.tabs .nav-link,
.nav-tabs .nav-link {
  color: var(--wfd-text-muted) !important;
  background-color: transparent !important;
}
.tabs .nav-link.active,
.nav-tabs .nav-link.active {
  color: var(--wfd-accent-fg) !important;
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) var(--wfd-border) var(--wfd-panel) !important;
}

/* Bloc "Commentaires" en bas de page produit */
#product-comments-list-header,
#product-comments-list-header *,
.product-comment-list-item,
#empty-product-comment {
  color: var(--wfd-text) !important;
  background-color: var(--wfd-panel) !important;
}

/* Blocs de contenu génériques du thème (bloc texte, CMS, catégories...)
   dont le nom de classe exact varie selon les modules installés */
[class*="block"],
[class*="cms"],
[class*="customtext"],
[id*="custom-text"],
[id*="block"] {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-text) !important;
  border-color: var(--wfd-border) !important;
}
[class*="block"] p,
[class*="cms"] p,
[class*="customtext"] p,
[id*="custom-text"] p {
  color: var(--wfd-text-muted) !important;
}

/* Boutons principaux (Ajouter au panier, Commander, etc.) */
.btn-primary,
#add-to-cart-or-refresh .btn-primary,
.card-block .btn-primary {
  background-color: var(--wfd-accent) !important;
  border-color: var(--wfd-accent) !important;
  color: var(--wfd-accent-text) !important;
  font-weight: 600 !important;
}
.btn-primary:hover {
  filter: brightness(1.08);
}

/* Prix */
.current-price span {
  color: var(--wfd-accent-fg) !important;
}

/* Champs de formulaire (checkout, contact...) restent lisibles sur fond sombre */
input, textarea, select {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-text) !important;
  border-color: var(--wfd-border) !important;
}

/* Popup "Produit ajouté au panier avec succès" (#blockcart-modal) :
   la modale Bootstrap et son contenu (.cart-content, .page-content.page-cms)
   restent en blanc/gris clair par défaut, avec du texte gris (#6c868e, #7a7a7a)
   codé en dur dans theme.css */
#blockcart-modal .modal-dialog,
#blockcart-modal .modal-content {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}
#blockcart-modal .modal-header,
#blockcart-modal .modal-body,
#blockcart-modal .modal-footer {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}
#blockcart-modal,
#blockcart-modal *,
#blockcart-modal .cart-content,
#blockcart-modal .cart-content *,
#blockcart-modal .page-content.page-cms,
#blockcart-modal .page-content.page-cms * {
  color: var(--wfd-text) !important;
}
#blockcart-modal .page-content.page-cms ul,
#blockcart-modal .page-content.page-cms p,
#blockcart-modal .cart-products-count,
#blockcart-modal .product-name,
#blockcart-modal .product-price {
  color: var(--wfd-text-muted) !important;
}
#blockcart-modal .divide-right,
#blockcart-modal hr {
  border-color: var(--wfd-border) !important;
}
#blockcart-modal .cart-content-btn .btn,
#blockcart-modal .btn-secondary {
  background-color: transparent !important;
  border-color: var(--wfd-accent) !important;
  color: var(--wfd-accent-fg) !important;
}
#blockcart-modal .btn-secondary:hover {
  background-color: var(--wfd-accent) !important;
  color: var(--wfd-accent-text) !important;
}
/* Ligne "Total" de la popup panier : fond #f6f6f6 codé en dur (même bug que
   le récapitulatif de commande) */
#blockcart-modal .cart-content .page-content.page-cms ul.product-total,
#blockcart-modal .cart-content p.product-total,
#blockcart-modal .cart-content ul {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-text) !important;
}

/* Étape "Paiement" : bloc d'instructions "Payer par chèque" (Montant,
   Bénéficiaire, adresse d'envoi...) en .definition-list - même bug de fond
   #f6f6f6 codé en dur */
.definition-list dl dd,
.definition-list dl dt,
.additional-information .definition-list {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-text) !important;
}
.additional-information {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}
.modal-backdrop.show {
  opacity: .7 !important;
}

/* Page panier : récapitulatif "1 article / Livraison / Total TTC" à peine
   visible (texte gris foncé #363a42 codé en dur dans theme.css sur fond sombre) */
.cart-summary-line,
.cart-summary-line .label,
.cart-summary-line .value,
.cart-summary-totals .cart-summary-line,
#cart-subtotal-products,
#cart-subtotal-shipping,
.cart-total .label,
.cart-total .value {
  color: var(--wfd-text) !important;
}
.cart-summary-totals .cart-summary-line.cart-total .label,
.cart-summary-totals .cart-summary-line.cart-total .value {
  color: var(--wfd-accent-fg) !important;
  font-weight: 700 !important;
}
.card-block.cart-detailed-subtotals,
.card-block.cart-summary-totals,
.cart-grid-right .card {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}

/* Tunnel de commande : libellés de formulaire (Titre, Prénom, Nom, E-mail...)
   en #232323 codé en dur dans theme.css, invisibles sur fond sombre */
#checkout form label,
#checkout .form-control-label,
.form-control-label,
form .form-control-label,
.custom-checkbox label,
.custom-radio label,
.radio-inline,
.checkbox-inline {
  color: var(--wfd-text) !important;
}
/* Textes d'aide sous les champs ("Seules les lettres...", "Optionnel", "(Ex: ...)") */
.form-control-comment,
.form-text,
small.form-text,
#checkout small {
  color: var(--wfd-text-muted) !important;
}
/* Champs radio "M. / Mme" et cases à cocher : bordure visible sur fond sombre */
#checkout input[type="radio"],
#checkout input[type="checkbox"] {
  accent-color: var(--wfd-accent) !important;
}
/* Étapes du tunnel de commande (fond des sections) */
#checkout .checkout-step,
#checkout .card,
#checkout .card-block,
#checkout .content {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}
#checkout .step-title {
  color: var(--wfd-text) !important;
}

/* Cases à cocher personnalisées (J'accepte les conditions, RGPD, newsletter...) :
   la coche est une icône Material Icons en couleur #232323 codée en dur dans
   theme.css -> invisible sur fond sombre bien que la case soit bien cochée */
i.checkbox-checked,
.custom-checkbox i,
label i.material-icons {
  color: var(--wfd-accent-fg) !important;
}
/* Cases à cocher / boutons radio (conditions générales, moyens de paiement,
   M./Mme...) : contour clair bien visible sur fond sombre, état coché en
   couleur d'accent. Remplace le contour #26262c (26/09/2026), quasi
   invisible sur les panneaux #17171b du tunnel de commande. */
.custom-checkbox input[type="checkbox"] + span {
  border: 2px solid #b4b4bc !important;
  background-color: var(--wfd-bg) !important;
}
.custom-checkbox input[type="checkbox"]:checked + span {
  border-color: var(--wfd-accent) !important;
}
.custom-radio {
  border: 2px solid #b4b4bc !important;
  background-color: var(--wfd-bg) !important;
}
.custom-radio input[type="radio"]:checked + span {
  background-color: var(--wfd-accent) !important;
}
.custom-radio:has(input[type="radio"]:checked) {
  border-color: var(--wfd-accent) !important;
}
.custom-checkbox input[type="checkbox"]:focus + span,
.custom-radio input[type="radio"]:focus + span {
  outline: 2px solid var(--wfd-accent);
  outline-offset: 2px;
}

/* Étape "Paiement" : libellés des moyens de paiement ("Payer par chèque",
   "Payer par virement bancaire") en #232323 codé en dur, invisibles */
.payment-option label span,
.payment-option label,
.payment-options label {
  color: var(--wfd-text) !important;
}

/* Récapitulatif final de la commande avant paiement : conteneur en blanc
   pur (#ffffff) codé en dur dans theme.css ; le texte est déjà clair grâce
   aux règles générales ci-dessus, seul le fond doit être corrigé */
.order-confirmation-table {
  background-color: var(--wfd-panel) !important;
}
.order-confirmation-table td,
.order-confirmation-table th {
  border-color: var(--wfd-border) !important;
}
.order-confirmation-table tr.total-value,
.order-confirmation-table tr.total-value td {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-accent-fg) !important;
}

/* Page "Contactez-nous" : bloc "Informations" (adresse, e-mail) en
   #232323 / #7a7a7a codés en dur dans theme.css, invisibles sur fond sombre */
.contact-rich,
.contact-rich .block,
.contact-rich .block .data,
.contact-rich .block .data * {
  color: var(--wfd-text) !important;
}
.contact-rich .block .data a {
  color: var(--wfd-accent-fg) !important;
}
.contact-rich hr {
  border-color: var(--wfd-border) !important;
}

/* Version mobile : les sous-menus dépliants du footer ("Notre société",
   "Votre compte", "Informations") ont un fond gris clair #f6f6f6 codé en
   dur dans theme.css (règle spécifique au mode accordéon mobile), invisible
   en desktop mais bien présent en mobile */
#footer .collapse,
.footer-container .collapse,
[id^="footer_sub_menu_"] {
  background-color: var(--wfd-panel) !important;
}
#footer .collapse a,
.footer-container .collapse a,
[id^="footer_sub_menu_"] a {
  color: var(--wfd-text-muted) !important;
}
#footer .collapse a:hover,
.footer-container .collapse a:hover,
[id^="footer_sub_menu_"] a:hover {
  color: var(--wfd-accent-fg) !important;
}

/* Version mobile : le menu déroulant du burger (catégories, langue,
   Contactez-nous) a un fond blanc #ffffff codé en dur dans theme.css */
#mobile_top_menu_wrapper {
  background-color: var(--wfd-bg) !important;
  border-color: var(--wfd-border) !important;
}
#mobile_top_menu_wrapper .top-menu,
#mobile_top_menu_wrapper .category {
  border-color: var(--wfd-border) !important;
}

/* Page "Mon compte" : tuiles (Informations, Adresses, Historique et détails
   de mes commandes, Avoirs, Mes listes d'envies, Mes données personnelles)
   en fond blanc/clair codé en dur, avec icônes Material Icons en #232323
   (theme.css) invisibles sur fond sombre */
.page-my-account #content .links a,
.page-my-account #content .links .link-item {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.page-my-account #content .links a:hover,
.page-my-account #content .links .link-item:hover {
  background-color: var(--wfd-bg) !important;
  color: var(--wfd-accent-fg) !important;
}
.page-my-account #content .links a i,
.page-my-account #content .links a i.material-icons,
.page-my-account #content .links .link-item i {
  color: var(--wfd-accent-fg) !important;
}
.page-my-account #content .links a span {
  color: var(--wfd-text) !important;
}

/* Page "Adresses" : tuile carte d'adresse en fond blanc #fff, texte #232323
   codés en dur dans theme.css (même bug récurrent) */
.page-addresses .address,
.address-body,
.address-body address {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.page-addresses .address h4,
.address-body h4 {
  color: var(--wfd-text) !important;
}
.address-footer,
.address-footer a {
  color: var(--wfd-accent-fg) !important;
}

/* Tableaux génériques du compte client (Historique de vos commandes, Avoirs,
   etc.) : en-tête en fond gris clair #f6f6f6 et texte #7a7a7a codés en dur
   dans theme.css, bordures #f6f6f6 quasi invisibles sur fond sombre */
.table,
.table-bordered,
.table-labeled,
.thead-default {
  background-color: var(--wfd-panel) !important;
}
.thead-default th,
.table thead th,
.table td,
.table th {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-text) !important;
  border-color: var(--wfd-border) !important;
}
.table-bordered,
.table-bordered td,
.table-bordered th {
  border-color: var(--wfd-border) !important;
}

/* Tunnel de commande, étape "Adresses" : tuiles de sélection d'adresse
   (facturation/livraison) en fond blanc codé en dur dans theme.css, avec
   titre "Mon adresse" et texte de l'adresse en #232323 */
.address-selector .js-address-item,
.address-selector .address-item,
#checkout .js-address-item {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.address-selector .js-address-item.selected,
.address-selector .address-item.selected {
  border-color: var(--wfd-accent) !important;
}
.address-selector .js-address-item header,
.address-selector .address-item header {
  color: var(--wfd-text) !important;
}
.address-selector hr {
  border-color: var(--wfd-border) !important;
}
.address-selector .address-footer a {
  color: var(--wfd-accent-fg) !important;
}

/* Page "Mon compte > Mes données personnelles" (module RGPD/psgdpr) : les
   blocs d'info ("Accès à mes données", "Demande de rectification...") ont
   un fond blanc/clair codé en dur par le module, texte gris difficile à
   lire sur fond sombre */
[class*="psgdprinfo"] {
  background-color: var(--wfd-panel) !important;
  color: var(--wfd-text) !important;
  border-color: var(--wfd-border) !important;
}
[class*="psgdprinfo"] p {
  color: var(--wfd-text) !important;
}
[class*="psgdprinfo"] a {
  color: var(--wfd-accent-fg) !important;
}

/* Fiche produit : miniature sélectionnée sous l'image principale, bordure
   en bleu PrestaShop #24b9d7 codé en dur dans theme.css (09/10/2026) */
.product-images > li.thumb-container > .thumb.selected,
.product-images > li.thumb-container > .thumb:hover,
.js-thumb-selected {
  border-color: var(--wfd-accent) !important;
}

/* Fiche produit : encadré « bêta privée réservée au Club Cantar » injecté par
   le module WFD avec des styles en ligne (fond #fafafa, bouton noir) - pas de
   classe ni d'id, d'où le sélecteur par attribut style (09/10/2026) */
.product-actions > div[style] {
  background: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}
.product-actions > div[style] p {
  color: var(--wfd-text-muted) !important;
}
.product-actions > div[style] a {
  background: var(--wfd-accent) !important;
  color: var(--wfd-accent-text) !important;
}
.product-actions > div[style] a:hover {
  filter: brightness(1.08);
}

/* ===== Passe de vérification sur toutes les pages (09/10/2026) ===== */

/* Liste d'envies (module blockwishlist) : bouton cœur sur les cartes produit
   (catégorie, recherche) en rond blanc codé en dur par le module */
.wishlist-button-add {
  background-color: var(--wfd-panel) !important;
  border: 1px solid var(--wfd-border) !important;
  box-shadow: none !important;
}
.wishlist-button-add i,
.wishlist-button-add i.material-icons {
  color: var(--wfd-accent-fg) !important;
}

/* Liste d'envies : fenêtres modales (ajouter, créer, renommer, partager,
   supprimer, connexion requise) en fond blanc, titres et libellés
   quasi invisibles (contraste 1,1) */
.wishlist-modal .modal-content,
.wishlist-modal .modal-header,
.wishlist-modal .modal-body,
.wishlist-modal .modal-footer {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.wishlist-modal .modal-title,
.wishlist-modal .form-control-label,
.wishlist-modal p,
.wishlist-modal .close,
.wishlist-modal .close span {
  color: var(--wfd-text) !important;
}
.wishlist-modal .modal-cancel,
.wishlist-modal .btn-secondary {
  background-color: transparent !important;
  border: 1px solid var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.wishlist-modal .btn-primary {
  color: var(--wfd-accent-text) !important;
}
.wishlist-list-item,
.wishlist-list-item a,
.wishlist-products-item {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
}

/* Liste d'envies : notification « Produit ajouté... » en bas d'écran,
   fond blanc + texte gris = illisible */
.wishlist-toast {
  background-color: var(--wfd-panel) !important;
  border: 1px solid var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.wishlist-toast .wishlist-toast-text {
  color: var(--wfd-text) !important;
}

/* Bleu Bootstrap/PrestaShop (#24b9d7) restant : liens .text-primary
   (« Créer une nouvelle liste »...) */
.text-primary,
a.text-primary,
.text-primary i.material-icons {
  color: var(--wfd-accent-fg) !important;
}

/* Page Contact : bouton « Choisir un fichier » (pièce jointe) en bleu
   PrestaShop avec texte peu lisible */
.bootstrap-filestyle .btn,
.bootstrap-filestyle label.btn,
.group-span-filestyle .btn {
  background-color: var(--wfd-accent) !important;
  border-color: var(--wfd-accent) !important;
  color: var(--wfd-accent-text) !important;
}
.bootstrap-filestyle .btn .buttonText,
.group-span-filestyle .buttonText {
  color: var(--wfd-accent-text) !important;
}

/* Messages d'information (Avoirs, Bons de réduction vides...) :
   .alert-info bleu clair codé en dur */
.alert-info {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  border-left: 3px solid var(--wfd-accent) !important;
  color: var(--wfd-text) !important;
}
.alert-info * {
  color: var(--wfd-text) !important;
}

/* Mes données personnelles (psgdpr) : boutons « Exporter mes données »
   rouges sur rouge, la règle [class*="psgdprinfo"] a l'emportait */
[class*="psgdprinfo"] a.btn-primary,
a.btn-primary,
a.btn-primary:hover {
  color: var(--wfd-accent-text) !important;
}
/* Les modales de la liste d'envies sont rendues dans #footer : la règle
   « #footer a » (gris) l'emportait sur le bouton « Connexion » */
#footer a.btn-primary,
#footer a.btn-primary:hover,
.footer-container a.btn-primary,
.footer-container a.btn-primary:hover {
  color: var(--wfd-accent-text) !important;
}

/* Champs préremplis par le navigateur (Chrome) : fond bleu clair */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--wfd-text) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--wfd-panel) inset !important;
  caret-color: var(--wfd-text);
}

/* Détail d'une commande (Mon compte > Commandes > Détails) : blocs .box
   (n° de commande, moyen de paiement, adresses, produits) en fond blanc
   codé en dur, texte clair dessus = illisible (09/10/2026) */
.box,
.page-order-detail .box,
#order-infos.box,
#invoice-address.box,
#delivery-address.box {
  background-color: var(--wfd-panel) !important;
  border: 1px solid var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}

/* Détail d'une commande : formulaire « Ajouter un message », bandes noires
   dues à la règle générique « section » du haut de fichier */
.order-message-form section,
.order-message-form .form-fields,
.order-message-form .form-group {
  background-color: transparent !important;
}

/* Footer : rectangles de teintes différentes dus à la règle générique
   [class*="block"] / section / .container du haut de fichier */
#footer [class*="block"],
#footer [id*="block"],
#footer .container,
#footer section,
.footer-container [class*="block"],
.footer-container [id*="block"],
.footer-container .container,
.footer-container section {
  background-color: transparent !important;
}

/* ===== Vérification au clic, compte connecté (09/10/2026) ===== */

/* Fiche produit : légende sous l'image agrandie (clic sur l'image) en
   bandeau blanc avec texte clair = illisible */
#product-modal .image-caption,
#product-modal figcaption {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text-muted) !important;
}
#product-modal .image-caption * {
  color: var(--wfd-text-muted) !important;
}

/* Recherche : liste de suggestions (autocomplete jQuery UI) en fond blanc,
   survol gris clair + texte blanc = invisible */
.ui-autocomplete,
.ui-autocomplete.ui-menu {
  background-color: var(--wfd-panel) !important;
  border: 1px solid var(--wfd-border) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .5) !important;
}
.ui-autocomplete .ui-menu-item a,
.ui-autocomplete .ui-menu-item a span {
  color: var(--wfd-text) !important;
  background-color: transparent !important;
  border: none !important;
}
.ui-autocomplete .ui-menu-item a.ui-state-focus,
.ui-autocomplete .ui-menu-item a.ui-state-active,
.ui-autocomplete .ui-menu-item a:hover {
  background-color: var(--wfd-bg) !important;
  color: var(--wfd-accent-fg) !important;
  margin: 0 !important;
}
.ui-autocomplete .ui-menu-item a.ui-state-focus span,
.ui-autocomplete .ui-menu-item a:hover span {
  color: var(--wfd-accent-fg) !important;
}

/* Catégorie : fenêtre « Aperçu rapide » en gris clair #f6f6f6, titre
   produit et libellé « Quantité » invisibles */
.quickview .modal-content,
.quickview .modal-header,
.quickview .modal-body,
.quickview .modal-footer {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.quickview h1,
.quickview .h1,
.quickview .control-label,
.quickview .close,
.quickview .close span {
  color: var(--wfd-text) !important;
}

/* Sélecteur de quantité (boutons +/-) en blanc */
.bootstrap-touchspin .btn-touchspin,
.btn-touchspin {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.bootstrap-touchspin .btn-touchspin i,
.btn-touchspin i {
  color: var(--wfd-text) !important;
}
.bootstrap-touchspin input,
.product-quantity #quantity_wanted {
  background-color: var(--wfd-bg) !important;
  color: var(--wfd-text) !important;
  border-color: var(--wfd-border) !important;
}

/* Boutons de partage (Facebook, Twitter, Pinterest) : pastilles blanches */
.social-sharing li {
  background-color: var(--wfd-bg) !important;
  border: 1px solid var(--wfd-border) !important;
  box-shadow: none !important;
}
.social-sharing li:hover {
  border-color: var(--wfd-accent) !important;
}
.social-sharing span {
  color: var(--wfd-text) !important;
}

/* Informations personnelles / formulaires : boutons « Afficher » le mot de
   passe en gris #7a7a7a hors charte */
.input-group-btn .btn,
button[data-action="show-password"] {
  background-color: var(--wfd-panel) !important;
  border: 1px solid var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
button[data-action="show-password"]:hover {
  border-color: var(--wfd-accent) !important;
  color: var(--wfd-accent-fg) !important;
}

/* Adresses : trait gris clair au-dessus de « Mettre à jour / Supprimer » */
.address-footer,
.address hr {
  border-color: var(--wfd-border) !important;
}

/* ===== PÉRIODE « RÉSERVÉ CLUB CANTAR » (09/10/2026) =====
   Bouton « Aperçu rapide » masqué : la fenêtre affichait un vrai bouton
   « Ajouter au panier » qui contournait l'encadré bêta privée (le serveur
   bloque bien l'ajout, mais sans aucun message pour le client).
   >>> À SUPPRIMER à l'ouverture de l'essai et de l'achat au public. <<< */
.quick-view,
.js-quick-view,
.product-miniature .highlighted-informations {
  display: none !important;
}

/* ===== Tunnel de commande, test complet (09/10/2026) ===== */

/* Pastilles numérotées des étapes : étape en cours en vert #00c062 codé en
   dur dans theme.css, autres étapes avec un contour #232323 invisible */
#checkout .checkout-step .step-number {
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text-muted) !important;
  background-color: transparent !important;
}
#checkout .checkout-step.-current .step-number,
#checkout .checkout-step.-complete .step-number {
  background-color: var(--wfd-accent) !important;
  border-color: var(--wfd-accent) !important;
  color: var(--wfd-accent-text) !important;
}
/* Coche verte « étape terminée » */
#checkout .checkout-step .step-title .done,
#checkout .checkout-step i.done {
  color: var(--wfd-accent-fg) !important;
}
/* Traits de séparation entre étapes en gris clair #ddd */
#checkout .checkout-step .step-title,
#checkout .checkout-step {
  border-color: var(--wfd-border) !important;
}

/* Popup « Produit ajouté au panier » : « Commander » était un bouton
   contour comme « Continuer mes achats » ; on le remet en bouton plein
   pour bien marquer l'action principale */
#blockcart-modal .cart-content-btn .btn-primary {
  background-color: var(--wfd-accent) !important;
  border-color: var(--wfd-accent) !important;
  color: var(--wfd-accent-text) !important;
}
#blockcart-modal .cart-content-btn .btn-primary * {
  color: var(--wfd-accent-text) !important;
}

/* Messages d'alerte (erreur, avertissement, succès) : fonds pastel clairs
   codés en dur par Bootstrap (ex. « Une licence Wave File Doctor est déjà
   associée à cette adresse e-mail » en rose clair sur le panier) */
.alert-danger,
.alert-warning,
.alert-success {
  background-color: var(--wfd-panel) !important;
  border-color: var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.alert-danger  { border-left: 3px solid var(--wfd-accent) !important; }
.alert-warning { border-left: 3px solid #f0a020 !important; }
.alert-success { border-left: 3px solid #3fb950 !important; }
.alert-danger *,
.alert-warning *,
.alert-success * {
  color: var(--wfd-text) !important;
}
.alert-danger a,
.alert-warning a,
.alert-success a {
  color: var(--wfd-accent-fg) !important;
}

/* Tunnel de commande : bandes plus sombres derrière les formulaires et le
   récapitulatif « Veuillez vérifier votre commande », dues à la règle
   générique « section » du haut de fichier ; cadre blanc #e5e5e5 autour
   des articles de la commande */
#checkout section,
#checkout .form-fields,
#order-summary-content,
#order-summary-content section,
#order-summary-content .row,
#order-summary-content .col-md-12 {
  background-color: transparent !important;
}
#order-summary-content .card,
#order-summary-content .card-block {
  border: 1px solid var(--wfd-border) !important;
}
.order-confirmation-table {
  border-color: var(--wfd-border) !important;
}

/* Page de confirmation de commande : encadré « Votre licence Wave File
   Doctor » du module wfdlicenceemission (bordure #ddd en ligne, code
   d'activation en gris peu lisible alors que c'est l'info principale) */
.wfd-licence-bloc {
  background-color: var(--wfd-panel) !important;
  border: 1px solid var(--wfd-accent) !important;
  border-left-width: 3px !important;
}
.wfd-licence-bloc h4 {
  color: var(--wfd-text) !important;
}
.wfd-licence-bloc p {
  color: var(--wfd-text-muted) !important;
}
.wfd-licence-bloc p[style*="letter-spacing"] {
  color: var(--wfd-text) !important;
  font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
  font-size: 1.6em !important;
}
.wfd-licence-bloc .btn-primary {
  color: var(--wfd-accent-text) !important;
}

/* Fiche produit : bouton « Donnez votre avis » (module productcomments)
   en gris Bootstrap hors charte */
.product-comment-modal .btn-comment,
.btn-comment,
.post-product-comment {
  background-color: transparent !important;
  border: 1px solid var(--wfd-border) !important;
  color: var(--wfd-text) !important;
}
.btn-comment i,
.post-product-comment i {
  color: var(--wfd-accent-fg) !important;
}
.btn-comment:hover,
.post-product-comment:hover {
  border-color: var(--wfd-accent) !important;
}