/* En-tête « Bandeau sombre » : fond anthracite, logo fondu dans le bandeau, menu en blanc,
   rubrique active soulignée en rouge. Identique en mode clair et en mode sombre du site.
   --mvk-logo-height est défini par le réglage « Hauteur du logo » du template. */

#mvk-header {
    --maverick-name-color: #fff;
    background: #141b24;
    border-bottom: 3px solid #d0021b;
}

#mvk-header .mvk-header__wrap {
    padding-block: 0;
}

#mvk-header .navbar-brand {
    margin: 0;
    padding: 0;
}

#mvk-header .navbar-brand a {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

/* Le bord droit de la photo se fond dans le bandeau. */
#mvk-header .logo-img {
    display: block;
    height: var(--mvk-logo-height, 100px);
    width: auto;
    -webkit-mask-image: linear-gradient(to right, #000 50%, transparent 100%);
    mask-image: linear-gradient(to right, #000 50%, transparent 100%);
}

#mvk-header .navbar-nav > .nav-item > .nav-link {
    color: rgba(255, 255, 255, 0.82);
}

/* alias-parent-active : classe posée par Joomla sur une entrée de type « alias » quand la page
   affichée est une sous-page de sa rubrique. */
#mvk-header .navbar-nav > .nav-item > .nav-link:hover,
#mvk-header .navbar-nav > .nav-item:is(.active, .alias-parent-active) > .nav-link {
    color: #fff;
}

#mvk-header .navbar-nav > .nav-item:is(.active, .alias-parent-active) > .nav-link {
    box-shadow: inset 0 -3px 0 #d0021b;
}

/* Bouton du menu replié, sur mobile : une zone de 44 px pour le doigt. */
#mvk-header .mvk-menu-toggle {
    min-width: 44px;
    min-height: 44px;
    color: #fff;
}

@media (max-width: 991.98px) {
    #mvk-header .logo-img {
        height: calc(var(--mvk-logo-height, 100px) * 0.7);
    }

    /* Menu déplié : le panneau reprend le fond du bandeau, pour que les liens blancs restent lisibles. */
    #mvk-header .navbar-collapse:is(.show, .collapsing) {
        padding: 8px 16px 12px;
        background: #141b24;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        border-bottom: 3px solid #d0021b;
        box-shadow: 0 12px 24px rgba(0, 0, 0, 0.35);
    }

    #mvk-header .navbar-nav > .nav-item > .nav-link {
        padding: 12px;
    }

    #mvk-header .navbar-nav > .nav-item + .nav-item {
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    /* Rubrique en cours : le filet passe à gauche, sur la hauteur de la ligne. */
    #mvk-header .navbar-nav > .nav-item:is(.active, .alias-parent-active) > .nav-link {
        box-shadow: inset 3px 0 0 #d0021b;
    }
}