/**
 * Custom site styles (migrated from Apparence > Personnaliser > CSS
 * additionnel — that field has no linting, a 64KB-ish practical limit
 * and no dev-tools source mapping, which is how invalid tokens and
 * duplicate rules had quietly accumulated here over time).
 *
 * Edit this file directly; it's enqueued from
 * inc/custom-styles.php. Cleared of exact duplicates, an old dead
 * .wc-block-product-filters__* section (that widget was replaced by
 * the YITH category filter, see inc/mobile-category-toggle.php), and
 * a couple of invalid declarations on 2026-09-11.
 */

/* Masque la barre de navigation mobile WooCommerce */
.storefront-handheld-footer-bar {
  display: none !important;
}
.handheld-footer-bar{
  display: none !important;
}

.elementor-widget-wc-categories .product-category img,
.elementor-widget-wc-categories .count {
  display: none !important;
}/* ── Conteneur horizontal ── */
#preset_550 .filter-title { display: none; }
#preset_550 .show-more { display: none !important; }

#preset_550 ul.filter-items {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  gap: 4px 24px;
  padding: 0;
  margin: 0;
  list-style: none;
}

#preset_550 .filter-item {
  width: auto !important;
  float: none;
}

/* ── Texte cliquable — état normal ── */
#preset_550 .term-label {
  display: inline-block;
  padding: 4px 0;
  color: #20314f;
  font-size: 0.9rem;
  font-weight: 400;
  text-decoration: none;
  border-bottom: 1.5px solid transparent;
  transition: border-color 150ms ease, font-weight 150ms ease;
}

/* ── Hover ── */
#preset_550 .term-label:hover {
  border-bottom-color: #20314f;
}

/* ── Actif / sélectionné ── */
#preset_550 .filter-item.active .term-label {
  font-weight: 700;
}

