/* ==========================================
   RECIFAL MUST - CUSTOM STYLES
   Version: 1.2.4
   ========================================== */

/* ==========================================
   0. GLOBAL FIXES
   ========================================== */

/* Fix césure de mots bizarre sur les catégories */
.subcategory-card-title,
.subcat-card-title,
.woocommerce-loop-category__title,
h2.woocommerce-loop-category__title {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
    -ms-hyphens: none !important;
}

/* ==========================================
   1. IMAGES - Bordures arrondies
   ========================================== */

/* Produits WooCommerce */
.woocommerce-product-gallery__image img,
ul.products li.product .attachment-woocommerce_thumbnail,
ul.products li.product img {
    border-radius: 15px !important;
}

/* Images Elementor (ciblées précisément) */
.elementor-widget-image .elementor-image img,
.elementor-widget-image-box .elementor-image-box-img img {
    border-radius: 15px !important;
}

/* Exclure les backgrounds et icônes */
.elementor-background-overlay img,
.elementor-icon img {
    border-radius: 0 !important;
}

/* Menu navigation */
.main-navigation ul.menu ul li.menu-item-image img {
    border-radius: 15px;
}

/* Image feature widget */
.elementor-widget-image.image-feature a {
    border-radius: 15px;
}

.image-feature .wp-caption {
    background: white;
}

/* Effet hover produits */
ul.products li.product:not(.product-category):before {
    border-radius: 15px;
}

/* ==========================================
   2. Z-INDEX - Hiérarchie propre
   ========================================== */

/* Header au-dessus de tout */
.site-header,
header,
.main-navigation,
.mega-menu,
.sub-menu {
    position: relative;
    z-index: 9999 !important;
}

/* Sections normales */
.elementor-section {
    position: relative;
    z-index: 1;
}

/* Sections custom homepage */
.recifal-hero,
.recifal-hero-content,
.recifal-categories,
.recifal-testimonials {
    position: relative;
    z-index: 1;
}

/* ==========================================
   3. FOOTER
   ========================================== */

footer {
    background-color: #1a1a1a;
    color: #ffffff;
    padding: 60px 20px 20px;
    margin-top: auto;
}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    margin-bottom: 40px;
}

.footer-section h3 {
    font-size: 18px;
    margin-bottom: 20px;
    color: #ffffff;
    font-weight: 600;
}

.footer-section p {
    line-height: 1.6;
    color: #b0b0b0;
    margin-bottom: 15px;
}

.footer-section ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-section ul li {
    margin-bottom: 12px;
}

.footer-section ul li a {
    color: #b0b0b0;
    text-decoration: none;
    transition: color 0.3s ease;
    display: inline-block;
}

.footer-section ul li a:hover {
    color: #ffffff;
    padding-left: 5px;
}

