body.SiteBackground{background-image:url('https://resx.octorate.com/content/437522/1778755569455.jpg')}@media (min-width: 1220px) {.SearchLabel .fa{background:#a59156;color:#fff}}.BoxHover:hover{box-shadow:1px 1px 10px #a59156}.SearchBar .GreenButton .ui-button-text{background-color:#a59156}.SiteTopBar{background-color:rgba(165,145,86,0.8)}:root{--color:#a59156!important;--color-rotation:45.90866575181945deg!important;}.button, .button span.ui-button-text, .customButton span.ui-button-text{background-color:#a59156!important;}/* ==========================================================================
   SECTION 1: PAGINA BENVENUTO & STRUTTURA GENERALE
   ========================================================================== */

/* Lingua e localizzazione */
#j_idt358\:icon .Lang {
    transform: scale(1.5) translateX(-8px);
    transform-origin: left center;
}

/* Footer del sito */
footer.flex-auto {
    visibility: hidden !important;
    /* eventualmente forza un'altezza specifica */
    height: 60px !important;
}

/* Sezione Cover: Immagini e sfondi */
section.cover .picture img {
    max-width: 250px !important;  /* cambia il numero a piacere */
}

section.cover .empty, section.cover .picture {
    background-color: transparent !important;
    box-shadow: none !important;
}

section.cover div.information {
    background-color: transparent !important;
    padding-top: 25px !important;
    box-shadow: none !important;
}

/* Contenuto di benvenuto */
section.welcome div.content {
     text-align: center;
}

section.welcome div.content h1, section.welcome div.content h3 {
    display: none;
}

/* Scorciatoie e Box principali */
section.shortcuts a.box, section.welcome div.content {
    box-shadow: none !important;
    border: 0.5px solid #a59156 !important;
	background-color: rgba(255, 255, 255, 0.7) !important;
}

/* Elementi di intestazione della pagina benvenuto */
header span.count.small {
    box-shadow: none !important;
    border: 0.5px solid #a59156 !important;
    background-color: rgba(255, 255, 255, 0.7) !important;
}

header .datetheme2 label {
    color: #000000 !important;
}

header .datetheme2 p {
    border-bottom: 5px solid #a59156 !important;
}


/* ==========================================================================
   SECTION 2: LOGO E INTESTAZIONE (DESKTOP DI BASE)
   ========================================================================== */

.headerLogo {
    max-height: 300px !important;
    width: 280px !important;
    margin-top: 30px !important;
}

.HotelHeader2 div.information[data-id="6"] {
    height: auto !important;        /* Rimuove l'altezza fissa da 30px */
    min-height: 0 !important;       /* Rimuove il vincolo di altezza minima */
    padding-bottom: 2px !important; /* Questo valore decide la distanza esatta tra testo e linea */
    margin-top: 15px !important;
	margin-bottom: 25px !important;
    border-bottom: 1px solid #a59156 !important;
}

.customHeaderLeft {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

/* Logo centrato */
.customHeaderLeft a:first-child {
    margin: 0 auto !important;
}

/* Nascondi l'icona "i" */
.customHeaderLeft .information img,
.customHeaderLeft .information svg,
.information .headerIconTheme2 > img,
.information .headerIconTheme2 > svg {
    display: none !important;
}

/* Barra di intestazione e pannelli fissi */
.SiteHeader .HotelHeader {
    box-shadow: none !important;
    border-radius: none !important;
    border-bottom-left-radius: none !important;
    border-bottom-right-radius: none !important;
    border-bottom: none !important;
}

.stickyPanel {
    height: 60px !important;
}

header div.contacts {
    display: none !important;
}


/* ==========================================================================
   SECTION 3: BOTTONI, COLORI BEIGE ED ELEMENTI CAMERE/TARIFFE
   ========================================================================== */

/* Colori dei pulsanti principali */
#toTop {
    background: #a59156 !important; 
}

section.room div.details .offers {
    background-color: #a59156 !important;
}

.customButtonGreen span.ui-button-text {
    background-color: #a59156 !important;
}

.OrangeButton .ui-button-text {
    background-color: #a59156 !important;
}

/* Dettagli e info camera */
.shortDesc {
  margin-top: 15px !important;
  padding-top: 15px !important;
  border-top: 1px solid #a59156 !important;
}

section.room div.details .roominfo {
  margin-top: 15px !important;
  padding-top: 15px !important;
  border-top: 1px solid #a59156 !important;
}

/* Prezzi e valute */
section.room div.offert .box .price {
  color: #a59156 !important;
}

section.room div.options .row .action .price {
    color: #a59156 !important;
}

section.room div.offert .box .price sup, section.room div.options .row .action .price sup {
    color: #a59156 !important;
}

/* Allineamenti e bottoni di gestione */
.wid100px .justifyContentCenter {
  justify-content: flex-start !important;
}

section.room div.offert .button.delete, section.room div.offert .button.edit {
        display: none !important;
}

/* Layout griglia per disponibilità */
.DispFlex.FlexWrap {
  display: grid !important;
  grid-template-columns: repeat(2, auto) !important;
  gap: 2px 5px !important;
  justify-content: start !important;
}

/* Pannello Sticky Variazione Prezzo */
.stickyPanel.PriceChange > div:first-child {
  display: none !important;
}

.stickyPanel.PriceChange {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 20px !important;
}

/* Bottoni della sezione ospiti */
.justify-content-end button.ui-button-icon-only .ui-button-text {
    background-color: #D3D3D3 !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}


/* ==========================================================================
   SECTION 4: TIPOGRAFIA E CARATTERI (FONT FAMILY)
   ========================================================================== */

.text1SubHeader, .textBoldSubHeader {
    font-family: 'Quicksand','Roboto', sans-serif !important;
    font-size: medium !important;
}

section.relative div.content h1 {
  font-family: 'Quicksand','Roboto', sans-serif !important;
  font-size: 18px !important;
}

section.room div.details h1 {
  font-family: 'Quicksand','Roboto', sans-serif !important;
  color: #a59156;
  font-size: clamp(1.5rem, 5vw, 3rem) !important
} 

.Blue {
   font-family: 'Quicksand','Roboto', sans-serif !important;
}

section.room div.label p {
   font-family: 'Quicksand','Roboto', sans-serif !important;
}

.button, .button span.ui-button-text, .customButton span.ui-button-text {
    font-family: 'Quicksand','Roboto', sans-serif !important;
}
 
header div.contacts a em, section.cover div.information a em {
     font-family: 'Quicksand','Roboto', sans-serif !important;
}

header .information {
     font-family: 'Quicksand','Roboto', sans-serif !important;
}

section.room div.details p {
 font-family: 'Quicksand','Roboto', sans-serif !important;
}

section.relative a p {
  font-family: 'Quicksand','Roboto', sans-serif !important;
 }

h1, h2, h3, h4, h5, h6 {
   font-family: 'Quicksand','Roboto', sans-serif !important;
 }

section.room div.details .offers em, section.room div.details .offers strong {
    font-family: 'Quicksand','Roboto', sans-serif !important;
 }

.customButtonGreen span.ui-button-text {
  font-family: 'Quicksand','Roboto', sans-serif !important;  
  background-color: #a59156;
}

.Padding20 {
    font-family: 'Quicksand','Roboto', sans-serif !important;
}

header .datetheme2 label {
   font-family: 'Quicksand','Roboto', sans-serif !important;
}

header .datetheme2 em {
font-family: 'Quicksand','Roboto', sans-serif !important;
}

/* Caratteri Finestre di dialogo / Coupon */
.swal2-styled.swal2-confirm {
    font-family: 'Quicksand', 'Roboto', sans-serif !important;
}

.swal2-styled.swal2-cancel {
    font-family: 'Quicksand', 'Roboto', sans-serif !important;
}


/* ==========================================================================
   SECTION 5: ICONE SERVIZI (OCTORATE AMENITIES)
   ========================================================================== */

/* 1. Nascondi gli object originali di Octorate */
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter object {
    display: none !important;
}

/* 2. Genera un'icona "sicura" tramite pseudoelemento */
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter::before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    transform: translateY(4px);
    background-color: #a59156 !important; 
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
}

/* 3. Mappe degli SVG per posizione (nth-child) */
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(1)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/AC.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/AC.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(2)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/HAIR_DRYER.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/HAIR_DRYER.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(3)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/BED_LINENS.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/BED_LINENS.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(4)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/FREE_PARKING.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/FREE_PARKING.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(5)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/PATIO_OR_BELCONY.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/PATIO_OR_BELCONY.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(6)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/TOWEL.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/TOWEL.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(7)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/SHAMPOO.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/SHAMPOO.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(8)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/HOT_WATER.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/HOT_WATER.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(9)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/WIRELESS_INTERNET.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/WIRELESS_INTERNET.svg");
}
.DispFlex.FlexWrap span.DispFlex.AlignItemsCenter:nth-child(10)::before {
    -webkit-mask-image: url("https://resx.octorate.com/content/amenities/HANGERS.svg");
    mask-image: url("https://resx.octorate.com/content/amenities/HANGERS.svg");
}


