/* public/assets/css/header.css */

/* Solo para pantallas grandes (PC) */
@media (min-width: 992px) {
    .dropdown-submenu {
        position: relative;
    }

    /* Oculto por defecto */
    .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%; /* Aparece a la derecha del menú padre */
        margin-top: -5px;
        display: none; 
        border-radius: 0.5rem;
    }

    /* Mostrar al hacer HOVER sobre el contenedor padre */
    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }
}

/* Para Celulares (Touch) */
@media (max-width: 991px) {
    .dropdown-submenu > .dropdown-menu {
        display: block; 
        position: static;
        border: none;
        padding-left: 1.5rem; /* Sangría para identificar que es sub-item */
        box-shadow: none;
        background-color: #f8f9fa; /* Un tono gris ligero para diferenciar */
    }
}

/* Ajuste de flechas indicadoras */
.dropdown-item.dropdown-toggle::after {
    display: none; /* Quitamos la flecha de Bootstrap para usar nuestro icono */
}