/* =====================================================
   MaxMegaMenu — Panneaux mobiles glissants v3 (RGAA)
   ===================================================== */

@media (max-width: 1023px) {

    /* Masquer les sous-menus inline */
    #mega-menu-wrap .mega-sub-menu,
    .mega-menu-wrap .mega-sub-menu {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }

    .mega-menu-item-has-children > a .mmm-arrow {
        margin-left: auto;
        padding-left: 8px;
        display: inline-flex;
        align-items: center;
        pointer-events: none;
    }

    /* ========================
       OVERLAY
    ======================== */
    #mmm-overlay {
        display: none;
        position: fixed !important;
        top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
        width: 100% !important; height: 100% !important;
        background: rgba(0, 0, 0, 0.5);
        z-index: 999990 !important;
        opacity: 0;
        transition: opacity 0.3s ease;
        margin: 0 !important; padding: 0 !important;
    }
    #mmm-overlay.mmm-visible { display: block !important; }
    #mmm-overlay.mmm-active  { opacity: 1; }

    /* ========================
       PANNEAU GLISSANT
    ======================== */
    .mmm-slide-panel {
        position: fixed !important;
        top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
        width: 100% !important;
        height: 100% !important; height: 100dvh !important;
        background: #ffffff !important;
        color: #1a1a1a !important;
        z-index: 999995 !important;
        transform: translateX(-100%) !important;
        transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1) !important;
        overflow-y: auto !important; overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
        /*box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15) !important;*/
        display: flex !important; flex-direction: column !important;
        margin: 0 !important; padding: 0 !important;
        border: none !important; border-radius: 0 !important; float: none !important;
    }
    .mmm-slide-panel.mmm-active { transform: translateX(0) !important; }
    .mmm-slide-panel[data-level="2"] { z-index: 999995 !important; }
    .mmm-slide-panel[data-level="3"] { z-index: 999997 !important; }

    /* ========================
       EN-TÊTE
    ======================== */
    .mmm-panel-header {
        display: flex !important; align-items: center !important; gap: 4px;
        padding: 0 8px 0 4px; height: 56px; min-height: 56px;
        border-bottom: 1px solid #e5e5e5; background: #fff;
        position: sticky; top: 0; z-index: 2; box-sizing: border-box; flex-shrink: 0;
    }

    /* ─── Indicateurs de focus visibles (RGAA 10.7 / WCAG 2.4.11) ─── */
    .mmm-back-btn,
    .mmm-close-btn {
        flex-shrink: 0;
        background: none !important; border: none !important;
        cursor: pointer; color: #333;
        padding: 10px;
        display: flex !important; align-items: center !important; justify-content: center !important;
        border-radius: 50%;
        transition: background 0.15s;
        -webkit-tap-highlight-color: transparent;
        width: 40px; height: 40px;
        box-sizing: border-box; line-height: 1; font-size: 0;
        box-shadow: none !important;
        /* outline par défaut du navigateur supprimé → remplacé par notre style */
        outline: none;
    }
    .mmm-back-btn:hover,
    .mmm-close-btn:hover { background: #f0f0f0 !important; }

    /* Focus visible : anneau haute contraste (ratio ≥ 3:1 requis WCAG 2.4.11) */
    .mmm-back-btn:focus-visible,
    .mmm-close-btn:focus-visible {
        outline: 3px solid #005fcc !important;
        outline-offset: 2px !important;
        background: #f0f0f0 !important;
    }

    .mmm-panel-title {
        flex: 1; font-size: 15px !important; font-weight: 600 !important;
        text-align: center; overflow: hidden; text-overflow: ellipsis;
        white-space: nowrap; padding: 0 4px; color: #1a1a1a !important; margin: 0 !important;
    }

    /* ========================
       LIEN "VOIR TOUT"
    ======================== */
    .mmm-panel-view-all {
        display: flex !important; align-items: center !important;
        padding: 13px 18px !important;
        font-size: 14px !important; font-weight: 500 !important;
        color: #0055aa !important; border-bottom: 2px solid #e5e5e5;
        text-decoration: underline !important;  /* lien clairement identifiable */
        background: #f5f8ff; flex-shrink: 0;
        outline: none;
    }
    .mmm-panel-view-all:hover { background: #edf2ff; color: #0044cc !important; }
    .mmm-panel-view-all:focus-visible {
        outline: 3px solid #005fcc !important;
        outline-offset: -3px !important;
    }

    /* ========================
       LISTE
    ======================== */
    .mmm-panel-list {
        list-style: none !important; margin: 0 !important; padding: 0 !important; flex: 1;
    }
    .mmm-panel-list li {
        border-bottom: 1px solid #f0f0f0 !important;
        margin: 0 !important; padding: 0 !important; display: block !important;
    }
    .mmm-panel-list li a {
        display: flex !important; align-items: center !important; justify-content: space-between !important;
        padding: 15px 18px !important;
        font-size: 15px !important; color: #1a1a1a !important;
        text-decoration: none !important;
        background: #fff !important;
        transition: background 0.15s;
        -webkit-tap-highlight-color: transparent;
        width: 100%; box-sizing: border-box;
        outline: none;
    }
    .mmm-panel-list li a:hover { background: #f5f5f5 !important; }

    /* Focus visible sur les liens de la liste */
    .mmm-panel-list li a:focus-visible {
        outline: 3px solid #005fcc !important;
        outline-offset: -3px !important;
        background: #f0f5ff !important;
        text-decoration: underline !important;
    }

    /* Chevron sur items avec enfants */
    .mmm-panel-list li.has-children > a::after {
        content: '';
        display: inline-block;
        width: 7px; height: 7px;
        border-right: 2px solid #aaa; border-top: 2px solid #aaa;
        transform: rotate(45deg);
        flex-shrink: 0; margin-left: 8px;
    }

    /* Contraste renforcé en mode forced-colors (Windows Contraste élevé) */
    @media (forced-colors: active) {
        .mmm-back-btn:focus-visible,
        .mmm-close-btn:focus-visible,
        .mmm-panel-list li a:focus-visible,
        .mmm-panel-view-all:focus-visible {
            outline: 3px solid ButtonText !important;
        }
    }

} /* fin @media */