/* Correction du menu mobile - rendre scrollable si trop long */

/* Bloquer le scroll du body quand le menu est ouvert - CSS PURE */
@media (max-width: 1024px) {
    /* Detecter si le menu sidebar existe et est visible */
    body:has(.nd_options_navigation_4_sidebar:not([style*="display: none"])),
    body:has(#nd_options_navigation_4_sidebar:not([style*="display: none"])) {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
        height: 100vh !important;
        top: 0 !important;
        left: 0 !important;
    }
}

/* Menu responsive (quand la fenêtre est réduite ou sur mobile) */
@media (max-width: 1024px) {
    /* Container principal du menu sidebar - FORCER scroll */
    .nd_options_navigation_4_sidebar,
    #nd_options_navigation_4_sidebar,
    .nd_options_navigation_sidebar_content,
    div[class*="navigation"][class*="sidebar"] {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        max-height: 100vh !important;
        overflow-y: scroll !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        z-index: 9999 !important;
        display: block !important;
    }

    /* TOUS les enfants directs doivent permettre le scroll */
    .nd_options_navigation_4_sidebar > *,
    #nd_options_navigation_4_sidebar > *,
    .nd_options_navigation_sidebar_content > * {
        max-height: none !important;
        overflow: visible !important;
        position: relative !important;
    }

    /* Assurer que le UL a de l'espace en bas */
    .nd_options_navigation_4_sidebar ul,
    #nd_options_navigation_4_sidebar ul,
    .nd_options_navigation_4_sidebar div > ul {
        max-height: none !important;
        overflow-y: visible !important;
        padding-bottom: 150px !important;
        min-height: auto !important;
        display: block !important;
    }

    /* Chaque item du menu */
    .nd_options_navigation_4_sidebar li,
    #nd_options_navigation_4_sidebar li {
        display: block !important;
        width: 100% !important;
        position: relative !important;
    }

    /* Scrollbar personnalisée pour le menu mobile */
    .nd_options_navigation_4_sidebar::-webkit-scrollbar,
    #nd_options_navigation_4_sidebar::-webkit-scrollbar,
    .nd_options_navigation_sidebar_content::-webkit-scrollbar {
        width: 8px;
    }

    .nd_options_navigation_4_sidebar::-webkit-scrollbar-track,
    #nd_options_navigation_4_sidebar::-webkit-scrollbar-track,
    .nd_options_navigation_sidebar_content::-webkit-scrollbar-track {
        background: rgba(255, 255, 255, 0.1);
    }

    .nd_options_navigation_4_sidebar::-webkit-scrollbar-thumb,
    #nd_options_navigation_4_sidebar::-webkit-scrollbar-thumb,
    .nd_options_navigation_sidebar_content::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.5);
        border-radius: 4px;
    }

    /* S'assurer que le padding en bas est visible */
    .nd_options_navigation_4_sidebar div > ul > li:last-child {
        padding-bottom: 40px !important;
    }
}

/* Optimisation mobile - réduire les espacements sur petits écrans */
@media (max-width: 768px) {
    /* Réduire les marges et padding des rows sur mobile */
    .cmsmasters_row_outer_parent {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    /* Réduire l'espacement des colonnes */
    .cmsmasters_column_inner {
        padding: 10px !important;
    }

    /* Réduire la hauteur du carousel sur mobile */
    .carousel {
        height: 400px !important;
        min-height: 300px !important;
    }

    .carousel-item img.slide-img {
        height: 350px !important;
    }
}