/* ============================================================
   SITE MENU - CSS TECHNIQUE V0
   Structure / comportement uniquement.
   Les couleurs, espacements fins, tailles visuelles et effets
   doivent être gérés dans css_generated/css_perso.css.
   ============================================================ */

.site-menu {
    position: relative;
    width: 100%;
    z-index: 50;
}

.site-menu__inner {
    width: 100%;
}

/* Boutons */
.site-menu__toggle,
.site-menu__close,
.site-menu__branch-toggle {
    cursor: pointer;
}

.site-menu__toggle {
    display: none;
}

.site-menu__close {
    display: none;
}

.site-menu__panel {
    width: 100%;
}

.site-menu__mobile-header {
    display: none;
}

/* Listes */
.site-menu__list,
.site-menu__submenu {
    list-style: none;
    margin: 0;
}

.site-menu__list {
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.site-menu__item {
    position: relative;
}

.site-menu__item-row {
    display: flex;
    align-items: stretch;
}

.site-menu__link,
.site-menu__label {
    display: flex;
    align-items: center;
}

.site-menu__link {
    text-decoration: none;
}

.site-menu__branch-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Desktop/mobile : sous-menus cachés par défaut */
.site-menu__submenu[hidden] {
    display: none !important;
}

.site-menu__submenu {
    display: none;
}

.site-menu__submenu.is-open,
.site-menu__item.is-open > .site-menu__submenu {
    display: block;
}

/* Overlay mobile caché par défaut */
.site-menu__overlay {
    display: none;
}

/* ============================================================
   DESKTOP
   ============================================================ */

@media (min-width: 992px) {
    .site-menu__panel {
        position: static;
    }

    .site-menu__list {
        flex-direction: row;
    }

    .site-menu__mobile-header,
    .site-menu__toggle,
    .site-menu__close,
    .site-menu__overlay {
        display: none !important;
    }

    .site-menu__item--has-children > .site-menu__submenu {
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 100%;
        z-index: 60;
    }

    .site-menu__submenu .site-menu__item--has-children > .site-menu__submenu {
        position: static;
        top: auto;
        left: auto;
        min-width: 100%;
    }

    .site-menu__submenu .site-menu__list,
    .site-menu__submenu {
        flex-direction: column;
    }

    .site-menu__submenu .site-menu__item-row {
        width: 100%;
    }
}

/* ============================================================
   MOBILE / TABLETTE
   ============================================================ */

@media (max-width: 991px) {
    .site-menu__inner {
        display: flex;
        align-items: center;
    }

    .site-menu__toggle {
        display: inline-flex;
        align-items: center;
    }

    .site-menu__panel {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        max-width: 90vw;
        overflow-y: auto;
        transform: translateX(-100%);
        z-index: 1000;
    }

    .site-menu.is-panel-open .site-menu__panel,
    .site-menu__panel.is-open {
        transform: translateX(0);
    }

    .site-menu.is-panel-open .site-menu__overlay,
    .site-menu__overlay.is-open {
        display: block;
    }

    .site-menu__overlay {
        position: fixed;
        inset: 0;
        z-index: 999;
    }

    .site-menu__mobile-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .site-menu__close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .site-menu__list {
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
    }

    .site-menu__item-row {
        width: 100%;
    }

    .site-menu__link,
    .site-menu__label {
        flex: 1 1 auto;
    }

    .site-menu__branch-toggle {
        flex: 0 0 auto;
    }

    .site-menu__submenu {
        position: static;
    }

    body.has-site-menu-open {
        overflow: hidden;
    }
}