/* ==========================================================================
   Siena UpTown — motore di prenotazione (MotoPress Hotel Booking)
   MPHB stampa markup proprio: qui lo riportiamo dentro il design system del
   tema (filetti da 1px, niente ombre, angoli vivi, maiuscoletto spaziato).
   Nessun !important salvo dove il plugin usa stili inline.
   ========================================================================== */

/* ---------- Campi: base comune a form di ricerca e di prenotazione ---------- */
.mphb_sc_search-form input[type="text"],
.mphb_sc_search-form select,
.mphb-booking-form input[type="text"],
.mphb-booking-form input[type="email"],
.mphb-booking-form input[type="tel"],
.mphb-booking-form input[type="number"],
.mphb-booking-form select,
.mphb-booking-form textarea,
.mphb_sc_checkout-form input[type="text"],
.mphb_sc_checkout-form input[type="email"],
.mphb_sc_checkout-form input[type="tel"],
.mphb_sc_checkout-form select,
.mphb_sc_checkout-form textarea{
  width: 100%;
  min-height: 50px;
  padding: 13px 16px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 0;
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--ink);
  transition: border-color .25s ease;
  -webkit-appearance: none;
  appearance: none;
}
.mphb_sc_search-form select,
.mphb-booking-form select,
.mphb_sc_checkout-form select{
  /* la freccia nativa sparisce con appearance:none: la ridisegniamo */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235e554d' stroke-width='1.8'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px;
  padding-right: 42px;
}
.mphb_sc_search-form input:focus,
.mphb_sc_search-form select:focus,
.mphb-booking-form input:focus,
.mphb-booking-form select:focus,
.mphb-booking-form textarea:focus,
.mphb_sc_checkout-form input:focus,
.mphb_sc_checkout-form select:focus,
.mphb_sc_checkout-form textarea:focus{ border-color: var(--siena); }

.mphb_sc_search-form label,
.mphb-booking-form label,
.mphb_sc_checkout-form label{
  display: block;
  margin-bottom: 7px;
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
/* Il markup di MPHB è <label>...</label><br><input>: il <br> serviva a far
   andare a capo una label inline, ma qui la label è già display:block, quindi
   il <br> aggiunge una riga vuota fantasma fra etichetta e campo — è quella
   riga a far sembrare che ogni etichetta appartenga al campo sopra invece
   che al proprio. Va tolto ovunque le label sono block, checkout incluso.
   NB: il <br> è fratello della label (label + br), non un suo discendente:
   "label br" non lo intercetta mai. */
.mphb_sc_search-form label + br,
.mphb-booking-form label + br,
.mphb_sc_checkout-form label + br{ display: none; }
.mphb_sc_search-form abbr,
.mphb-booking-form abbr,
.mphb_sc_checkout-form abbr{ text-decoration: none; color: var(--siena); }

/* ---------- Bottoni ---------- */
.mphb_sc_search-form button,
.mphb_sc_search-form input[type="submit"],
.mphb-booking-form button[type="submit"],
.mphb-booking-form input[type="submit"],
.mphb_sc_checkout-form button[type="submit"],
.mphb_sc_checkout-form input[type="submit"],
.mphb-confirm-reservation button,
.button.mphb-book-button{
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px;
  padding: 14px 28px;
  background: var(--oxblood);
  color: var(--paper);
  border: 1px solid var(--oxblood);
  border-radius: 0;
  font-family: var(--font-body);
  font-size: .71rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase;
  cursor: pointer;
  transition: transform .25s var(--ease), background-color .3s ease;
}
.mphb_sc_search-form button:hover,
.mphb-booking-form button[type="submit"]:hover,
.mphb_sc_checkout-form button[type="submit"]:hover,
.button.mphb-book-button:hover{ background: var(--oxblood-deep); transform: translateY(-2px); }

/* Fuori dalla home la barra non deve scavalcare nulla: il tema le da'
   margin-top negativo per sovrapporla all'hero. */
.booking-bar-inline{ margin-top: 0; }

/* Intestazione ridotta per le pagine del flusso: senza foto di sfondo lo
   spazio del page-header pieno sarebbe sproporzionato. */
.page-header-slim{
  padding: calc(var(--header-h) + clamp(40px, 5vw, 70px)) 0 clamp(32px, 4vw, 52px);
}
.page-header-slim h1{ margin-bottom: 0; }

/* ---------- Pannello di ricerca (pagine interne) ----------
   NB: la classe .booking-bar e' gia' usata dal tema per la barra in home:
   qui serve un nome diverso o i due stili si sovrascrivono a vicenda. */
.booking-panel{
  background: var(--white);
  border: 1px solid var(--line);
  padding: clamp(24px, 3vw, 40px);
}
.booking-panel-head{ margin-bottom: 22px; }
.booking-panel-head h3{
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.4vw, 2.1rem);
  font-weight: 400; margin: 0; line-height: 1.15;
}
.booking-panel .mphb_sc_search-form{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 18px;
  align-items: end;
}
.booking-panel .mphb_sc_search-form > p{ margin: 0; }
.booking-panel .mphb-required-fields-tip{ display: none; }
.booking-panel .mphb_sc_search-form button{ width: 100%; }

