/* CSS FORZADO para menú móvil - SOLUCIÓN DEFINITIVA */

/* FORZAR position: fixed en móvil para .vives-nav__list */
@media (max-width: 768px) {
    .vives-nav__list {
        position: fixed !important;
        top: var(--menu-height-mobile) !important;
        left: 0 !important;
        right: 0 !important;
        background: var(--vives-blue) !important;
        flex-direction: column !important;
        height: auto !important;
        max-height: calc(100vh - var(--menu-height-mobile)) !important;
        overflow-y: auto !important;
        transform: translateX(-100%) !important;
        transition: transform 0.3s ease !important;
        z-index: 999 !important;
        padding: 0 !important;
        display: flex !important;
    }
    
    .vives-nav__list.active {
        transform: translateX(0) !important;
    }
}

/* FORZAR overlay en móvil */
@media (max-width: 768px) {
    .vives-nav__overlay {
        display: none !important;
        pointer-events: none !important;
    }
    
    .vives-nav__overlay.active {
        display: block !important;
        pointer-events: auto !important;
    }
}

/* Elemento que bloqueaba todo */
.barra_color {
    pointer-events: none !important;
    z-index: -1 !important;
    position: relative !important;
}

/* Asegurar que el nav tenga z-index correcto */
.vives-nav {
    z-index: 1000 !important;
}

.vives-nav__container {
    z-index: 1001 !important;
}

.vives-nav__list {
    z-index: 1002 !important;
}

/* Enlaces del menú */
.vives-nav__link,
.vives-nav__submenu-link {
    pointer-events: auto !important;
    cursor: pointer !important;
}