/* ================================================
   MENU DROPDOWN - STILI FORZATI
   ================================================ */

/* Reset completo per i sottomenu */
.header-nav .sub-menu,
.header-nav ul.sub-menu,
ul#menu-new_menu .sub-menu,
.nav-menu .sub-menu {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    padding-left: 0 !important;
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    background: #fff !important;
    min-width: 220px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15) !important;
    border: 1px solid #ddd !important;
    z-index: 9999 !important;
}

/* Li dentro i sottomenu */
.header-nav .sub-menu li,
.header-nav ul.sub-menu li,
ul#menu-new_menu .sub-menu li,
.nav-menu .sub-menu li {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
    position: relative !important;
}

.header-nav .sub-menu li:last-child {
    border-bottom: none !important;
}

/* Link dentro i sottomenu */
.header-nav .sub-menu a,
.header-nav ul.sub-menu a,
ul#menu-new_menu .sub-menu a,
.nav-menu .sub-menu a {
    display: block !important;
    padding: 12px 20px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    font-weight: 400 !important;
    color: #000 !important;
    transition: background 0.2s ease !important;
}

.header-nav .sub-menu a:hover {
    background: #f5f5f5 !important;
    color: #cf3a3a !important;
}

/* Elemento genitore deve essere relative */
.header-nav .menu-item-has-children,
.nav-menu .menu-item-has-children,
ul#menu-new_menu .menu-item-has-children {
    position: relative !important;
}

/* ================================================
   TESTO SCORREVOLE MENU PRINCIPALE
   ================================================ */

/* ===== DESKTOP: Layout flex per menu principale ===== */
@media (min-width: 769px) {
    /* Il container che contiene menu + icone */
    .header-inner {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
    }
    
    /* Logo a sinistra */
    .header-left {
        flex-shrink: 0 !important;
    }
    
    /* Nav menu al centro che si espande */
    .header-nav {
        flex: 1 1 auto !important;
        overflow: visible !important; /* Importante per contenere il testo scorrevole */
        margin: 0 20px !important; /* Spazio tra logo e icone */
    }
    
    /* Il menu UL dentro header-nav */
    .header-nav > ul,
    ul#menu-new_menu {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
    }
    
    /* Voci normali del menu principale */
    .header-nav > ul > li:not(.menu-scrolling-text),
    ul#menu-new_menu > li:not(.menu-scrolling-text) {
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }
    
    /* Voce con testo scorrevole - occupa spazio residuo NEL MENU */
    .menu-scrolling-text {
        flex: 0 0 300px !important;
        overflow: hidden !important;
        position: relative !important;
        min-width: 100px !important; /* Larghezza minima */
        max-width: 250px !important;
    }
    
    /* Icone a destra - non si restringono mai */
    .header-right {
        flex-shrink: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 15px !important;
    }
    
    /* Mostra sottomenu al hover */
    .header-nav .menu-item-has-children:hover > .sub-menu,
    .header-nav .menu-item-has-children:hover > ul.sub-menu,
    ul#menu-new_menu .menu-item-has-children:hover > .sub-menu {
        display: block !important;
    }
}

/* Container del marquee per menu principale */
.menu-scrolling-text .marquee-wrapper {
    display: flex !important;
    width: 100% !important;
    overflow: hidden !important;
}

/* Contenuto scorrevole */
.menu-scrolling-text .marquee-content {
    display: flex !important;
    animation: scroll-marquee 20s linear infinite !important;
    padding-right: 50px !important;
}

/* Testo duplicato */
.menu-scrolling-text .marquee-content span {
    white-space: nowrap !important;
    padding-right: 50px !important;
}

/* Animazione marquee */
@keyframes scroll-marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Pausa al hover */
.menu-scrolling-text:hover .marquee-content {
    animation-play-state: paused !important;
}

/* ================================================
   TESTO SCORREVOLE NEI SOTTOMENU (esistente)
   ================================================ */

.header-nav .sub-menu .scrolling-text a,
.nav-menu .sub-menu .scrolling-text a,
ul#menu-new_menu .sub-menu .scrolling-text a {
    overflow: hidden !important;
    position: relative !important;
    display: block !important;
}