/* ---------- Scheda appartamento: due colonne ---------- */
.room-single{
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
  gap: clamp(36px, 5vw, 80px);
  align-items: start;
}
.room-single-main .simple-content p{ color: var(--ink-soft); max-width: 62ch; }

.room-facts{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin-top: 40px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.room-facts > div{
  padding: 22px 24px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.room-facts b{
  display: block;
  font-family: var(--font-display);
  font-size: 1.45rem; font-weight: 400; line-height: 1.1;
  margin-bottom: 6px;
}
.room-facts span{ font-size: .82rem; color: var(--ink-soft); }

/* ---------- Scatola di prenotazione (colonna destra, sticky) ---------- */
.room-single-aside{ position: sticky; top: calc(var(--header-h) + 24px); }
.booking-card{
  background: var(--white);
  border: 1px solid var(--line);
  padding: clamp(24px, 2.6vw, 34px);
}
.booking-card-price{
  padding-bottom: 20px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--line-soft);
}
.booking-card-price b{
  font-family: var(--font-display);
  font-size: 2.4rem; font-weight: 400; line-height: 1;
  display: block;
}
.booking-card-price span{
  font-size: .66rem; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: var(--ink-faint);
}
.booking-card .mphb-booking-form > p,
.booking-card .mphb_sc_booking_form-wrapper > p{ margin: 0 0 16px; }
.booking-card .mphb-required-fields-tip{ display: none; }
.booking-card button[type="submit"],
.booking-card input[type="submit"]{ width: 100%; margin-top: 6px; }

/* Esito della verifica disponibilità, dentro la scheda. */
.booking-card .mphb-rooms-quantity-wrapper{
  margin: 18px 0 0;
  padding-top: 16px;
  border-top: 1px solid var(--line-soft);
  font-size: .88rem;
  color: var(--ink-soft);
}
/* Il prezzo per il periodo scelto: e' il dato che conta, va letto per primo. */
.booking-card .mphb-period-price{
  margin: 10px 0 16px;
  font-size: .66rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-faint);
}
.booking-card .mphb-period-price .mphb-price{
  display: block;
  margin-top: 4px;
  font-family: var(--font-display);
  font-size: 2.1rem; font-weight: 400; letter-spacing: 0;
  text-transform: none; color: var(--ink);
}
.booking-card .mphb-period-price .mphb-price-period{
  display: inline-block;
  margin-top: 2px;
  font-size: .62rem; letter-spacing: .14em;
  text-decoration: none; border: 0;
  color: var(--ink-faint);
}
.booking-card .mphb-hide{ display: none; }
.booking-card-note{
  margin: 18px 0 0;
  font-size: .8rem;
  line-height: 1.5;
  color: var(--ink-faint);
}

/* ---------- Prezzi, riepiloghi, dettagli ---------- */
.mphb-price, .mphb-booking-details .mphb-price{ font-weight: 600; color: var(--ink); }
.mphb-currency{ color: var(--ink-soft); }
.mphb-booking-details,
.mphb_sc_checkout-reserved-rooms-details,
.mphb-reserved-rooms-details{
  border: 1px solid var(--line);
  padding: 24px;
  background: var(--white);
}
.mphb-booking-details table,
.mphb_sc_checkout-form table{ width: 100%; border-collapse: collapse; }
.mphb-booking-details th, .mphb-booking-details td,
.mphb_sc_checkout-form th, .mphb_sc_checkout-form td{
  padding: 11px 0;
  border-bottom: 1px solid var(--line-soft);
  text-align: left;
  font-size: .92rem;
}
.mphb-booking-details th, .mphb_sc_checkout-form th{
  font-size: .66rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-soft);
}

