/* ==========================================================================
   GRAND HOTEL DUCA D'ESTE
   HEADER + BOOKING MOBILE

   Gestisce:
   - blocco dello scroll orizzontale;
   - topbar con lingue dinamica;
   - header bianco;
   - logo testuale;
   - hamburger;
   - barra PRENOTA;
   - booking compatto;
   - apertura booking;
   - menu mobile;
   - sottomenu mobile.

   Desktop rimane invariato.
   ========================================================================== */


/* ==========================================================================
   DESKTOP
   ========================================================================== */

.duca-header-stack {
    display: contents;
}


/*
 * Elementi presenti esclusivamente su smartphone.
 */

.mobile-booking-toggle,
.mobile-booking-close {
    display: none;
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 640px) {


    /* ==========================================================================
       BLOCCO DELLO SCROLL ORIZZONTALE
       ========================================================================== */

    html {
        width: 100%;
        max-width: 100%;

        overflow-x: hidden !important;
        overflow-x: clip !important;
    }


    body {
        width: 100%;
        max-width: 100%;

        margin: 0 !important;

        overflow-x: hidden !important;
        overflow-x: clip !important;
    }


    body > * {
        max-width: 100%;
    }


    *,
    *::before,
    *::after {
        box-sizing: border-box;
    }



    /* ==========================================================================
       STACK HEADER
       ========================================================================== */

    .duca-header-stack {
        position: sticky;

        top: 0;

        z-index: 5000;

        display: block;

        width: 100%;
        max-width: 100%;

        margin: 0;

        background: #ffffff;

        overflow: visible;
    }



    /* ==========================================================================
       TOPBAR
       ========================================================================== */

    .duca-header-stack .topbar {
        position: relative !important;

        top: auto !important;

        z-index: 40;

        width: 100%;
        max-width: 100%;

        margin: 0 !important;

        overflow: hidden;

        opacity: 1;

        max-height: 80px;

        transition:
            max-height .22s ease,
            opacity .16s ease;

        will-change:
            max-height,
            opacity;
    }


    .duca-header-stack
    .topbar
    .wrap {

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;

        padding-left: 12px !important;
        padding-right: 12px !important;

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            auto;

        align-items: center;

        gap: 8px;
    }


    .duca-header-stack
    .topbar
    .contatti {

        min-width: 0;

        white-space: normal !important;

        overflow-wrap: anywhere;

        font-size: .62rem !important;
        line-height: 1.35 !important;
    }


    .duca-header-stack
    .topbar
    .lingue {

        min-width: 0;

        display: flex !important;

        align-items: center;

        gap: 7px;

        white-space: nowrap;

        font-size: .62rem !important;
    }



    /*
     * Scroll verso il basso:
     * scompare soltanto la topbar.
     *
     * Il JS blocca temporaneamente il rilevamento
     * della direzione durante questa animazione,
     * eliminando il tremolio.
     */

    body.duca-scroll-down
    .duca-header-stack
    .topbar {

        max-height: 0 !important;

        opacity: 0;

        padding-top: 0 !important;
        padding-bottom: 0 !important;

        pointer-events: none;
    }



    /* ==========================================================================
       NAV BIANCA
       ========================================================================== */

    .duca-header-stack
    nav.duca-nav {

        position: relative !important;

        top: auto !important;
        left: auto !important;
        right: auto !important;

        z-index: 30;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;

        background: #ffffff !important;

        overflow: visible !important;
    }


    .duca-header-stack
    nav.duca-nav > .wrap {

        position: relative;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: 72px !important;

        margin: 0 !important;

        padding:
            0
            12px
            0
            16px !important;

        display: flex !important;

        align-items: center !important;

        justify-content: space-between !important;

        gap: 8px;

        overflow: visible !important;
    }



    /* ==========================================================================
       LOGO TESTUALE DUCA D'ESTE
       ========================================================================== */

    .duca-header-stack
    nav.duca-nav
    .logo {

        flex:
            1
            1
            auto;

        min-width: 0 !important;

        width: auto !important;

        max-width:
            calc(100% - 52px) !important;

        margin: 0 !important;

        padding: 4px 0 0 !important;

        background: none !important;
        background-image: none !important;

        text-indent: 0 !important;

        color:
            var(--scuro, #1b2a3a) !important;

        overflow: hidden;

        white-space: nowrap;

        text-overflow: ellipsis;

        font-size:
            clamp(
                1.05rem,
                5vw,
                1.35rem
            ) !important;

        line-height: 1.15 !important;
    }


    .duca-header-stack
    nav.duca-nav
    .logo::before,

    .duca-header-stack
    nav.duca-nav
    .logo::after {

        content: none !important;

        display: none !important;
    }


    .duca-header-stack
    nav.duca-nav
    .logo small {

        display: block !important;

        margin-top: 5px !important;

        color:
            var(--oro, #c39a4e) !important;

        font-size: .5rem !important;

        line-height: 1 !important;

        letter-spacing: .28em !important;

        text-transform: uppercase;

        white-space: nowrap;
    }



    /* ==========================================================================
       HAMBURGER
       ========================================================================== */

    .duca-header-stack
    .hamburger {

        position: static !important;

        inset: auto !important;

        flex:
            0
            0
            40px !important;

        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;

        height: 40px !important;

        margin: 0 !important;

        padding: 0 !important;

        transform: none !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        border: 0 !important;

        background: transparent !important;

        color:
            var(--scuro, #1b2a3a) !important;

        cursor: pointer;
    }


    .duca-header-stack
    .hamburger span {

        display: block;

        font-family:
            Arial,
            sans-serif;


        font-size: 25px;

        line-height: 1;
    }



    /* ==========================================================================
       PRENOTA DESKTOP
       ========================================================================== */

    .duca-header-stack
    .nav-cta {

        display: none !important;
    }



    /* ==========================================================================
       PRENOTA MOBILE
       ========================================================================== */

    .mobile-prenota-bar {

        position: relative;

        z-index: 20;

        display: flex;

        align-items: center;

        justify-content: center;

        width: 100%;

        min-height: 41px;

        margin: 0;

        padding: .65rem 1rem;

        background:
            var(--oro, #c39a4e);

        color:
            var(--scuro, #1b2a3a);

        font-size: .75rem;

        font-weight: 500;

        line-height: 1;

        letter-spacing: .18em;

        text-transform: uppercase;

        text-align: center;

        text-decoration: underline;
        text-underline-offset: 2px;
    }



    /* ==========================================================================
       BOOKING BAR
       ========================================================================== */

    #booking-bar.duca-booking-bar {

        position: relative !important;

        top: auto !important;

        left: auto !important;
        right: auto !important;

        z-index: 10;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;

        padding:
            7px
            13px
            8px !important;

        background:
            var(--scuro, #1b2a3a) !important;

        color: #ffffff;

        overflow-x: hidden;

        box-shadow:
            0
            4px
            14px
            rgba(0, 0, 0, .20);
    }



    /* ==========================================================================
       MIGLIOR TARIFFA
       ========================================================================== */

    #booking-bar
    .rate {

        margin:
            0
            0
            5px !important;

        padding: 0 !important;

        color:
            rgba(255, 255, 255, .75) !important;

        font-size: .66rem !important;

        line-height: 1.3 !important;

        text-align: center !important;

        white-space: normal;
    }



    /* ==========================================================================
       VERIFICA DISPONIBILITÀ
       ========================================================================== */

    #booking-bar
    .mobile-booking-toggle {

        -webkit-appearance: none !important;
        appearance: none !important;

        position: relative !important;

        inset: auto !important;

        display: flex;

        align-items: center;

        justify-content: center;

        width: 100% !important;

        max-width: 100% !important;

        min-height: 41px;

        margin: 0 !important;

        padding:
            .65rem
            1rem !important;

        border: 0 !important;

        border-radius:
            var(--radius, 0) !important;

        background:
            var(--oro, #c39a4e) !important;

        background-image: none !important;

        color: #ffffff !important;

        font-family: inherit !important;

        font-size: .72rem !important;

        font-weight: 700 !important;

        line-height: 1.2;

        letter-spacing:
            .04em !important;

        text-transform:
            uppercase !important;

        text-align: center;

        box-shadow: none !important;

        cursor: pointer;
    }


    /*
     * Elimina eventuali +, frecce o simboli
     * provenienti da vecchi fogli CSS.
     */

    #booking-bar
    .mobile-booking-toggle::before,

    #booking-bar
    .mobile-booking-toggle::after {

        content: none !important;

        display: none !important;
    }



    /* ==========================================================================
       BOOKING NASCOSTO
       ========================================================================== */

    #booking-bar
    #sb-container {

        display: none;

        width: 100%;

        max-width: 100%;

        margin-top: 8px;

        overflow-x: hidden;
    }


    #booking-bar
    #sb-container * {

        max-width: 100%;

        box-sizing: border-box;
    }



    /* ==========================================================================
       BOOKING APERTO
       ========================================================================== */

    #booking-bar.mobile-open
    #sb-container {

        display: block !important;
    }


    #booking-bar.mobile-open
    .mobile-booking-toggle {

        display: none !important;
    }


    #booking-bar.mobile-open {

        padding-top:
            49px !important;

        max-height:
            calc(100dvh - 113px);

        overflow-y: auto;

        overscroll-behavior:
            contain;
    }



    /* ==========================================================================
       X BOOKING
       ========================================================================== */

    #booking-bar
    .mobile-booking-close {

        display: none;

        position: absolute !important;

        top: 8px !important;

        right: 12px !important;

        left: auto !important;

        z-index: 50;

        align-items: center;

        justify-content: center;

        width: 34px !important;

        min-width: 34px !important;
        max-width: 34px !important;

        height: 34px !important;

        margin: 0 !important;

        padding: 0 !important;

        border:
            1px solid
            rgba(255, 255, 255, .6) !important;

        border-radius:
            50% !important;

        background:
            transparent !important;

        color:
            #ffffff !important;

        font-family:
            Arial,
            sans-serif !important;

        font-size:
            23px !important;

        line-height: 1 !important;

        transform:
            none !important;

        cursor: pointer;
    }


    #booking-bar.mobile-open
    .mobile-booking-close {

        display: flex !important;
    }



    /* ==========================================================================
       FORM BOOKING
       ========================================================================== */

    #booking-bar
    .bb-form {

        width: 100% !important;

        max-width: 100% !important;

        margin: 0 !important;

        padding:
            10px
            0
            4px !important;

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr) !important;

        gap: 9px !important;

        align-items: end;
    }


    #booking-bar
    .bb-form label {

        min-width: 0 !important;

        width: 100% !important;

        margin: 0 !important;

        display: flex;

        flex-direction: column;

        gap: 4px;
    }


    /*
     * Ospiti full width.
     */

    #booking-bar
    .bb-form
    label:nth-of-type(3) {

        grid-column:
            1 / -1;
    }


    #booking-bar
    .bb-form
    label span {

        color:
            var(--oro, #c39a4e) !important;

        font-size:
            .63rem !important;

        letter-spacing:
            .08em !important;
    }



    /* ==========================================================================
       INPUT BOOKING
       ========================================================================== */

    #booking-bar
    .bb-form
    input,

    #booking-bar
    .bb-form
    select {

        width: 100% !important;

        min-width: 0 !important;

        max-width: 100% !important;

        height: 42px;

        margin: 0 !important;

        padding:
            .5rem
            .55rem !important;

        border: 0 !important;

        border-bottom:
            1px solid
            #514c3e !important;

        border-radius:
            var(--radius, 4px) !important;

        background:
            var(--scuro-2, #131f2b) !important;

        color:
            #ffffff !important;

        font-size:
            .78rem !important;
    }



    /* ==========================================================================
       SUBMIT BOOKING
       ========================================================================== */

    #booking-bar
    .bb-form
    button[type="submit"] {

        grid-column:
            1 / -1;

        width: 100% !important;

        max-width: 100% !important;

        min-height: 44px;

        margin-top:
            3px !important;

        padding:
            .7rem
            1rem !important;

        border: 0 !important;

        background:
            var(--oro, #c39a4e) !important;

        color:
            #ffffff !important;

        font-weight: 700;

        cursor: pointer;
    }



    /* ==========================================================================
       MENU MOBILE
       ========================================================================== */

    #menu-nav {

        display: none !important;
    }


    #menu-nav.aperto {

        position: absolute !important;

        top: 72px !important;

        left: 0 !important;
        right: 0 !important;

        z-index: 100;

        display: block !important;

        width: 100% !important;

        max-width: 100% !important;

        margin: 0 !important;

        padding:
            8px
            16px
            18px !important;

        background:
            #ffffff !important;

        border-top:
            1px solid
            #ece7dc;

        box-shadow:
            0
            12px
            24px
            rgba(0, 0, 0, .14) !important;

        max-height:
            calc(100dvh - 72px);

        overflow-y: auto;

        overflow-x: hidden;
    }



    /* ==========================================================================
       VOCI MENU
       ========================================================================== */

    #menu-nav.aperto > li {

        display: block !important;

        width: 100%;

        margin: 0 !important;

        padding: 0 !important;

        border-bottom:
            1px solid
            #ece7dc;
    }


    #menu-nav.aperto > li:last-child {

        border-bottom: 0;
    }


    #menu-nav.aperto > li > a {

        display: flex !important;

        align-items: center !important;

        justify-content:
            space-between !important;

        width: 100% !important;

        padding:
            14px
            0 !important;

        color:
            var(--scuro, #1b2a3a) !important;

        font-size:
            .92rem !important;

        font-weight:
            500 !important;

        line-height:
            1.3 !important;

        text-decoration:
            none !important;
    }


    #menu-nav.aperto > li > a:hover,
    #menu-nav.aperto > li > a:focus {

        color:
            var(--scuro, #1b2a3a) !important;

        text-decoration:
            none !important;
    }



    /* ==========================================================================
       CARET MENU
       ========================================================================== */

    #menu-nav.aperto
    .caret {

        flex:
            0
            0
            auto;

        margin-left:
            10px;

        color:
            var(--scuro, #1b2a3a) !important;

        font-size:
            .7rem !important;

        line-height:
            1 !important;

        transition:
            transform
            .2s ease;
    }


    #menu-nav
    .has-sub.open
    > a
    .caret {

        transform:
            rotate(180deg);
    }



    /* ==========================================================================
       SOTTOMENU
       ========================================================================== */

    #menu-nav.aperto
    .sub {

        position: static !important;

        display: none !important;

        width: 100% !important;

        min-width: 0 !important;

        max-width: 100% !important;

        margin:
            0
            0
            10px !important;

        padding:
            6px
            0
            8px
            14px !important;

        background:
            #f8f6f1 !important;

        border-radius:
            4px !important;

        box-shadow:
            none !important;
    }


    #menu-nav
    .has-sub.open
    > .sub {

        display:
            block !important;
    }


    #menu-nav.aperto
    .sub li {

        margin: 0 !important;

        padding: 0 !important;

        list-style:
            none !important;
    }


    #menu-nav.aperto
    .sub a {

        display:
            block !important;

        padding:
            8px
            0 !important;

        color:
            #394857 !important;

        font-size:
            .84rem !important;

        line-height:
            1.35 !important;

        text-decoration:
            none !important;
    }


    #menu-nav.aperto
    .sub a:hover,

    #menu-nav.aperto
    .sub a:focus {

        color:
            #394857 !important;

        text-decoration:
            none !important;
    }



    /* ==========================================================================
       MENU APERTO
       ========================================================================== */

    body.duca-menu-open {

        overflow-y: hidden;
    }


    /*
     * Con menu aperto la topbar rimane visibile.
     */

    body.duca-menu-open
    .duca-header-stack
    .topbar {

        max-height:
            80px !important;

        opacity:
            1 !important;

        pointer-events:
            auto !important;
    }


    /*
     * Quando il menu è aperto nascondiamo
     * PRENOTA e booking per lasciare spazio
     * esclusivamente alla navigazione.
     */

    body.duca-menu-open
    .mobile-prenota-bar,

    body.duca-menu-open
    #booking-bar {

        display:
            none !important;
    }

}



