/* 1. RESET DU CONTENEUR */
/* On s'assure que le conteneur est une boite flexible standard */
#search_filters .facet:not(.facet-type-slider):not(.facet-type-price) ul {
    display: flex !important;
    flex-wrap: wrap !important; /* Passage à la ligne OBLIGATOIRE */
    flex-direction: row !important; /* Force l'horizontal */
    gap: 5px !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* 2. LA BOITE (LI) */
#search_filters .facet:not(.facet-type-slider):not(.facet-type-price) ul li {
    /* Style de la boite */
    display: inline-flex !important;
    align-items: center !important; /* Centre verticalement le contenu */
    
    width: auto !important;
    max-width: 100% !important; /* Bloque la largeur au parent */
    
    border: 1px solid #dcdcdc !important;
    background: #fff !important;
    border-radius: 3px !important;
    padding: 4px 8px !important;
    margin: 0 !important; /* Le gap gère l'espace */
    
    box-sizing: border-box !important;
    min-height: 30px; /* Hauteur min pour l'esthétique */
}

/* 3. LE LIEN (A) - C'est lui qui cassait tout */
/* On le force à devenir flexible et à prendre toute la place dans le LI */
#search_filters .facet:not(.facet-type-slider):not(.facet-type-price) ul li a {
    display: flex !important;
    align-items: center !important;
    flex-direction: row !important; /* Force case à gauche, texte à droite */
    width: 100% !important;
    border: none !important;
    text-decoration: none !important;
    background: transparent !important;
}

/* 4. LA CASE À COCHER */
#search_filters .facet:not(.facet-type-slider):not(.facet-type-price) ul li .custom-checkbox {
    /* Taille fixe indéformable */
    flex: 0 0 16px !important; 
    width: 16px !important;
    height: 16px !important;
    margin-right: 8px !important;
    display: block !important;
}

/* 5. LE TEXTE */
#search_filters .facet:not(.facet-type-slider):not(.facet-type-price) ul li .facet-label {
    /* Gestion de l'espace */
    flex: 1 1 auto !important; /* Prend la place restante */
    min-width: 0 !important; /* AUTORISE LE TEXTE À RÉTRÉCIR (Vital) */
    
    /* Gestion de la coupure */
    white-space: normal !important; /* Autorise 2 lignes */
    word-break: break-word !important; /* Coupe les mots si trop longs */
    line-height: 1.1 !important;
    font-size: 13px !important;
    text-align: left !important;
    color: #555 !important;
}

/* 6. ESTHÉTIQUE */
#search_filters .facet:not(.facet-type-slider):not(.facet-type-price) ul li:hover {
    border-color: #333 !important;
}

/* Filtre Actif */
#search_filters .facet ul li:has(input:checked) {
    background-color: #f6f6f6 !important;
    border-color: #000 !important;
    font-weight: 600 !important;
}
/* Transforme la ligne en colonne : Libellé au-dessus, champ en dessous */
.product-variants > .product-variants-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    margin-bottom: 15px !important; /* Espace entre chaque attribut */
}

/* Ajuste le titre (Label) pour qu'il prenne toute la largeur */
.product-variants > .product-variants-item .control-label {
    width: 100% !important;
    text-align: left !important;
    margin-bottom: 5px !important; /* Espace sous le titre */
    font-weight: bold; /* Optionnel : mettre le titre en gras */
}

/* Ajuste le champ pour qu'il prenne toute la largeur */
.product-variants > .product-variants-item ul,
.product-variants > .product-variants-item select,
.product-variants > .product-variants-item .form-control-select {
    width: 100% !important;
}
/* Masquer la référence dans l'onglet Détails du produit */
.product-details .product-reference,
.tab-content .product-reference {
    display: none !important;
}
/* 1. Masquer le stock dans l'onglet "Détails du produit" */
.product-quantities,
.product-details .product-quantities {
    display: none !important;
}