/**
 * Menu mobile Tchatcha — lisibilité pro (priorité sur Zante + ht-zante-home2)
 */

/* Voile sombre quand le menu est ouvert */
body.ht-mobile-nav-open::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 999;
    pointer-events: auto;
}

@media (max-width: 991px) {
    /* Panneau latéral */
    #main_menu.mobile_menu {
        width: min(320px, 88vw) !important;
        right: -320px !important;
        background: #fff !important;
        box-shadow: -8px 0 32px rgba(0, 0, 0, 0.18) !important;
        z-index: 1001 !important;
        -webkit-overflow-scrolling: touch;
    }

    #main_menu.mobile_menu.mobile_menu_open {
        right: 0 !important;
    }

    /* Liens principaux — texte foncé lisible (écrase header transparent blanc) */
    header #main_menu.mobile_menu .navbar-nav > li > a,
    header.transparent #main_menu.mobile_menu .navbar-nav > li > a,
    header.transparent #main_menu.mobile_menu .navbar-nav li a,
    header.transparent.nav_bg #main_menu.mobile_menu .navbar-nav li a,
    body.ht-zante-home header #main_menu.mobile_menu .navbar-nav > li > a,
    body.ht-zante-home header.fixed:not(.scrolled) #main_menu.mobile_menu .navbar-nav li a {
        color: #2d2d2d !important;
        font-family: 'Nunito', sans-serif !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        letter-spacing: 0.03em !important;
        text-transform: none !important;
        padding: 16px 20px !important;
        line-height: 1.35 !important;
        display: block !important;
    }

    #main_menu.mobile_menu .navbar-nav > li > a:hover,
    #main_menu.mobile_menu .navbar-nav > li.active > a,
    #main_menu.mobile_menu .navbar-nav > li.open > a {
        color: #deb666 !important;
        background: #faf6ee !important;
    }

    #main_menu.mobile_menu .navbar-nav > li {
        background: #fff !important;
        border-bottom: 1px solid #ebebeb !important;
    }

    /* Sous-menus */
    #main_menu.mobile_menu .dropdown-menu {
        background: #f7f7f7 !important;
        border: none !important;
        box-shadow: none !important;
        position: relative !important;
        width: 100% !important;
        float: none !important;
        padding: 0 !important;
    }

    #main_menu.mobile_menu .dropdown-menu li {
        background: #f7f7f7 !important;
        border-bottom: 1px solid #eee !important;
    }

    #main_menu.mobile_menu .dropdown-menu li a,
    #main_menu.mobile_menu .dropdown-menu .dropdown-header {
        color: #444 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        padding: 12px 20px 12px 28px !important;
        white-space: normal !important;
        line-height: 1.4 !important;
    }

    #main_menu.mobile_menu .dropdown-menu .dropdown-header {
        color: #deb666 !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        letter-spacing: 0.1em !important;
        text-transform: uppercase !important;
        padding-top: 14px !important;
        background: #f0f0f0 !important;
    }

    #main_menu.mobile_menu .dropdown-menu li a:hover {
        color: #deb666 !important;
        background: #fff !important;
    }

  /* Flèche sous-menu */
    #main_menu.mobile_menu .mobile-dropdown-toggle.arrow {
        color: #deb666 !important;
        background: rgba(222, 182, 102, 0.15) !important;
        border-radius: 50% !important;
        width: 28px !important;
        height: 28px !important;
        line-height: 28px !important;
        margin-top: 2px !important;
    }

    /* Bouton Réserver */
    #main_menu.mobile_menu li.menu_button {
        padding: 20px !important;
        background: #faf6ee !important;
        border-top: 2px solid #deb666 !important;
    }

    #main_menu.mobile_menu li.menu_button .ht-btn-reserve-gold,
    #main_menu.mobile_menu li.menu_button .btn {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
        padding: 14px 20px !important;
        font-size: 13px !important;
        font-weight: 800 !important;
        color: #1a1a1a !important;
        margin: 0 !important;
    }

    /* Hamburger toujours visible */
    header .navbar-header .mobile_menu_btn {
        z-index: 1002 !important;
        padding: 12px 8px !important;
    }

    header .navbar-header .mobile_menu_btn .icon-bar {
        background: #fff !important;
        height: 3px !important;
        width: 26px !important;
        margin: 5px 0 !important;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    }

    header.fixed.scrolled .navbar-header .mobile_menu_btn .icon-bar,
    header.fixed.ht-header--inner .navbar-header .mobile_menu_btn .icon-bar,
    header.nav_bg .navbar-header .mobile_menu_btn .icon-bar {
        background: #606060 !important;
        box-shadow: none;
    }

    header .navbar-header .mobile_menu_btn.mobile_menu_active .icon-bar {
        background: #606060 !important;
        box-shadow: none;
    }

    /* Compact desktop : ne pas réduire le mobile */
    #main_menu.ht-menu-compact .navbar-nav > li > a {
        font-size: 15px !important;
        padding: 16px 20px !important;
    }
}

@media (min-width: 992px) {
    body.ht-mobile-nav-open::before {
        display: none !important;
    }
}