/**
 * SGI LEASE & GO - Fix Menu Categories
 * Correction du comportement du menu "All Categories"
 * Date: 08/12/2025
 */

/* ========================================
   FIX: Élargir la bande du menu header
   ======================================== */
.bottom_header {
    padding: 12px 0 !important;
}

.bottom_header .navbar-nav .nav-link,
.bottom_header .navbar-nav .nav_item {
    padding: 10px 15px !important;
    font-size: 14px !important;
    white-space: nowrap;
}

.bottom_header .attr-nav {
    display: flex;
    align-items: center;
    gap: 5px;
}

.bottom_header .attr-nav > li {
    margin-left: 5px;
}

/* Surcharger le comportement par défaut du thème */
/* Le thème force display:block même sans .show, on corrige ça */

/* Par défaut, le menu collapse est caché */
.nav_cat.collapse:not(.show) {
    display: none !important;
}

#navCatContent:not(.show) {
    display: none !important;
}

/* Quand la classe .show est présente, afficher le menu */
.nav_cat.collapse.show,
#navCatContent.show {
    display: block !important;
}

/* Assurer que le bouton reflète l'état du menu */
.categories_btn[aria-expanded="true"] {
    color: #0057B8;
}

.categories_btn[aria-expanded="false"].collapsed {
    color: inherit;
}

/* Transitions fluides */
#navCatContent {
    transition: all 0.3s ease-in-out;
}

/* Sur mobile, comportement spécifique */
@media (max-width: 991px) {
    #navCatContent {
        position: fixed;
        left: -280px;
        top: 0;
        width: 280px;
        height: 100%;
        z-index: 9999;
        overflow-y: auto;
        transition: all 0.3s ease-in-out;
    }
    
    #navCatContent.show {
        left: 0 !important;
    }
    
    #navCatContent:not(.show) {
        left: -280px !important;
    }
}

/* Sur desktop */
@media (min-width: 992px) {
    #navCatContent {
        position: absolute;
        background-color: #fff;
        padding: 5px 0px 0;
        z-index: 99;
        width: 280px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    }
    
    /* Menu ouvert */
    #navCatContent.show {
        display: block !important;
        opacity: 1;
        visibility: visible;
    }
    
    /* Menu fermé */
    #navCatContent:not(.show) {
        display: none !important;
        opacity: 0;
        visibility: hidden;
    }
}