/* =============================================
   NAVBAR PUBLIQUE (includes/navbarIndex.php)
   Chargée par headerIndex.php sur TOUTES les pages publiques
   (landing, explore, blog, rides…). Le style "transparent sur
   hero" reste dans landing.css (landing uniquement).
   ============================================= */

/* Ancre du dropdown mobile. Sur la landing, landing.css repasse le header
   en position:absolute via .landing-header-transparent (chargé après). */
.landing-header {
    position: relative;
}

@media (max-width: 991.98px) {

    /* --- Collapse du menu en dropdown sous le burger --- */
    .header-navs {
        display: none !important;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #fff;
        box-shadow: 0 8px 24px rgba(0, 0, 0, .15);
        border-radius: 0 0 12px 12px;
        padding: 16px 20px !important;
        z-index: 105;
        flex-direction: column !important;
        height: auto !important;
        width: 100% !important;
    }
    .header-navs.show {
        display: flex !important;
    }
    /* Garde-fou : neutralise toute hauteur inline posée par un composant
       Metronic (KTScroll) — le dropdown reste à hauteur de contenu */
    .header-navs .tab-content {
        height: auto !important;
    }
    .header-navs .menu {
        flex-direction: column !important;
    }
    .header-navs .menu-link {
        padding: 12px 16px !important;
        border-radius: 8px;
    }
    /* Spécificité volontairement supérieure à
       ".landing-header-transparent .menu-title" (landing.css) : le texte du
       dropdown reste sombre quel que soit l'ordre de chargement des feuilles */
    .landing-header .header-navs .menu-title,
    .landing-header .header-navs .menu-link {
        color: #071437 !important;
    }
    .landing-header .header-navs .menu-item.here .menu-title {
        color: var(--bs-primary, #1B84FF) !important;
    }
    .header-navs .menu-link:hover {
        background: rgba(27, 132, 255, .08);
    }

    /* Prevent logo container from stretching full width */
    .landing-header .flex-equal {
        flex: 0 1 auto !important;
    }

    /* Toolbar buttons — compact on mobile */
    .landing-header .btn-sm {
        padding: 6px 12px !important;
        font-size: .8rem !important;
    }
}

@media (max-width: 575.98px) {
    /* Even smaller buttons on XS */
    .landing-header .btn-sm {
        padding: 5px 10px !important;
        font-size: .75rem !important;
    }
}