/** Shopify CDN: Minification failed

Line 6:1 Unexpected "/"

**/
*/
.m-menu-button { 
    width: 20%; 
}

/* Menu principale più sottile */
.m-menu { 
    background: #000000; /* Sfondo nero */
    color: #FFFFFF; /* Testo bianco */
    border-bottom: 2px solid #d1ac13;
     height: 50px; /* ALTEZZA FISSA ridotta */

    padding: 0px; /* Riduce l'altezza del menu */
    position: relative;
    width: 100% !important; /* Occupa tutta la larghezza della pagina */
}

/* Assicura che il contenitore del menu sia a larghezza piena */
.m-header__menu {
    width: 100% !important;
    max-width: 100vw !important;
}

/* Riduce margini laterali per un look più pulito */
.m-header__container {
    width: 100% !important;
    max-width: 100vw !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Stile delle voci di menu - più sottili ed eleganti */
.m-menu__item { 
    padding: 0px 0px; /* Riduce lo spazio verticale */
    font-size: 17px; /* Testo leggermente più piccolo per eleganza */
    font-weight: 600; /* Non troppo bold */
    color: #FFFFFF;
    position: relative;
}

/* Mantiene il colore originale dei link */
.m-menu__link { 
    color: #FFFFFF;
    text-decoration: none;
    transition: color 0.3s ease;
}

/* Effetto hover sui link */
.m-menu__link:hover { 
    color: #d1ac13;
}

/* *** STILE PRIMO LIVELLO *** */
.m-mega-menu__container {
    background: #FFFFFF !important;
    padding: 8px !important; /* Ridotto lo spazio interno */
    border-radius: 5px !important;
    box-shadow: none !important;
    width: auto !important;
}

/* *** STILE SECONDO LIVELLO - CONTRASTO VISIVO *** */
.m-mega-menu__column {
    background: #F5F5F5 !important; 
    padding: 8px 0 !important; /* Spazio interno ridotto */
    border: 1px solid #D1AC13 !important;
    border-radius: 5px !important;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2) !important; /* Ombra più sottile */
    width: 90% !important;
    transition: all 0.3s ease-in-out;
}

/* Effetto hover per il secondo livello */
.m-mega-menu__column:hover {
    background: #EAEAEA !important; 
    box-shadow: 0px 6px 14px rgba(0, 0, 0, 0.3) !important;
}

/* Stile dei link nei sotto livelli del menu */
.m-sub-menu a, .m-mega-menu a, .gm-submenu a,
.m-sub-menu ul a, .m-mega-menu ul a, .gm-submenu ul a { 
    color: #000000 !important; /* Mantiene il colore nero */
    font-size: 15px !important; /* Cambia la dimensione del font */
    font-weight: 600 !important; /* Cambia il peso del font */
    padding: 8px 12px; /* Spazio interno ottimizzato */
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: none !important;
    transition: background 0.3s ease, color 0.3s ease;
}

/* Effetto hover sui dropdown */
.m-sub-menu a:hover, .m-mega-menu a:hover, .gm-submenu a:hover,
.m-sub-menu ul a:hover, .m-mega-menu ul a:hover, .gm-submenu ul a:hover { 
    background: #d1ac13 !important;
    color: #FFFFFF !important;
}

/* Mantiene il menu principale su una riga */
.m-menu--optimized { 
    display: flex;
    flex-wrap: nowrap !important;
    justify-content: center;
    align-items: center;
    gap: 12px; /* Leggermente più piccolo */
}

/* Blocca il ritorno a capo */
.m-menu--optimized .m-menu__item { 
    flex-shrink: 0;
    white-space: nowrap;
}

/* Scroll invisibile per nascondere eventuali scrollbar */
.m-menu--optimized::-webkit-scrollbar { 
    display: none;
}