/* ==========================================================================
   GRAND HOTEL DUCA D'ESTE
   RIPRISTINO DESKTOP
   ========================================================================== */

@media (min-width: 641px) {

    /* ==========================================================================
       ELEMENTI SOLO MOBILE
       ========================================================================== */

    .mobile-prenota-bar,
    .mobile-booking-toggle,
    .mobile-booking-close {
        display: none !important;
    }


    /* ==========================================================================
       STACK
       ========================================================================== */

    .duca-header-stack {
        display: contents !important;
    }


    /* ==========================================================================
       TOPBAR
       ========================================================================== */

    .topbar {
        position: relative !important;
        top: auto !important;

        width: 100%;
        max-width: none !important;

        transform: none !important;
        opacity: 1 !important;

        max-height: none !important;

        pointer-events: auto !important;
    }


    .topbar > .wrap {
        width: 100% !important;
        max-width: var(--maxw, 1240px) !important;

        margin: 0 auto !important;

        padding-left: 24px !important;
        padding-right: 24px !important;
    }


    /* ==========================================================================
       NAV DESKTOP
       ========================================================================== */

    nav.duca-nav {
        position: sticky !important;

        top: 0 !important;

        z-index: 1000;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;

        background: #ffffff !important;

        border-bottom:
            1px solid
            rgba(0, 0, 0, .08);
    }


    nav.duca-nav > .wrap {
        position: relative;

        display: flex !important;

        align-items: center !important;
        justify-content: space-between !important;

        width: 100% !important;
        max-width: var(--maxw, 1240px) !important;

        min-height: 82px;

        margin: 0 auto !important;

        padding-left: 24px !important;
        padding-right: 24px !important;

        gap: 24px;

        overflow: visible !important;
    }


    /* ==========================================================================
       LOGO
       ========================================================================== */

    nav.duca-nav .logo {
        flex: 0 0 auto;

        display: block !important;

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        background: none !important;
        background-image: none !important;

        text-indent: 0 !important;

        color:
            var(--scuro, #1b2a3a) !important;

        text-decoration: none !important;

        white-space: nowrap;

        overflow: visible !important;

        font-size: 1.35rem !important;
        line-height: 1.1 !important;
    }


    nav.duca-nav .logo::before,
    nav.duca-nav .logo::after {
        content: none !important;
        display: none !important;
    }


    nav.duca-nav .logo small {
        display: block !important;

        margin-top: 5px !important;

        color:
            var(--oro, #c39a4e) !important;

        font-size: .52rem !important;

        line-height: 1 !important;

        letter-spacing: .30em !important;

        text-transform: uppercase;

        white-space: nowrap;
    }


    /* ==========================================================================
       MENU PRINCIPALE
       ========================================================================== */

    #menu-nav {
        position: static !important;

        flex: 1 1 auto;

        display: flex !important;

        align-items: center !important;
        justify-content: flex-end !important;

        width: auto !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        gap: 22px;

        overflow: visible !important;

        list-style: none !important;

        background: transparent !important;

        box-shadow: none !important;
    }


    #menu-nav > li {
        position: relative;

        display: block !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;

        list-style: none !important;
    }


    #menu-nav > li > a {
        display: flex !important;

        align-items: center !important;

        gap: 5px;

        padding:
            30px
            0 !important;

        color:
            var(--scuro, #1b2a3a) !important;

        font-size: .76rem !important;

        font-weight: 500 !important;

        line-height: 1 !important;

        letter-spacing: .04em !important;

        white-space: nowrap;

        text-decoration: none !important;
    }


    #menu-nav > li > a:hover,
    #menu-nav > li > a:focus {
        color:
            var(--oro, #c39a4e) !important;

        text-decoration: none !important;
    }


    #menu-nav .caret {
        display: inline-block !important;

        margin-left: 2px;

        color:
            var(--oro, #c39a4e) !important;

        font-size: .65rem !important;

        line-height: 1 !important;

        transform: none !important;
    }


    /* ==========================================================================
       SOTTOMENU DESKTOP
       ========================================================================== */

    #menu-nav .sub {
        position: absolute !important;

        top: calc(100% - 10px) !important;
        left: -18px !important;

        z-index: 1500;

        display: none !important;

        width: auto !important;

        min-width: 210px !important;
        max-width: 290px !important;

        margin: 0 !important;

        padding:
            10px
            0 !important;

        background:
            #ffffff !important;

        border:
            1px solid
            rgba(0, 0, 0, .08);

        border-radius: 0 !important;

        box-shadow:
            0
            12px
            28px
            rgba(0, 0, 0, .13) !important;

        list-style: none !important;
    }


    #menu-nav .has-sub:hover > .sub,
    #menu-nav .has-sub:focus-within > .sub {
        display: block !important;
    }


    #menu-nav .sub li {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        list-style: none !important;
    }


    #menu-nav .sub a {
        display: block !important;

        width: 100% !important;

        padding:
            10px
            18px !important;

        color:
            var(--scuro, #1b2a3a) !important;

        font-size: .76rem !important;

        font-weight: 400 !important;

        line-height: 1.35 !important;

        white-space: normal;

        text-decoration: none !important;
    }


    #menu-nav .sub a:hover,
    #menu-nav .sub a:focus {
        background:
            #f7f4ed !important;

        color:
            var(--oro, #c39a4e) !important;

        text-decoration: none !important;
    }


    /* ==========================================================================
       HAMBURGER
       ========================================================================== */

    nav.duca-nav .hamburger {
        display: none !important;
    }


    /* ==========================================================================
       PRENOTA HEADER
       ========================================================================== */

    nav.duca-nav .nav-cta {
        flex: 0 0 auto;

        display: inline-flex !important;

        align-items: center !important;
        justify-content: center !important;

        min-height: 50px;

        margin: 0 !important;

        padding:
            0
            28px !important;

        background:
            var(--oro, #c39a4e) !important;

        color:
            var(--scuro, #1b2a3a) !important;

        font-size: .72rem !important;

        font-weight: 600 !important;

        line-height: 1 !important;

        letter-spacing: .16em !important;

        text-transform: uppercase;

        text-decoration: none !important;

        border-radius: 0 !important;
    }


    /* ==========================================================================
       BOOKING BAR DESKTOP
       ========================================================================== */

    #booking-bar.duca-booking-bar {
        position: sticky !important;

        top: 82px !important;

        z-index: 900;

        display: flex !important;
        flex-direction: column !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;

        padding: 0 !important;

        background:
            var(--scuro, #1b2a3a) !important;

        color:
            #ffffff !important;

        box-shadow:
            none !important;

        overflow:
            visible !important;
    }


    /* ==========================================================================
       SIMPLEBOOKING CONTAINER — FULL WIDTH
       ========================================================================== */

    #booking-bar #sb-container {
        order: 1;

        display: block !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;

        /*
         * Quasi full width:
         * soltanto 8px ai lati.
         */
        padding:
            30px
            8px
            0 !important;

        overflow:
            visible !important;
    }


    /*
     * SimpleBooking genera altri contenitori.
     * Nessuno deve ereditare il max-width del sito.
     */

    #booking-bar #sb-container > * {
        width: 100% !important;

        max-width: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    #booking-bar #sb-container > div,
    #booking-bar #sb-container > section,
    #booking-bar #sb-container > form {
        width: 100% !important;

        max-width: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    #booking-bar #sb-container form {
        width: 100% !important;

        max-width: none !important;

        margin: 0 !important;
    }


    /*
     * Rimuove eventuali contenitori centrati
     * inseriti dal widget.
     */

    #booking-bar #sb-container div {
        max-width: none !important;
    }


    /* ==========================================================================
       FALLBACK FORM
       ========================================================================== */

    #booking-bar .bb-form {
        display: grid !important;

        /*
         * Praticamente tutta la viewport:
         *
         * ARRIVO    25%
         * PARTENZA  25%
         * OSPITI    24%
         * CTA       26%
         */

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            minmax(0, .96fr)
            minmax(0, 1fr) !important;

        align-items:
            end !important;

        gap:
            10px !important;

        width:
            100% !important;

        max-width:
            none !important;

        margin:
            0 !important;

        padding:
            0 !important;
    }


    /* ==========================================================================
       LABEL FALLBACK
       ========================================================================== */

    #booking-bar .bb-form label {
        display:
            flex !important;

        flex-direction:
            column !important;

        width:
            100% !important;

        min-width:
            0 !important;

        max-width:
            none !important;

        margin:
            0 !important;

        gap:
            6px !important;

        color:
            var(--oro, #c39a4e) !important;

        font-size:
            .82rem !important;

        font-weight:
            400 !important;

        line-height:
            1.15 !important;

        letter-spacing:
            0 !important;

        text-transform:
            none !important;
    }


    #booking-bar
    .bb-form
    label:nth-of-type(3) {
        grid-column:
            auto !important;
    }


    #booking-bar
    .bb-form
    label > span {
        display: block !important;

        color:
            var(--oro, #c39a4e) !important;

        font-size:
            .82rem !important;

        font-weight:
            400 !important;

        line-height:
            1 !important;

        letter-spacing:
            0 !important;

        text-transform:
            none !important;
    }


    /* ==========================================================================
       INPUT FALLBACK
       ========================================================================== */

    #booking-bar .bb-form input,
    #booking-bar .bb-form select {
        display:
            block !important;

        width:
            100% !important;

        min-width:
            0 !important;

        max-width:
            none !important;

        height:
            62px !important;

        margin:
            0 !important;

        padding:
            0
            18px !important;

        border:
            0 !important;

        border-bottom:
            1px solid
            #514c3e !important;

        border-radius:
            2px !important;

        background:
            var(--scuro-2, #131f2b) !important;

        color:
            #ffffff !important;

        font-family:
            var(--testo-font, inherit) !important;

        font-size:
            1.05rem !important;

        font-weight:
            500 !important;

        box-shadow:
            none !important;
    }


    /* ==========================================================================
       SUBMIT FALLBACK
       ========================================================================== */

    #booking-bar
    .bb-form
    button[type="submit"] {
        grid-column:
            auto !important;

        display:
            flex !important;

        align-items:
            center !important;

        justify-content:
            center !important;

        width:
            100% !important;

        min-width:
            0 !important;

        max-width:
            none !important;

        height:
            62px !important;

        min-height:
            62px !important;

        margin:
            0 !important;

        padding:
            0
            20px !important;

        border:
            0 !important;

        border-radius:
            2px !important;

        background:
            var(--oro, #c39a4e) !important;

        color:
            #ffffff !important;

        font-family:
            var(--testo-font, inherit) !important;

        font-size:
            1rem !important;

        font-weight:
            500 !important;

        line-height:
            1 !important;

        letter-spacing:
            0 !important;

        text-transform:
            none !important;

        text-align:
            center !important;

        cursor:
            pointer !important;
    }


    #booking-bar
    .bb-form
    button[type="submit"]:hover {
        background:
            var(--oro, #c39a4e) !important;

        color:
            #ffffff !important;
    }


    /* ==========================================================================
       WIDGET SIMPLEBOOKING GENERATO
       ========================================================================== */

    /*
     * Quando SimpleBooking sostituisce il fallback,
     * gli impediamo di tornare a una larghezza centrata.
     */

    #booking-bar #sb-container input,
    #booking-bar #sb-container select,
    #booking-bar #sb-container button {
        max-width:
            none !important;
    }


    #booking-bar #sb-container table {
        width:
            100% !important;

        max-width:
            none !important;
    }


    #booking-bar #sb-container fieldset {
        width:
            100% !important;

        max-width:
            none !important;
    }


    /* ==========================================================================
       MIGLIOR TARIFFA
       ========================================================================== */

    #booking-bar .rate {
        order: 2;

        display:
            block !important;

        width:
            100% !important;

        max-width:
            none !important;

        margin:
            0 !important;

        padding:
            14px
            24px
            18px !important;

        color:
            #a59d88 !important;

        font-size:
            .72rem !important;

        line-height:
            1.4 !important;

        text-align:
            center !important;
    }


    /* ==========================================================================
       CONTROLLI MOBILE NASCOSTI
       ========================================================================== */

    #booking-bar
    .mobile-booking-toggle,

    #booking-bar
    .mobile-booking-close {
        display:
            none !important;
    }

}


.CookiebotWidget{
	display: none!important;
}


@media (min-width: 641px) {
  .duca-booking-bar {
    top: 90px;
    margin-top: 8px;
  }
}

@media (max-width: 768px) {
  .mobile-prenota-bar {
    display: none !important;
  }
}


/* ==========================================================================
   FIX MENU MOBILE: mantiene la posizione di scroll quando si apre hamburger
   ========================================================================== */
@media (max-width: 640px) {

    /* Non cambiare il contenitore di scroll quando il menu viene aperto. */
    body.duca-menu-open {
        overflow-y: auto !important;
    }

    /*
     * Se la topbar era già nascosta perché l'utente ha scrollato verso il basso,
     * non la facciamo riapparire all'apertura del menu.
     * In questo modo l'header non cambia altezza.
     */
    body.duca-menu-open.duca-scroll-down
    .duca-header-stack
    .topbar {
        max-height: 0 !important;
        opacity: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        pointer-events: none !important;
    }

    /*
     * Il menu resta agganciato all'header sticky nel punto corrente
     * e scorre internamente se supera l'altezza dello schermo.
     */
    #menu-nav.aperto {
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
}