/* ==========================================================================
   SECTION 6: GESTIONE IMMAGINI DI STRUTTURA ED ERRORI (IPHONE FIX GLOBAL)
   ========================================================================== */

/* 1. Pulizia immagini originali */
span.filterRed img,
span.filterGreen img,
span.filterRed img.floatNone,
span.filterGreen img.floatNone {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* 2. Fix anti-colore per iPhone */
span.filterRed,
span.filterGreen {
    background: transparent !important;
    border: none !important;
    filter: none !important; 
    -webkit-filter: none !important;
}

/* Iniettiamo l'icona grigia globale in Base64 agganciata allo span */
span.filterRed::before,
span.filterGreen::before {
    content: "" !important;
    display: inline-block !important;
    width: 20px !important;
    height: 20px !important;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBmaWxsPSIjMDAwMDAwIj48cGF0aCBkPSJNMjU2IDUxMkEyNTYgMjU2IDAgMSAwIDI1NiAwYTI1NiAyNTYgMCAxIDAgMCA1MTJ6TTIxNiAzMzZoMjRWMjQwaC0yNGMtMTMuMyAwLTI0LTEwLjctMjQtMjRzMTAuNy0yNCAyNC0yNGg0MGMxMy4zIDAgMjQgMTAuNyAyNCAyNHYxMjBoMjRjMTMuMyAwIDI0IDEwLjcgMjQgMjRzLTEwLjcgMjQtMjQgMjRIMjE2Yy0xMy4zIDAtMjQtMTAuNy0yNC0yNHMxMC43LTI0IDI0LTI0em00MC0yMDhhMzIgMzIgMCAxIDEgMCA2NCAzMiAzMiAwIDEgMSAwLTY0eiIvPjwvc3ZnPg==") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    opacity: 0.4 !important; /* Grigio chiaro */
    vertical-align: middle !important;
}

button#confirmButton2 {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
}

