/* ==========================================================
   1. BASE & DESKTOP (981px et plus)
   ========================================================== */

/* On cache tout par défaut */
header#top-header .sub-menu, 
header#top-header .main-nav ul li ul {
    display: none; 
    position: absolute; 
    visibility: hidden;
    opacity: 0;
    list-style: none;
    padding: 20px 0;
    margin: 0;
    background: #FFF;
    z-index: 9999;
    min-width: 250px;
    box-shadow: 0px 8px 15px rgba(0,0,0,0.1);
    flex-direction: column;
}

/* Positionnement du parent sur Desktop */
@media screen and (min-width: 981px) {
    header#top-header .main-nav ul li.menu-item-has-children {
        position: relative;
    }
    /* Ouverture au Hover */
    header#top-header .main-nav ul li.menu-item-has-children:hover > ul {
        display: flex !important;
        visibility: visible;
        opacity: 1;
        top: 100%;
        left: 0;
    }
}

/* Styles des liens du sous-menu (Communs) */
.sub-menu li, header#top-header .main-nav ul li ul li {
    display: flex !important;
    padding: 8px 20px;
		margin:0 !important;
}

.sub-menu li a, header#top-header .main-nav ul li ul li a {
    color: #000 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 16px !important;
    text-decoration: none !important;
    border: none !important;
}
#top-header nav .container .main-nav ul li ul li:hover {
	border-bottom: none;
}
.sub-menu li a:hover, header#top-header .main-nav ul li ul li a:hover { 
    color: #86D6DB !important; 
}

/* ==========================================================
   2. MOBILE UNIQUEMENT (980px et moins)
   ========================================================== */
@media screen and (max-width: 980px) {
    
    /* Structure du menu mobile */
    header#top-header .nav-burger .sub-menu {
        position: static !important; 
        display: none; 
        visibility: visible;
        opacity: 1;
        box-shadow: none;
        background: #f9f9f9;
        width: 100%;
    }

    header#top-header .nav-burger li.is-open > .sub-menu {
        display: block !important;
    }

    /* AJOUT DES FLÈCHES : Seulement ici */
    .nav-burger .menu-item-has-children > a::after, 
    .nav-burger .submenu-toggle::after {
        content: '▾';
        margin-left: 10px;
        display: inline-block;
        transition: transform 0.3s ease;
        font-size: 20px;
        line-height: 1;
        vertical-align: middle;
    }

    /* Rotation de la flèche quand ouvert */
    .nav-burger li.is-open > a::after,
    .nav-burger li.is-open > .submenu-toggle::after {
        transform: rotate(180deg);
        color: #86D6DB;
    }
}