/* ── Bouton Reset ── */
#preset_550 ~ form .yith-wcan-reset-filters,
.yith-wcan-reset-filters.reset-filters {
  display: inline-block;
  background: none;
  border: none;
  color: #20314f;
  font-size: 0.8rem;
  font-weight: 400;
  padding: 4px 0;
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 150ms ease;
  margin-bottom: 16px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.yith-wcan-reset-filters.reset-filters:hover {
  opacity: 1;
}


/* Suppression du padding-top pour toutes les tailles d'écran */
.panel-content .wrap {
    padding-top: 0 !important;
}

/* Ajustement ou suppression du padding-bottom si nécessaire */
.panel-content .wrap {
    padding-bottom: 0 !important;
}

/* Neutralisation spécifique des Media Queries */
@media screen and (min-width: 30em) {
    .panel-content .wrap {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

@media screen and (min-width: 48em) {
    .panel-content .wrap {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}


/* ==========================================================================
   STYLE PERSONNALISÉ PANIER WOOCOMMERCE - COULEUR #20314F
   ========================================================================== */

:root {
    --auros-primary: #20314f;
    --auros-primary-hover: #16243a;
    --auros-light-bg: #fcfcfc;
    --auros-border: #e2e2e2;
    --auros-bg-light: #fcfcfc; /* alias kept for rules written against this name */
}

/* --- 1. STRUCTURE GLOBALE & TITRES --- */
.wc-block-cart .wc-block-components-product-name {
    color: var(--auros-primary) !important;
    font-weight: 600 !important;
    text-decoration: none;
}

.wc-block-cart-items__header {
    border-bottom: 2px solid var(--auros-primary) !important;
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* --- 2. LISTE DES PRODUITS & QUANTITÉ --- */
.wc-block-cart-item__image img {
    border-radius: 4px;
}

.wc-block-components-quantity-selector {
    border: 1px solid var(--auros-border) !important;
    border-radius: 4px !important;
    max-width: 120px;
}

.wc-block-components-quantity-selector__button {
    background: #f8f9fa !important;
    color: var(--auros-primary) !important;
    border: none !important;
}

.wc-block-components-quantity-selector__button:hover {
    background: #eeeeee !important;
}

.wc-block-cart-item__remove-link {
    color: #999 !important;
    transition: color 0.3s;
}

.wc-block-cart-item__remove-link:hover {
    color: #d11a2a !important;
}

/* --- 3. BARRE LATÉRALE (RÉSUMÉ) --- */
.wc-block-cart__sidebar {
    background-color: var(--auros-light-bg) !important;
    border: 1px solid #eeeeee !important;
    padding: 25px !important;
    border-radius: 8px;
}

.wc-block-cart__totals-title {
    color: var(--auros-primary) !important;
    border-bottom: 1px solid #ddd;
    padding-bottom: 15px;
    margin-bottom: 20px !important;
    font-weight: 700 !important;
}

/* --- 4. BLOC CODE PROMO (COUPON) --- */
/* Bouton d'ouverture */
.wc-block-components-panel__button {
    color: var(--auros-primary) !important;
    font-weight: 600 !important;
    padding: 10px 0 !important;
    display: flex;
    align-items: center;
}

.wc-block-components-panel__button-icon {
    fill: var(--auros-primary) !important;
}

/* Formulaire interne */
.wc-block-components-totals-coupon__form {
    display: flex !important;
    gap: 10px;
    margin-top: 15px;
}

.wc-block-components-totals-coupon__input input {
    border: 1px solid var(--auros-border) !important;
    border-radius: 4px !important;
    padding: 10px 15px !important;
    height: 45px !important;
}

.wc-block-components-totals-coupon__input input:focus {
    border-color: var(--auros-primary) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(32, 49, 79, 0.1) !important;
}

/* Bouton Appliquer */
.wc-block-components-totals-coupon__button {
    background-color: var(--auros-primary) !important;
    color: #fff !important;
    border-radius: 4px !important;
    height: 45px !important;
    padding: 0 20px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

.wc-block-components-totals-coupon__button:disabled {
    background-color: #ccc !important;
    opacity: 0.6;
}

.wc-block-components-totals-coupon__button:hover:not(:disabled) {
    background-color: var(--auros-primary-hover) !important;
}

/* --- 5. BOUTON VALIDER LA COMMANDE --- */
.wc-block-cart__submit-button {
    background-color: var(--auros-primary) !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    padding: 18px !important;
    font-weight: bold !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.1em !important;
    transition: all 0.3s ease !important;
    border: none !important;
    width: 100%;
    display: block;
    text-align: center;
}

.wc-block-cart__submit-button:hover {
    background-color: var(--auros-primary-hover) !important;
    box-shadow: 0 4px 12px rgba(32, 49, 79, 0.25);
    transform: translateY(-1px);
}

/* --- 6. RÉGLAGES FINAUX & RESPONSIVE --- */
.wc-block-components-totals-footer-item-tax-value {
    font-weight: 700;
    color: var(--auros-primary);
    font-size: 1.2em;
}

@media (max-width: 768px) {
    .wc-block-components-totals-coupon__form {
        flex-direction: column;
    }
    
    .wc-block-components-totals-coupon__button {
        width: 100%;
    }
}

/* On force le padding et le margin à 0 pour tous les titres */
h1, h2, h3, h4, h5, h6 {
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
    /* On garde un petit margin-bottom si vous voulez que le texte en dessous ne colle pas */
    margin-bottom: 0.5em !important; 
}

/* On enlève aussi la règle spécifique au premier enfant */
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
/* --- Uniquement pour la page Contact (ID 40) --- */

/* 1. On force le conteneur du thème Auros à prendre 100% */
.page-id-40 #content, 
.page-id-40 .site-content, 
.page-id-40 .site-content > .wrap, 
.page-id-40 #primary {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 2. On enlève les padding automatiques d'Elementor sur cette page si besoin */
.page-id-40 .elementor-40 .elementor-section-wrap {
    padding: 0 !important;
}

/* 3. On s'assure que le contenu n'est pas bridé par le thème */
.page-id-40 .entry-content {
    max-width: 100% !important;
    width: 100% !important;
}



/* ==========================================================================
   STYLE PERSONNALISÉ CHECKOUT (COMMANDE) - COULEUR #20314F
   ========================================================================== */


/* --- 1. TITRES DES ÉTAPES --- */
.wc-block-checkout .wc-block-components-title,
.wc-block-checkout h2,
.wc-block-checkout h3 {
    color: var(--auros-primary) !important;
    font-family: "Futura LT Pro", sans-serif !important;
    font-weight: bold !important;
    margin-bottom: 20px !important;
}

/* --- 2. CORRECTION DES CHAMPS (INPUTS & SELECTS) --- 
   Répare le chevauchement du label et du texte */

.wc-block-components-text-input, 
.wc-block-components-country-input,
.wc-blocks-components-select {
    margin-bottom: 15px !important;
    position: relative;
}

/* Ajustement de la hauteur pour laisser de la place au label */
.wc-block-components-text-input input,
.wc-block-components-address-form input,
.wc-blocks-components-select__select {
    padding-top: 25px !important; /* Crée l'espace pour le label qui descend */
    padding-bottom: 10px !important;
    height: 55px !important;
    border: 1px solid var(--auros-border) !important;
    border-radius: 4px !important;
    font-size: 16px !important;
}

/* Style du label (l'étiquette) */
.wc-block-components-text-input label,
.wc-blocks-components-select__label {
    top: 8px !important; /* Force le label à rester en haut */
    left: 15px !important;
    font-size: 12px !important;
    color: #888 !important;
    transition: all 0.2s ease;
    z-index: 2;
}

/* Focus sur les champs */
.wc-block-components-text-input input:focus,
.wc-blocks-components-select__select:focus {
    border-color: var(--auros-primary) !important;
    box-shadow: 0 0 0 2px rgba(32, 49, 79, 0.1) !important;
    outline: none !important;
}

/* --- 3. SIDEBAR (RÉSUMÉ DE COMMANDE) --- */
.wc-block-checkout__sidebar {
    background-color: var(--auros-bg-light) !important;
    border: 1px solid var(--auros-border) !important;
    padding: 30px !important;
    border-radius: 4px;
}

.wc-block-components-checkout-order-summary__title-text {
    color: var(--auros-primary) !important;
    font-weight: bold !important;
    font-size: 1.2em;
}

/* Ligne du Total final */
.wc-block-components-totals-footer-item {
    border-top: 2px solid var(--auros-primary) !important;
    padding-top: 15px !important;
    margin-top: 15px !important;
}

.wc-block-components-totals-footer-item-tax-value {
    color: var(--auros-primary);
    font-weight: 800;
    font-size: 1.4em;
}

/* --- 4. BOUTON COMMANDER --- */
.wc-block-components-checkout-place-order-button {
    background-color: var(--auros-primary) !important;
    color: #ffffff !important;
    padding: 22px !important;
    border-radius: 4px !important;
    font-weight: bold !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    width: 100% !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

.wc-block-components-checkout-place-order-button:hover {
    background-color: var(--auros-primary-hover) !important;
    box-shadow: 0 5px 15px rgba(32, 49, 79, 0.25);
    transform: translateY(-2px);
}

/* --- 5. CHECKBOX & TEXTES LÉGAUX --- */
.wc-block-components-checkbox__input:checked {
    background-color: var(--auros-primary) !important;
    border-color: var(--auros-primary) !important;
}

.wc-block-checkout__terms {
    font-size: 0.9em;
    color: #666;
    margin-top: 20px;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 4px;
}

/* Correction responsive pour mobile */
@media (max-width: 768px) {
    .wc-block-checkout__sidebar {
        padding: 20px !important;
        margin-top: 20px;
    }
}
/* Uniquement pour les écrans de téléphone et tablettes (moins de 992px) */
@media (max-width: 991px) {
    /* On transforme le conteneur en boîte flexible verticale */
    .site-content > .wrap {
        display: flex !important;
        flex-direction: column !important;
    }

    /* On donne l'ordre 1 aux filtres (ils montent) */
    #secondary {
        order: 1 !important;
        width: 100% !important;
        margin-bottom: 20px !important; /* Espace avant les produits */
        /* Le thème fixe "flex: 0 0 340px" pour #secondary (style.css,
           dès 769px) : pensé pour une colonne large en mode ligne, ce
           340px devient une HAUTEUR une fois qu'on repasse .wrap en
           colonne ci-dessus — la liste de catégories se retrouvait
           coupée à 340px de haut et débordait sur la grille produits
           en dessous (bug détecté en tablette, ~769–991px). On annule
           ce flex-basis hérité pour laisser la hauteur s'adapter au
           contenu réel. */
        flex: 1 1 auto !important;
        height: auto !important;
        max-height: none !important;
    }

    /* On donne l'ordre 2 aux produits (ils descendent) */
    #primary {
        order: 2 !important;
        width: 100% !important;
        flex: 1 1 auto !important;
    }
}



/* ==========================================================================
   1. DÉCLARATION DES POLICES (BOLD & MEDIUM)
   ========================================================================== */
@font-face {
    font-family: 'Futura LT Pro';
    src: url('https://dev8.exesdev.ch/wp-content/uploads/2026/04/FuturaLTProBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Futura LT Pro';
    src: url('https://dev8.exesdev.ch/wp-content/uploads/2026/04/FuturaLTProMedium.woff2') format('woff2');
    font-weight: 500; /* Medium */
    font-style: normal;
}

/* ==========================================================================
   2. APPLICATION NUCÉLAIRE (TOUT LE SITE EN FUTURA)
   ========================================================================== */
/* On cible TOUS les éléments possibles pour forcer la police */
*, html, body, p, a, li, span, div, input, button, select, textarea, label, 
td, th, blockquote, .woocommerce, .elementor-widget-container, .menu-item a {
    font-family: 'Futura LT Pro', sans-serif !important;
    font-weight: 500; /* Medium par défaut pour le texte courant */
}

/* On force le Bold pour les titres et les éléments importants */
h1, h2, h3, h4, h5, h6, strong, b, .site-title, .entry-title, .widget-title, .button, .elementor-button {
    font-family: 'Futura LT Pro', sans-serif !important;
    font-weight: bold !important;
}
/* ==========================================================================
   3. FIX : EN-TÊTE BLANC AU SCROLL ET MOBILE PAR DÉFAUT
   ========================================================================== */

/* Transition globale pour la fluidité */
.elementor-element-6eb929d9 {
    transition: background-color 0.4s ease-in-out, box-shadow 0.4s ease-in-out !important;
}

/* --- ÉTAT PAR DÉFAUT SUR MOBILE (Dès le chargement) --- */
@media (max-width: 767px) {
    .elementor-element-6eb929d9 {
        background-color: #ffffff !important;
    }
    
    /* On force la couleur des liens et du bouton menu (hamburger) sur mobile */
    .elementor-element-6eb929d9 .menu-item a,
    .elementor-element-6eb929d9 .elementor-menu-toggle i {
        color: #20314f !important;
    }
}

/* --- ÉTAT AU SCROLL (Sticky Effects pour Desktop/Tablette) --- */
.elementor-element-6eb929d9.elementor-sticky--effects {
    background-color: #ffffff !important;
}

.elementor-element-6eb929d9.elementor-sticky--effects .menu-item a {
    color: #20314f !important;
}



.woocommerce-info, .woocommerce-noreviews, p.no-comments {
    background-color: #23375f !important;
}

/* ==========================================================================
   FIX : LOGO MASQUÉ/TRANSPARENT AVANT SCROLL -> APPARITION AU SCROLL
   ========================================================================== */

/* 1. ÉTAT INITIAL (Avant le scroll) : On force l'invisibilité du logo */
.elementor-element-6eb929d9:not(.elementor-sticky--effects) .elementor-element-73387ce {
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out !important;
}

/* 2. ÉTAT AU SCROLL : Dès que la classe sticky s'active, le logo apparaît */
.elementor-element-6eb929d9.elementor-sticky--effects .elementor-element-73387ce {
    opacity: 1 !important;
    visibility: visible !important;
	    transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out !important;
}

/* ==========================================================================
   AJUSTEMENT DE LA LARGEUR DE LA BOUTIQUE À 90%
   ========================================================================== */
@media (min-width: 1200px) {
    /* Aligne le conteneur global à 90% de la largeur de l'écran et le centre */
    .site-content > .wrap {
        max-width: 95% !important;
        width: 95% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* ==========================================================================
   RÉDUCTION DE L'ESPACE EN HAUT DU BOUTON FILTRE (BOUTIQUE)
   ========================================================================== */

/* Ajustement global de la zone principale de la boutique */
.archive.woocommerce #main.site-main,
.archive.woocommerce #primary.content-area {
    padding-top: 5px !important;
    margin-top: 0 !important;
}

/* ==========================================================================
   SUPPRESSION DE LA BORDURE DES VIGNETTES ET DU SÉLECTEUR DE QUANTITÉ
   ========================================================================== */
/* Galerie d'images miniatures */
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.flex-control-thumbs li {
    border: none !important;
}

/* Bloc quantité à côté du bouton d'ajout au panier */
.single-product div.product form.cart .quantity {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* ==========================================================================
   ACCORDÉON PRODUIT À 95% CENTRÉ
   ========================================================================== */
#osf-accordion-container.woocommerce-tabs {
    max-width: 95% !important;
    width: 95% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ==========================================================================
   FIX COUPE-CONFLIT DASHLANE : ICÔNE ŒIL VECTORIELLE (SANS ÉMOJI)
   ========================================================================== */

/* 1. Prépare le conteneur parent */
.woocommerce-form-row span.password-input {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

/* 2. Positionne le bouton de WooCommerce au-dessus de Dashlane */
button.show-password-input {
    position: absolute !important;
    top: 50% !important;
    right: 45px !important; /* Décalé à gauche pour laisser la place à Dashlane tout à droite */
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: none !important;
    width: 24px !important;
    height: 24px !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 99999 !important; /* Passe au premier plan pour rester cliquable */
}

/* 3. Injecte l'icône vectorielle officielle de WooCommerce (\e03d = Œil) */
button.show-password-input::after {
    content: "\e03d" !important; 
    font-family: "WooCommerce" !important;
    font-size: 18px !important;
    color: #20314f !important; /* Ton bleu */
    display: block !important;
    speak: none;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
}

/* 4. Quand on clique (mot de passe visible), l'icône se transforme en œil barré (\e03c) */
button.show-password-input.display-password::after {
    content: "\e03c" !important;
}
/* ==========================================================================
   REFONTE ET MODERNISATION DU TABLEAU DU PANIER (WOOCOMMERCE BLOCKS)
   ========================================================================== */

/* --- 1. Nettoyage global de la table --- */
table.wc-block-cart-items {
    border-collapse: collapse !important;
    border: none !important;
    width: 100% !important;
}

/* En-tête du tableau plus discret et professionnel */
tr.wc-block-cart-items__header {
    border-bottom: 2px solid #20314f !important; /* Ta couleur principale */
    background: transparent !important;
}

tr.wc-block-cart-items__header th {
    padding: 15px 10px !important;
    font-family: 'Futura LT Pro', sans-serif !important;
    font-weight: bold !important;
    color: #20314f !important;
    text-transform: uppercase;
    font-size: 0.85rem !important;
    letter-spacing: 0.5px;
    border: none !important;
}

/* --- 2. Lignes de produits (Rows) --- */
tr.wc-block-cart-items__row {
    border-bottom: 1px solid #eeeeee !important;
    background-color: #ffffff !important;
    transition: background-color 0.2s ease;
}

tr.wc-block-cart-items__row:hover {
    background-color: #fcfcfc !important; /* Léger effet de survol */
}

tr.wc-block-cart-items__row td {
    padding: 25px 10px !important;
    vertical-align: middle !important;
    border: none !important;
}

/* --- 3. Alignement des cellules --- */

/* Image du produit */
td.wc-block-cart-item__image {
    width: 90px !important;
    max-width: 90px !important;
}

td.wc-block-cart-item__image img {
    border-radius: 6px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    border: 1px solid #f0f0f0 !important;
}

/* Détails du produit (Nom, Prix, Quantité) */
.wc-block-cart-item__wrap {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.wc-block-cart-item__product .wc-block-components-product-name {
    font-size: 1.05rem !important;
    font-weight: bold !important;
    color: #20314f !important;
}

/* Prix unitaire sous le titre */
.wc-block-cart-item__prices .wc-block-components-product-price__value {
    font-size: 0.9rem !important;
    color: #666666 !important;
}

/* Description (Ex: En bois de hêtre) */
.wc-block-components-product-metadata__description p {
    font-size: 0.85rem !important;
    color: #888888 !important;
    margin: 0 !important;
}

/* --- 4. Bloc Quantité & Bouton Supprimer --- */
.wc-block-cart-item__quantity {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    margin-top: 10px !important;
}

/* Sélecteur de quantité plus fin */
.wc-block-cart-item__quantity .wc-block-components-quantity-selector {
    height: 36px !important;
    border: 1px solid #e2e2e2 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    overflow: hidden;
    max-width: 105px !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector__input {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    color: #20314f !important;
}

/* Bouton Supprimer (Poubelle) mieux intégré */
button.wc-block-cart-item__remove-link {
    background: transparent !important;
    border: none !important;
    padding: 5px !important;
    color: #a0a0a0 !important;
    cursor: pointer !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

button.wc-block-cart-item__remove-link:hover {
    color: #d11a2a !important; /* Rouge au survol */
    transform: scale(1.05);
}

button.wc-block-cart-item__remove-link svg {
    width: 18px !important;
    height: 18px !important;
    fill: currentColor !important;
}

/* --- 5. Prix Total (Cellule de droite) --- */
td.wc-block-cart-item__total {
    text-align: right !important;
}

td.wc-block-cart-item__total .wc-block-components-product-price__value {
    font-size: 1.1rem !important;
    font-weight: bold !important;
    color: #20314f !important;
}

/* --- 6. Optimisation Responsive pour Mobile --- */
@media (max-width: 480px) {
    tr.wc-block-cart-items__header {
        display: none !important; /* Masque l'en-tête sur petit écran */
    }
    
    tr.wc-block-cart-items__row {
        display: flex !important;
        flex-wrap: wrap !important;
        position: relative !important;
        padding: 15px 0 !important;
    }
    
    td.wc-block-cart-item__image {
        padding: 0 !important;
    }
    
    td.wc-block-cart-item__product {
        flex: 1 !important;
        padding: 0 0 0 15px !important;
    }
    
    td.wc-block-cart-item__total {
        width: 100% !important;
        text-align: left !important;
        padding: 10px 0 0 105px !important; /* Aligne le total avec le texte */
    }
}
/* ==========================================================================
   FIX : RÉALIGNER ET REFAIRE APPARAÎTRE LE CHIFFRE DE LA QUANTITÉ
   ========================================================================== */
.wc-block-components-quantity-selector {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
}

/* Force l'affichage et le centrage du texte/chiffre */
.wc-block-components-quantity-selector__input {
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    flex: 1 !important;
    min-width: 30px !important;
    line-height: 36px !important; /* Doit être égal à la hauteur du sélecteur (36px) */
    display: block !important;
    border: none !important;
    background: transparent !important;
}

/* S'assure que les boutons + et - ne marchent pas sur le texte */
.wc-block-components-quantity-selector__button {
    height: 100% !important;
    width: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

/* ==========================================================================
   FIX : SUPPRESSION DE LA BORDURE ORANGE SUR LE BOUTON APPLIQUER
   ========================================================================== */

/* Cible le bouton dans tous ses états (normal, focus, actif, survol) */
button.wc-block-components-totals-coupon__button,
button.wc-block-components-totals-coupon__button:focus,
button.wc-block-components-totals-coupon__button:active,
button.wc-block-components-totals-coupon__button:hover {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* Optionnel : Si tu veux aussi enlever le contour orange autour du champ texte de coupon au clic */
.wc-block-components-totals-coupon__input input:focus {
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(32, 49, 79, 0.1) !important; /* Léger halo bleu EXES au lieu d'orange */
    border-color: #20314f !important;
}



/* ============================================
   WIDGET FILTRE - CONTENEUR GLOBAL
============================================ */
.yith-wcan-filters {
    font-family: 'Futura LT Pro', sans-serif !important;
    width: 100%;
    max-width: 300px;
    background: #ffffff;
    padding: 24px;

    border: 1px solid #ececec;
    box-sizing: border-box;
}

/* ============================================
   TITRE DU FILTRE
============================================ */
.yith-wcan-filter .filter-title {
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #20314f;
    margin: 0 0 18px 0;
    padding-bottom: 12px;
    border-bottom: 1px solid #eee;
}

/* ============================================
   LISTE PRINCIPALE
============================================ */
.filter-content > .filter-items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* ============================================
   CHAQUE ITEM
============================================ */
.filter-item {
    position: relative;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    /* Le thème ajoute un padding générique (.widget ul li) sur la page
       Boutique (widget de sidebar) mais pas sur la page d'accueil (widget
       Elementor) : on neutralise cet héritage pour garder un espacement
       identique sur les deux pages, contrôlé uniquement par .filter-item label. */
    padding: 0 !important;
}

.filter-item:hover {
    background-color: #f7f8fa;
}

/* Label en flex, aligné en haut (important pour texte sur 2 lignes) */
.filter-item label {
    display: flex;
    align-items: flex-start;
    width: 100%;
    padding: 9px 10px;
    cursor: pointer;
    gap: 12px;
    margin: 0;
    box-sizing: border-box;
}

/* ============================================
   CHECKBOX PERSONNALISÉE
============================================ */
.filter-item input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    flex-shrink: 0;
    width: 19px;
    height: 19px;
    border: 1.5px solid #c9ccd1;
    border-radius: 5px;
    position: relative;
    cursor: pointer;
    margin: 0;
    margin-top: 1px; /* micro-ajustement pour aligner avec la 1ère ligne du texte */
    background: #fff;
    transition: all 0.2s ease;
    display: block;
}

.filter-item input[type="checkbox"]:hover {
    border-color: #20314f;
}

.filter-item input[type="checkbox"]:checked {
    background-color: #20314f;
    border-color: #20314f;
}

.filter-item input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 2px;
    width: 4px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* ============================================
   TEXTE DU LABEL (le lien term-label)
============================================ */
.filter-item .term-label {
    color: #3d4148;
    font-size: 14.5px;
    line-height: 1.35;
    text-decoration: none;
    flex: 1;
    transition: color 0.2s ease;
    font-weight: 400;
    display: inline-block;
    margin: 0;
    padding: 0;
}

.filter-item:hover .term-label {
    color: #20314f;
}

.filter-item label:has(input:checked) .term-label {
    color: #20314f;
    font-weight: 600;
}

/* ============================================
   SOUS-CATÉGORIES (level-1, level-2...)
============================================ */
.filter-items.level-1 {
    list-style: none;
    margin: 4px 0 8px 0;
    padding-left: 18px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-left: 2px solid #eef0f3;
    margin-left: 19px;
    box-sizing: border-box;
}

.filter-items.level-1 .filter-item label {
    padding: 7px 10px;
    align-items: flex-start;
}

.filter-items.level-1 .term-label {
    font-size: 13.5px;
    color: #6b7078;
    line-height: 1.3;
}

.filter-items.level-1 input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin-top: 1px;
}

.filter-items.level-1 input[type="checkbox"]:checked::after {
    left: 4.5px;
    top: 1px;
    width: 3.5px;
    height: 7.5px;
}

/* ============================================
   RESPONSIVE
============================================ */
@media (max-width: 1024px) {
    .yith-wcan-filters {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .yith-wcan-filters {
        padding: 18px;
        border-radius: 10px;
    }

    .filter-item label {
        padding: 11px 8px;
    }
}

@media (max-width: 480px) {
    .yith-wcan-filters {
        border-radius: 0;
        border-left: none;
        border-right: none;
        padding: 16px;
    }
}





/* ============================================================
   Harmonisation Accueil / Boutique (Tâche 1)
   ============================================================ */

/* 1.1 — Élargir la ligne Elementor de l'accueil (filtres + grille
   produits) pour qu'elle occupe la même largeur que le conteneur
   de la page Boutique (~1580px), au lieu du "boxed width" Elementor
   par défaut (1140px) qui écrase les vignettes produits.
   Limité à partir de 768px : en dessous, Elementor empile déjà
   correctement filtres + grille sur 100% de largeur (flex-direction:
   column, cf. CSS généré post-519.css) — on ne touche pas à ce
   comportement mobile qui fonctionnait très bien. */
@media (min-width: 768px) {
  /* Le vrai conteneur centré de la page est #content.site-content
     (max-width theme ~1170px + margins auto) : tout ce qui est en
     dessous (#primary, article, .wrap, .panel-content, .entry-content,
     le conteneur Elementor) est en width:auto et hérite simplement de
     cette largeur. Élargir seulement le conteneur Elementor sans
     élargir ce parent le fait déborder à droite (il reste ancré au
     bord gauche du parent resté étroit) au lieu de rester centré.
     On élargit donc les DEUX ensemble, sur la page d'accueil
     uniquement (toutes langues, cf. classe body "auros-front-page"). */
  body.auros-front-page #content.site-content {
    max-width: min(1610px, 94vw) !important;
  }

  .elementor-519 .elementor-element-1b4029d.e-con-boxed {
    width: min(1580px, 92vw) !important;
    max-width: 1580px !important;
  }
  .elementor-519 .elementor-element-1b4029d.e-con-boxed > .e-con-inner {
    width: min(1580px, 92vw) !important;
    max-width: 1580px !important;
  }
}

/* 1.2 — Filtre catégories YITH (preset "draft-preset" / #preset_550) :
   passage d'une liste horizontale centrée à une liste verticale
   alignée à gauche, seule présentation lisible dans une colonne
   étroite (sidebar), + indentation plus marquée des sous-catégories
   pour bien matérialiser la hiérarchie (ex. Produits en bâche >
   Porte-monnaie / Sacs). Cette même présentation est utilisée sur
   l'accueil ET la boutique (même widget/preset sur les deux pages). */
#preset_550 ul.filter-items {
  display: block !important;
}

#preset_550 .filter-items .filter-item {
  display: block !important;
  width: 100% !important;
  float: none !important;
}

#preset_550 .filter-items.level-0 ul {
  padding-left: 28px !important;
}

/* 1.1 (suite) — Colonne de gauche (filtres YITH + recherche) vs grille
   produits sur les 3 pages d'accueil (FR/DE/EN, id 519/1171/1181) :
   largeur cohérente avec la sidebar de la boutique (#secondary fait
   340px en CSS thème, cf. style.css). La colonne est un conteneur
   Elementor ("hpsidebarcol") qui enveloppe le widget de filtres ET le
   widget de recherche — cibler ce conteneur, pas les widgets à
   l'intérieur, qui doivent eux rester à 100% de leur parent.
   Desktop/tablette uniquement (≥768px) — sous ce seuil, Elementor
   passe déjà chaque widget à 100% de largeur en colonne (mobile). */
@media (min-width: 768px) {
  .elementor-element-hpsidebarcol {
    flex: 0 0 340px !important;
    width: 340px !important;
    max-width: 340px !important;
  }
  .elementor-element-hpsidebarcol .elementor-element-567cecd.elementor-widget-yith_wcan_filters,
  .elementor-element-hpsidebarcol .elementor-element-hpsearch01 {
    width: 100% !important;
    max-width: 100% !important;
  }
  .elementor-519 .elementor-element-2f21f4f.elementor-widget-shortcode,
  .elementor-1171 .elementor-element-2f21f4f.elementor-widget-shortcode,
  .elementor-1181 .elementor-element-2f21f4f.elementor-widget-shortcode {
    width: auto !important;
    max-width: none !important;
    flex: 1 1 auto !important;
  }
}

/* ============================================================
   1.3 — Bouton "Catégories" repliable sur mobile (accueil + boutique)
   ============================================================
   Le filtre YITH (#preset_550) est utilisé sur les deux pages ; sur
   petit écran, afficher la liste complète des catégories avant les
   produits obligeait à scroller longuement. On la replie derrière un
   bouton, injecté en JS (inc/mobile-category-toggle.php /
   assets/js/mobile-category-toggle.js), stylé comme le bouton de
   filtre mobile déjà prévu ailleurs sur le site (même bleu, même
   police, mêmes arrondis) pour rester cohérent avec le thème. */
.auros-category-toggle {
  display: none;
}

@media (max-width: 767px) {
  /* On masque toute la boîte (pas juste son contenu) : sinon sa
     bordure/son padding par défaut restaient visibles, vides, sous
     le bouton "Catégories" une fois replié. */
  .yith-wcan-filters {
    border: none !important;
    padding: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  .yith-wcan-filters.is-open {
    border: 1px solid #ececec !important;
    padding: 18px !important;
    height: auto !important;
    overflow: visible !important;
  }

  .auros-category-toggle {
    width: 100% !important;
    background-color: #20314f !important;
    color: #ffffff !important;
    padding: 16px !important;
    border-radius: 4px !important;
    border: none !important;
    font-family: 'Futura LT Pro', sans-serif !important;
    font-weight: bold !important;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 10px;
    box-shadow: 0 4px 12px rgba(32, 49, 79, 0.2);
    margin-bottom: 16px;
    cursor: pointer;
  }

  .auros-category-toggle-icon {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #ffffff;
    transition: transform 0.2s ease;
  }

  .auros-category-toggle.is-open .auros-category-toggle-icon {
    transform: rotate(180deg);
  }
}

/* ============================================================
   1.4 — Sélecteur de langue (drapeaux) au-dessus du panier mobile
   ============================================================
   Le widget Elementor du sélecteur de langue (flottant bas-droite,
   présent sur tout le site) avait un z-index à 99999 défini dans
   Elementor, supérieur à celui du mini-panier qui glisse depuis la
   droite après un "Ajouter au panier" (z-index 9998). Résultat : le
   sélecteur de langue recouvrait les boutons "Voir le panier" /
   "Commander" du panier, les rendant intouchables. On redescend son
   z-index sous celui du panier tout en le gardant au-dessus du
   contenu normal de la page. */
.elementor-element-c2b185c {
  z-index: 100 !important;
}
/* Elementor génère aussi .elementor-widget-shortcode[data-id="c2b185c"]
   avec z-index:99999 !important — spécificité CSS égale/supérieure à la
   règle ci-dessus, donc elle l'emportait. On la cible explicitement. */
.elementor-widget-shortcode[data-id="c2b185c"] {
  z-index: 100 !important;
}


/* ============================================================
   1.5 — Bloc de recherche dans la sidebar boutique
   ============================================================
   Présent uniquement sur la boutique (pas sur l'accueil, qui n'a
   jamais eu ce widget) : c'est le champ de recherche natif resté
   après avoir simplifié l'ancien widget de filtres WooCommerce cassé
   (cf. Tâche 1.2). Il n'était pas stylé (bouton "Rechercher" en texte
   brut, sans forme de bouton) et pouvait sembler tronqué faute
   d'espace pour s'afficher proprement à côté du champ. */
.wp-block-search__inside-wrapper {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px;
}

.wp-block-search__input {
  flex: 1 1 auto;
  min-width: 0;
  border: 1px solid #e2e2e2 !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
  font-family: 'Futura LT Pro', sans-serif !important;
}

.wp-block-search__button {
  flex: 0 0 auto;
  white-space: nowrap;
  background-color: #20314f !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
  font-family: 'Futura LT Pro', sans-serif !important;
  font-weight: bold !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  font-size: 13px;
}

@media (max-width: 380px) {
  .wp-block-search__button {
    padding: 10px 10px;
    font-size: 12px;
    letter-spacing: 0.2px;
  }
}

.wp-block-search__button:hover {
  background-color: #16243a !important;
}

/* ============================================================
   1.6 — Menu mobile plein écran
   ============================================================
   Refonte "reveal circulaire" : le bouton burger devient un bouton
   rond plein (navy, comme le reste du site), son icône se change en
   croix par un fondu+rotation au lieu du display:none brut par défaut
   du thème (non animable) ; le panneau s'ouvre par un cercle qui se
   déploie depuis ce bouton jusqu'à couvrir l'écran (clip-path) sur un
   fond dégradé navy ; les liens arrivent en cascade (décalage de délai
   par item) en grande typographie, page courante en blanc plein/gras,
   les autres en blanc atténué. Toujours basé sur aria-hidden (déjà
   basculé par Elementor à l'ouverture/fermeture) et sur la classe
   .elementor-active (déjà posée par Elementor sur le bouton), donc
   aucune dépendance à un état interne fragile. */
@media (max-width: 767px) {
  /* --- Bouton : petite icône plate → pastille ronde navy --- */
  .elementor-menu-toggle {
    position: relative !important;
    z-index: 60 !important;
    width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background-color: #20314f !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow: 0 4px 14px rgba(32, 49, 79, 0.35);
    transition: transform 0.2s ease, background-color 0.3s ease;
  }

  .elementor-menu-toggle:active {
    transform: scale(0.93);
  }

  /* Les deux icônes (barres / croix) restent toutes les deux dans le
     DOM, superposées au centre, et on bascule leur visibilité par
     opacité + rotation — ça se transitionne, contrairement au
     display:none que le thème utilise par défaut. */
  .elementor-menu-toggle .elementor-menu-toggle__icon--open,
  .elementor-menu-toggle .elementor-menu-toggle__icon--close {
    display: block !important;
    position: absolute !important;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
    transition: opacity 0.3s ease, transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  }

  .elementor-menu-toggle .e-font-icon-svg {
    fill: #ffffff !important;
  }

  .elementor-menu-toggle:not(.elementor-active) .elementor-menu-toggle__icon--close,
  .elementor-menu-toggle.elementor-active .elementor-menu-toggle__icon--open {
    opacity: 0;
    transform: rotate(-90deg) scale(0.4);
    pointer-events: none;
  }

  .elementor-menu-toggle:not(.elementor-active) .elementor-menu-toggle__icon--open,
  .elementor-menu-toggle.elementor-active .elementor-menu-toggle__icon--close {
    opacity: 1;
    transform: rotate(0deg) scale(1);
  }

  /* --- Panneau : reveal circulaire depuis le bouton --- */
  .elementor-nav-menu--dropdown.elementor-nav-menu__container {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    background: linear-gradient(160deg, #2a3d5e 0%, #1c2b46 55%, #121b2e 100%) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 0 !important;
    overflow-y: auto !important;
    padding: 32px 32px !important;
    margin-top: 0 !important; /* Elementor pose 15px de marge par defaut sous le bouton pour le dropdown standard - inutile ici, on couvre tout le viewport */
    box-sizing: border-box !important;
    z-index: 9999 !important; /* au-dessus du header sticky Elementor (z-index:95) */
    clip-path: circle(0px at calc(100% - 50px) 46px);
    transition: clip-path 0.65s cubic-bezier(0.77, 0, 0.175, 1);
  }

  .elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="false"] {
    clip-path: circle(150% at calc(100% - 50px) 46px);
  }

  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item {
    border: none !important;
  }

  /* Cascade : chaque lien part légèrement en dessous et transparent,
     et remonte à sa place avec un délai croissant par item. */
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-item {
    display: block !important;
    font-family: 'Futura LT Pro', sans-serif !important;
    font-weight: 300 !important;
    font-size: 2.4rem !important;
    line-height: 1.3 !important;
    letter-spacing: -0.3px;
    color: rgba(255, 255, 255, 0.55) !important;
    padding: 10px 0 !important;
    transform: translateY(22px);
    opacity: 0;
    transition: transform 0.5s cubic-bezier(0.2, 0.9, 0.3, 1), opacity 0.4s ease, color 0.2s ease;
  }

  .elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="false"] .elementor-item {
    transform: translateY(0);
    opacity: 1;
  }

  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item:nth-child(1) .elementor-item {
    transition-delay: 0.15s;
  }
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item:nth-child(2) .elementor-item {
    transition-delay: 0.22s;
  }
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item:nth-child(3) .elementor-item {
    transition-delay: 0.29s;
  }
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item:nth-child(4) .elementor-item {
    transition-delay: 0.36s;
  }
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item:nth-child(5) .elementor-item {
    transition-delay: 0.43s;
  }

  .elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-item:active {
    color: rgba(255, 255, 255, 0.8) !important;
  }

  /* Page courante : blanc plein + gras, au lieu du fond gris brut par
     défaut du thème. */
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item.current-menu-item {
    background: none !important;
  }

  .elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item.current-menu-item .elementor-item,
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-item.current {
    color: #ffffff !important;
    font-weight: 600 !important;
    background: none !important;
  }

  /* Hiérarchie des sous-menus, si le menu en gagne un jour. */
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .sub-menu {
    padding-left: 18px !important;
    border-left: 2px solid rgba(255, 255, 255, 0.15);
    margin-left: 4px;
  }

  .elementor-nav-menu--dropdown.elementor-nav-menu__container .sub-menu .elementor-item {
    font-size: 1.1rem !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.5) !important;
    padding: 10px 0 !important;
  }

  /* Le sélecteur de langue (widget flottant en bas à droite) recouvrait
     le panneau plein écran ; on le masque tant que le menu est ouvert.
     Il recouvrait aussi la bannière "ajouté au panier" (notice WooCommerce
     fixe en bas d'écran, cf. QA responsive) : même traitement. */
  body:has(.elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="false"]) .elementor-element-c2b185c,
  body:has(.woocommerce-message) .elementor-element-c2b185c {
    display: none !important;
  }
}

/* ============================================================
   1.7 — Coche des cases à cocher blanche (au lieu de noire)
   ============================================================
   Les cases à cocher WooCommerce Blocks (checkout : "Utiliser la
   même adresse pour la facturation", conditions générales, etc.)
   ont un fond bleu marine une fois cochées, mais l'icône de coche
   (SVG) restait noire par défaut — peu lisible. */
.wc-block-components-checkbox__input:checked + .wc-block-components-checkbox__mark {
  fill: #ffffff !important;
}

/* ============================================================
   1.8 — Filtres YITH : bouton "Reset filters" et état vide
   ============================================================
   Le libellé du bouton est déjà traduit par langue côté PHP
   (inc/yith-filter-fixes.php) ; il ne reste que la casse forcée en
   MAJUSCULES par le style générique .btn/.button-primary du thème à
   neutraliser ici, spécifiquement pour ce bouton. */
.yith-wcan-reset-filters.reset-filters,
#preset_550 ~ form .yith-wcan-reset-filters {
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* État vide ("Aucun produit trouvé") : remplace la simple notice texte
   de WooCommerce par une icône discrète + un message clair + un bouton
   de retour au catalogue complet (woocommerce/loop/no-products-found.php). */
.auros-empty-state {
  background: none !important;
  border: none !important;
  text-align: center;
  padding: 56px 24px !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 420px;
  margin: 0 auto;
}

.auros-empty-state__icon {
  color: #b9bec7;
  margin-bottom: 16px;
}

.auros-empty-state__title {
  font-family: 'Futura LT Pro', sans-serif;
  font-weight: bold;
  font-size: 1.15rem;
  color: #20314f;
  margin: 0 0 8px;
}

.auros-empty-state__text {
  color: #6b7078;
  font-size: 0.95rem;
  line-height: 1.5;
  margin: 0 0 24px;
}

.auros-empty-state__reset {
  display: inline-block;
  background-color: #20314f !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 11px 22px !important;
  font-family: 'Futura LT Pro', sans-serif !important;
  font-weight: bold !important;
  text-transform: none !important;
  text-decoration: none !important;
  cursor: pointer;
}

.auros-empty-state__reset:hover {
  background-color: #16243a !important;
}

/* ==========================================================================
   BADGE SWISS LABEL (fiches produits + vignettes boutique/catégories)
   ========================================================================== */

/* Vignette produit (shop/category grid) : badge en médaillon coin haut-droit. */
ul.products li.product a.woocommerce-LoopProduct-link {
    position: relative;
}

ul.products li.product .auros-swiss-label-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
    object-fit: contain;
    z-index: 2;
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    background: #fff;
}

/* Fiche produit (page produit unique) : badge inline sous le titre. */
.single-product div.product .auros-swiss-label-badge {
    display: block;
    width: 48px;
    height: 48px;
    object-fit: contain;
    margin: 8px 0 16px;
}

/* ==========================================================================
   MENU MOBILE : DESIGN PLAT (SUPPRESSION DE LA PASTILLE RONDE NAVY)
   + OVERLAY PLEIN VIEWPORT INDÉPENDANT DU SCROLL
   ========================================================================== */

/* Bouton hamburger : design plat, plus de fond/rayon "pastille". */
.elementor-menu-toggle {
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    width: auto !important;
    height: auto !important;
}

/* Panneau du menu mobile : overlay plein viewport fixe, quelle que soit la
   position de scroll de la page (header sticky ou non). */
.elementor-nav-menu--dropdown {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
    z-index: 9999 !important;
    margin: 0 !important;
}

/* Empêche le body de défiler en arrière-plan pendant que le menu est ouvert
   (classe posée par assets/js/mobile-menu-fix.js). */
body.auros-mobile-menu-open {
    overflow: hidden !important;
}

/* ==========================================================================
   HOMEPAGE : ALIGNEMENT DE LA GRILLE PRODUITS SUR LA BOUTIQUE
   ========================================================================== */

/* La colonne sidebar Elementor (filtres YITH) fait déjà 340px, identique à
   #secondary sur la page Boutique. Mais #primary (Boutique) a ~46px de
   padding interne cumulé (theme + wrapper) avant que la grille ne
   commence, que la colonne Elementor "2f21f4f" (widget shortcode produits
   homepage) n'a pas par défaut — d'où la grille/pagination affichée plus
   à gauche que sur la Boutique (signalé le 2026-09-16). Box-sizing étant
   déjà border-box sur les éléments Elementor, ce padding décale le
   contenu sans changer la largeur totale de la colonne.
   ID Elementor stable car défini manuellement dans l'éditeur (widget
   shortcode [alfaset_products_paginated] sur Accueil/Home/Startseite). */
@media (min-width: 768px) {
  .elementor-element-2f21f4f {
    padding-left: 46px;
  }
}

/* ==========================================================================
   MENU MOBILE : CORRECTIFS SUITE RETOUR UTILISATEUR (2026-09-16, round 2)
   ========================================================================== */

/* Le bouton avait width/height:auto (voir plus haut) qui l'a fait
   s'effondrer à ~2x2px (zone tactile quasi nulle). On lui redonne une
   vraie zone tactile carrée de 44px (taille minimale standard), toujours
   sans fond/pastille. */
.elementor-menu-toggle {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
}

/* Icône "ouvrir" (hamburger) : Elementor la sort en blanc par défaut
   (prévu pour un fond sombre) — invisible sur le header blanc du site,
   d'où le "logo burger blanc sur blanc" signalé. On la force en navy.
   L'icône "fermer" (X), elle, reste blanche : elle ne s'affiche que
   quand le panneau (fond navy) est ouvert, donc déjà lisible telle
   quelle — on n'y touche pas. */
.elementor-menu-toggle .elementor-menu-toggle__icon--open,
.elementor-menu-toggle .elementor-menu-toggle__icon--open path {
    fill: #20314f !important;
}

/* Texte du menu déroulant plein écran : la règle plus haut qui met les
   liens en navy au scroll (".sticky--effects .menu-item a") visait le
   header desktop, mais son sélecteur générique ".menu-item a" attrape
   aussi les liens DANS ce panneau — dont le fond reste navy foncé en
   permanence. Résultat : texte navy sur fond navy, illisible ("je ne
   vois plus le texte de mon menu" une fois scrollé). On force du blanc
   ici, indépendamment de l'état sticky (sélecteur plus spécifique que
   les deux règles existantes pour être sûr de gagner la cascade). */
.elementor-nav-menu--dropdown.elementor-nav-menu__container .menu-item a {
    color: #ffffff !important;
}

/* ==========================================================================
   HOMEPAGE : DROPDOWN DE TRI ("Trier par") FONCTIONNEL
   ========================================================================== */
/* Le thème masque le <select> natif (.woocommerce-ordering select {
   display:none }) et le remplace par un dropdown stylé en JS
   (auros-core/assets/js/woocommerce/main.js, initSelectOrder()) — mais ce
   script ne se déclenche que si body a la classe .post-type-archive-product
   ou .tax-product_cat, donc jamais sur la home (une simple "page"). Plutôt
   que de patcher ce JS minifié tiers, on réaffiche le <select> natif ici :
   pleinement fonctionnel, juste avec le style natif du navigateur au lieu
   du dropdown custom de la Boutique. */
.elementor-element-2f21f4f .woocommerce-ordering select {
    display: inline-block !important;
    padding: 8px 12px;
    border: 1px solid #e2e2e2;
    border-radius: 4px;
    font-family: inherit;
    color: #20314f;
    background: #fff;
}

/* ==========================================================================
   MENU MOBILE : neutralise la marge generee par Elementor pour ce widget
   ========================================================================== */
/* Elementor genere un CSS specifique au post (elementor-post-1021-css) avec
   .elementor-1021 .elementor-element-57a4c937 .elementor-nav-menu__container.elementor-nav-menu--dropdown
   { margin-top: 15px !important } en mobile (reglage "Marge" du widget nav-menu
   dans l'editeur). Cette selecteur tres specifique bat notre regle generique
   (voir plus haut) meme en !important. On reprend le meme selecteur exact
   pour etre certain de gagner, plutot que d'aller modifier le reglage dans
   l'editeur Elementor (ce qui regenererait ce fichier de toute facon). */
@media (max-width: 767px) {
  .elementor-1021 .elementor-element.elementor-element-57a4c937 .elementor-nav-menu__container.elementor-nav-menu--dropdown {
    margin-top: 0 !important;
  }
}