/* Estilos para menú móvil con slide-in desde arriba */
@media (max-width: 767px) {
    /* Ajustes del toggle */
    #menu-principal-header .elementor-menu-toggle {
        z-index: 9999999 !important; /* Z-index muy alto */
        position: relative !important;
    }
    
    /* Cambiar color del toggle cuando está activo */
    #menu-principal-header .elementor-menu-toggle.elementor-active {
        color: white !important;
    }
    
    /* Estilo del contenedor principal del menú */
    #menu-principal-header .elementor-nav-menu--dropdown.elementor-nav-menu__container {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        background-color: #ce0037 !important;
        padding: 80px 20px 20px !important;
        z-index: 9999998 !important; /* Z-index extremadamente alto */
        
        /* Posición inicial (fuera de la pantalla) */
        transform: translateY(-100%) !important;
        
        /* Transición suave */
        transition: transform 0.4s ease !important;
        
        /* Estilos adicionales */
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
        border: none !important;
        overflow-y: auto !important;
    }
    
    /* Cuando el menú está activo */
    #menu-principal-header .elementor-menu-toggle.elementor-active + .elementor-nav-menu--dropdown.elementor-nav-menu__container {
        transform: translateY(0) !important;
    }
    
    /* Logo blanco */
    #menu-principal-header .mobile-menu-logo {
        position: absolute !important;
        top: 20px !important;
        left: 20px !important;
        width: 250px !important;
        height: 50px !important;
        background-image: url('https://transparencia.barcelonaencomu.cat/wp-content/uploads/sites/4/2025/04/Logo-Monotono-Blanco.png') !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        background-position: left center !important;
        z-index: 9999999 !important; /* Z-index muy alto */
    }
    
    /* Estilo de los elementos del menú */
    #menu-principal-header .elementor-nav-menu--dropdown .elementor-item,
    #menu-principal-header .elementor-nav-menu--dropdown .elementor-sub-item {
        color: white !important;
        font-size: 24px !important;
        padding: 15px 0 !important;
        text-align: center !important;
    }
    
    /* Quitar efectos de fondo en hover */
    #menu-principal-header .elementor-nav-menu--dropdown .elementor-item:hover,
    #menu-principal-header .elementor-nav-menu--dropdown .elementor-sub-item:hover {
        background-color: transparent !important;
    }
    
    /* Deshabilitar scroll cuando el menú está abierto */
    body.menu-mobile-open {
        overflow: hidden !important;
    }
}