/* Social Icons */
.social-links {
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.social-links a {
    width: 40px;
    height: 40px;
    background-color: #2a2a2a;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s ease;
}

.social-links a:hover {
    background-color: #16bbca;
    transform: translateY(-3px);
}

/* Footer Bottom */
.footer-bottom {
    border-top: 1px solid #333;
    padding-top: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.footer-bottom p {
    color: #ffffff;
    font-size: 14px;
    margin: 0;
}

.footer-links {
    display: flex;
    gap: 20px;
    align-items: center;
}

.footer-links a {
    color: #ffffff;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
}

.footer-links a:hover {
    color: #16bbca;
}

.footer-credit {
    color: #ffffff;
    font-size: 14px;
    margin-left: 20px;
}

/* ==========================================
   4. PAGES CATÉGORIES CUSTOM - PLEINE LARGEUR
   ========================================== */

/* Cacher la sidebar sur toutes les catégories custom */
.tax-product_cat.term-vivant #secondary,
.tax-product_cat.term-vivant .sidebar,
.tax-product_cat.term-eau-et-chimie #secondary,
.tax-product_cat.term-eau-et-chimie .sidebar,
.tax-product_cat.term-materiel-technique #secondary,
.tax-product_cat.term-materiel-technique .sidebar,
.tax-product_cat.term-alimentation #secondary,
.tax-product_cat.term-alimentation .sidebar {
    display: none !important;
}

/* Étendre le contenu en pleine largeur */
.tax-product_cat.term-vivant #primary,
.tax-product_cat.term-vivant .content-area,
.tax-product_cat.term-eau-et-chimie #primary,
.tax-product_cat.term-eau-et-chimie .content-area,
.tax-product_cat.term-materiel-technique #primary,
.tax-product_cat.term-materiel-technique .content-area,
.tax-product_cat.term-alimentation #primary,
.tax-product_cat.term-alimentation .content-area {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

/* Cacher description, tri, résultats et pagination WooCommerce */
.tax-product_cat.term-vivant .term-description,
.tax-product_cat.term-vivant .woocommerce-ordering,
.tax-product_cat.term-vivant .woocommerce-result-count,
.tax-product_cat.term-vivant .woocommerce-pagination,
.tax-product_cat.term-eau-et-chimie .term-description,
.tax-product_cat.term-eau-et-chimie .woocommerce-ordering,
.tax-product_cat.term-eau-et-chimie .woocommerce-result-count,
.tax-product_cat.term-eau-et-chimie .woocommerce-pagination,
.tax-product_cat.term-materiel-technique .term-description,
.tax-product_cat.term-materiel-technique .woocommerce-ordering,
.tax-product_cat.term-materiel-technique .woocommerce-result-count,
.tax-product_cat.term-materiel-technique .woocommerce-pagination,
.tax-product_cat.term-alimentation .term-description,
.tax-product_cat.term-alimentation .woocommerce-ordering,
.tax-product_cat.term-alimentation .woocommerce-result-count,
.tax-product_cat.term-alimentation .woocommerce-pagination {
    display: none !important;
}

/* Cacher breadcrumb et titre - TOUTES LES VARIATIONS */
.tax-product_cat.term-vivant .woocommerce-breadcrumb,
.tax-product_cat.term-vivant .woocommerce-products-header,
.tax-product_cat.term-vivant .woocommerce-products-header__title,
.tax-product_cat.term-vivant h1.page-title,
.tax-product_cat.term-vivant .page-title,
.tax-product_cat.term-vivant .archive-header,
.tax-product_cat.term-eau-et-chimie .woocommerce-breadcrumb,
.tax-product_cat.term-eau-et-chimie .woocommerce-products-header,
.tax-product_cat.term-eau-et-chimie .woocommerce-products-header__title,
.tax-product_cat.term-eau-et-chimie h1.page-title,
.tax-product_cat.term-materiel-technique .woocommerce-breadcrumb,
.tax-product_cat.term-materiel-technique .woocommerce-products-header,
.tax-product_cat.term-materiel-technique .woocommerce-products-header__title,
.tax-product_cat.term-materiel-technique h1.page-title,
.tax-product_cat.term-alimentation .woocommerce-breadcrumb,
.tax-product_cat.term-alimentation .woocommerce-products-header,
.tax-product_cat.term-alimentation .woocommerce-products-header__title,
.tax-product_cat.term-alimentation h1.page-title {
    display: none !important;
}

/* Masquer le bouton "Afficher les filtres" de Shoptimizer sur les 4 catégories principales */
/* ATTENTION: Ne pas masquer les filtres custom coral-filter-btn-rm */
body.term-vivant .shoptimizer-mobile-filters,
body.term-vivant .shoptimizer-filter-button,
body.term-vivant button.shoptimizer-filter-toggle,
.tax-product_cat.term-vivant .shoptimizer-mobile-filters,
.tax-product_cat.term-vivant .shoptimizer-filter-button,
.tax-product_cat.term-vivant button.shoptimizer-filter-toggle,
.tax-product_cat.term-vivant .woocommerce-filtering,

body.term-materiel-technique .shoptimizer-mobile-filters,
body.term-materiel-technique .shoptimizer-filter-button,
body.term-materiel-technique button.shoptimizer-filter-toggle,
.tax-product_cat.term-materiel-technique .shoptimizer-mobile-filters,
.tax-product_cat.term-materiel-technique .shoptimizer-filter-button,
.tax-product_cat.term-materiel-technique button.shoptimizer-filter-toggle,
.tax-product_cat.term-materiel-technique .woocommerce-filtering,

body.term-eau-et-chimie .shoptimizer-mobile-filters,
body.term-eau-et-chimie .shoptimizer-filter-button,
body.term-eau-et-chimie button.shoptimizer-filter-toggle,
.tax-product_cat.term-eau-et-chimie .shoptimizer-mobile-filters,
.tax-product_cat.term-eau-et-chimie .shoptimizer-filter-button,
.tax-product_cat.term-eau-et-chimie button.shoptimizer-filter-toggle,
.tax-product_cat.term-eau-et-chimie .woocommerce-filtering,

body.term-alimentation .shoptimizer-mobile-filters,
body.term-alimentation .shoptimizer-filter-button,
body.term-alimentation button.shoptimizer-filter-toggle,
.tax-product_cat.term-alimentation .shoptimizer-mobile-filters,
.tax-product_cat.term-alimentation .shoptimizer-filter-button,
.tax-product_cat.term-alimentation button.shoptimizer-filter-toggle,
.tax-product_cat.term-alimentation .woocommerce-filtering {
    display: none !important;
}

/* S'assurer que nos filtres custom restent visibles */
.coral-filters-rm {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
}
.coral-filters-rm .coral-filter-btn-rm,
.coral-filter-btn-rm,
button.coral-filter-btn-rm {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.coral-subfilters-rm .coral-subfilter-btn-rm,
.coral-subfilter-btn-rm,
button.coral-subfilter-btn-rm {
    display: inline-flex !important;
    visibility: visible !important;
}

/* Cacher les contrôles WooCommerce en double sur vivant */
.tax-product_cat.term-vivant .woocommerce-notices-wrapper,
.tax-product_cat.term-vivant .storefront-sorting,
.tax-product_cat.term-vivant nav.woocommerce-pagination {
    display: none !important;
}

/* ==========================================
   5. RESPONSIVE
   ========================================== */

@media (max-width: 768px) {
    .footer-content {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }
    
    .footer-links {
        flex-direction: column;
        gap: 10px;
    }
    
    .footer-credit {
        margin-left: 0;
        margin-top: 10px;
    }
    
    /* Désactiver hover sur mobile pour catégories */
    .tax-product_cat.term-vivant .subcat-card-single:hover,
    .tax-product_cat.term-vivant .coral-card-rm:hover {
        transform: none;
    }
}

/* ==========================================
   6. VIVANT HERO - SUPPRIMER OVERLAYS
   ========================================== */

/* Supprimer tout overlay du thème sur le hero Vivant */
.tax-product_cat.term-vivant .vivant-hero::before,
.tax-product_cat.term-vivant .vivant-hero::after,
.vivant-hero::before,
.vivant-hero::after {
    display: none !important;
    content: none !important;
}

/* Désactiver les filtres CSS potentiels */
.vivant-hero {
    filter: none !important;
    -webkit-filter: none !important;
}

/* ==========================================
   7. VIVANT PAGE - Styles supplémentaires
   ========================================== */

/* Note: Le header reste normal sur la page Vivant */
/* La vidéo de fond s'affiche dans le hero sans overlay */

/* ==========================================
   8. WHATSAPP - Icône réduite sur mobile
   ========================================== */

@media (max-width: 768px) {
    /* Remonter le bouton au-dessus du sticky cart */
    .qlwapp {
        bottom: 100px !important;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }
    
    /* Masquer le texte "Une question?" */
    .qlwapp__text {
        display: none !important;
    }
    
    /* Réduire la taille du bouton */
    .qlwapp__button {
        padding: 10px !important;
    }
    
    /* Masquer WhatsApp quand le menu mobile est ouvert */
    body.mobile-toggled .qlwapp {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* ==========================================
   9. HERO HOMEPAGE - STYLES COMPLETS
   ========================================== */

/* Base desktop - pour référence */
.recifal-hero-content {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.recifal-hero-text {
    max-width: 600px;
}

/* ===== RESPONSIVE MOBILE ===== */
@media (max-width: 992px) {
    .recifal-hero-content {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
        text-align: center !important;
        padding: 0 30px !important;
    }
    
    .recifal-hero-text {
        max-width: 100% !important;
        width: 100% !important;
        text-align: center !important;
    }
    
    .recifal-hero-buttons {
        justify-content: center !important;
    }
    
    .recifal-hero-visual {
        max-width: 400px !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 576px) {
    .recifal-hero {
        padding: 30px 0 40px !important;
        overflow: hidden !important;
    }
    
    .recifal-hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding: 0 20px !important;
        gap: 25px !important;
    }
    
    .recifal-hero-text {
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
    }
    
    .recifal-hero-text h1 {
        font-size: 1.5rem !important;
        text-align: center !important;
        line-height: 1.3 !important;
    }
    
    .recifal-hero-text p {
        font-size: 0.95rem !important;
        text-align: center !important;
        line-height: 1.5 !important;
        margin-bottom: 20px !important;
    }
    
    .recifal-hero-buttons {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        gap: 12px !important;
    }
    
    .recifal-btn-hero {
        width: 80% !important;
        max-width: 280px !important;
        padding: 14px 25px !important;
        font-size: 0.95rem !important;
        text-align: center !important;
        justify-content: center !important;
    }
    
    .recifal-hero-visual {
        width: 100% !important;
        max-width: 300px !important;
        margin: 0 auto !important;
    }
    
    .recifal-hero-card {
        padding: 15px !important;
    }
    
    .hero-top3-title-rm {
        font-size: 0.9rem !important;
        text-align: center !important;
    }
}

/* Très petits écrans */
@media (max-width: 400px) {
    .recifal-hero-content {
        padding: 0 15px !important;
    }
    
    .recifal-hero-text h1 {
        font-size: 1.3rem !important;
    }
    
    .recifal-hero-text p {
        font-size: 0.85rem !important;
    }
    
    .recifal-btn-hero {
        width: 90% !important;
        max-width: 250px !important;
        padding: 12px 20px !important;
        font-size: 0.85rem !important;
    }
    
    .recifal-hero-visual {
        max-width: 260px !important;
    }
    
    .hero-top3-title-rm {
        font-size: 0.8rem !important;
    }
}