/**
 * Menu desktop: barra, header, pannelli del mega menu di Astra Pro
 * Figma "Atlantic menu" w063nJEH1q0HYYz8DPp9wF, nodi 390:1126 / 389:3 (chiuso) e 389:61, 389:138, 389:243, 389:324 (aperto)
 * (classi aggiunte in inc/navigation/desktop-menu.php; #ast-desktop-header esiste solo sopra il breakpoint mobile di Astra)
 */
:root {
    --mgs-dm-ink: #001a35;
    --mgs-dm-blue: #2b81b2;
    --mgs-dm-bar: #e3eef5;
    --mgs-dm-line: #d9e0e8;
    --mgs-dm-text: #596b80;
    --mgs-dm-outline: #5b7284;
    /* margine laterale del contenitore di Astra: 1360px centrati, almeno 20px (76px a 1512, come nel Figma);
       usato nel padding del pannello, quindi 100% = larghezza del pannello (senza barra di scorrimento) */
    --mgs-dm-gutter: max(20px, calc((100% - 1360px) / 2));
    --mgs-dm-font: 'Work Sans', sans-serif;
    /* icone Material: expand_more, expand_less, chevron_right */
    --mgs-dm-icon-more: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E");
    --mgs-dm-icon-less: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z'/%3E%3C/svg%3E");
    --mgs-dm-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z'/%3E%3C/svg%3E");
}

/* ---------- barra: altezza dell'online (58px), il contenuto della pagina parte a 180px ---------- */
#ast-desktop-header .ast-above-header {
    padding: 0;
}
#ast-desktop-header .ast-above-header-bar .site-above-header-wrap {
    min-height: 58px;
}
#ast-desktop-header .ast-builder-menu-1,
#ast-desktop-header .ast-builder-menu-2 {
    margin: 0;
}
#ast-desktop-header #ast-hf-menu-1 {
    gap: 36px;
    margin: 0;
}
#ast-desktop-header #ast-hf-menu-1 > .menu-item {
    margin: 0;
    padding: 0;
    line-height: normal;
}
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link {
    display: flex;
    align-items: center;
    gap: 6px;
    box-sizing: border-box;
    height: 58px;
    padding: 2px 0 0;
    border-bottom: 2px solid transparent;
    font-family: var(--mgs-dm-font);
    font-size: 13px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 1.04px;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--mgs-dm-ink);
}
/* sottolineatura di Astra (hover style underline) sostituita dal bordo della voce aperta;
   il ::after vuoto di Astra sarebbe un elemento flex in più (6px di gap) */
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link::before,
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link::after {
    display: none;
}
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link > .ast-icon,
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link .dropdown-menu-toggle .ast-icon,
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .ast-menu-toggle {
    display: none;
}
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link .dropdown-menu-toggle {
    display: flex;
    margin: 0;
    padding: 0;
}
#ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link .dropdown-menu-toggle::before {
    content: "";
    width: 18px;
    height: 18px;
    background-color: currentColor;
    -webkit-mask: var(--mgs-dm-icon-more) center / 18px 18px no-repeat;
    mask: var(--mgs-dm-icon-more) center / 18px 18px no-repeat;
}
/* voce aperta: il mega menu di Astra si apre solo al passaggio del mouse
   (con il focus la voce resterebbe blu dopo il clic, a pannello già chiuso) */
#ast-desktop-header #ast-hf-menu-1 > .menu-item:hover > .menu-link {
    border-bottom-color: var(--mgs-dm-blue);
    font-weight: 600;
    color: var(--mgs-dm-blue);
}
#ast-desktop-header #ast-hf-menu-1 > .menu-item:hover > .menu-link .dropdown-menu-toggle::before {
    -webkit-mask-image: var(--mgs-dm-icon-less);
    mask-image: var(--mgs-dm-icon-less);
}

/* selettore di lingua */
#ast-desktop-header .mgs-dm-languages {
    display: flex;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}
#ast-desktop-header .mgs-dm-languages li {
    margin: 0;
}
#ast-desktop-header .mgs-dm-languages a {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 34px;
    height: 26px;
    border: 1px solid var(--mgs-dm-ink);
    font-family: var(--mgs-dm-font);
    font-size: 11px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.88px;
    text-decoration: none;
    color: var(--mgs-dm-ink);
}
#ast-desktop-header .mgs-dm-languages a.is-active {
    background: var(--mgs-dm-ink);
    color: #fff;
}

