/* Color del menú */
.navbar-custom {
    background-color: var(--color-principal);
    border-bottom: 2px solid #FFFFFF;
}

    /* Marca de la barra de navegación (PAI) */
    .navbar-custom .navbar-brand {
        color: #FFFFFF;
        font-weight: bold;
    }

    /* Enlaces del menú principal */
    .navbar-custom .navbar-nav > .nav-item > .nav-link {
        color: #FFFFFF;
        font-weight: 500;
        padding: 12px 15px;
        transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
    }

        /* Efecto al pasar el cursor sobre los enlaces principales */
        .navbar-custom .navbar-nav > .nav-item > .nav-link:hover {
            background-color: #26519c;
            color: #FFFFFF;
            border-radius: 4px;
        }

    /* Estilo para el botón de colapso en dispositivos móviles */
    .navbar-custom .navbar-toggler {
        /* Cambia el color del borde del botón para que sea visible */
        border-color: rgba(255, 255, 255, 0.5);
    }

    .navbar-custom .navbar-toggler-icon {
        /* Cambia el color de las líneas del icono a blanco */
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.8)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    /* Dropdown menu (submenús) */
    .navbar-custom .dropdown-menu {
        background-color: #26519c;
        border: none;
        box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        padding: 0;
    }

    /* Enlaces del submenú */
    .navbar-custom .dropdown-item {
        color: #FFFFFF;
        padding: 10px 20px;
    }

    /* Efecto al pasar el cursor sobre los enlaces del submenú */
    .navbar-custom .dropdown-item:hover {
        background-color: #2e59a6;
        color: #FFFFFF;
    }

    /* Estilo del menú activo */
    .navbar-custom .nav-link.active {
        background-color: #1a3666;
        color: #FFFFFF;
        border-radius: 4px;
    }



    /* Estilo para el botón de cierre de sesión */
    .navbar-custom form .btn-link {
        color: #ECF0F1; /* Color de texto blanco/claro */
        font-weight: bold;
        text-decoration: none; /* Opcional: elimina el subrayado del enlace */
    }

    /* Efecto al pasar el cursor */
    .navbar-custom form .btn-link:hover {
        color: #FFFFFF;
        text-decoration: underline; /* Opcional: muestra un subrayado al pasar el cursor */
    }