/* Ripristina le dimensioni corrette dell'icona CORNETTO */
section.room div.details .view .box svg,
div.detailDiv svg {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;  /* Impedisce al flexbox di schiacciarlo */
    min-height: 32px !important; /* Impedisce al flexbox di schiacciarlo */
    display: inline-block !important;
}

/* ==========================================================================
   SECTION 7: MEDIA QUERIES (RESPONSIVE DESIGN)
   ========================================================================== */

/* --- SCHERMI GRANDI / DESKTOP (min-width: 900px) --- */
@media only screen and (min-width: 900px) {
    .arrival > div,
    .departure > div {
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      justify-content: center !important;
      width: 100% !important;
    }

    .row span strong, section.room div.details .view .box strong {
       margin: 5px 0 0 0px !important;
    }

    section.room div.details .view .box p {
       margin: 5px 0 0 0px !important;
    }

    .chekinout p,
    .chekinout h6 {
      white-space: nowrap !important;
    }

    /* Allineamento icone iPhone su desktop */
    span.filterRed::before,
    span.filterGreen::before {
        margin-left: 5px !important;
        position: relative !important;
        top: -1px !important;
    }
}


/* --- SCHERMI PICCOLI / TABLET E MOBILE (max-width: 900px) --- */
@media (max-width: 900px) {
    header .information {
        margin: 5px 5px 5px 5px !important;
        float: right !important;
    }

    .HotelHeader2 div.information[data-id="6"] {
        height: auto !important;
        min-height: 0 !important;
        padding-bottom: 2px !important;
        margin-top: 15px !important;
		margin-bottom: 25px !important;
        border-bottom: 1px solid #a59156 !important;
    }

    .headerLogo {
        max-height: 180px !important;
        width: 220px !important;
        margin-top: 30px !important;
    }

    #iconDiv div.information[data-id="6"] {
        height: 90px !important;
        min-height: 90px !important;
        border-bottom: none !important;
    }
    
    #iconDiv .headerIconTheme2,
    #iconDiv .discount {
        height: 90px !important;
        min-height: 90px !important;
    }

    .customHeaderLeft {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }

    .customHeaderLeft a:first-child {
        margin: 0 auto !important;
    }

    .customHeaderLeft .information img,
    .customHeaderLeft .information svg,
    .information .headerIconTheme2 > img,
    .information .headerIconTheme2 > svg {
        display: none !important;
    }

    .CalendarDay div,.NoWrap,.RoomSummary,.SiteButtons,section.room div.calendar ul li .datetheme2 {
        white-space: normal !important;
    }  

    div.customHeaderLeft {
        padding-left: 15px !important;
    }

    .justifyContentEnd {
        justify-content: normal !important;
    }

    /* Posizionamento filtri in prima pagina su Mobile */
    :not(.detalldiv) > div.infoDetail span.filterRed,
    :not(.detalldiv) > div.infoDetail span.filterGreen {
        display: inline-block !important;
        position: relative !important;
        top: 4px !important; 
        left: -110px !important;       
        margin-right: -15px !important; 
    }  
  
    :not(.detalldiv) > div.infoDetail {
        margin-top: 20px !important; 
    }

    /* Posizionamento filtri in seconda pagina (Checkout) su Mobile */
    div.infoDetail span.filterRed,
    div.infoDetail span.filterGreen,
    .detalldiv span.filterRed,
    .detalldiv span.filterGreen {
        display: inline-block !important;
        position: relative !important;
        left: 0 !important;
        margin-right: 0 !important;
    }
  
    span.groupLabelDispYes {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Comando intestazione per smartphone (ex-600px) */
    header div.commandDiv {
        margin-top: -25px !important;
    }
}