/*
 * CSS funcional obligatorio del módulo.
 * Estas reglas controlan la apertura/cierre del menú y no deben eliminarse
 * aunque el diseño visual se implemente desde la plantilla del sitio.
 */

.menu-lateral-dane__submenu[hidden] {
    display: none !important;
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/*
 * Estado base: en escritorio el contenedor permanece visible y el botón móvil
 * queda oculto. En móvil, el contenedor se muestra solo cuando menu.js agrega
 * la clase .is-open al elemento .menu-lateral-dane.
 *
 * Los estilos visuales fuertes del botón, colores, bordes, tipografías y espaciados
 * deben aplicarse desde la hoja de estilos de la plantilla.
 */

.menu-lateral-dane__mobile-toggle {
    display: none;
}

.menu-lateral-dane__container {
    display: block;
}

@media (max-width: 991px) {

    .menu-lateral-dane__mobile-toggle {
        display: block;
    }

    .menu-lateral-dane__container {
        display: none;
    }

    .menu-lateral-dane__container[hidden] {
        display: none !important;
    }

    .menu-lateral-dane.is-open .menu-lateral-dane__container {
        display: block;
    }
}
