/* Navigazione rapida: presente nel DOM ma visibile solo quando compare l'hamburger. */
.mobile-priority-nav {
    display: none;
}

@media (max-width: 1000px) {
    .header-v2--with-navigation .header-v2-topbar,
    .header-v2--with-navigation .header-v2-phone {
        display: none;
    }

    .header-v2--with-navigation .header-v2-main {
        height: 68px;
        padding: 0;
        box-shadow: none;
    }

    .header-v2--with-navigation .header-v2-main .container,
    .header-v2--with-navigation .header-v2-main-inner {
        height: 100%;
    }

    .header-v2--with-navigation .header-v2-main .container {
        padding-right: max(15px, env(safe-area-inset-right));
        padding-left: max(15px, env(safe-area-inset-left));
    }

    .header-v2--with-navigation .header-v2-main-inner {
        position: relative;
        justify-content: center;
    }

    .header-v2--with-navigation .header-v2-logo {
        position: absolute;
        z-index: 2;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .header-v2--with-navigation .header-v2-logo img {
        display: block;
        width: min(56vw, 220px);
        max-width: 220px;
        height: auto;
        max-height: 38px;
    }

    .header-nav-wrapper {
        border-top: 1px solid #edf1f4;
        box-shadow: 0 3px 10px rgba(29, 54, 74, .08);
    }

    .header-nav .header-nav-wrapper .menuzord,
    .menuzord-js #menuzord {
        min-height: 44px !important;
        padding: 0;
    }

    .header-nav .menuzord .showhide {
        position: absolute;
        z-index: 30;
        top: -69px;
        right: 0;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 68px;
        margin: 0;
        padding: 0;
    }

    .header-nav .menuzord .showhide em {
        float: none;
        width: 22px;
        height: 2px;
        margin: 3px 0;
        background: #21405f;
        border-radius: 2px;
    }

    .header-catalog-search {
        top: -69px;
        right: auto;
        left: 0;
        width: 44px;
        height: 68px;
        transform: none;
    }

    .header-catalog-search-trigger {
        width: 44px;
        min-height: 68px;
    }

    .header-catalog-search-trigger-icon {
        font-size: 21px;
    }

    /* Dopo l'inizializzazione i controlli sono figli reali della riga logo.
       Il posizionamento precedente resta soltanto come fallback senza JS. */
    .header-v2--with-navigation.header-mobile-controls-ready .header-v2-main-inner {
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr) 44px;
        align-items: center;
        justify-content: initial;
    }

    .header-v2--with-navigation.header-mobile-controls-ready .header-v2-logo {
        position: static;
        grid-column: 2;
        grid-row: 1;
        justify-self: center;
        transform: none;
    }

    .header-v2--with-navigation.header-mobile-controls-ready .header-catalog-search {
        position: static;
        grid-column: 1;
        grid-row: 1;
        justify-self: start;
        width: 44px;
        height: 68px;
        transform: none;
    }

    .header-v2--with-navigation.header-mobile-controls-ready .header-mobile-menu-toggle {
        position: static;
        z-index: 3;
        display: flex !important;
        grid-column: 3;
        grid-row: 1;
        flex-direction: column;
        align-items: center;
        align-self: stretch;
        justify-content: center;
        justify-self: end;
        float: none;
        width: 44px;
        height: 68px;
        margin: 0;
        padding: 0;
    }

    .header-v2--with-navigation.header-mobile-controls-ready .header-mobile-menu-toggle em {
        float: none;
        width: 22px;
        height: 2px;
        margin: 3px 0;
        background: #21405f;
        border-radius: 2px;
    }

    .mobile-priority-nav {
        position: relative;
        display: block;
        height: 44px;
        overflow: hidden;
        background: #fff;
    }

    .mobile-priority-nav::after {
        position: absolute;
        z-index: 2;
        top: 0;
        right: 0;
        width: 30px;
        height: 44px;
        pointer-events: none;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0), #fff 78%);
        content: '';
    }

    .mobile-priority-nav-scroll {
        display: flex;
        align-items: stretch;
        height: 44px;
        padding: 0 max(15px, env(safe-area-inset-left));
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
    }

    .mobile-priority-nav-scroll::-webkit-scrollbar {
        display: none;
    }

    .mobile-priority-nav-link {
        position: relative;
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        height: 44px;
        padding: 0 14px;
        color: #40596c;
        font-size: 12.5px;
        font-weight: 600;
        line-height: 1;
        text-decoration: none;
        white-space: nowrap;
        scroll-snap-align: start;
    }

    .mobile-priority-nav-link:first-child {
        padding-left: 0;
    }

    .mobile-priority-nav-link + .mobile-priority-nav-link::before {
        position: absolute;
        top: 14px;
        bottom: 14px;
        left: 0;
        width: 1px;
        background: #dce5eb;
        content: '';
    }

    .mobile-priority-nav-link:hover,
    .mobile-priority-nav-link:focus,
    .mobile-priority-nav-link.is-active {
        color: #167fbd;
        text-decoration: none;
        outline: 0;
    }

    .mobile-priority-nav-link:focus-visible {
        outline: 2px solid rgba(38, 149, 218, .45);
        outline-offset: -3px;
    }

    .mobile-priority-nav-link.is-active::after {
        position: absolute;
        right: 14px;
        bottom: 0;
        left: 14px;
        height: 2px;
        background: #2695da;
        content: '';
    }

    .mobile-priority-nav-link:first-child.is-active::after {
        left: 0;
    }
}
