/**
 * mod_hamburger - Stylesheet
 * Verbergt de Cassiopeia horizontale menubalk en toont de hamburger-toggler.
 * Geactiveerd via body.mod-hamburger-hide-nav, gezet door hamburger.js.
 * Werkt in Joomla 4 / 5 / 6 met Cassiopeia.
 */

/* Verberg het volledige menu incl. hamburger-knop op geselecteerde pagina's */
body.mod-hamburger-hide-all .container-nav,
body.mod-hamburger-hide-all .grid-child.container-nav {
    display: none !important;
}


body.mod-hamburger-hide-nav .container-nav .navbar-collapse,
body.mod-hamburger-hide-nav .grid-child.container-nav .navbar-collapse {
    display: none !important;
}

/* Toon de hamburger-toggler altijd, ook op brede schermen */
body.mod-hamburger-hide-nav .container-nav .navbar-toggler,
body.mod-hamburger-hide-nav .grid-child.container-nav .navbar-toggler {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

/* Zorg dat het hamburger-icoon (icon-menu) altijd zichtbaar is,
   ook als de achtergrond transparant is.
   Cassiopeia gebruikt currentColor — we zetten een expliciete kleur
   via de CSS-variabele van het template, met zwart als fallback. */
body.mod-hamburger-hide-nav .container-nav .navbar-toggler .icon-menu,
body.mod-hamburger-hide-nav .grid-child.container-nav .navbar-toggler .icon-menu {
    color: var(--cassiopeia-color-primary, var(--bs-primary, #333)) !important;
    font-size: 1.5rem;
}

/* Toon het menu wél als de hamburger geklikt is (Bootstrap .show / .collapsing) */
body.mod-hamburger-hide-nav .container-nav .navbar-collapse.show,
body.mod-hamburger-hide-nav .container-nav .navbar-collapse.collapsing,
body.mod-hamburger-hide-nav .grid-child.container-nav .navbar-collapse.show,
body.mod-hamburger-hide-nav .grid-child.container-nav .navbar-collapse.collapsing {
    display: block !important;
}

/* Vloeiende overgang voor de achtergrondkleur (JS beheert de waarden) */
body.mod-hamburger-hide-nav .container-header {
    transition: background-color 0.25s ease;
}