/* ---------- Metodi di pagamento ----------
   Struttura reale: ul.mphb-gateways-list > li.mphb-gateway >
   input[radio] + label.mphb-gateway-title + p.mphb-gateway-description.
   La regola generale sui label del checkout li rende blocchi maiuscoli:
   qui vanno riportati a etichette di scelta, in linea col radio. */
.mphb-gateways-list{
  list-style: none; margin: 0 0 24px; padding: 0;
  border: 1px solid var(--line); background: var(--white);
}
.mphb-gateway{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
  padding: 18px clamp(18px, 2vw, 24px);
}
.mphb-gateway + .mphb-gateway{ border-top: 1px solid var(--line-soft); }
.mphb-gateway input[type="radio"]{
  width: 18px; height: 18px; min-height: 0; margin: 3px 0 0;
  padding: 0; border: 0; background: none;
  accent-color: var(--oxblood);
  -webkit-appearance: auto; appearance: auto;
  grid-row: 1 / span 2;
}
.mphb_sc_checkout-form .mphb-gateway label.mphb-gateway-title{
  margin: 0;
  font-size: .95rem; font-weight: 600;
  letter-spacing: 0; text-transform: none;
  color: var(--ink); cursor: pointer;
}
.mphb-gateway-description{
  margin: 4px 0 0;
  font-size: .87rem; line-height: 1.5; color: var(--ink-soft);
}
.mphb-gateway-instructions{ font-size: .87rem; color: var(--ink-soft); }

/* ---------- Messaggi ---------- */
.mphb-errors-wrapper, .mphb-error, .mphb-message, .mphb-success{
  padding: 16px 20px;
  border-left: 3px solid var(--siena);
  background: var(--paper-3);
  font-size: .92rem;
  margin-bottom: 20px;
}
.mphb-success{ border-left-color: var(--olive); }

/* ---------- Calendario disponibilità della scheda appartamento ----------
   MPHB riusa il datepick di kbwood in versione "inline": arriva con tabella,
   sfondi e bordi propri, che qui riportiamo ai filetti da 1px del tema. */