/* ---------- header: misure dell'online (114px, logo 223px, nessuna linea sotto); dal Figma solo il bordo del pulsante Simple Booking ---------- */
#ast-desktop-header .ast-header-button-1 .ast-custom-button {
    border-color: var(--mgs-dm-blue);
}

/* ---------- pannelli del mega menu ---------- */
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel > .astra-full-megamenu-wrapper {
    top: 58px;
    margin: 0;
    border-bottom: 1px solid var(--mgs-dm-line);
    background: #fff;
    box-shadow: 0 12px 24px 0 rgba(0, 26, 51, 0.12);
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .astra-megamenu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    box-sizing: border-box;
    /* !important: Astra scrive via JS la larghezza del contenitore (width:1360px inline) */
    width: 100% !important;
    max-width: none;
    margin: 0;
    padding: 36px var(--mgs-dm-gutter) 40px;
    border: 0;
    background: transparent;
    box-shadow: none;
}
/* pannello a sei colonne (Soggiorno e pacchetti): alto 317px come nel Figma, bordo compreso */
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel:not(.mgs-dm-panel--photos) .astra-megamenu {
    min-height: 316px;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .astra-megamenu > .mgs-dm-col {
    flex-grow: 0;
    flex-shrink: 1;
    width: auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col > .menu-link {
    display: none;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col .ast-mm-custom-content,
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col .ast-mm-widget-item {
    margin: 0;
    padding: 0;
}

/* foto (object-fit cover come nel Figma; !important: il widget immagine scrive height:auto inline) */
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--photo {
    flex-basis: 196px;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--photo img {
    display: block;
    width: 100%;
    max-width: none !important;
    height: 180px !important;
    margin: 0;
    object-fit: cover;
}

/* descrizione */
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--intro {
    flex-basis: 200px;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--intro .mega-block-title {
    margin: 0 0 14px;
    padding: 0;
    font-family: var(--mgs-dm-font);
    font-size: 15px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--mgs-dm-blue);
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--intro .textwidget,
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--intro .textwidget p {
    margin: 0;
    font-family: var(--mgs-dm-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    text-transform: none;
    color: var(--mgs-dm-text);
}

/* link: righe da 42px come le sottovoci del menu mobile */
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--links {
    flex-basis: 224px;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--links ul.menu {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--links ul.menu > li.menu-item {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--mgs-dm-line);
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--links ul.menu > li.menu-item > a.menu-link {
    display: flex;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
    min-height: 41px;
    padding: 0 !important;
    font-family: var(--mgs-dm-font);
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: var(--mgs-dm-ink);
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--links ul.menu > li.menu-item > a.menu-link::after {
    content: "";
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-left: auto;
    background-color: var(--mgs-dm-blue);
    -webkit-mask: var(--mgs-dm-icon-chevron) center / 18px 18px no-repeat;
    mask: var(--mgs-dm-icon-chevron) center / 18px 18px no-repeat;
}
/* hover non disegnato nel Figma: testo blu come la voce aperta */
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--links ul.menu > li.menu-item > a.menu-link:hover,
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel .mgs-dm-col--links ul.menu > li.menu-item > a.menu-link:focus-visible {
    color: var(--mgs-dm-blue);
}

/* pannelli con due foto affiancate (Scopri, Esperienze, Esplora):
   foto 260x180 a sinistra, descrizione 360px + link 376px centrati nello spazio rimasto */
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel--photos .astra-megamenu {
    gap: 0;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel--photos .astra-megamenu > .mgs-dm-col--photo {
    flex-basis: 260px;
    margin-right: 24px;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel--photos .astra-megamenu > .mgs-dm-col--photo + .mgs-dm-col--photo {
    margin-right: 40px;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel--photos .astra-megamenu > .mgs-dm-col--intro {
    flex-basis: 360px;
    margin-right: 40px;
    margin-left: auto;
}
#ast-desktop-header #ast-hf-menu-1 > .mgs-dm-panel--photos .astra-megamenu > .mgs-dm-col--links {
    flex-basis: 376px;
    margin-right: auto;
}

/* sotto i 1280px (larghezze non disegnate nel Figma) la barra si stringe per stare su una riga */
@media (max-width: 1279px) {
    #ast-desktop-header #ast-hf-menu-1 {
        gap: 20px;
    }
    #ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link {
        gap: 4px;
        font-size: 12px;
        letter-spacing: 0.6px;
    }
}
@media (max-width: 1099px) {
    #ast-desktop-header #ast-hf-menu-1 {
        gap: 14px;
    }
    #ast-desktop-header #ast-hf-menu-1 > .menu-item > .menu-link {
        letter-spacing: 0.2px;
    }
}