/* ============================================
   📱 ESTILOS PARA NAVBAR MÓVIL (ACORDEÓN)
   ============================================

   Estilos aplicados SOLO en móvil (≤768px) para
   mejorar la presentación del menú acordeón.

   Reemplaza la inyección de estilos inline que
   se hacía desde JavaScript con !important.

   ============================================ */

@media (max-width: 768px) {
    /* Contenedor principal del menú móvil */
    #navbarContenido {
        background-color: rgba(255, 255, 255, 0.98);
        border: 1px solid #ddd;
        border-radius: 8px;
        box-shadow: 0 4px 8px rgba(0,0,0,0.2);
        margin-top: 5px;
        padding: 10px;
    }

    /* Cada elemento del navbar en móvil */
    .navbar-element-independent {
        background-color: rgba(255, 255, 255, 0.9);
        border-radius: 5px;
        margin: 2px 0;
        padding: 5px;
    }

    /* Clase para dropdown activo en móvil */
    .mobile-dropdown-active {
        background-color: rgba(255, 255, 255, 1);
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
}

/* ============================================
   NOTAS:
   • Este archivo reemplaza fixNavbarAccordionMobile()
   • Ya no se necesita JavaScript para inyectar estilos
   • Los estilos se aplican automáticamente en móvil
   ============================================ */