/**
 * custom.css
 *
 * Petits correctifs CSS ajoutés en dehors du build SASS (style.css), pour
 * pouvoir les modifier/pousser sans recompiler le thème. Chargé après
 * style.css sur toutes les pages (voir inc/scripts.php -> mma_scripts()).
 */

/*
 * Zone BTC (boutique pour particuliers) uniquement : ne pas afficher la
 * plage de prix ("0.00$ – 299.50$") d'un produit variable sur sa fiche
 * produit tant qu'aucune variation complète n'est sélectionnée. Le script
 * wc-variation-price.js remplace déjà ce même élément .price par le prix
 * de la variation choisie (classe .mma-variation-price-inline) une fois la
 * sélection faite — cette règle masque uniquement l'état initial (la
 * plage), pas le prix affiché après sélection. Les comptes entrepreneur
 * (classe .login-in-entrepreneur sur le body) ne sont pas touchés.
 */
body.single-product:not(.login-in-entrepreneur) .summary:has(form.variations_form) > .price:not(.mma-variation-price-inline) {
    display: none;
}

/*
 * Section "Parcourez aussi…" (produits reliés) sur la fiche produit :
 * refonte visuelle (cartes blanches, coins arrondis, ombre légère, flèches
 * de navigation en boutons ronds) + retrait des soulignements sur les
 * liens. Le prix est masqué côté BTC via le paramètre $hidePrice de
 * product_slider() (voir woocommerce/single-product/related.php) — cette
 * règle ne gère que l'apparence.
 */
.related-products .swiper-products-related a,
.related-products .swiper-products-related a:hover,
.related-products .swiper-products-related a:focus,
.related-products .swiper-products-related a:visited {
    text-decoration: none !important;
}

/*
 * Swiper étire par défaut (align-items: stretch) toutes les cartes de la
 * rangée à la hauteur de la plus haute. On force chaque carte à ne prendre
 * que sa propre hauteur de contenu (garde-fou, sans effet une fois la
 * hauteur des titres normalisée ci-dessous). Scopé à CE slider
 * (.swiper-products-related) uniquement : ne touche pas aux autres
 * carrousels du site qui utilisent product_slider() ailleurs.
 */
.related-products .swiper-products-related .swiper-wrapper {
    align-items: flex-start;
}

/*
 * Cause réelle de l'espace blanc sous les cartes plus courtes : le titre
 * (h2) prend 1 ligne pour certains produits et 2 lignes pour d'autres, donc
 * les cartes n'ont pas naturellement la même hauteur — Swiper aligne alors
 * toute la rangée sur la carte la plus haute, laissant un vide sous les
 * cartes plus courtes. On réserve systématiquement la hauteur de 2 lignes
 * pour le titre (et on tronque avec "…" au-delà de 2 lignes) : toutes les
 * cartes deviennent naturellement de la même hauteur, sans vide résiduel.
 * Scopé à CE slider uniquement.
 */
.related-products .swiper-products-related .product-info h2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(2 * 27.5px);
}

.related-products .swiper-products-related .product-preview {
    border-radius: 16px;
    border: 1px solid #DFDFE0;
    box-shadow: 0 1px 4px rgba(29, 29, 27, 0.04);
    overflow: hidden;
    transition: box-shadow .25s ease, transform .25s ease;
}

.related-products .swiper-products-related .product-preview:hover {
    box-shadow: 0 8px 20px rgba(29, 29, 27, 0.10);
    transform: translateY(-3px);
}

.related-products .swiper-products-related .image-wrapper {
    border-bottom: 1px solid #DFDFE0;
}

.related-products .swiper-products-related .product-info {
    padding: 14px 16px 18px !important;
    margin: 0 !important;
}

.related-products .swiper-products-related .cat {
    color: #73787C;
    letter-spacing: .04em;
    margin-bottom: 4px;
}

.related-products .swiper-products-related h2 {
    color: #1D1D1B;
}

.related-products .swiper-nav {
    background-color: #DFDFE0 !important;
}

.related-products .swiper-nav .swiper-button {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #1D1D1B;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color .2s ease, transform .15s ease;
}

.related-products .swiper-nav .swiper-button i {
    color: #FFFFFF;
}

.related-products .swiper-nav .swiper-button:hover {
    background-color: #2788BD;
    transform: scale(1.05);
}