/* Estilos generales del menú de navegación */
.navbar-custom {
    background-color: #081A51;
}

.navbar-custom .nav-link,
.navbar-custom .navbar-brand,
.navbar-custom .navbar-periodo {
    color: white;
}

.navbar-custom .nav-link:hover,
.navbar-custom .dropdown-item:hover{
    color: #081A51;
    background-color: white;
}
.navbar-custom .dropdown-menu {
    background-color: #081A51;
}

.navbar-custom .dropdown-menu .dropdown-item {
    color: white;
}

.navbar-custom .dropdown-menu .dropdown-item:hover {
    color: #081A51;
    background-color: white;
}

.navbar-custom .nav-link.dropdown-toggle {
    color: white !important;
}

.navbar-custom .nav-link.dropdown-toggle:hover {
    color: #081A51 !important;
}

/* Ajustes para el botón del menú desplegable */
.navbar-custom .navbar-toggler {
    border-color: white;
}

.navbar-custom .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Estilos para submenús */
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
    display: none;
}

.dropdown-submenu:hover .dropdown-menu {
    display: block;
}

/* Mostrar submenús en dispositivos de escritorio */
@media (min-width: 992px) {
    .dropdown-menu .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }
}

/* Ajustes para submenús en dispositivos móviles */
@media (max-width: 991.98px) {
    .dropdown-submenu .dropdown-menu {
        position: relative;
        left: 0;
        display: none;
    }

    .dropdown-submenu.open .dropdown-menu {
        display: block;
    }

    /* Usar un tipo de viñeta personalizada para los submenús */
    .dropdown-submenu > .dropdown-toggle::after {
        content: ''; /* Aquí puedes cambiar el símbolo a cualquier otro */
        float: right;
        font-size: 0.8em; /* Tamaño más pequeño para la viñeta en móviles */
    }

    .dropdown-submenu.open > .dropdown-toggle::after {
        content: '▾'; /* Símbolo de flecha hacia abajo cuando está abierto */
        float: right;
        font-size: 0.8em; /* Tamaño más pequeño para la viñeta en móviles */
    }
}

/* Ajuste para el dropdown del usuario */
.navbar-custom .dropdown-menu-end {
    right: 0;
    left: auto;
}