.m-menu--optimized { 
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Abilita lo scroll SOLO per il primo livello quando ci sono 8 o più voci */
.m-sub-menu--scrollable {
    max-height: 350px; /* Ridotto per migliorare l'estetica */
    overflow-y: auto;  
}

/* Assicura che il secondo livello NON abbia scroll */
.m-sub-menu--scrollable .m-sub-menu--level-2 {
    max-height: unset;
    overflow: visible;
}

/* Scrollbar più sottile */
.m-sub-menu--scrollable::-webkit-scrollbar {
    width: 4px; /* Ridotta */
}

.m-sub-menu--scrollable::-webkit-scrollbar-thumb {
    background-color: #d1ac13;
    border-radius: 4px;
}

.m-sub-menu--scrollable::-webkit-scrollbar-track {
    background: #000000;
} 

/* Sposta leggermente la barra di ricerca verso il centro */
.m-header__left {
    margin-left: 100px !important; /* Aumentato per distanziarla dal bordo */
}

/* Sposta leggermente il blocco delle icone verso il centro */
.m-header__right {
    margin-right: 100px !important; /* Aumentato per distanziarlo dal bordo */
}

/* Adatta la barra di ricerca e le icone per essere meglio centrate */
@media (max-width: 1440px) {
    .m-header__left {
        margin-left: 60px !important;
    }
    .m-header__right {
        margin-right: 60px !important;
    }
}

/* Mantiene margini più ampi per schermi grandi */
@media (min-width: 1441px) {
    .m-header__left {
        margin-left: 100px !important;
    }
    .m-header__right {
        margin-right: 100px !important;
    }
}

/* Riduce lo spazio tra le voci di menu solo su schermi più piccoli */
@media (max-width: 1440px) {
    .m-menu--optimized {
        gap: 8px !important; /* Riduce lo spazio tra le voci */
    }
    .m-menu__item {
        font-size: 16px !important; /* Riduce leggermente il font */
    }
}

/* Mantiene una buona distanza per schermi grandi */
@media (min-width: 1441px) {
    .m-menu--optimized {
        gap: 12px !important; /* Spaziatura normale per i grandi schermi */
    }
}


/* ==================== */
/* 📌 STILE MENU MOBILE RIMODULATO */
/* ==================== */

/* Sfondo bianco per il menu mobile */
.m-menu-drawer {
    background: #FFFFFF !important;
}

/* Sfondo bianco per il contenitore */
.m-menu-drawer__wrapper {
    background: #FFFFFF !important;
}

/* Stile delle voci di menu principali */
.m-menu-mobile__item {
    border-bottom: 1px solid #d1ac13 !important; /* Bordi dorati per separare le voci principali */
}

/* Testo delle voci principali in grassetto */
.m-menu-mobile__link,
.m-menu-mobile__toggle-button {
    color: #000000 !important;
    font-size: 17px !important;
    font-weight: 700 !important; /* Grassetto */
    text-decoration: none !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    white-space: normal !important; /* Impedisce il taglio del testo */
    word-break: break-word !important; /* Permette la divisione del testo lungo */
}

/* ===== SUBMENU LIVELLO 1 & 2 ===== */

/* Blocca lo scroll orizzontale e migliora adattamento */
.m-megamenu-mobile,
.m-megamenu-mobile--level-1.open {
    overflow-x: hidden !important;
    white-space: normal !important;
    word-break: break-word !important;
    max-width: 100% !important;
}

/* Sfondo bianco per i livelli secondari */
.m-megamenu-mobile {
    background: #FFFFFF !important;
    max-height: calc(100vh - 50px) !important; /* Occupa tutto lo spazio disponibile senza tagliare */
    overflow-y: auto !important; /* Abilita lo scroll verticale */
    scrollbar-width: thin !important; /* Scroll sottile */
    padding-bottom: 50px !important; /* Evita il taglio dell'ultimo elemento */
}

/* Scroll solo se necessario */
.m-megamenu-mobile::-webkit-scrollbar {
    width: 4px !important;
}

.m-megamenu-mobile::-webkit-scrollbar-thumb {
    background-color: #d1ac13 !important;
    border-radius: 4px !important;
}

.m-megamenu-mobile::-webkit-scrollbar-track {
    background: #000000 !important;
}

/* TITOLO DELLA COLLEZIONE CHE PERMETTE DI TORNARE INDIETRO (IN GRASSETTO) */
.m-menu-mobile__back-button {
    background: transparent !important; /* Nessun colore di sfondo */
    color: #000000 !important; /* Testo nero */
    font-size: 17px !important;
    font-weight: 700 !important; /* Grassetto per distinguerlo */
    padding: 12px 16px;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 8px;
    border: none !important; /* Nessun bordo dorato */
}

/* VOCI DELLE SOTTOCATEGORIE (PIÙ LEGGERE) */
.m-submenu-mobile .m-menu-mobile__item a {
    color: #000000 !important;
    font-size: 16px !important;
    font-weight: 400 !important; /* Testo più leggero per distinguere */
    padding: 10px 16px;
    white-space: normal !important; /* Permette il ritorno a capo */
    word-break: break-word !important; /* Evita tagli su iPhone */
}

/* ==================== */
/* 📌 SCROLL PER SOTTOMENU LIVELLO 2 */
/* ==================== */

/* Contenitore del livello 2 - Scroll dinamico */
.m-megamenu-mobile--level-2 {
    max-height: calc(100vh - 50px) !important; /* Evita che si espanda troppo */
    overflow-y: auto !important;
    padding-bottom: 50px !important; /* Evita il taglio dell'ultimo elemento */
    overflow-x: hidden !important; /* Blocca lo scroll orizzontale */
}

/* Scroll sottile per il livello 2 */
.m-megamenu-mobile--level-2::-webkit-scrollbar {
    width: 4px !important;
}

.m-megamenu-mobile--level-2::-webkit-scrollbar-thumb {
    background-color: #d1ac13 !important;
    border-radius: 4px !important;
}

.m-megamenu-mobile--level-2::-webkit-scrollbar-track {
    background: #000000 !important;
}

/* ==================== */
/* 📌 RESPONSIVE DESIGN PER TUTTI GLI SCHERMI */
/* ==================== */

/* Per dispositivi piccoli (es. iPhone 12, Samsung Galaxy vecchi) */
@media (max-width: 390px) {
    .m-megamenu-mobile {
        max-height: calc(100vh - 60px) !important;
    }

    .m-megamenu-mobile--level-2 {
        max-height: calc(100vh - 60px) !important;
    }

    /* Ridimensiona il testo per evitare il taglio */
    .m-menu-mobile__link,
    .m-menu-mobile__toggle-button {
        font-size: 14px !important;
        padding: 8px 12px !important;
    }
}

/* Per dispositivi più grandi (es. iPhone 12 Pro Max, Pixel 7, Samsung Galaxy S21) */
@media (max-width: 430px) {
    .m-megamenu-mobile {
        max-height: calc(100vh - 60px) !important;
    }

    .m-megamenu-mobile--level-2 {
        max-height: calc(100vh - 60px) !important;
    }
}

/* Per tablet e schermi più grandi */
@media (min-width: 768px) {
    .m-megamenu-mobile {
        max-height: calc(100vh - 80px) !important;
    }

    .m-megamenu-mobile--level-2 {
        max-height: calc(100vh - 80px) !important;
    }
}

/* ==================== */
/* 📌 FINE STILE MENU MOBILE */
/* ==================== */


/* ==================== */
/* 📌 SEZIONE ACCOUNT - ALLINEAMENTO PERFETTO */
/* ==================== */

/* Contenitore generale */
.m-menu-customer {
    margin-top: 10px !important;
    padding-top: 0px !important;
    position: relative;
    text-align: center;
}

/* 📌 "Il mio account" ben posizionato */
.m-menu-customer__label {
    font-size: 15px !important;
    font-weight: 600 !important;
    text-align: center;
    margin-bottom: 8px !important; /* Riduce lo spazio sotto */
}

/* ==================== */
/* 📌 SEZIONE LOGIN & REGISTRAZIONE */
/* ==================== */

/* Stile uniforme per Login, Registrati e Disconnettiti */
.m-menu-customer__button {
    display: block !important;
    text-align: center !important;
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 10px 14px !important;
    border-radius: 6px !important;
    border: none !important;
    margin: 8px auto !important; /* Uniforma il margine tra i pulsanti */
    width: 85% !important;
    max-width: 230px !important;
    text-decoration: none !important;
    transition: all 0.3s ease-in-out;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.12) !important;
}