.header-nav .sub-menu .scrolling-text a .scroll-wrapper,
.nav-menu .sub-menu .scrolling-text a .scroll-wrapper,
ul#menu-new_menu .sub-menu .scrolling-text a .scroll-wrapper {
    display: inline-block !important;
    white-space: nowrap !important;
    animation: scroll-text 15s linear infinite !important;
}

@keyframes scroll-text {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-33.333%);
    }
}

.header-nav .sub-menu .scrolling-text:hover a .scroll-wrapper,
.nav-menu .sub-menu .scrolling-text:hover a .scroll-wrapper {
    animation-play-state: paused !important;
}

/* ================================================
   MOBILE
   ================================================ */
@media (max-width: 768px) {
    /* Reset flex per mobile */
    .header-nav > ul,
    .nav-menu > ul,
    ul#menu-new_menu {
        display: block !important;
        width: 100% !important;
    }
    
    /* Voce con scrolling nel menu mobile */
    .menu-scrolling-text {
        overflow: hidden !important;
        position: relative !important;
        width: 100% !important;
        display: block !important;
        margin-right: 0 !important;
    }
    
    /* Link nel mobile menu */
    .menu-scrolling-text > a {
        display: block !important;
        width: 100% !important;
        overflow: hidden !important;
    }
    
    /* Velocità più lenta su mobile per leggibilità */
    .menu-scrolling-text .marquee-content {
        animation-duration: 25s !important;
    }
    
    /* Sottomenu chiuso di default */
    .header-nav .sub-menu,
    .header-nav ul.sub-menu,
    .nav-menu .sub-menu,
    ul#menu-new_menu .sub-menu {
        position: static !important;
        box-shadow: none !important;
        border: none !important;
        background: #f5f5f5 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        transition: max-height 0.4s ease !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    /* Sottomenu aperto quando il genitore ha classe .active */
    .header-nav .menu-item-has-children.active > .sub-menu,
    .header-nav .menu-item-has-children.active > ul.sub-menu,
    .nav-menu .menu-item-has-children.active > .sub-menu,
    ul#menu-new_menu .menu-item-has-children.active > .sub-menu {
        max-height: 1000px !important;
        margin-top: 10px !important;
    }

    /* Indicatore freccia per mobile */
    .header-nav .menu-item-has-children > a::after,
    .nav-menu .menu-item-has-children > a::after,
    ul#menu-new_menu .menu-item-has-children > a::after {
        content: ' ▼' !important;
        font-size: 0.7em !important;
        margin-left: 8px !important;
        display: inline-block !important;
        transition: transform 0.3s ease !important;
    }

    /* Freccia ruotata quando aperto */
    .header-nav .menu-item-has-children.active > a::after,
    .nav-menu .menu-item-has-children.active > a::after,
    ul#menu-new_menu .menu-item-has-children.active > a::after {
        transform: rotate(180deg) !important;
    }

    /* Stili per gli elementi dei sottomenu mobile */
    .header-nav .sub-menu li,
    .nav-menu .sub-menu li {
        border-bottom: 1px solid #e0e0e0 !important;
        background: #f5f5f5 !important;
    }

    .header-nav .sub-menu a,
    .nav-menu .sub-menu a {
        padding: 10px 20px !important;
        font-size: 14px !important;
        background: transparent !important;
    }
    
    .header-nav .sub-menu a:hover,
    .nav-menu .sub-menu a:hover {
        background: #e8e8e8 !important;
    }
}

@media (max-width: 768px) {
  /* Forza la disposizione verticale di tutte le voci */
  .header-nav ul,
  .header-nav ul li,
  ul#menu-new_menu,
  ul#menu-new_menu > li {
    display: block !important;
    width: 100% !important;
    float: none !important;
    margin-bottom: 15px !important;
  }

   /* Per evitare che l'ultimo abbia spazio extra sotto */
  .header-nav ul li:last-child {
    margin-bottom: 0 !important;
  }

    /* Evita che i link si comprimano o si affianchino */
   .header-nav ul li a {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
  }
}