.room-calendar{
  background: var(--white);
  border: 1px solid var(--line);
  padding: clamp(20px, 2.4vw, 32px);
}
.room-calendar .mphb-calendar,
.room-calendar .datepick{
  width: 100% !important;
  max-width: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: var(--font-body) !important;
}
.room-calendar .datepick-month-row{
  display: flex; flex-wrap: wrap; gap: clamp(20px, 3vw, 44px);
}
.room-calendar .datepick-month{
  flex: 1 1 280px; width: auto !important; float: none !important;
  border: 0 !important;
}
.room-calendar .datepick-month table{ width: 100%; border-collapse: collapse; }
.room-calendar .datepick-month-header,
.room-calendar .datepick-month th{
  background: transparent !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  font-size: .66rem !important; font-weight: 700 !important;
  letter-spacing: .14em; text-transform: uppercase;
  padding: 10px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
/* Il primo mese porta i select di mese/anno del datepick, che arrivano con
   lo stile scuro nativo: li allineiamo al resto dell'intestazione. */
.room-calendar .datepick-month-header select{
  appearance: none; -webkit-appearance: none;
  background: transparent !important;
  border: 0 !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  font-size: .66rem !important; font-weight: 700 !important;
  letter-spacing: .14em; text-transform: uppercase;
  padding: 0 16px 0 4px;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23181512' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 2px center !important;
  background-size: 11px !important;
}

.room-calendar .datepick-month td{
  border: 0 !important;
  padding: 3px !important;
  text-align: center;
}
.room-calendar .datepick-month td span,
.room-calendar .datepick-month td a{
  display: block;
  padding: 9px 2px 7px;
  border: 1px solid transparent;
  font-size: .9rem; line-height: 1.15;
  text-decoration: none;
}
/* Notte libera: prenotabile */
.room-calendar .datepick-month td a{
  color: var(--ink);
  background: transparent;
  border-color: var(--line-soft);
}
.room-calendar .datepick-month td a:hover{
  background: var(--siena); border-color: var(--siena); color: var(--paper);
}
/* Notte occupata o passata: barrata e spenta */
.room-calendar .datepick-month td span{
  color: var(--ink-faint);
  background: repeating-linear-gradient(
    -45deg, transparent, transparent 4px,
    rgba(24, 21, 18, .07) 4px, rgba(24, 21, 18, .07) 5px
  );
}
/* Il prezzo per notte, sotto il numero del giorno */
.room-calendar .mphb-price,
.room-calendar .datepick-month td small{
  display: block;
  margin-top: 3px;
  font-size: .6rem; font-weight: 600; letter-spacing: .02em;
  color: var(--siena);
}
.room-calendar .datepick-month td span .mphb-price{ color: var(--ink-faint); }
.room-calendar .datepick-cmd{ display: none !important; }
.room-calendar .datepick-nav, .room-calendar .datepick-ctrl{
  background: transparent !important; border: 0 !important;
}
.room-calendar .datepick-nav a, .room-calendar .datepick-ctrl a{
  color: var(--ink) !important; background: transparent !important;
  font-size: .66rem; letter-spacing: .12em; text-transform: uppercase;
}

.calendar-legend{
  display: flex; flex-wrap: wrap; gap: 22px;
  margin: 26px 0 0; padding-top: 18px;
  border-top: 1px solid var(--line-soft);
  list-style: none;
  font-size: .74rem; color: var(--ink-soft);
}
.calendar-legend li{ display: flex; align-items: center; gap: 9px; }
.swatch{ width: 15px; height: 15px; display: inline-block; border: 1px solid var(--line); }
.swatch-free{ background: var(--white); }
.swatch-busy{
  background: repeating-linear-gradient(
    -45deg, transparent, transparent 3px,
    rgba(24, 21, 18, .18) 3px, rgba(24, 21, 18, .18) 4px
  );
}

/* ---------- Galleria della scheda ---------- */
.room-single-gallery{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: clamp(12px, 1.6vw, 22px);
}
.room-single-gallery figure{ margin: 0; overflow: hidden; cursor: zoom-in; }
.room-single-gallery img{
  width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3;
  transition: transform .7s var(--ease);
}
.room-single-gallery figure:hover img{ transform: scale(1.04); }

/* ---------- Altri appartamenti ---------- */
.room-other-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: clamp(16px, 2vw, 28px);
}
.room-other{ display: block; background: var(--white); border: 1px solid var(--line); }
.room-other img{ width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.room-other-body{ padding: 20px 22px; }
.room-other-body h4{
  font-family: var(--font-display); font-weight: 400;
  font-size: 1.35rem; margin: 0 0 4px;
}
.room-other-body p{ margin: 0; font-size: .85rem; color: var(--ink-soft); }
.room-other:hover{ border-color: var(--siena); }

/* ---------- Risultati di ricerca ---------- */
.mphb_sc_search_results-wrapper .mphb-room-type{
  border: 1px solid var(--line);
  background: var(--white);
  padding: clamp(20px, 2.4vw, 32px);
  margin-bottom: 22px;
}
.mphb_sc_search_results-wrapper h3,
.mphb_sc_search_results-wrapper h2{
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(1.5rem, 2.2vw, 2rem); margin: 0 0 10px;
}

/* ---------- Calendario date (datepick) ---------- */
.datepick{
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--font-body) !important;
  background: var(--white) !important;
}
.datepick .datepick-month-header,
.datepick .datepick-month-header select{
  font-family: var(--font-body) !important;
  font-size: .78rem !important;
  letter-spacing: .1em; text-transform: uppercase;
}
.datepick td .datepick-today{ background: var(--paper-2) !important; }
.datepick td a:hover{ background: var(--siena) !important; color: var(--paper) !important; }

/* ---------- Pagine del flusso (ricerca, checkout, conferma, account) -------
   page.php stringe .simple-content a 68ch: qui le restituiamo la larghezza,
   perche' risultati e riepiloghi sono griglie e tabelle, non prosa. */
.siena-booking-page .simple-content{ max-width: none; }
.siena-booking-page .simple-content > * + *{ margin-top: 0; }

/* Riga di riepilogo della ricerca ("3 strutture trovate da ... a ...") */
.mphb_sc_search_results-wrapper > p:first-child{
  font-size: .68rem; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: var(--ink-soft);
  padding-bottom: 16px; border-bottom: 1px solid var(--line);
  margin: 0 0 36px;
}