/* 📌 Effetto hover per tutti i pulsanti */
.m-menu-customer__button:hover {
    background: #000000 !important;
    color: #ffffff !important;
}

/* 📌 Rimuove il bordo inferiore dell'ultimo pulsante */
.m-menu-customer__button:last-child {
    border-bottom: none !important;
}

/* ==================== */
/* 📌 ACCOUNT UTENTE - ALLINEAMENTO ICONA & EMAIL */
/* ==================== */

/* 📌 Contenitore dell'account */
.m-menu-customer__account {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 100% !important;
    padding: 6px 12px !important;
    text-align: center !important;
}

/* 📌 Link cliccabile per accedere all'account */
.m-menu-customer__account-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    padding: 5px 10px !important;
    width: 100% !important;
}

/* 📌 Icona utente più piccola */
.m-menu-customer__icon svg {
    width: 16px !important;
    height: 16px !important;
    fill: #000000 !important;
}

/* 📌 Email allineata */
.m-menu-customer__email {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: inline-block !important;
}

/* 📌 Effetto hover */
.m-menu-customer__account-link:hover .m-menu-customer__email {
    color: #d1ac13 !important;
}

.m-menu-customer__account-link:hover .m-menu-customer__icon svg {
    fill: #d1ac13 !important;
}

/* ==================== */
/* 📌 DISCONNETTITI - STILE COERENTE */
/* ==================== */

.m-logout-button {
    display: block !important;
    text-align: center !important;
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 10px 14px !important;
    border-radius: 6px !important;
    border: none !important;
    margin: 10px auto !important; /* Leggermente abbassato */
    width: 85% !important;
    max-width: 230px !important;
    text-decoration: none !important;
    transition: all 0.3s ease-in-out;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.12) !important;
}

/* 📌 Effetto hover */
.m-logout-button:hover {
    background: #000000 !important;
    color: #ffffff !important;
}