/* ---------- Blocco "Consigliato per N ospiti" ---------- */
.mphb-recommendation{
  background: var(--white);
  border: 1px solid var(--line);
  padding: clamp(22px, 2.6vw, 34px);
  margin-bottom: 40px;
}
.mphb-recommendation-title{
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(1.4rem, 2vw, 1.9rem);
  margin: 0 0 20px; line-height: 1.15;
}
.mphb-recommendation-details-list{ margin: 0; padding: 0; list-style: none; }
.mphb-recommendation-item{
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px;
  padding: 14px 0; border-bottom: 1px solid var(--line-soft);
}
.mphb-recommendation-item .mphb-recommedation-item-subtotal{ margin-left: auto; font-weight: 600; }
.mphb-recommendation-item-guests{ font-size: .84rem; color: var(--ink-soft); width: 100%; }
.mphb-recommendation-total{
  display: flex; align-items: baseline; gap: 12px;
  padding-top: 18px; margin-top: 4px;
}
.mphb-recommendation-total-title{
  font-size: .68rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-soft);
}
.mphb-recommendation-total-value{
  font-family: var(--font-display); font-size: 1.7rem; line-height: 1;
}
.mphb-recommendation-total-value .mphb-price{ font-weight: 400; }
.mphb-recommendation .mphb-reserve-room-section{ margin-top: 22px; }

/* ---------- Elenco risultati: schede ----------
   La scheda ha otto figli diretti (galleria, titolo, estratto, attributi,
   prezzo, bottoni...) senza un contenitore per la colonna di testo. Con una
   griglia a due colonne le righe verrebbero dimensionate sull'altezza della
   foto, aprendo vuoti fra un blocco e l'altro: il float fa scorrere il testo
   accanto all'immagine senza inventare wrapper che il plugin non stampa. */
.mphb_sc_search_results-wrapper .mphb-room-type{
  border: 1px solid var(--line);
  background: var(--white);
  padding: clamp(20px, 2.4vw, 32px);
  margin-bottom: 24px;
  overflow: hidden; /* contiene il float */
}
.mphb_sc_search_results-wrapper .mphb-room-type > * + *{ margin-top: 14px; }
.mphb_sc_search_results-wrapper .mphb-room-type-images{
  float: left;
  width: 46%;
  margin: 0 clamp(24px, 3vw, 40px) 20px 0;
}
.mphb_sc_search_results-wrapper .mphb-room-type img{ width: 100%; height: auto; }
.mphb-room-type-title{
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(1.6rem, 2.4vw, 2.2rem); line-height: 1.1;
  margin: 0;
}
.mphb-room-type-title a{ border: 0; }
/* E' un heading, quindi eredita il font display del tema: qui torna a essere
   una piccola etichetta di sezione come le altre della scheda. */
.mphb_sc_search_results-wrapper .mphb-room-type-details-title{
  font-family: var(--font-body);
  font-size: .66rem; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--ink-soft);
  margin: 0; padding-bottom: 10px;
  border-bottom: 1px solid var(--line-soft);
}

/* La galleria e' un flexslider: si inizializza dopo il primo paint e da quel
   momento gestisce da solo display, float e transform delle slide. Qualsiasi
   regola che nasconda o ridimensioni i <li> lo manda fuori sincrono e lascia
   un riquadro bianco, quindi qui tocchiamo solo il contenitore. */
.mphb-room-type-images{ overflow: hidden; }
/* MPHB stampa due slider: quello principale e una striscia di miniature che,
   senza il CSS delle gallery a colonne di WordPress, si apre a piena larghezza
   e raddoppia l'altezza della scheda. In elenco basta una foto: nascondiamo
   la striscia (nella scheda singola la galleria la disegna il tema). */
.mphb-room-type-images .mphb-gallery-thumbnails-slider{ display: none; }
.mphb-room-type-images .flex-direction-nav a{
  background: rgba(24, 21, 18, .55);
  color: var(--paper);
  text-shadow: none;
}
.mphb-room-type-images .gallery-icon{ display: block; }
.mphb-loop-room-type-attributes{
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 4px 20px;
  margin: 18px 0;
  padding: 16px 0;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  list-style: none;
}
.mphb-attribute-title{
  font-size: .64rem; font-weight: 700; letter-spacing: .13em;
  text-transform: uppercase; color: var(--ink-faint);
  display: block;
}
.mphb-attribute-value{ font-size: .95rem; }
.mphb-regular-price, .mphb-room-type .mphb-price{
  font-family: var(--font-display);
  font-size: 1.6rem; font-weight: 400; line-height: 1;
}
.mphb-price-period{
  font-size: .68rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-faint);
}

/* ---------- Bottoni MPHB fuori dai form ---------- */
.button.mphb-button,
a.button.mphb-button,
.mphb-recommendation-reserve-button,
.mphb-confirm-reservation{
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 14px 28px;
  background: var(--oxblood); color: var(--paper);
  border: 1px solid var(--oxblood); border-radius: 0;
  font-family: var(--font-body);
  font-size: .71rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase;
  cursor: pointer; text-decoration: none;
  transition: transform .25s var(--ease), background-color .3s ease;
}
.button.mphb-button:hover, a.button.mphb-button:hover{
  background: var(--oxblood-deep); color: var(--paper); transform: translateY(-2px);
}
/* Il "vedi dettagli" e' un'azione secondaria: resta un contorno */
.button.mphb-view-details-button,
a.button.mphb-view-details-button{
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 14px 26px;
  background: transparent; color: var(--ink);
  border: 1px solid var(--ink); border-radius: 0;
  font-size: .71rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase;
  text-decoration: none; margin-left: 10px;
}
.button.mphb-view-details-button:hover{ background: var(--ink); color: var(--paper); }
.mphb-remove-from-reservation{
  font-size: .74rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--siena); border-bottom: 1px solid currentColor;
}

/* Con "Prenota" che porta dritto al checkout (mphb_direct_search_results) il
   carrello non si riempie mai: resterebbe una scatola vuota che invita a un
   passaggio che non esiste piu'. */
.mphb_sc_search_results-wrapper .mphb-reservation-cart{ display: none; }

/* ---------- Carrello prenotazione ---------- */
.mphb-reservation-cart{
  background: var(--white); border: 1px solid var(--line);
  padding: clamp(20px, 2.4vw, 30px); margin-bottom: 32px;
}
.mphb-cart-total-price{
  display: flex; align-items: baseline; gap: 12px;
  padding-top: 16px; margin-top: 16px; border-top: 1px solid var(--line);
}
.mphb-cart-total-price-title{
  font-size: .68rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-soft);
}
.mphb-cart-total-price-value{ font-family: var(--font-display); font-size: 1.6rem; line-height: 1; }
.mphb-empty-cart-message, .mphb-cart-message{ color: var(--ink-soft); font-size: .92rem; }

/* ---------- Adattamenti mobile ---------- */
@media (max-width: 980px){
  .room-single{ grid-template-columns: 1fr; }
  .room-single-aside{ position: static; }
}
@media (max-width: 860px){
  .mphb_sc_search_results-wrapper .mphb-room-type-images{
    float: none; width: 100%; margin: 0 0 20px;
  }
}
@media (max-width: 640px){
  .booking-panel .mphb_sc_search-form{ grid-template-columns: 1fr; }
  .room-facts{ grid-template-columns: 1fr; }
  .button.mphb-view-details-button{ margin-left: 0; margin-top: 10px; }

  /* Il calendario a due mesi affiancati non ci sta su schermi stretti: ogni
     mese va a piena larghezza e le celle si stringono per mostrare tutta la
     settimana, prezzo compreso (resta minuscolo, ma leggibile). min-width:0
     e' necessario perche' di default un elemento flex non si restringe mai
     sotto la larghezza minima del proprio contenuto. */
  .room-calendar{ padding: 16px 14px; }
  .room-calendar .datepick-month-row{ gap: 28px; }
  .room-calendar .datepick-month{ flex-basis: 100%; min-width: 0; }
  .room-calendar .datepick-month table{ table-layout: fixed; }
  .room-calendar .datepick-month td span,
  .room-calendar .datepick-month td a{ padding: 7px 1px 6px; font-size: .8rem; }
  .room-calendar .mphb-price,
  .room-calendar .mphb-currency,
  .room-calendar .datepick-month td small{ font-size: .52rem !important; }
  .room-calendar .datepick-month td span{ background: rgba(24, 21, 18, .05); }
}