/* 23/10/2026: COLORI DI RIFERIMENTO (riordino CSS, passo 1). Cambiare qui, non nelle singole regole.
   Fondo pagina, riquadri, marrone dei pulsanti (template), rosso solo carrello e sconti, testi, inattivo. */
:root{
  --ss-fondo:#FAF9F6;
  --ss-riq:#F2EFE9;
  --ss-riq-scuro:#E6DED2;
  --ss-bordo:#ECE4D8;
  --ss-marrone:#755D4A;
  --ss-marrone-sec:#8A6A52;
  --ss-marrone-scuro:#5E4A3B;
  --ss-oro:#A87A4F;
  --ss-rosso:#B15151;
  --ss-rosso-scuro:#963F3F;
  --ss-testo:#2A2622;
  --ss-testo-bruno:#3B2A1E;
  --ss-testo2:#4A3F37;
  --ss-testo3:#6B5D52;
  --ss-inattivo:#ECEBE8;
  --ss-inattivo-t:#8C8984;
  --ss-verde:#2E7A4A;
  --ss-wa:#1F8F4E;
}
/* ==========================================================================
   Albergo Sonia — sito sul telefono come un'app (solo sotto 992px)
   Caricato dopo sonia.css (index.php e reservation/templates/default/default.php).
   Markup in reservation/include/sonia_app_sito.inc.php. Il desktop non cambia.
   Regole: testo base più grande, pulsanti alti almeno 52px.
   ========================================================================== */

.ss-app { display: none; }

@media (max-width: 1199.98px) {

  /* testo un po' più grande in tutto il sito */
  body.ss-on { font-size: 1.2625rem; padding-bottom: calc(78px + env(safe-area-inset-bottom)); }

  /* via i pulsanti fluttuanti che la barra sostituisce */
  body.ss-on #scrollTopBtn, body.ss-on .scroll-top { display: none !important; }

  .ss-app { display: block; }

  /* ---------- barra in basso ---------- */
                  
  /* ---------- foglio Contatti ---------- */
                                  
  /* il login del sito resta sopra la barra */
  .modal { z-index: 1060; }
}

/* ---------- Home (bozza 6a), solo telefono sotto 768px ---------- */
.ss-cerca-tit, .ss-usp, .ss-camere { display: none; }
@media (max-width: 1199.98px) {
  /* via i doppioni: Chiama/WhatsApp e la striscia contatti ora sono nel foglio Contatti; Prenota è nella barra */
  .hero-arch-actions, .hero-arch-contacts, .hero-arch-cta { display: none !important; }
  /* foto più bassa, i tre vantaggi passano nei riquadri sotto la ricerca */
      
  /* ricerca: riquadro bianco con titolo, subito sotto la foto */
  #checkRooms { padding-top: 6px; padding-bottom: 6px; }
  #checkRooms .card-check-room { background: #fff !important; border: 1px solid var(--ss-bordo) !important; border-radius: 14px; box-shadow: 0 6px 18px rgba(60, 40, 20, .10); }
    #checkRooms .form-control, #checkRooms .form-select { min-height: 54px; font-size: 17px !important; }
  #checkRooms button[type="submit"], #checkRooms .btn { min-height: 56px; font-size: 17px; }

  /* tre vantaggi */
  .ss-usp { display: grid; grid-template-columns: repeat(3, 1fr); }
  
  /* camere da scorrere di lato */
                      }

@media (max-width: 1199.98px) {
  html body.ss-on section.hero-arch-contacts, html body.ss-on .hero-arch-contacts .service-featured-list { display: none !important; }
}

/* Home telefono: meno vuoti tra le sezioni, testo lungo accorciato */
@media (max-width: 1199.98px) {
  #about, #overview, #roomsSuites, #facilitiesAmenities, #testimonials { padding-top: 28px !important; padding-bottom: 28px !important; }
  #about .mb-10, #about .mb-12, #about .mt-10, #about .mt-12, #about .pt-12, #about .pb-12,
  #overview .mb-10, #overview .mb-12, #overview .mt-10, #overview .mt-12, #overview .pt-12, #overview .pb-12,
  #roomsSuites .mb-10, #roomsSuites .pb-12 { margin-top: 0 !important; margin-bottom: 16px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
  #about .row, #overview .row { --bs-gutter-y: 1rem; }
      }

/* ---------- Home telefono: prima schermata (titolo sulla foto, offerta, fiducia) ---------- */
.ss-bollino, .ss-hero-extra { display: none; }
@media (max-width: 1199.98px) {
  /* testata: l'utente ora è "Account" nella barra in basso */
  body.ss-on header .ms-0.ms-xl-4.dropdown, body.ss-on .navbar .ms-0.ms-xl-4.dropdown { display: none !important; }
}
@media (max-width: 1199.98px) {
  .hero-carousel .check-room { background-color: transparent !important; }
                        /* ricerca: pulsante pieno */
  #checkRooms button[type="submit"] { background: #a5825f !important; border-color: #a5825f !important; color: #fff !important; font-weight: 600; letter-spacing: .08em; }
  #checkRooms { position: relative; z-index: 3; }
}

/* Home telefono: più contrasto per il testo sulla foto (29/09) */

/* Home telefono: più contrasto per il testo sulla foto */

/* Home telefono · 7a: testo in un nastro marrone noce (colore del banco reception) con coda a V.
   Sostituisce sfumatura e ombre delle regole sopra. */

/* 7a · ritocchi: coda a V più evidente, titolo su una riga, voto non coperto dalla ricerca */

/* Home telefono · banda orizzontale a tutta larghezza (sostituisce la coda a V).
   Colore della banda: cambiare solo --ss-banda (scelto da Paolo: marrone trasparente). */
@media (max-width: 1199.98px) {
  #heroArchMobile { --ss-banda: rgba(134, 57, 6, .52); }
            /* pillole sulla stessa riga */
    /* scheda di ricerca: titolo staccato dal bordo */
  }

/* "Quando arrivi?" come pillola bianca con ombra (bozza 7a) */

/* ======================================================================
   Albergo Sonia — Camere disponibili sul telefono (bozza approvata 29/09)
   ====================================================================== */
.sonia-room-m, .sonia-room-m-tax { display: none; }

@media (max-width: 1199.98px) {
  /* Riepilogo ricerca: una pastiglia, il modulo si apre con "Modifica" */
  #availSummary {
    display: grid; grid-template-columns: 1fr auto; grid-template-areas: "main btn" "meta btn";
    align-items: center; column-gap: 12px; width: 100%; margin: 0 0 1.25rem;
    padding: 8px 8px 8px 18px; text-align: left;
    background: #fff; border: 1px solid var(--bs-primary-100); border-radius: 40px;
    color: var(--bs-body-color); font: inherit; cursor: pointer;
  }
  #availSummary .avail-summary-main { grid-area: main; font-weight: 500; font-size: 0.9375rem; line-height: 1.25; }
  #availSummary .avail-summary-meta { grid-area: meta; font-size: 0.8125rem; color: var(--bs-secondary-color); line-height: 1.3; }
  #availSummary .avail-summary-btn {
    grid-area: btn; background: var(--bs-primary); color: #fff; border-radius: 30px;
    padding: 8px 16px; font-size: 0.8125rem; font-weight: 500;
  }
  #availSearch { display: none; }
  body.avail-search-open #availSearch { display: block; }
  body.avail-search-open #availSummary .avail-summary-btn { background: var(--bs-secondary); }
}

@media (max-width: 1199.98px) {
  .card.card-selected .sonia-room-full { display: none; }
  .sonia-room-m { display: block; margin-bottom: 0.75rem; }
  .sonia-room-m-icons { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 0.9375rem; font-weight: 300; margin-bottom: 0.75rem; }
  .sonia-room-m-icons span { display: inline-flex; align-items: center; gap: 6px; }
  .sonia-room-m-icons .hicon { font-size: 1.15rem; color: var(--bs-primary); }
  .sonia-room-m-pay { display: flex; flex-wrap: wrap; gap: 6px; }
  .sonia-room-m-pay > span {
    white-space: nowrap;
    border: 1px solid #bfe0c9; color: var(--ss-verde); border-radius: 20px;
    padding: 3px 10px; font-size: 0.75rem; font-weight: 500; line-height: 1.4;
  }
  .sonia-room-m-tax { display: block; flex: 1 1 100%; font-size: 0.75rem; color: var(--bs-secondary-color); margin-top: -4px; }
  .card.card-selected .card-body > .row.g-0 > div:last-child > div:nth-child(1) { flex-wrap: wrap; }
  /* Prenota: colore del sito (era grigio, sembrava disattivato) */
  .card.card-selected .room-book-btn.btn-secondary {
    background: var(--bs-primary); border-color: var(--bs-primary); color: #fff;
  }
}

/* ==========================================================================
   Home telefono — foto della camera (r_2_min.jpg), 02/10/2026
   La foto e' chiara e il testo bianco sopra non si leggeva: il testo esce
   dalla foto e va subito sotto, marrone su fondo crema (come il desktop).
   Foto pulita, solo il bollino dell'offerta.
   ========================================================================== */
@media (max-width: 1199.98px) {
                  #checkRooms { margin-top: -14px !important; }
}

/* Home telefono · riquadro trasparente sulla foto con indirizzo e pillole (02/10).
   Trasparenza: cambiare solo --ss-box (0 = trasparente, 1 = bianco pieno). */
@media (max-width: 1199.98px) {
  #heroArchMobile { --ss-box: rgba(255,255,255,.62); }
      }

/* ==========================================================================
   Home telefono · bozza 1c (05/10/2026): striscia di foto della reception con
   lo slogan sopra, banda rossa dell'offerta, poi subito "Quando arrivi?".
   REGOLA QUI: altezza della foto (img height), grandezza dello slogan (.ss-foto-titolo).
   ========================================================================== */
@media (min-width: 1200px) { .ss-banda-offerta { display: none; } }
/* 05/10: banda dell'offerta in alto, sopra la foto */

/* 05/10: foto della reception senza velo scuro (prova). Lo slogan resta leggibile con un'ombra
   piu' marcata. Per rimettere il velo: cancellare queste due righe. */

/* 05/10 · strada b: slogan in una striscia crema sotto la banda rossa, sopra la foto.
   REGOLA QUI: grandezza (font-size) e spazi (padding) di .ss-slogan */
@media (min-width: 1200px) { .ss-slogan { display: none; } }
/* slogan su una riga, stesso fondo della scheda sotto (05/10) */

/* ==========================================================================
   Carrello sul telefono = tondo Prenota (07/10/2026), sotto 992px
   - via la barra "1 Camera : 65,00 · Continua" e il carrello in testata;
   - con camere nel carrello il tondo diventa blu #2c458a con numerino rosso,
     e sotto compare l'importo al posto di "Prenota" (il clic fa "Continua");
   - fumetto "Camera aggiunta" sopra il tondo per 2,5 secondi.
   ========================================================================== */
@media (max-width: 1199.98px) {
  body.ss-on #toast-container > .toast-success { display: none !important; }
  body.ss-on a.js-cart-link { display: none !important; }

}

/* Carrello sul telefono, correzioni 07/10: icona carrello sul tondo blu, "Carrello" sotto,
   importo in testata accanto al menu, niente avviso fisso "Camera rimossa" (c'e' il fumetto). */
.ss-testa-imp { display: none; }
@media (max-width: 1199.98px) {
  body.ss-on #toast-container > .toast-warning, body.ss-on #toast-container > .toast { display: none !important; }
                .ss-testa-imp.is-on { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: 15px; font-weight: 600; text-decoration: none !important; line-height: 1; }
  .ss-testa-imp svg { width: 18px; height: 18px; }
}

/* le icone del tondo stanno in <span>: prendevano il colore della scritta sotto
   (marrone su marrone, blu su blu) e sparivano. Sempre bianche. */

/* ==========================================================================
   Telefono 07/10/2026 (sotto 768px)
   1) Login, crea account, password dimenticata...: troppo spazio sopra il riquadro
      (pt-25 pensato per il computer). Restano 24px sotto la testata.
   3) "Termini e Condizioni" non si spezza a meta' riga.
   4) Footer: Condizioni | Privacy Policy | Cookie Policy su una sola riga.
   ========================================================================== */
@media (max-width: 1199.98px) {
  section#login, section#create-account, section#password-forgotten,
  section#resend-activation, section#reset-account,
  section#dashboard.pt-25, section#account.pt-25, section#booking.pt-25, section#remove-account.pt-25 {
    padding-top: 24px !important;
  }

  label[for="agree"] a { white-space: nowrap; }

  .sonia-footer-links { display: flex !important; flex-wrap: nowrap; align-items: center; gap: 0; margin-bottom: 0; }
  .sonia-footer-links .list-inline-item { margin: 0 !important; padding: 0 !important; white-space: nowrap; font-size: 15px; }
  .sonia-footer-links .list-inline-item + .list-inline-item::before { content: "|"; margin: 0 10px; padding: 0 !important; color: #b9ab9a; }
  .sonia-footer-links .list-inline-item::after { content: none !important; }
}

/* Dashboard cliente sul telefono: nome + pillola "Ospite premium" sotto il titolo (customer/home.php) */
@media (max-width: 1199.98px) {
  #pageTitle h1 + .sonia-dash-m { margin-top: -18px; margin-bottom: 20px; }
  .sonia-dash-m { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
  .sonia-dash-m-nome { font: 500 1.15rem "Jost", sans-serif; color: #2e2118; }
  .sonia-dash-m-premium { display: inline-flex; align-items: center; gap: 2px; padding: 5px 12px; border-radius: 999px;
                          background: #fbe9e4; border: 1px solid #f0bfb2; color: #c0301e; font: 600 .95rem "Jost", sans-serif; }
  .sonia-dash-m-premium .sonia-corona { width: 16px; height: 16px; margin-right: 5px; }
}

/* Checkout sul telefono: schede Tariffa flessibile / non rimborsabile piu' leggibili
   (stili in linea in page/handlers/handler_booking_checkout.php, qui solo telefono) */
@media (max-width: 1199.98px) {
  .sonia-tariffa { padding: 18px 16px 14px !important; gap: 8px !important; }
  .sonia-tariffa > span strong { font-size: 1.2rem; }
  .sonia-tariffa ul { font-size: 1.02rem !important; line-height: 1.5 !important; }
  .sonia-tariffa ul { color: #3f362e !important; }
  .sonia-tariffa ul li + li { margin-top: 2px; }
  .sonia-tariffa > strong.fs-5 { font-size: 1.4rem !important; }
  .sonia-tariffa > span[style*="position:absolute"] {
    top: -14px !important; right: 14px !important;
    font-size: 1rem !important; padding: 4px 13px !important; border-radius: 999px !important;
    box-shadow: 0 3px 8px rgba(192, 57, 43, .3);
  }
}

/* Dashboard cliente sul telefono: pulsante Esci a destra, sulla riga del nome */
@media (max-width: 1199.98px) {
  .sonia-dash-m-esci { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px;
                       border: 1px solid #d9cdbd; border-radius: 999px; background: #fff; color: var(--ss-marrone-scuro) !important;
                       font: 500 1rem "Jost", sans-serif; text-decoration: none !important; }
  .sonia-dash-m-esci i { font-size: 14px; }
}

/* Telefono: "Esci" in fondo al menu, separato da una riga */
/* Login (finestra e pagina): "Recupera password?" sotto "Ricordami", allineato a sinistra */
@media (max-width: 1199.98px) {
  .row:has(#chkRemember2) > .col-5, .row:has(#chkRemember2) > .col-7,
  .row:has(#chkRemember) > .col-5, .row:has(#chkRemember) > .col-7 { flex: 0 0 100%; max-width: 100%; }
  .row:has(#chkRemember2) > .col-5 .mb-5, .row:has(#chkRemember) > .col-5 .mb-5 { margin-bottom: 10px !important; }
  .row:has(#chkRemember2) > .col-7 .text-end, .row:has(#chkRemember) > .col-7 .text-end { text-align: left !important; }
}

/* ==========================================================================
   HOME SU TELEFONO - passo 1 (11/10/2026)
   Correzioni dirette + mappa con legenda sotto (bozza 7a). Solo sotto i 768px.
   ========================================================================== */
@media (max-width: 1199.98px) {
  /* Meno vuoto fra un capitolo e l'altro */
  #about, #overview, #roomsSuites, #pagamenti, #facilitiesAmenities, #testimonials {
    padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
  #about .layered-card, #overview .layered-card, #roomsSuites .layered-card,
  #pagamenti .layered-card, #facilitiesAmenities .layered-card, #testimonials .layered-card { margin-bottom: 1rem !important; }

  /* Intestazioni dei capitoli attaccate alla scheda, come su desktop */
  #roomsSuites .sonia-camere-intro, #pagamenti .sonia-camere-intro,
  #facilitiesAmenities .sonia-camere-intro, #testimonials .sonia-camere-intro {
    margin: 0 !important; box-shadow: none !important; border-bottom: 0 !important; padding: 1.4rem 1.25rem 1.1rem !important; gap: .6rem !important;
    background: linear-gradient(180deg, var(--sonia-intro-crema, var(--ss-riq)) 0%, var(--bs-body-bg, #fff) 100%) !important; }
  .sonia-camere-intro + .layered-card { margin-top: 0 !important; }
  .sonia-camere-intro-testo { color: var(--ss-testo-bruno) !important; font-size: 1rem; line-height: 1.6; }

  /* Titolo della scheda pagamenti: meno spaziato, non va piu' a capo male */
  .sonia-scheda-tit { letter-spacing: .08em !important; font-size: 1.25rem !important; }

  /* Recensioni piu' leggibili */
  .sonia-rev-testo p { font-size: 1rem !important; line-height: 1.6; }
  .sonia-rev-nome { font-size: 1.05rem; }
  .sonia-rev-da { font-size: .85rem; }
  .sonia-rev-critiche .btn { justify-content: center; }

  /* Mappa (bozza 7a): legenda SOTTO la mappa, testo 15px; pulsanti affiancati */
  .sonia-dt-mappa { height: auto !important; min-height: 0 !important; overflow: visible !important; background: #fff; }
  .sonia-dt-mappa > a:first-child { position: relative !important; display: block !important; height: 250px !important; overflow: hidden; }
  .sonia-dt-mappa > a:first-child img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; object-position: 50% 70%; }
  .sonia-mappa-legenda { position: static !important; width: auto !important; max-width: none !important; padding: .9rem 1.1rem .4rem !important;
    background: #fff !important; border-radius: 0 !important; box-shadow: none !important; }
  .sonia-mappa-legenda .sonia-dt td { font-size: .95rem !important; padding: .55rem 0 !important; }
  .sonia-mappa-legenda .sonia-dt-ico { flex-basis: 22px !important; width: 22px !important; height: 22px !important; font-size: .7rem !important; }
  .sonia-mappa-legenda .sonia-dt-luogo span:last-child { white-space: normal; }
  .sonia-mappa-nota { font-size: .8rem; padding-top: .2rem; }
  .sonia-dt-gmaps { top: 10px !important; left: 10px !important; right: auto !important; bottom: auto !important; }
  .sonia-pos-pulsanti { flex-wrap: nowrap; gap: 8px; }
  .sonia-pos-pulsanti .btn { flex: 1 1 0 !important; justify-content: center; padding-left: .5rem; padding-right: .5rem; }
}

/* HOME SU TELEFONO - camere in schede complete una sotto l'altra (bozza 8a, 11/10/2026).
   Niente piu' scorrimento di lato; angoli vivi come le schede del sito. */

/* HOME SU TELEFONO - passo 3 (bozza 8a, 11/10/2026): testi brevi come un'app, servizi 2 colonne */
@media (max-width: 1199.98px) {
  /* Testi lunghi: intestazioni capitoli senza paragrafo; schede Benvenuti/Posizione a 3 righe */
  #about .layered-card-inner p, #overview .layered-card-inner p {
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 1rem !important; }
  /* Servizi: griglia 2 x 3 in una scheda, righe sottili */
  #facilitiesAmenities .svc-tiles { display: grid !important; grid-template-columns: 1fr 1fr; }
  #facilitiesAmenities .svc-tiles > [class*="col-"] { width: auto !important; max-width: none !important; flex: none !important;
    border-bottom: 1px solid var(--sonia-scheda-riga, rgba(132,105,85,.24)) !important; }
  #facilitiesAmenities .svc-tiles > [class*="col-"]:nth-child(odd) { border-right: 1px solid var(--sonia-scheda-riga, rgba(132,105,85,.24)) !important; }
  #facilitiesAmenities .svc-tiles > [class*="col-"]:nth-last-child(-n+2) { border-bottom: 0 !important; }
  #facilitiesAmenities .svc-tile { padding: 1.1rem .6rem 1rem !important; gap: .35rem !important; }
  #facilitiesAmenities .svc-tile-icon { height: 2rem !important; font-size: 1.6rem !important; }
  #facilitiesAmenities .svc-tile-title { font-size: .95rem !important; line-height: 1.25; }
  #facilitiesAmenities .svc-tile-title::before { margin: .2rem auto .5rem !important; width: 22px !important; }
  #facilitiesAmenities .svc-tile-text { font-size: .85rem !important; line-height: 1.35; }
  /* Recensioni: frase sulle critiche piu' corta (2 righe) */
  .sonia-rev-critiche p { -webkit-box-orient: vertical; }
}

/* HOME SU TELEFONO - pagamenti (bozza 8a): due riquadri HTML al posto dell'immagine; testo lungo a 3 righe */
@media (max-width: 1199.98px) {
  #pagamenti .sonia-pay-img { display: none !important; }
  .sonia-pay-m { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 1rem; }
            #pagamenti .layered-card-inner p { -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
}

/* Pagamenti telefono (2): i due riquadri dicono gia' tutto -> paragrafi lunghi nascosti, niente "..." */
@media (max-width: 1199.98px) {
  #pagamenti .layered-card-inner p { display: none !important; }
  #pagamenti .layered-card-inner .btn { margin-top: .25rem; }
    }

/* Pagamenti telefono (3): testi dei riquadri piu' grandi, tolto il vuoto sotto il pulsante */
@media (max-width: 1199.98px) {
        #pagamenti .layered-card-inner .h-100.d-flex.align-items-center > div { padding-bottom: 1rem !important; margin-bottom: 0 !important; }
}

/* HOME SU TELEFONO - ultimi passi bozza 8a (11/10/2026)
   1) tre riquadri sotto la ricerca: bianchi, angoli vivi, come le altre schede
   2) footer compatto: tolti motto e colonna Utili (stanno nel menu), dati su righe strette */
@media (max-width: 1199.98px) {
  .hero-arch-contacts .service-featured-list > li > * , .hero-arch-contacts .service-featured-list .card {
    background: #fff !important; border-radius: 0 !important; border: 0 !important; box-shadow: 0 1px 3px rgba(59,42,30,.08) !important; }
  .hero-arch-contacts .service-featured-list i { color: var(--ss-marrone) !important; }

  #footer.sonia-foot { padding-top: 1.5rem !important; }
  #footer.sonia-foot .sonia-foot-motto { display: none !important; }
  #footer.sonia-foot .sonia-foot-cols > div:nth-child(2) { display: none !important; }
  #footer.sonia-foot .sonia-foot-logo { padding-bottom: 1rem !important; }
  #footer.sonia-foot .sonia-foot-cols { padding-bottom: 1rem !important; gap: 1rem !important; }
  #footer.sonia-foot .sonia-foot-lista { font-size: .9rem !important; gap: .15rem !important; }
  #footer.sonia-foot .sonia-foot-tit { margin-bottom: .35rem !important; }
  #footer.sonia-foot .sonia-foot-legali { font-size: .78rem !important; padding: .75rem 0 6.5rem !important; gap: .25rem !important; }
}

/* Telefono, ritocchi (11/10/2026, 2) */
@media (max-width: 1199.98px) {
  /* riquadri sotto la ricerca: bianchi ad angoli vivi (selettore piu' largo) */
  .hero-arch-contacts .service-featured-list > li > *, .hero-arch-contacts .service-featured-list > li > * > *:first-child:not(i):not(svg) {
    border-radius: 0 !important; }
  .hero-arch-contacts .service-featured-list > li > * { background: #fff !important; border-color: transparent !important; box-shadow: 0 1px 3px rgba(59,42,30,.08) !important; }
  /* Benvenuti / Posizione: niente vuoto sotto il testo accorciato */
  #about .layered-card-inner .h-100, #overview .layered-card-inner .h-100 { height: auto !important; min-height: 0 !important; }
  #about .layered-card-inner .h-100 > div, #overview .layered-card-inner .h-100 > div { padding-bottom: 1.25rem !important; margin-bottom: 0 !important; }
  /* footer: meno vuoto in fondo (basta lo spazio della barra) */
  #footer.sonia-foot .sonia-foot-legali { padding-bottom: 5rem !important; }
}

/* Telefono: i tre riquadri sotto la ricerca sono .ss-usp-v -> bianchi, angoli vivi, testo piu' compatto (11/10/2026) */

/* TELEFONO come la bozza 8a (11/10/2026): fondo crema unico, niente ombre ne' sfumature nelle cornici;
   tre riquadri sotto la ricerca: icona, valore grande, riga piccola */
@media (max-width: 1199.98px) {
  body, main, #about, #overview, #roomsSuites, #pagamenti, #facilitiesAmenities, #testimonials, .ss-usp { background: var(--ss-fondo) !important; }
  .layered-card::before, .layered-card::after { display: none !important; }
  .layered-card, .layered-card-inner, .ss-camera, .ss-usp-v, .sonia-camere-intro { box-shadow: none !important; }
  .layered-card { padding: 0 !important; margin-left: 0 !important; margin-right: 0 !important; }
  .ss-usp { gap: 8px !important; padding: 16px 12px 8px !important; }
        }

/* TELEFONO: intestazioni dei capitoli = solo titolo, come nella bozza 8a (niente titoletto, veli, sfumature) */
@media (max-width: 1199.98px) {
  .sonia-camere-intro { display: block !important; background: none !important; margin: 0 !important; padding: .25rem 0 .75rem !important; border: 0 !important; }
  .sonia-camere-intro-tit > span { display: none !important; }
  .sonia-camere-intro h2 { font: 500 22px/1.2 "Cinzel", serif !important; text-transform: none !important; letter-spacing: 0 !important; margin: 0 !important; color: #1f1712 !important; }
  .sonia-camere-intro-testo { display: none !important; }
  #roomsSuites, #pagamenti, #facilitiesAmenities, #testimonials, #overview { padding-top: 1.5rem !important; }
}

/* TELEFONO: "Dove siamo" come la bozza 8a; la scheda desktop resta nascosta */
.ss-dove { display: none; }

/* TELEFONO: tutti i titoli dei capitoli uguali a "Dove siamo" (senza velo, senza rientro) */
@media (max-width: 1199.98px) {
  html body #roomsSuites .sonia-camere-intro, html body #pagamenti .sonia-camere-intro,
  html body #facilitiesAmenities .sonia-camere-intro, html body #testimonials .sonia-camere-intro {
    background: none !important; margin: 0 !important; padding: .25rem 0 .75rem !important; box-shadow: none !important; }
  html body .sonia-camere-intro h2, .ss-dove-testa h2 { font: 500 22px/1.2 "Cinzel", serif !important; letter-spacing: 0 !important; }
}

/* TELEFONO: "Come paghi" come la bozza 8a */
.ss-paga { display: none; }

/* TELEFONO: "Dicono di noi" - riquadro delle critiche intero e separato, come una scheda a se' */
@media (max-width: 1199.98px) {
  .sonia-rev-critiche { border-top: 10px solid var(--ss-fondo) !important; padding: 16px !important; background: #fff; }
  .sonia-rev-critiche p { display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important;
    font-size: 15px !important; line-height: 1.55 !important; color: var(--ss-testo-bruno) !important; margin-bottom: 14px !important; }
  .sonia-rev-critiche p b, .sonia-rev-critiche p strong { color: #1f1712; font-weight: 600; }
  .sonia-rev-critiche .btn { width: 100%; border-radius: 0 !important; padding: 11px !important; font-size: 15px !important; }
}

/* TELEFONO: footer compatto come la bozza 8a; il resto del footer nascosto */
.ss-foot { display: none; }
@media (max-width: 1199.98px) {
  #footer.ss-foot-on { padding: 0 12px !important; background: var(--ss-fondo) !important; }
  #footer.ss-foot-on > .container > *:not(.ss-foot), #footer.ss-foot-on > *:not(.container):not(.ss-foot) { display: none !important; }
  .ss-foot { display: flex; flex-direction: column; gap: 14px; background: var(--ss-marrone-scuro); padding: 18px 16px 16px; margin: 1.5rem 0 6rem; text-align: center; }
  .ss-foot-btn { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .ss-foot-btn a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 8px; font: 500 16px Jost, sans-serif; color: #fff !important; text-decoration: none !important; }
  .ss-foot-tel { background: rgba(255,255,255,.12); }
  .ss-foot-wa { background: #285a35; }
  .ss-foot p { margin: 0; font: 300 14px/1.55 Jost, sans-serif; color: rgba(255,255,255,.85); }
  .ss-foot .sonia-foot-legali { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 4px 10px; padding: 0 !important; border: 0 !important; font: 300 12.5px Jost, sans-serif !important; color: rgba(255,255,255,.65) !important; }
  .ss-foot .sonia-foot-legali a { color: rgba(255,255,255,.75) !important; }
}

/* TELEFONO: footer compatto - tolto lo spazio vuoto (padding ereditato dalla riga legali e margini) */
@media (max-width: 1199.98px) {
  html body #footer.ss-foot-on { padding: 0 !important; margin: 0 !important; background: var(--ss-marrone-scuro) !important; }
  html body .ss-foot { margin: 0 !important; padding: 18px 16px 14px !important; gap: 12px !important; }
  html body #footer .ss-foot .sonia-foot-legali { padding: 0 !important; margin: 0 !important; }
}

/* TELEFONO (11/10/2026): schede centrate (tolto lo spostamento a destra della cornice sfalsata),
   pulsante Prenota della barra piu' piccolo e senza anello bianco, footer sopra la barra */
@media (max-width: 1199.98px) {
  html body .layered-card-inner, html body .layered-card > .row, html body .layered-card > div {
    margin-left: 0 !important; margin-right: 0 !important; left: 0 !important; right: 0 !important; transform: none !important; }
  html body .layered-card-inner { width: 100% !important; }
    }

/* TELEFONO: pulsanti tutti nel marrone delle bozze (var(--ss-marrone)), testo piu' grande; WhatsApp resta verde */
@media (max-width: 1199.98px) {
  html body .btn { font-size: 16px !important; font-weight: 500 !important; border-radius: 0 !important; }
  html body .ss-camera-btn .btn, html body .sonia-rev-critiche .btn { padding: 12px 8px !important; }
  html body .ss-foot { padding-bottom: calc(72px + env(safe-area-inset-bottom)) !important; }
}

/* TELEFONO: testo dei pulsanti semi-grassetto come nella bozza */
@media (max-width: 1199.98px) {
  html body .btn, html body .ss-foot-btn a { font-weight: 600 !important; letter-spacing: .01em !important; }
}

/* TELEFONO: prima schermata come la bozza 9a (11/10/2026)
   foto piu' bassa con la frase Careggi sopra, ricerca senza riquadro tondo, data scritta per esteso */

/* TELEFONO bozza 9a (v2) */

/* TELEFONO bozza 9a (v3): un solo margine laterale, fondo crema, campo data leggibile, pulsante marrone */
@media (max-width: 1199.98px) {
  #heroArchMobile, .hero-arch-mobile, .hero-carousel { background: var(--ss-fondo) !important; }
            }

/* TELEFONO bozza 9a (v4): tutto il blocco ricerca su crema, caselle bianche separate, pulsante marrone */

/* TELEFONO: "Cerca camere" nel marrone delle bozze - regola su id, piu' forte di quelle del tema; tolti i veli ::before/::after */
@media (max-width: 1199.98px) {
  html body #soniaCercaBtn#soniaCercaBtn { background: var(--ss-marrone) !important; background-color: var(--ss-marrone) !important; border-color: var(--ss-marrone) !important;
    color: #fff !important; opacity: 1 !important; filter: none !important; box-shadow: none !important; text-transform: none !important; }
  html body #soniaCercaBtn#soniaCercaBtn::before, html body #soniaCercaBtn#soniaCercaBtn::after { display: none !important; }
  html body #soniaCercaBtn#soniaCercaBtn:active { background-color: var(--ss-marrone-scuro) !important; }
}

@media (max-width: 1199.98px) {
  html body #soniaCercaBtn#soniaCercaBtn { display: flex !important; align-items: center; justify-content: center; gap: 10px; }
  #soniaCercaBtn .ss-lente { flex: none; }
}

/* TELEFONO bozza 9a (v5): caselle bianche separate (.ss-campo), niente riquadro bianco dietro */

/* TELEFONO: calendario delle date - ripristinato (fondo bianco, sopra a tutto, pulsanti del calendario normali) */
@media (max-width: 1199.98px) {
  html body .daterangepicker { background-color: #fff !important; z-index: 1060 !important; box-shadow: 0 6px 24px rgba(31,23,18,.18) !important; border: 1px solid var(--ss-riq-scuro) !important; }
  html body .daterangepicker .calendar-table { background-color: #fff !important; }
}

/* TELEFONO: ancore (es. Camere nella barra) - il titolo del capitolo resta visibile sotto l'intestazione fissa */
@media (max-width: 1199.98px) {
  #about, #roomsSuites, #overview, #pagamenti, #facilitiesAmenities, #testimonials, #checkRooms { scroll-margin-top: 72px !important; }
}

/* ancora Camere: titolo subito sotto l'intestazione (la sezione ha gia' ~80px di spazio sopra il titolo) */
@media (max-width: 1199.98px) {
  html { scroll-padding-top: 0 !important; }
  /* REGOLA QUI: piu' alto il numero = la pagina si ferma piu' in basso (piu' spazio sopra il titolo).
     72px = troppo spazio, 0px = titolo nascosto. Prova tra 20px e 50px. */
  html body #roomsSuites { scroll-margin-top: 64px !important; } /* valore scelto 11/10/2026 */
}

/* TELEFONO: dissolvenza dei tre riquadri sotto la ricerca */
@media (prefers-reduced-motion: reduce) { .ss-usp.ss-fade { opacity: 1 !important; transform: none !important; transition: none !important; } }

/* TELEFONO: tendina Adulti/Bambini larga quanto la casella, pulsanti - e + da app */

/* TELEFONO: niente striscia bianca sotto la casella ospiti - il bianco sta solo sui campi, alti uguali */

/* ==========================================================================
   PRENOTAZIONE SU TELEFONO (11/10/2026) - 4 passi come la home (sotto 768px)
   Camere disponibili (1) · Dati ospite (2) · Pagamento (3) · Conferma (4)
   Il body riceve .ss-pren e .ss-pren-N da sonia_app_sito.inc.php, che mette
   anche i passi con etichetta (.ss-passi) al posto della barra a pallini.
   Fondo crema, schede bianche senza ombre, angoli vivi, pulsanti var(--ss-marrone).
   ========================================================================== */
.ss-passi { display: none; }
@media (max-width: 1199.98px) {
  body.ss-pren, body.ss-pren main, body.ss-pren #pageTitle, body.ss-pren #reservation { background: var(--ss-fondo) !important; }

  /* titolo come i capitoli della home + passi con etichetta */
  body.ss-pren #pageTitle { padding-bottom: 0 !important; }
  body.ss-pren #pageTitle h1 { font: 500 22px/1.2 "Cinzel", serif !important; text-transform: none !important; letter-spacing: 0 !important; color: #1f1712 !important; margin: 0 0 14px !important; }
  body.ss-pren #pageTitle .row > .col-xl-6:nth-child(2) { display: none !important; }
  .ss-passi { display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; margin: 0 0 4px; padding: 0; counter-reset: none; }
  .ss-passi li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
  .ss-passi li + li::before { content: ""; position: absolute; right: 50%; width: 100%; height: 2px; background: #e0d6ca; z-index: 0; }
  .ss-passi b, .ss-passi a { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center;
    background: #fff; border: 2px solid #e0d6ca; color: #8a7766; font: 600 14px Jost, sans-serif; text-decoration: none !important; }
  .ss-passi li.is-fatto b, .ss-passi li.is-fatto a { color: #fff !important; }
  .ss-passi li.is-ora b { background: #fff; }
  .ss-passi span { font: 400 13px/1.2 Jost, sans-serif; color: #8a7766; }
  .ss-passi li.is-ora span { color: #1f1712; font-weight: 600; }
  body.ss-pren #reservation { padding-bottom: 24px !important; }

  /* schede: bianche, angoli vivi, niente bordi/ombre */
  body.ss-pren #reservation .card { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: #fff !important; }
  body.ss-pren #reservation .card-selected:not(.card-reserved)::before, body.ss-pren #reservation .card-selected:not(.card-reserved)::after { display: none !important; }
  body.ss-pren #reservation .card > .card-body { padding: 16px !important; }
  body.ss-pren #reservation .card h2.h4 { font: 600 17px/1.2 "Red Hat Text", sans-serif !important; text-transform: none !important; letter-spacing: .02em !important; color: #1f1712; }
  body.ss-pren #reservation .card hr { border-color: rgba(132,105,85,.24); opacity: 1; margin: 12px 0; }
  body.ss-pren #reservation .pb-8 { padding-bottom: 12px !important; }
  body.ss-pren #reservation .row.g-0 > [class*="col-"] { margin-bottom: 0; }

  /* campi e pulsanti */
  /* 24/10/2026: campi e caselle ora in sonia-app2.css (pagine v2) */
  body.ss-pren #reservation textarea.form-control { min-height: 72px; }
  body.ss-pren #reservation .form-label { font: 500 15px Jost, sans-serif; color: var(--ss-testo-bruno); margin-bottom: 4px; }
  body.ss-pren #reservation .form-range::-webkit-slider-thumb { background: var(--ss-marrone); }
  body.ss-pren #reservation .form-range::-moz-range-thumb { background: var(--ss-marrone); }
  body.ss-pren #reservation .btn { border-radius: 0 !important; box-shadow: none !important; min-height: 48px; }
  body.ss-pren #reservation .btn-outline-secondary { background: #fff !important; border: 1px solid var(--ss-marrone) !important; color: var(--ss-marrone) !important; }
  body.ss-pren #reservation a.text-secondary { color: var(--ss-marrone) !important; }

  /* passo 1: riepilogo ricerca a spigoli vivi, schede camera */
  body.ss-pren #availSummary { border-radius: 0 !important; border: 0 !important; padding: 10px 10px 10px 14px !important; margin-bottom: 14px !important; }
  body.ss-pren #availSearch { background: #fff; padding: 14px 14px 4px; margin-bottom: 14px !important; }
  body.ss-pren .card.card-selected { margin-bottom: 14px !important; }
  body.ss-pren .card.card-selected .card-title, body.ss-pren .card.card-selected .card-title a { font: 600 18px/1.2 "Red Hat Text", sans-serif !important; letter-spacing: .04em !important; color: #1f1712 !important; }
  body.ss-pren .card.card-selected .room-figure, body.ss-pren .card.card-selected .room-figure img { border-radius: 0 !important; }
  body.ss-pren .sonia-room-m-icons .hicon { color: var(--ss-marrone) !important; }
  body.ss-pren .sonia-room-m-pay > span { border: 0 !important; border-radius: 0 !important; background: #fbefec; color: #b03a2e !important; font-size: 13px !important; padding: 4px 10px !important; }
  body.ss-pren .card.card-selected .badge.bg-danger { border-radius: 0 !important; }
  body.ss-pren .card.card-selected del { color: #8a7766; }
  body.ss-pren .sonia-room-m-tax { color: #8a7766 !important; }

  /* passi 2-3: pulsante finale a tutta larghezza, accetto le condizioni sopra */
  body.ss-pren-2 #frmRegistration .d-flex.justify-content-between.flex-wrap { flex-direction: column; align-items: stretch !important; }
  body.ss-pren-2 #frmRegistration button[type="submit"], body.ss-pren-3 #reservation form .text-end .btn-primary { width: 100%; justify-content: center; }
  body.ss-pren-3 #reservation .text-end { text-align: left !important; }
  body.ss-pren-3 .sonia-tariffe { grid-template-columns: 1fr !important; }
  body.ss-pren-3 #reservation .sonia-offerta { color: #b03a2e; }
  body.ss-pren-3 #reservation form.row.g-2 .btn { min-height: 38px; }
  body.ss-pren-3 #reservation .alert { border-radius: 0; }

  /* passo 4 */
  body.ss-pren-4 #reservation .alert { border-radius: 0; border: 0; }
  body.ss-pren-4 #reservation .btn-primary { width: 100%; justify-content: center; }
}

/* ==========================================================================
   PRENOTAZIONE SU TELEFONO (2) - bozza 1a-1d approvata 11/10/2026
   Barra fissa .ss-avanti (totale + Continua) sopra il menu; strisce di riepilogo
   .ss-riep al posto delle schede Dettagli/I tuoi dati; tariffe compatte; codice
   sconto chiuso; orario a fasce; conferma in una scheda. Markup: handler_booking.php,
   handler_booking_checkout.php, booking_success.php, sonia_app_sito.inc.php.
   ========================================================================== */
.ss-riep-col, .ss-avanti, .ss-coupon-apri, .ss-ok-ico, .ss-ok-mie, .ss-fasce { display: none; }
@media (max-width: 1199.98px) {
  body.ss-pren .ss-solo-desk, body.ss-pren .ss-nasc { display: none !important; }

  /* barra fissa */
  .ss-avanti.is-on { position: fixed; }
  .ss-avanti-btn { border: 0; }
  .ss-avanti-btn:active { background: var(--ss-rosso-scuro); }
  /* con la barra: tondo del menu a filo (non sporge sulla barra), spazio in fondo alla pagina */
    body.ss-avanti-on { padding-bottom: calc(150px + env(safe-area-inset-bottom)) !important; }
  html body.ss-avanti-on .ss-foot { padding-bottom: calc(150px + env(safe-area-inset-bottom)) !important; }
  body.ss-pren-2.ss-avanti-on { padding-bottom: calc(176px + env(safe-area-inset-bottom)) !important; }
  html body.ss-pren-2.ss-avanti-on .ss-foot { padding-bottom: calc(176px + env(safe-area-inset-bottom)) !important; }

  /* strisce di riepilogo */
  body.ss-pren .ss-riep-col { display: flex; flex-direction: column; gap: 10px; }
  .ss-riep { background: #fff; display: flex; align-items: center; }
  .ss-riep > i, .ss-riep > div > i { color: var(--ss-marrone); flex: none; }
  .ss-riep > span { flex: 1; display: flex; flex-direction: column; min-width: 0; }
  .ss-riep b { font: 500 15px Jost, sans-serif; color: #1f1712; }
  .ss-riep small { font: 400 13px Jost, sans-serif; color: #8a7766; }
  .ss-riep > a { flex: none; border: 1px solid var(--ss-marrone); color: var(--ss-marrone) !important; font: 600 14px Jost, sans-serif; padding: 8px 12px; text-decoration: none !important; }
  .ss-riep-2 { flex-direction: column; align-items: stretch; gap: 0; padding: 4px 14px; }
  .ss-riep-2 > div { display: flex; align-items: center; gap: 10px; font: 400 14px Jost, sans-serif; color: var(--ss-testo-bruno); }
  .ss-riep-2 > div + div { border-top: 1px solid rgba(132,105,85,.18); }
  .ss-riep-2 > div > span { flex: 1; min-width: 0; }
  .ss-riep-2 > div > a { flex: none; color: var(--ss-marrone) !important; font: 600 13.5px Jost, sans-serif; text-decoration: none !important; }
  .ss-accedi { background: var(--ss-riq); padding: 11px 14px; display: flex; align-items: center; gap: 10px; font: 400 14.5px Jost, sans-serif; color: var(--ss-testo-bruno) !important; text-decoration: none !important; }
  .ss-accedi i { color: var(--ss-marrone); font-size: 18px; }
  .ss-accedi span { flex: 1; }
  .ss-accedi b { color: var(--ss-marrone); font-weight: 600; }

  /* passo 2: campi piu' compatti, orario a fasce */
  body.ss-pren-2 #frmRegistration .mb-4 { margin-bottom: 12px !important; }
  body.ss-pren-2 #frmRegistration hr { margin: 6px 0 14px !important; }
  .ss-fasce-on > .form-control, .ss-fasce-on > .form-range { display: none !important; }
  .ss-fasce { flex-wrap: wrap; }
  .ss-fasce button { border: 1.5px solid var(--ss2-line); background: #fff; color: var(--ss2-ink); font: 500 17px "Lexend", sans-serif; border-radius: 14px; min-height: 54px; } /* 24/10/2026: stile app v2 */
  .ss-fasce-on .invalid-feedback { order: 3; }

  /* passo 3: prima la scelta, poi codice sconto e conto (form "trasparente" per ordinare i pezzi) */
  body.ss-pren-3 #reservation .card > .card-body:has(.ss-conto) { display: flex; flex-direction: column; gap: 12px; }
  body.ss-pren-3 #reservation .card-body > form:has(.ss-conto) { display: contents; }
  body.ss-pren-3 .ss-pag-tit { order: 1; }
  body.ss-pren-3 .card-body > form > hr { display: none; }
  body.ss-pren-3 .ss-metodi { order: 2; margin-bottom: 0 !important; }
  body.ss-pren-3 .ss-coupon-apri { order: 3; display: flex; align-items: center; gap: 6px; background: none; border: 0; padding: 4px 0; font: 500 15px Jost, sans-serif; text-align: left; }
  body.ss-pren-3 .ss-coupon { order: 3; margin: 0 !important; }
  body.ss-pren-3 .ss-coupon:not(.is-aperto) { display: none !important; }
  body.ss-pren-3 .ss-conto { order: 4; margin: 0 !important; background: var(--ss-riq); padding: 10px 12px; font-size: 15px; }
  body.ss-pren-3 .ss-conto hr { margin: 8px 0 !important; }
  body.ss-pren-3 .ss-conto .fs-4 { font-size: 20px !important; }
  body.ss-pren-3 .ss-avanti-orig { order: 5; }
  body.ss-pren-3 #reservation .card .alert { order: 2; }
  /* tariffe come righe: pallino, titolo e righe a sinistra, prezzo a destra */
  body.ss-pren-3 .sonia-tariffe { gap: 10px !important; }
  body.ss-pren-3 .sonia-tariffa { display: grid !important; grid-template-columns: 1fr auto; column-gap: 12px; row-gap: 2px !important; align-items: start;
    padding: 12px 14px !important; border-width: 1px !important; }
  body.ss-pren-3 .sonia-tariffa > span:not([style*="position:absolute"]) { grid-column: 1; }
  body.ss-pren-3 .sonia-tariffa > span strong { font-size: 16px !important; }
  body.ss-pren-3 .sonia-tariffa ul { grid-column: 1; padding-left: 26px !important; font-size: 13.5px !important; line-height: 1.4 !important; color: var(--ss-testo2) !important; }
  body.ss-pren-3 .sonia-tariffa > strong.fs-5 { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin: 0 !important; font-size: 18px !important; }

  /* passo 4: una sola scheda */
  body.ss-pren-4 .ss-ok { background: #fff; padding: 22px 18px 18px; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
  body.ss-pren-4 .ss-ok-ico { display: flex; width: 56px; height: 56px; border-radius: 50%; background: #2e6b3f; color: #fff; align-items: center; justify-content: center; font-size: 28px; }
  body.ss-pren-4 .ss-ok .alert { background: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; color: var(--ss-testo-bruno) !important; font: 400 15px/1.5 Jost, sans-serif; text-align: center; }
  body.ss-pren-4 .ss-ok .alert::before, body.ss-pren-4 .ss-ok .alert > i:first-child, body.ss-pren-4 .ss-ok .alert img, body.ss-pren-4 .ss-ok .alert svg { display: none !important; }
  body.ss-pren-4 .ss-ok .alert b, body.ss-pren-4 .ss-ok .alert strong { display: block; margin: 8px 0 2px; padding: 10px; background: var(--ss-riq); font: 600 21px 'Red Hat Text', sans-serif; letter-spacing: .08em; color: #1f1712; }
  body.ss-pren-4 .ss-ok > p { width: 100%; margin: 4px 0 0 !important; background: #fdf6e8; border-left: 3px solid #c9a24a; padding: 10px 12px; font: 400 14px/1.45 Jost, sans-serif; color: #5a4410; text-align: left; }
  body.ss-pren-4 .ss-ok-btn { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px; margin-top: 6px; }
  body.ss-pren-4 .ss-ok-btn .btn { margin: 0 !important; width: 100%; justify-content: center; padding: 12px 8px !important; }
  body.ss-pren-4 .ss-ok-mie { display: flex !important; }
}

/* PRENOTAZIONE SU TELEFONO (3) - ritocchi dagli screenshot 11/10/2026 */
@media (max-width: 1199.98px) {
  /* spazio in fondo: lo da' solo il footer, alto quanto barra + menu (--ss-av messo da ssAvanti) */
  body.ss-avanti-on, body.ss-pren-2.ss-avanti-on { padding-bottom: 0 !important; }
  html body.ss-pren-4 .ss-foot { padding-bottom: calc(86px + env(safe-area-inset-bottom)) !important; }

  /* passo 3: righe delle tariffe piu' leggibili */
  body.ss-pren-3 .sonia-tariffa ul, body.ss-pren-3 .sonia-tariffa ul li { color: var(--ss-testo2) !important; }

  /* passo 4: i messaggi del sistema (.msg.success) senza riquadri ne' icone, dentro la scheda */
  body.ss-pren-4 .ss-ok .msg { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; width: 100%; text-align: center; }
  body.ss-pren-4 .ss-ok .msg::before, body.ss-pren-4 .ss-ok .msg::after, body.ss-pren-4 .ss-ok .msg p::before, body.ss-pren-4 .ss-ok .msg p::after { display: none !important; content: none !important; }
  body.ss-pren-4 .ss-ok .msg p { margin: 0 !important; padding: 0 !important; font: 400 15px/1.5 Jost, sans-serif !important; color: var(--ss-testo-bruno) !important; }
  body.ss-pren-4 .ss-ok .msg b, body.ss-pren-4 .ss-ok .msg strong { display: block; margin: 10px 0 0; padding: 10px; background: var(--ss-riq); font: 600 21px 'Red Hat Text', sans-serif !important; letter-spacing: .08em; color: #1f1712 !important; }
  /* "Email inviata": una riga piccola in verde */
  body.ss-pren-4 .ss-ok .msg + .msg p, body.ss-pren-4 .ss-ok .msg ~ * .msg p { font-size: 14px !important; color: #2e6b3f !important; }
  body.ss-pren-4 .ss-ok .msg + .msg p::before { content: "\2713  " !important; display: inline !important; }
  body.ss-pren-4 .ss-ok-ico { margin-bottom: 2px; }
}

/* PRENOTAZIONE SU TELEFONO (4) - pagina piu' snella, meno marrone (screenshot m_1, 11/10/2026) */
@media (max-width: 1199.98px) {
  /* importo in testata: solo testo */
  .ss-testa-imp.is-on { background: none !important; color: var(--ss-testo-bruno) !important; padding: 6px 4px !important; border-radius: 0 !important; }
  .ss-testa-imp.is-on svg { color: var(--ss-marrone); }
  /* tondo Prenota del menu: cerchio bianco, non pieno */
    }
@media (max-width: 1199.98px) {
  /* via titolo e passi: si parte subito dal contenuto */
  body.ss-pren #pageTitle { display: none !important; }
  body.ss-pren #reservation { padding-top: 12px !important; }
  /* Modifica del riepilogo: chiaro */
  /* barra fissa -> pulsante flottante a destra: "1 camera · €62,00 | Continua ->" */
  .ss-avanti-tx small { font-size: 12px !important; }
  .ss-avanti-tx b { font-size: 16px !important; }
  /* passo 2: Accetto i Termini di nuovo nel modulo */
}

/* PRENOTAZIONE SU TELEFONO (5) - Continua a forma di freccia, bianco (bozza 2a senza marrone, 11/10/2026).
   Sul telefono non siamo legati al marrone: fondi bianchi o tenui. */
@media (max-width: 1199.98px) {
  .ss-avanti.is-on { cursor: pointer; }
  .ss-avanti-r { justify-content: center; }
  .ss-avanti-tx { padding: 0 !important; }
  .ss-avanti-tx small:not(:empty) + b:not(:empty)::before { font-weight: 400; color: var(--ss-testo3); }
  .ss-avanti-btn { text-align: left; }
}

/* PRENOTAZIONE SU TELEFONO (6) - scheda camera (screenshot 11/10/2026):
   camere rimaste a nastro con risvolto, PayPal sulla foto, Prenota blu scuro */
@media (max-width: 1199.98px) {
  body.ss-pren .card.card-selected .room-figure { overflow: visible !important; position: relative; }
  body.ss-pren .card.card-selected .room-figure img { display: block; }
  /* nastro "N camere rimaste": esce dal bordo sinistro, risvolto sotto */
  body.ss-pren .card.card-selected .room-stock-badge {
    top: 12px !important;
    left: -8px !important;
    border-radius: 0 !important;
    background: #2e6b3f82 !important;
    color: #fff !important;
    font: 600 12px/1 Jost, sans-serif !important;
    letter-spacing: .04em;
    padding: 7px 12px 7px 14px !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    }
  body.ss-pren .card.card-selected .room-stock-badge::after { content: ""; position: absolute; left: 0; top: 100%;
    border-top: 6px solid #1c4428; border-left: 8px solid transparent; }
  body.ss-pren .card.card-selected .room-stock-badge-danger { background: #b03a2e !important; }
  body.ss-pren .card.card-selected .room-stock-badge-warning { background: #b8732e !important; }
  body.ss-pren .card.card-selected .room-stock-badge-muted { background: #6b6b6b !important; }
  /* PayPal sulla foto, in alto a destra alla stessa altezza */
  .ss-pay-foto {
    position: absolute;
    top: 12px;
    right: 10px;
    z-index: 2;
    color: #ffffff !important;
    font: 500 15px/1 Jost, sans-serif;
    padding: 7px 10px;
    }
  body.ss-pren .sonia-room-m-icons { margin-bottom: 0 !important; }
}

/* PRENOTAZIONE SU TELEFONO (7) - rifinitura scheda camera sul CSS di Fernando (11/10/2026) */
@media (max-width: 1199.98px) {
  /* risvolto trasparente come il nastro */
  body.ss-pren .card.card-selected .room-stock-badge::after { border-top-color: rgba(28,68,40,.6) !important; }
  body.ss-pren .card.card-selected .room-stock-badge-danger::after { border-top-color: rgba(122,39,31,.6) !important; }
  body.ss-pren .card.card-selected .room-stock-badge-warning::after { border-top-color: rgba(126,78,31,.6) !important; }
  body.ss-pren .card.card-selected .room-stock-badge-muted::after { border-top-color: rgba(68,68,68,.6) !important; }
  /* testo leggibile anche sulle foto chiare */
  body.ss-pren .card.card-selected .room-stock-badge, .ss-pay-foto { text-shadow: 0 1px 2px rgba(0,0,0,.45); }
  .ss-pay-foto { background: rgb(176 58 46 / 55%) !important; font-size: 13px !important; max-width: calc(100% - 150px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* -5% tenue: il blu di Prenota resta l unico colore pieno */
  body.ss-pren .card.card-selected .badge.bg-danger { background: #fbefec !important; color: #b03a2e !important; font-weight: 600; }
}
@media (max-width: 379.98px) {
  .ss-pay-foto { font-size: 12px !important; padding: 6px 8px !important; }
}

/* PRENOTAZIONE SU TELEFONO (8) - freccia Continua con carrello blu, sinistra arrotondata;
   niente lampo di titolo e passi al caricamento (11/10/2026) */
@media (max-width: 1199.98px) {
  /* il titolo si nasconde subito, senza aspettare lo script */
  main:has(#reservation) #pageTitle, main:has(#frmRegistration) #pageTitle { display: none !important; }
  .ss-avanti-r { position: relative; grid-template-columns: auto auto; grid-template-rows: auto auto; align-content: center; }
  .ss-avanti-r::after { content: ""; position: absolute; left: 100%; top: 0; width: 0; height: 0;
    border-top: 27px solid transparent; border-bottom: 27px solid transparent; border-left: 22px solid #fff; }
  .ss-avanti-ico { grid-row: 1 / span 2; grid-column: 1; display: flex; justify-content: center; font-style: normal; }
  .ss-avanti-tx { grid-column: 2; grid-row: 1; }
  .ss-avanti-btn { grid-column: 2; grid-row: 2; }
}

/* PRENOTAZIONE SU TELEFONO (9) - freccia e carrello piu' grandi (11/10/2026) */
@media (max-width: 1199.98px) {
  .ss-avanti-r { margin-right: 26px !important; column-gap: 12px !important; }
  .ss-avanti-r::after { border-top-width: 33px !important; border-bottom-width: 33px !important; border-left-width: 26px !important; }
  .ss-avanti-tx small, .ss-avanti-tx b { font-size: 13.5px !important; }
}

/* PRENOTAZIONE SU TELEFONO (10) - bozza 3a: durante la prenotazione il menu in basso diventa
   la barra del carrello: Home | carrello blu · camere · totale | freccia blu Continua.
   Sostituisce la freccia flottante; via l importo in testata (11/10/2026) */
@media (max-width: 1199.98px) {
  body.ss-avanti-on .ss-tab, body.ss-avanti-on .ss-testa-imp { display: none !important; }
  .ss-avanti.is-on { left: 0 !important; right: 0 !important; bottom: 0 !important; max-width: none !important; filter: none !important;
    display: flex !important; flex-direction: row !important; align-items: center; gap: 0 !important; border: 0 !important; box-shadow: 0 -4px 14px rgba(31,23,18,.06) !important; z-index: 1030; }
  .ss-avanti-home { flex: none; width: 56px; height: 52px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-decoration: none !important; font: 400 11px Jost, sans-serif; border-right: 1px solid var(--ss-riq-scuro); margin-right: 10px; }
  .ss-avanti-home svg { width: 24px; height: 24px; }
  .ss-avanti-r { flex: 1; min-width: 0; display: flex !important; flex-direction: row !important; align-items: center !important; margin: 0 !important; border-radius: 0 !important; clip-path: none !important; }
  .ss-avanti-r::after { display: none !important; }
  .ss-avanti-ico { flex: none; width: auto !important; height: auto !important; color: var(--ss-marrone-sec) !important; }
  .ss-avanti-ico svg { width: 30px !important; height: 30px !important; }
  .ss-avanti-tx { min-width: 0; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 0 !important; line-height: 1.2; }
  .ss-avanti-tx small { font: 400 12.5px Jost, sans-serif !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .ss-avanti-tx small:not(:empty) + b:not(:empty)::before { content: none !important; }
  .ss-avanti-tx b { font: 600 19px Jost, sans-serif !important; color: #1f1712 !important; white-space: nowrap; }
  .ss-avanti-btn { flex: none; position: relative;
    background: var(--ss-marrone-sec) !important; color: #fff !important; font: 600 16px Jost, sans-serif !important; border-radius: 0 !important; }
  .ss-avanti-btn::after { content: ""; position: absolute; left: 100%; top: 0; border-top: 24px solid transparent; border-bottom: 24px solid transparent; border-left: 16px solid var(--ss-rosso); }
  .ss-avanti-btn:active, .ss-avanti-btn:active::after { background: var(--ss-rosso-scuro) !important; border-left-color: var(--ss-rosso-scuro); }
  /* spazio in fondo alla pagina = altezza della barra */
}

/* PRENOTAZIONE SU TELEFONO (11) - Modifica in evidenza (blu, con matita) in tutti i riepiloghi (11/10/2026) */
@media (max-width: 1199.98px) {
  body.ss-pren #availSummary .avail-summary-btn, .ss-riep > a, .ss-riep-2 > div > a {
    display: inline-flex !important; align-items: center; gap: 6px; background: #fff !important; color: #6b4f3c !important;
    border: 1px solid var(--ss-marrone-sec) !important; border-radius: 0 !important; font: 600 14px Jost, sans-serif !important; padding: 8px 12px !important; text-decoration: none !important; }
  body.ss-pren #availSummary .avail-summary-btn::before, .ss-riep > a::before, .ss-riep-2 > div > a::before {
    content: ""; width: 14px; height: 14px; flex: none; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4l10.5-10.5a2.8 2.8 0 0 0-4-4L4 16v4'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4l10.5-10.5a2.8 2.8 0 0 0-4-4L4 16v4'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E") center / contain no-repeat; }
  .ss-riep-2 > div > a { padding: 5px 10px !important; font-size: 13px !important; }
  .ss-avanti-home span { font: 400 11px Jost, sans-serif; }
}

/* PRENOTAZIONE SU TELEFONO (12) - riepilogo staccato e piu' grande; orari su una riga (screenshot m_2, 11/10/2026) */
@media (max-width: 1199.98px) {
  body.ss-pren .ss-riep-col { margin-bottom: 16px !important; }
  .ss-riep { padding: 14px 12px 14px 14px !important; gap: 12px !important; border-bottom: 3px solid var(--ss-riq-scuro); }
  .ss-riep > i, .ss-riep > div > i { font-size: 24px !important; }
  .ss-riep b { font-size: 17px !important; font-weight: 600 !important; }
  .ss-riep small { font-size: 14.5px !important; margin-top: 2px; }
  .ss-riep-2 > div { font-size: 15.5px !important; padding: 11px 0 !important; }
  /* orari: cinque fasce sulla stessa riga, larghe uguali */
  .ss-fasce { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px !important; }
  .ss-fasce button { padding: 9px 2px !important; font-size: 16px !important; white-space: nowrap; text-align: center; }
}
@media (max-width: 359.98px) {
  .ss-fasce button { font-size: 13px !important; }
}

/* PRENOTAZIONE SU TELEFONO (13) - passo 3: scelta tariffa in blu come Continua (11/10/2026) */
@media (max-width: 1199.98px) {
  body.ss-pren-3 .ss-coupon-apri { color: var(--ss-marrone-sec) !important; }
  body.ss-pren-3 #reservation a:not(.btn):not(.ss-avanti-home) { color: var(--ss-marrone-sec); }
}

/* PRENOTAZIONE SU TELEFONO (14) - ritocchi da screenshot 12/10/2026: freccia non tagliata,
   blu al posto del marrone (fasce, Termini, conferma, Accedi), passo 4 ripulito */
@media (max-width: 1199.98px) {
  .ss-avanti.is-on { padding-right: 4px !important; }
  .ss-avanti-btn { padding: 0 4px 0 14px !important; }
  .ss-avanti-btn::after { border-left-width: 15px !important; }
  /* passo 2 */
  .ss-fasce button.is-on { background: var(--ss2-pri) !important; border-color: var(--ss2-pri) !important; color: #fff !important; font-weight: 600 !important; }
  /* passo 4 */
  body.ss-pren-4 .ss-ok-mail { display: flex; justify-content: center; align-items: center; gap: 6px; width: 100%; font: 500 15px Jost, sans-serif !important; color: #2e6b3f !important; margin: 2px 0 !important; text-align: center; }
  body.ss-pren-4 .ss-ok-btn .btn-primary { background: var(--ss-rosso) !important; border-color: var(--ss-rosso) !important; color: #fff !important; }
  body.ss-pren-4 .ss-ok-btn .btn-outline-primary { background: #fff !important; border: 1.5px solid var(--ss-marrone-sec) !important; color: #6b4f3c !important; }
  /* pagina Accedi (dal passo 2) */
  body.ss-login #login { background: var(--ss-fondo) !important; padding-top: 16px !important; padding-bottom: 24px !important; }
  body.ss-login #login .card { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
  body.ss-login #login .card-body { padding: 18px 16px !important; }
  body.ss-login #login h1 { font: 600 18px 'Red Hat Text', sans-serif !important; letter-spacing: .04em; }
  body.ss-login #login .form-control { border-radius: 0 !important; box-shadow: none !important; border: 1px solid #e0d6ca !important; min-height: 48px; font-size: 16px !important; }
  body.ss-login #login .mb-5 { margin-bottom: 14px !important; }
  body.ss-login #login .row:has(#chk_remember_me) { align-items: center; }
  body.ss-login #login .row:has(#chk_remember_me) > .col-6 { flex: 0 0 auto; width: auto; }
  body.ss-login #login .row:has(#chk_remember_me) > .col-6:last-child { margin-left: auto; }
  body.ss-login #login a { color: var(--ss-marrone-sec) !important; white-space: nowrap; }
  body.ss-login #login .form-check-input { border-radius: 0; }
  body.ss-login #login .form-check-input:checked { background-color: var(--ss-marrone-sec); border-color: var(--ss-marrone-sec); }
  body.ss-login #login #btnSubmit { width: 100% !important; min-height: 48px; border-radius: 0 !important; background: var(--ss-marrone) !important; border-color: var(--ss-marrone) !important; color: #fff !important; font-weight: 600; justify-content: center; }
}

/* (15) passo 3: camera su una riga, periodo sotto */

/* (16) barra in basso: riquadro azzurrino attorno a carrello, totale e Continua (bozza 3b); barra un po' piu' alta */
@media (max-width: 1199.98px) {
  .ss-avanti.is-on { padding: 8px 8px calc(8px + env(safe-area-inset-bottom)) 4px !important; }
  .ss-avanti-r { height: 64px !important; }
  .ss-avanti-tx small { color: var(--ss-marrone-scuro) !important; }
  .ss-avanti-btn { margin-right: 22px !important; }
  html body.ss-avanti-on .ss-foot, html body.ss-pren-2.ss-avanti-on .ss-foot { padding-bottom: calc(94px + env(safe-area-inset-bottom)) !important; }
}

/* (17) il colore azzurrino va su tutta la barra, senza riquadro interno */
@media (max-width: 1199.98px) {
  .ss-avanti-r { background: none !important; padding: 0 !important; }
}

/* (18) azzurrino solo dietro carrello e totale (annulla il fondo su tutta la barra) */
@media (max-width: 1199.98px) {
  .ss-avanti.is-on { background: #fff !important; border-top: 1px solid var(--ss-riq-scuro) !important; }
  .ss-avanti-home { border-right-color: var(--ss-riq-scuro) !important; color: var(--ss-testo3) !important; }
  .ss-avanti-r { gap: 0 !important; }
  .ss-avanti-ico, .ss-avanti-tx { background: var(--ss-riq); height: 54px !important; display: flex !important; }
  .ss-avanti-ico { padding: 0 8px 0 10px; align-items: center; }
  .ss-avanti-tx { justify-content: center; padding-right: 12px !important; margin-right: 10px; flex: 0 1 auto !important; }
  .ss-avanti-btn { margin-left: auto; }
}

/* Home telefono (12/10/2026, bozza "Offerta sulla foto" 4a): la banda rossa diventa un nastro
   trasversale nell'angolo in alto a sinistra della foto. Scritte e percentuale come prima. */
@media (max-width: 1199.98px) {
  #heroArchMobile { position: relative; }
          }

/* (19) passo 2: riepilogo su righe ordinate, Modifica sotto il testo (niente testo troncato) */
@media (max-width: 1199.98px) {
  .ss-riep:not(.ss-riep-2) { display: grid !important; grid-template-columns: auto minmax(0, 1fr); column-gap: 12px !important; row-gap: 10px !important; align-items: start !important; }
  .ss-riep:not(.ss-riep-2) > i { grid-column: 1; grid-row: 1; margin-top: 2px; }
  .ss-riep:not(.ss-riep-2) > span { grid-column: 2; grid-row: 1; }
  .ss-riep:not(.ss-riep-2) > a { grid-column: 2; grid-row: 2; justify-self: start; }
}

/* Home telefono 12/10/2026: ritorno al vecchio stile (scheda bianca "Quando arrivi?").
   Slogan sulla striscia crema sopra la foto, una riga; nastro dell offerta dentro la foto. */

/* Dettaglio camera 13/10/2026: barra fissa in alto con Scegli le date e Torna (solo sotto i 1200px) */
.sd-barra-fissa { position: fixed; left: 0; right: 0; z-index: 1020; background: #fff; padding: 10px 16px 6px;
  box-shadow: 0 6px 14px rgba(59,42,30,.12); transform: translateY(-120%); opacity: 0; pointer-events: none; transition: transform .2s ease, opacity .2s ease; }
.sd-barra-fissa.is-on { transform: none; opacity: 1; pointer-events: auto; }
.sd-barra-fissa .sd-barra-torna { display: block; width: 100%; background: none; border: 0; padding: 8px 0 4px;
  color: #6b4f3a; font-size: .9rem; font-weight: 500; }
@media (min-width: 1200px) { .sd-barra-fissa { display: none; } }
/* Camere disponibili: avviso "solo questa camera" con ritorno a tutte */
.ss-solo-camera { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px;
  background: var(--ss-riq); border: 1px solid var(--ss-riq-scuro); padding: 10px 14px; margin-bottom: 14px; color: var(--ss-testo-bruno); font-size: .95rem; }
.ss-solo-camera button { background: none; border: 0; padding: 0; color: #6b4f3a; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Camere disponibili 13/10/2026: arrivo da "Scegli le date e prenota": campo data evidenziato */
#txtCheckDate.ss-data-evid { border-color: var(--ss-marrone) !important; box-shadow: 0 0 0 3px rgba(122,92,69,.18) !important; }
#txtCheckDate.ss-data-evid::placeholder { color: var(--ss-testo-bruno); font-weight: 500; }

/* 13/10/2026: pagamento come testo rosso sotto il prezzo (tolta la pillola dalla foto) */
@media (max-width: 1199.98px) {
  .sonia-room-m-tax.ss-pay-txt, body.ss-pren .sonia-room-m-tax.ss-pay-txt { color: #b03a2e !important; font-size: .82rem; font-weight: 500; margin: 2px 0 0; }
}
/* Dettagli prenotazione: "Rimuovi" con la X, non solo la X */
.booking-details-remove.ss-rimuovi { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; margin-left: auto;
  padding: 3px 9px; border: 1px solid #e3b8b1; background: #fff; color: #b03a2e !important; font-size: .78rem; font-weight: 500;
  line-height: 1.3; text-decoration: none; letter-spacing: 0; text-transform: none; }
.booking-details-remove.ss-rimuovi:hover { background: #fbefec; border-color: #b03a2e; }
.booking-details-remove.ss-rimuovi .hicon { font-size: .8rem; }
/* Dettaglio camera, telefono 15/10/2026: meno spazio in alto, dati su una banda sulla foto, pillola in alto */
#detailRoom.sd .sd-banda { display: none; }
@media (max-width: 1199.98px) {
  #detailRoom.sd .sd-head { display: none !important; }
  #detailRoom.sd .sd-banda { display: flex; justify-content: center; gap: 2px 0; position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; color: #fff; font: 500 13px/1.3 Jost, sans-serif; pointer-events: none; }
  #detailRoom.sd .sd-banda li { display: flex; align-items: center; white-space: nowrap; }
  #detailRoom.sd .sd-banda li + li::before { content: ""; border-radius: 50%; }
  #detailRoom.sd .sd-nastro.sd-pillola { bottom: auto; }
  #detailRoom.sd .carousel-indicators { display: none !important; }
}
/* 15/10/2026: foto ancora piu in alto, banda dati su una riga */
@media (max-width: 1199.98px) {
  #detailRoom.sd { padding-top: 0 !important; }
  #detailRoom.sd > .container > .row, #detailRoom.sd .sd-gal { margin-top: 0 !important; padding-top: 0 !important; }
  #detailRoom.sd .sd-banda { flex-wrap: nowrap; }
}
/* 15/10/2026: valori scelti dall utente (bozza 2a) */
@media (max-width: 1199.98px) {
  #detailRoom.sd .sd-gal { margin-top: 1px !important; margin-left: calc(var(--bs-gutter-x, 1.5rem) * -.5) !important; margin-right: calc(var(--bs-gutter-x, 1.5rem) * -.5) !important; width: auto !important; max-width: none !important; }
  #detailRoom.sd .sd-gal .room-gallery-capped, #detailRoom.sd .sd-gal .carousel-inner { border-radius: 0 !important; }
  #detailRoom.sd .sd-nastro.sd-pillola { top: 15px; left: 15px; white-space: nowrap; }
}
/* telefoni stretti: la banda puo andare su due righe senza tagli */
@media (max-width: 399.98px) { #detailRoom.sd .sd-banda { flex-wrap: wrap; } }
/* 15/10/2026: spazio sotto il menu ridotto SOLO nella pagina dettaglio camera (telefono e tablet). Le altre pagine restano come sono */
@media (max-width: 1199.98px) { html:has(#detailRoom) { --hs-clear: 0.7rem; } }
/* 15/10/2026: banda e pillola piu leggibili; banda su una riga con meno spazio tra le voci */
@media (max-width: 1199.98px) {
  #detailRoom.sd .sd-banda { font-size: 15px; font-weight: 600; letter-spacing: -.01em; padding: 26px 4px 9px;
    background: linear-gradient(180deg, rgba(30,26,22,0) 0%, rgba(30,26,22,.82) 60%); text-shadow: 0 1px 2px rgba(0,0,0,.45); }
  #detailRoom.sd .sd-banda li + li::before { margin: 0 5px; width: 4px; height: 4px; background: #fff; }
  #detailRoom.sd .sd-nastro.sd-pillola { font-size: 14px; font-weight: 600; padding: 8px 13px; gap: 7px; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.18); }
  #detailRoom.sd .sd-nastro.sd-pillola::before { width: 8px; height: 8px; }
}
@media (max-width: 399.98px) { #detailRoom.sd .sd-banda { font-size: 13.5px; } #detailRoom.sd .sd-nastro.sd-pillola { font-size: 13px; } }
/* Contatti telefono 15/10/2026 (bozza 2b): striscia reception + schede a tutta larghezza */
.ss-ct-mob { display: none; }
@media (max-width: 1199.98px) {
  .ss-ct-mob { display: block; margin-bottom: 26px; }
  .ss-ct-desk, .col-xl-9 > .reception-hours-badge { display: none !important; }
  .ss-ct-mob .reception-hours-badge.rh-targa { display: grid !important; grid-template-columns: 1fr auto; grid-template-rows: auto auto; align-items: center; column-gap: 10px; row-gap: 2px;
    width: 100%; padding: 14px 16px !important; text-align: left !important; outline: 0; border: 1px solid var(--ss-bordo) !important; position: static !important; margin: 0 0 10px !important; }
  .ss-ct-mob .rh-targa .rh-tit { grid-column: 1; grid-row: 1; font-size: 12px; }
  .ss-ct-mob .rh-targa .rh-ore { grid-column: 1; grid-row: 2; font-size: 22px; gap: 8px; }
  .ss-ct-mob .rh-targa .rh-stato { grid-column: 2; grid-row: 1 / 3; font-size: 15px; font-weight: 600; white-space: nowrap; }
  .ss-ct-schede { display: flex; flex-direction: column; gap: 10px; }
  .ss-ct-scheda { display: flex; align-items: center; gap: 14px; padding: 16px; background: #fff; border: 1px solid var(--ss-bordo); text-decoration: none; color: var(--ss-testo); }
  .ss-ct-scheda:active { background: var(--ss-fondo); }
  .ss-ct-ico { width: 48px; height: 48px; flex: none; border-radius: 50%; background: var(--ss-riq); color: var(--ss-marrone-sec); display: flex; align-items: center; justify-content: center; font-size: 22px; }
  .ss-ct-txt { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
  .ss-ct-txt span { font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #9a7b5f; }
  .ss-ct-txt b { font-size: 20px; font-weight: 500; line-height: 1.25; color: var(--ss-testo); overflow-wrap: anywhere; }
  .ss-ct-fr { font-size: 28px; line-height: 1; color: #b9a68f; }
}
/* 15/10/2026: Contatti su telefono con lo stesso crema delle altre pagine (senza il velo 8% di bg-body-tertiary) */
@media (max-width: 1199.98px) { section#contact.bg-body-tertiary { background: var(--ss-fondo) !important; } }
/* 15/10/2026 Siamo qui: spazio sotto il menu ridotto solo in questa pagina (come dettaglio camera) */
@media (max-width: 1199.98px) { html:has(#doveSiamo) { --hs-clear: 0.7rem; } }

/* ==========================================================================
   20/10/2026: pagina Come arrivare (classi ss-ca2-*), versione telefono.
   Spostato qui da sonia.css: in sonia.css resta solo computer/tablet.
   ========================================================================== */
@media (max-width: 1199.98px){
.ss-ca2-hero-g{gap:20px}
.ss-ca2-ind b{font-size:17px}
.ss-ca2-ind span{font-size:14px}
.ss-ca2-az .btn{flex:1 1 0}
.ss-ca2-off{font-size:14px}
.ss-ca2-idx a span small{display:none}
.ss-ca2-via-g{display:flex;flex-direction:column;gap:12px}
.ss-ca2-via-t{display:contents}
.ss-ca2-via-p{order:2;padding-top:4px}
.ss-ca2-via-t .ss-ca2-az{order:3}
.ss-ca2-nota{margin-left:0}
.ss-ca2-nota div{flex-direction:column;gap:2px}
.ss-ca2-pausa .container > b{display:none}
.ss-ca2-pausa p{line-height:1.5}
.ss-ca2-pausa .btn{width:100%;justify-content:center}
.ss-ca2-altre-g{gap:12px}
.ss-ca2 .ss-ca-fondo{padding-bottom:24px}
}
@media (max-width: 1199.98px){
.ss-ca2-sky{right:-60px;top:20px}
.ss-ca2-off-c{border-width:3px}
}
@media (max-width: 1199.98px){
.ss-ca2-hero{display:flex;flex-direction:column;padding:20px 0 0}
.ss-ca2-hero > .container,.ss-ca2-hero-g{display:contents}
.ss-ca2-intro{order:1;padding:0 20px;gap:12px}
.ss-ca2-intro .ss-ca2-k{margin-top:0;font-size:12px;letter-spacing:.18em}
.ss-ca2-intro h1{font-size:32px}
.ss-ca2-lead{font-size:16px;font-weight:400;color:#3f3631;max-width:none;line-height:1.5}
.ss-ca2-az{flex-direction:column;align-self:stretch;gap:8px;margin-top:4px}
.ss-ca2-az .btn{width:100%;min-height:48px;font-size:16px;font-weight:500;white-space:nowrap;justify-content:center}
.ss-ca2-off{margin-top:6px;gap:12px}
.ss-ca2-off-c{width:58px;height:58px}
.ss-ca2-off-c b{font-size:17px}
.ss-ca2-off-c small{font-size:8px}
.ss-ca2-off-t > span{font-size:12px;letter-spacing:.16em}
.ss-ca2-off-t em{font-size:16px;font-weight:500}
.ss-ca2-sky{position:static;display:block;width:100%;height:auto;opacity:.4}
.ss-ca2-idx{margin:0;padding:20px 20px 24px;background:var(--ss-fondo);box-shadow:none;border-top:1px solid var(--ss-bordo)}
.ss-ca2-idx h2{padding:0 0 4px;font-size:21px}
.ss-ca2-idx-ind{padding:0 0 12px;font-size:14px;color:#6f635a}
.ss-ca2-idx a{background:#fff;height:54px;min-height:0;padding:0 16px;border:1px solid var(--ss-bordo);border-top:0}
.ss-ca2-idx h2 + .ss-ca2-idx-ind + a{border-top:1px solid var(--ss-bordo)}
.ss-ca2-idx a span b{font-size:16px;font-weight:500}
.ss-ca2-idx a em{font-size:18px}
.ss-ca2-via{padding:28px 0;border-top:1px solid var(--ss-bordo)}
.ss-ca2-via .container,.ss-ca2-altre .container,.ss-ca2-fine .container,.ss-ca2-pausa .container{padding-left:20px;padding-right:20px}
.ss-ca2-k{font-size:12px;letter-spacing:.16em}
.ss-ca2-via-t h2{font-size:24px;line-height:1.2}
.ss-ca2-via-t p{font-size:16px;font-weight:400;color:#3f3631}
.ss-ca2-tempo{border:0;padding:0;gap:10px;align-items:center}
.ss-ca2-tempo b{background:var(--ss-marrone-sec);color:#fff;font-size:18px;padding:4px 12px;line-height:1.3}
.ss-ca2-tempo span{font-size:15px;color:#5b5049}
.ss-ca2-passi li{padding:4px 0 18px 46px;gap:3px}
.ss-ca2-passi li::before{width:32px;height:32px;font-size:15px}
.ss-ca2-passi li::after{left:15px;top:38px}
.ss-ca2-passi li b{font-family:var(--bs-body-font-family) !important;font-size:16px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--ss-testo)}
.ss-ca2-passi li span{font-size:16px;font-weight:400;color:#3f3631;line-height:1.5}
.ss-ca2-nota{padding:12px 14px}
.ss-ca2-nota dd{font-size:15px;color:#3f3631;line-height:1.45}
.ss-ca2-via-t .ss-ca2-az{margin-top:2px}
.ss-ca2-pausa{padding:22px 0}
.ss-ca2-pausa h2{font-size:22px;text-transform:uppercase}
.ss-ca2-pausa p{font-size:16px;font-weight:400}
.ss-ca2-pausa .btn{min-height:48px;font-size:16px;font-weight:600;margin-top:6px}
.ss-ca2-altre{padding:28px 0}
.ss-ca2-altre .container > h2{font-size:22px;text-transform:uppercase;margin-bottom:12px}
.ss-ca2-mini{padding:18px 16px;gap:10px}
.ss-ca2-mini h3,.ss-ca2-mini header b{font-size:20px;text-transform:uppercase}
.ss-ca2-mini > small{font-size:15px;color:#6f635a;margin-top:-6px}
.ss-ca2-mini ol{border-top:0;padding-top:4px}
.ss-ca2-mini li{font-size:16px;line-height:1.5;color:#3f3631;padding-left:36px}
.ss-ca2-mini li::before{width:26px;height:26px;font-size:13px;border-width:1.5px}
.ss-ca2-mini footer{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:4px}
.ss-ca2-mini footer a{height:46px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:500;text-decoration:none !important;white-space:nowrap}
.ss-ca2-mini footer a:first-child{background:var(--ss-marrone-sec);color:#fff !important}
.ss-ca2-mini footer a + a{border:1px solid #b9a28c;color:#6e5645 !important;background:#fff}
.ss-ca2-fine{padding:28px 0 32px}
.ss-ca2 .ss-ca-fondo{display:none}
.ss-ca2-tel{display:flex;flex-direction:column;gap:6px}
.ss-ca2-tel-ind{font-size:18px;font-weight:600;color:var(--ss-testo)}
.ss-ca2-tel-sub{margin:0 0 8px;font-size:15px;line-height:1.5;color:#3f3631}
.ss-ca2-tess{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ss-ca2-tess a{border:1px solid #e2d6c7;background:#fff;padding:14px;display:flex;flex-direction:column;gap:2px;color:var(--ss-testo);text-decoration:none;min-width:0}
.ss-ca2-tess a b{font-size:16px;font-weight:600}
.ss-ca2-tess a span{font-size:13px;color:#6f635a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-ca2-tel-rec{margin-top:8px;background:var(--ss-riq);padding:14px 16px;font-size:15px;line-height:1.5;color:#3f3631}
.ss-ca2-tel-rec span{display:block;font-family:"Red Hat Text",sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ss-marrone-sec);padding-bottom:2px}
.ss-ca2 .ss-og-fam{margin-top:24px;flex-direction:column;align-items:stretch;padding:20px 16px;gap:12px}
.ss-ca2 .ss-og-fam h2{font-size:clamp(13px,3.9vw,17px);margin:0}
.ss-ca2 .ss-og-fam .btn{min-height:48px;width:100%;justify-content:center}
}

/* 20/10/2026: Come arrivare, telefono: ordine dei blocchi in testata = offerta, disegno di Firenze, titolo, testo, pulsanti, Da dove parti? */
@media (max-width: 1199.98px){
.ss-ca2-hero{padding-top:16px}
.ss-ca2-intro{display:contents}
.ss-ca2-intro > .ss-sq-bric,.ss-ca2-intro > .ss-ca2-k{display:none !important}
.ss-ca2-off{order:1;margin:0 20px}
.ss-ca2-sky{order:2;margin:4px 0 0}
.ss-ca2-intro h1{order:3;margin:-6px 20px 0;position:relative}
.ss-ca2-lead{order:4;margin:10px 20px 0}
.ss-ca2-intro > .ss-ca2-az{order:5;margin:16px 20px 22px;align-self:auto}
.ss-ca2-idx{order:6}
}

/* 20/10/2026: home telefono, link "Come arrivare" e "Condizioni" accanto ai titoli: piu visibili (erano quasi invisibili) */

/* 20/10/2026 (scelta cliente 5b): telefono, pulsanti var(--ss-rosso) al posto del marrone delle bozze; WhatsApp resta verde suo */
@media (max-width: 1199.98px) {
  html body .btn-primary, html body .ss-camera-btn .btn-primary, html body .ss-foot-tel { background: var(--ss-rosso) !important; border-color: var(--ss-rosso) !important; color: #fff !important; }
  html body .btn-primary:hover, html body .btn-primary:active { background: var(--ss-rosso-scuro) !important; border-color: var(--ss-rosso-scuro) !important; }
  html body .btn-outline-primary { background: #fff !important; border: 1px solid var(--ss-rosso) !important; color: var(--ss-rosso) !important; }
  html body .btn-outline-primary:hover, html body .btn-outline-primary:active { background: var(--ss-rosso) !important; color: #fff !important; }
    }

/* 20/10/2026: home telefono, Dove siamo: fascia "Come arrivare" sotto la mappa, ben visibile */

/* 20/10/2026: Siamo qui (dove-siamo-hotel-firenze-careggi.php), telefono riordinato:
   mappa senza vuoto sotto, legenda che non si sovrappone, recapiti su una riga da 4, schede senza foto tagliata, Come arrivare in evidenza */
@media (max-width: 1199.98px){
html body.ss-dq-pag .ss-sq-card .ss-sq-mappa{position:static !important;height:auto !important;min-height:0 !important;display:block !important;margin:0 !important}
html body.ss-dq-pag .ss-sq-card .ss-sq-mappa > a{height:auto !important;min-height:0 !important}
html body.ss-dq-pag .ss-sq-card .ss-sq-mappa img{height:230px !important;min-height:0 !important}
html body.ss-dq-pag .ss-sq-card .ss-sq-leg{position:static !important;display:grid !important;grid-template-columns:1fr 1fr;gap:8px 12px;margin:0;padding:12px 16px 4px !important;background:#fff !important;font-size:14px !important;inset:auto !important}
html body.ss-dq-pag .ss-sq-rec-riga{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:0 !important;margin:16px 0 !important;padding:12px 4px !important;background:#fff;border:1px solid var(--ss-bordo);box-shadow:none}
html body.ss-dq-pag .ss-sq-rec-riga .ss-sq-tile{flex-direction:column !important;align-items:center;gap:6px !important;padding:6px 2px !important;border:0 !important;min-height:0 !important}
html body.ss-dq-pag .ss-sq-rec-riga .ss-sq-ico{width:44px !important;height:44px !important;font-size:19px !important;border:1px solid #d9c9b6;background:none}
html body.ss-dq-pag .ss-sq-rec-riga .ss-sq-ico svg{width:20px;height:20px}
html body.ss-dq-pag .ss-sq-rec-riga .ss-sq-tt{align-items:center}
html body.ss-dq-pag .ss-sq-rec-riga .ss-sq-tt span{font-size:13px !important;font-weight:500 !important;letter-spacing:0 !important;text-transform:none !important;color:var(--ss-testo) !important;white-space:nowrap}
html body.ss-dq-pag .ss-sq-rec-riga .ss-sq-tt b{display:none !important}
html body.ss-dq-pag .ss-sq-prev{margin-top:0 !important;display:flex !important;flex-direction:column;gap:12px !important}
html body.ss-dq-pag .ss-sq-pv{display:block !important;background:#fff}
html body.ss-dq-pag .ss-sq-pv-foto{display:none !important}
html body.ss-dq-pag .ss-sq-pv-txt{padding:16px !important;gap:6px !important}
html body.ss-dq-pag .ss-sq-pv-txt h2{font-size:16px !important}
html body.ss-dq-pag .ss-sq-pv-txt p{font-size:15px !important;line-height:1.45 !important}
html body.ss-dq-pag .ss-sq-pv-txt > span{font-size:16px !important}
html body.ss-dq-pag .ss-sq-pv[href*="come-arrivare"]{order:-1;background:var(--ss-rosso) !important;border-color:var(--ss-rosso) !important}
html body.ss-dq-pag .ss-sq-pv[href*="come-arrivare"] .ss-sq-pv-txt h2,
html body.ss-dq-pag .ss-sq-pv[href*="come-arrivare"] .ss-sq-pv-txt p,
html body.ss-dq-pag .ss-sq-pv[href*="come-arrivare"] .ss-sq-pv-txt > span{color:#fff !important}
html body.ss-dq-pag .ss-sq-pv[href*="come-arrivare"]:active{background:var(--ss-rosso-scuro) !important}
html body.ss-dq-pag .ss-sq-corpo .ss-dq-cta{margin-top:16px !important}
}

/* 20/10/2026: pagine ospedale (ospedale-pagina.inc.php), telefono: riquadro Prenota la tua camera subito dopo il testo iniziale (prima era in fondo, dopo le domande) */

/* 20/10/2026: pagine ospedale, telefono: testata pulita = foto sola (con bollino) e sotto, su fondo bianco, titolo + frase. Tolte briciole, "Hotel Sonia · Firenze Careggi" e "Tariffe pensate per te" */

/* 21/10/2026: telefono, fascia distanze: "metri" leggibile (era 8px circa, troppo chiaro) */
@media (max-width: 1199.98px){
html body .ss-sq-dist b small{font-size:13px !important;font-weight:500 !important;color:var(--ss-testo3) !important;margin-left:4px !important;letter-spacing:.02em !important}
}

/* 21/10/2026: menu Per te e Siamo qui nel menu a tendina (sotto 1200px): le voci erano quasi invisibili (prendevano i colori chiari pensati per la testata scura sopra la foto) */
@media (max-width:1199.98px){
html body #header .ss-menu-perte .mega-menu-item,
html body #header .ss-menu-perte .mega-menu-item b,
html body #header .ss-menu-siamo3 .mega-menu-item{color:var(--ss-testo) !important;opacity:1 !important}
html body #header .ss-menu-perte .mega-menu-item small{color:var(--ss-testo3) !important}
html body #header .ss-menu-perte .ss-mn-tutte,html body #header .ss-menu-siamo3 .ss-mn-tutte,
html body #header .ss-menu-siamo3 .ss-ms-osp .mega-menu-item b{color:var(--ss-marrone-sec) !important}
html body #header .ss-menu-perte .mega-menu-item,html body #header .ss-menu-siamo3 .mega-menu-item{font-size:16px !important}
html body #header .ss-menu-siamo3 .ss-ms-box{margin:8px 0 4px}
}

/* 21/10/2026: menu del telefono su fondo bianco (prima crema scuro var(--ss-riq)); righe divisorie e titoli restano */
@media (max-width:1199.98px){
html body #offcanvasNavbar,html body #offcanvasNavbar .offcanvas-header,html body #offcanvasNavbar .offcanvas-body{background:#fff !important}
html body #offcanvasNavbar .offcanvas-header{border-bottom:1px solid var(--ss-riq)}
html body #offcanvasNavbar .ss-menu-siamo3 .ss-ms-box{background:var(--ss-riq) !important}
}

/* 21/10/2026: menu del telefono, la parte bassa (pulsanti, lingua, tema) non finisce piu sotto la barra .ss-tab */
@media (max-width:1199.98px){
html body #offcanvasNavbar{z-index:1050 !important}
html body #offcanvasNavbar .offcanvas-body{padding-bottom:calc(96px + env(safe-area-inset-bottom, 0px)) !important}
}

/* 21/10/2026: Ospedali vicini, telefono: foto in alto, titolo e testo sotto su bianco */
@media (max-width: 1199.98px){
.ss-ovh{background:#fff;padding-bottom:0}
.ss-ovh-foto{height:210px;padding-top:12px}
.ss-ovh-foto .ss-ov-bric{font-size:13px;padding:4px 12px}
.ss-ovh > .container{padding:0}
.ss-ovh-card{margin-top:0;box-shadow:none;padding:18px 20px 22px;gap:10px}
.ss-ovh-k{display:none}
.ss-ovh-card h1{font-size:26px;line-height:1.15}
.ss-ovh-lead{font:400 16px/1.55 Jost,sans-serif}
}

/* 21/10/2026: Ospedali vicini, telefono: i tre link della testata su una riga sola */
@media (max-width: 1199.98px){
html body .ss-ovh-card .ss-og-azioni .ss-og-link{font-size:14px !important;white-space:nowrap;letter-spacing:0}
}
@media (max-width:359.98px){
html body .ss-ovh-card .ss-og-azioni .ss-og-link{font-size:13px !important}
}

/* 21/10/2026: tendina Camere nel menu del telefono (sotto 1200px): elenco compatto, Come paghi sotto */
@media (max-width:1199.98px){
html body #offcanvasNavbar .ss-menu-camere{padding:4px 0 8px !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-k{display:none}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-paga .ss-mc-k{display:block;padding-bottom:4px}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-paga li{padding:4px 0}
}

/* 21/10/2026: tendina Camere nel menu del telefono: il menu e bianco, quindi colori chiari anche sopra la foto della Home (theme.js mette data-bs-theme=dark al menu) */
@media (max-width:1199.98px){
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-nome,
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-prezzo{color:var(--ss-testo) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-osp,
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-paga small{color:var(--ss-testo3) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-riga,
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-lista .ss-mc-tutte{border-color:var(--ss-riq) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-paga{background:var(--ss-riq) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-paga b{color:var(--ss-testo-bruno) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-menu-camere .ss-mc-tutte{color:var(--ss-marrone-sec) !important}
}

/* 22/10/2026: testata ospedale con prenotazione (bozza 5a): telefono in colonna, titolo, testo, coupon, prenotazione */
@media (max-width: 1199.98px){
.ss-ovh-riga{display:flex !important;flex-direction:column;gap:0}
.ss-ovh-pren{box-shadow:none;background:#fff;padding:0 20px 22px}
.ss-ovh-kriga{display:block}
.ss-ovh-card .ss-ovh-cp{display:flex !important;flex-wrap:wrap;gap:6px 10px;padding:8px 8px 8px 12px}
.ss-ovh-cp > span{flex:1;min-width:0;font-size:15px}
}

/* 22/10/2026: hotel-vicino-ospedale-careggi-firenze.php, contenuto (bozza 6b) su telefono: fondi bianchi o tenui */
@media (max-width: 1199.98px){
.ss-cr-num > div{padding:18px 6px}
.ss-cr-num b{font-size:32px}
.ss-cr-num b small{font-size:13px}
.ss-cr-num span{font-size:14px}
.ss-cr-num em{font-size:13px}
.ss-cr-corpo{background:#fff;padding:32px 0 48px}
.ss-cr-corpo .container{gap:32px}
.ss-cr-corpo h2{font-size:24px}
.ss-cr-perc{padding:0}
.ss-cr-breve{padding:22px 20px}
.ss-cr-breve dl > div{grid-template-columns:minmax(0,1fr);gap:2px}
.ss-cr-esenz{grid-template-columns:minmax(0,1fr);gap:14px;padding:22px 20px;box-shadow:none;background:var(--ss-riq)}
.ss-cr-esenz-ico{display:none}
.ss-cr-esenz .btn{white-space:normal}
.ss-cr-vic{padding:20px;flex-direction:column;gap:10px}
.ss-cr-vic .ss-cr-vic-arr{margin-left:0}
}

/* 22/10/2026: pagine "Hotel vicino a..." su telefono: link sulla prima riga, coupon a tutta larghezza sotto, senza freccia */
@media (max-width: 1199.98px){
html body .ss-ovh-card .ss-og-azioni{flex-wrap:wrap !important;justify-content:flex-start !important}
html body .ss-ovh-card .ss-og-azioni .ss-ovh-cp{flex:1 0 100% !important;order:3;margin:4px 0 0 !important;display:flex !important;flex-wrap:wrap;align-items:center;gap:6px 10px !important;padding:10px 12px !important;border:1.5px dashed #c9a47e !important;background:var(--ss-fondo) !important}
html body .ss-ovh-cp > span{flex:1 1 180px;min-width:0;font-size:15px !important;line-height:1.35 !important}
html body .ss-ovh-cp .ss-ovh-cp-ev,html body .ss-ovh-cp mark{font-family:inherit !important;font-size:inherit !important;white-space:normal}
html body .ss-ovh-cp-fr{display:none !important}
}
@media (max-width: 1199.98px){html body .ss-ovh-cp .ss-ovh-cp-ev,html body .ss-ovh-cp mark{background:none !important;padding:0 !important;color:inherit !important}} /* 22/10/2026: su telefono niente evidenziatore nel riquadro coupon */

/* 22/10/2026: pagine "Hotel vicino a..." su telefono, prima schermata (bozza 7a) */
@media (max-width: 1199.98px){
html body .ss-ovh-foto{height:200px !important;background-position:center 50% !important}
html body .ss-ovh-foto[style*="--ss-ovh-m"]{background-image:var(--ss-ovh-m) !important;background-size:cover !important;background-position:center !important}
html body .ss-ovh-card{padding:18px 20px 8px !important;gap:12px !important}
html body .ss-ovh-card .ss-og-azioni{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important}
html body .ss-ovh-card .ss-og-azioni > a.ss-og-link{height:48px;display:flex !important;align-items:center;justify-content:center;font:500 15px Jost,sans-serif !important;letter-spacing:0 !important;white-space:nowrap;text-decoration:none !important;border:1.5px solid var(--ss-marrone-sec);color:#6b4f3c !important;background:#fff}
html body .ss-ovh-card .ss-og-azioni > a.ss-og-link + a.ss-og-link{background:#285a35;border-color:#285a35;color:#fff !important}
html body .ss-ovh-card .ss-og-azioni .ss-ovh-cp{grid-column:1 / -1}
/* modulo di prenotazione con piu aria */
html body .ss-ovh-pren{padding:22px 20px 28px !important;gap:14px !important;border-top:1px solid var(--ss-riq)}
html body .ss-ovh-pren .ss-cg-form{gap:12px !important}
html body .ss-ovh-pren .ss-cg-date{gap:10px !important}
html body .ss-ovh-pren .ss-cg-form label{padding:10px 12px !important;gap:2px !important}
html body .ss-ovh-pren .ss-cg-dl .ss-cg-dtxt,html body .ss-ovh-pren .ss-cg-form select{font-size:16px !important}
html body .ss-ovh-pren .ss-cg-form .btn{height:52px;padding:0 12px !important;font-size:17px !important;margin-top:4px !important}
}

/* 23/10/2026: telefono. Menu Per te chiaro (l header e scuro, il menu laterale no) e + / - piu grandi */
@media (max-width:1199.98px){
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt,html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt-sei{background:#fff !important;border-color:var(--ss-riq) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt-sei,html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt-faq{padding:14px 0 14px 16px !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt .mega-menu-title{color:var(--ss-testo) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt .mega-menu-item,html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt-q b{color:var(--ss-testo) !important;opacity:1 !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt-q span{color:var(--ss-testo3) !important;opacity:1}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt .ss-mn-tutte{color:var(--ss-marrone-sec) !important}
html:not([data-bs-theme=dark]) #offcanvasNavbar .ss-pt-off{margin-left:16px;background:var(--ss-riq) !important}
html body #offcanvasNavbar .navbar-nav .dropdown-toggle-hover{padding-right:56px !important}
html body #offcanvasNavbar .navbar-nav .dropdown-toggle-hover .dropdown-toggle-icon{width:52px !important;height:52px !important;right:-8px !important;font-size:24px !important}
html body #offcanvasNavbar .navbar-nav .dropdown-toggle-icon,html body #offcanvasNavbar .navbar-nav [class*="toggle"] i{font-size:24px !important}
}

/* 23/10/2026: menu del telefono a schermate (bozza 11a). Voci grandi, nessun testo sotto i 16 px */
@keyframes ssDdIn{from{transform:translateX(100%)}to{transform:none}}
@media (max-width:1199.98px){
html body #offcanvasNavbar .offcanvas-body{position:relative}
/* elenco principale */
html body #offcanvasNavbar .navbar-nav > .nav-item > .nav-link{min-height:64px;display:flex !important;align-items:center;font-size:22px !important;letter-spacing:.01em !important;padding-top:0 !important;padding-bottom:0 !important}
html body #offcanvasNavbar .navbar-nav > .nav-item > .nav-link .dropdown-toggle-icon{width:48px !important;height:48px !important;right:-6px !important;font-size:0 !important}
html body #offcanvasNavbar .navbar-nav > .nav-item > .nav-link .dropdown-toggle-icon::before{content:"\203A" !important;font:300 34px/1 Jost,sans-serif !important;color:var(--ss-marrone-sec)}
html body #offcanvasNavbar .navbar-nav > .nav-item > .dropdown-menu{display:none !important}
/* schermata aperta */
/* dentro le schermate: caratteri piu grandi */
html body #offcanvasNavbar .ss-menu-camere .ss-mc-lista{padding:0 !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-riga{padding:14px 0 !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-nome{font-size:19px !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-prezzo{font-size:18px !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-osp{font-size:17px !important;font-weight:400 !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-sconto{font-size:17px !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-tutte{font-size:18px !important;font-weight:500 !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-paga{margin:14px 0 0 !important;padding:18px !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-paga b{font-size:18px !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-paga small{font-size:16px !important;font-weight:400 !important}
html body #offcanvasNavbar .ss-menu-camere .ss-mc-paga .ss-mc-k{font-size:15px !important}
html body #offcanvasNavbar .ss-menu-siamo3 .mega-menu-title,html body #offcanvasNavbar .ss-pt .mega-menu-title{font-size:19px !important;padding:14px 0 4px !important;margin:0 !important}
html body #offcanvasNavbar .ss-menu-siamo3 ul.ms-4,html body #offcanvasNavbar .ss-menu-siamo3 .ss-mn-tutte{margin-left:0 !important;padding-left:0 !important}
html body #offcanvasNavbar .ss-menu-siamo3 .mega-menu-item{font-size:18px !important;padding:11px 0 !important;min-height:48px;display:flex !important;align-items:center}
html body #offcanvasNavbar .ss-menu-siamo3 .ss-ms-osp .mega-menu-item b{font-size:17px !important}
html body #offcanvasNavbar .ss-menu-siamo3 .ss-mn-tutte{font-size:18px !important;margin-top:8px}
html body #offcanvasNavbar .ss-menu-siamo3 .ss-ms-box{margin:16px 0 0 !important;padding:18px !important}
html body #offcanvasNavbar .ss-menu-siamo3 .ss-ms-box span{font-size:19px !important}
html body #offcanvasNavbar .ss-menu-siamo3 .ss-ms-box small,html body #offcanvasNavbar .ss-menu-siamo3 .ss-ms-box b{font-size:17px !important}
html body #offcanvasNavbar .ss-pt-sei,html body #offcanvasNavbar .ss-pt-faq{padding:4px 0 10px !important;gap:6px !important}
html body #offcanvasNavbar .ss-pt .ss-pt-mot{font-size:19px !important;padding:10px 0 !important;min-height:48px;display:flex !important;align-items:center}
html body #offcanvasNavbar .ss-pt-faq-g{gap:14px !important}
html body #offcanvasNavbar .ss-pt-q b{font-size:18px !important}
html body #offcanvasNavbar .ss-pt-q span{font-size:16px !important;opacity:1 !important}
html body #offcanvasNavbar .ss-pt .ss-mn-tutte{font-size:18px !important}
html body #offcanvasNavbar .ss-pt-off{margin:14px 0 0 !important;padding:18px !important}
html body #offcanvasNavbar .ss-pt-off1 span{font-size:18px !important}
html body #offcanvasNavbar .ss-pt-anche,html body #offcanvasNavbar .ss-pt-pic a{font-size:16px !important}
html body #offcanvasNavbar .ss-pt-vedi{font-size:18px !important}
}
/* 23/10/2026: la schermata copre tutto il menu, non solo la riga */
/* 23/10/2026: barra indietro non trasparente, schermata che scorre fino in fondo, Verifica disponibilita in Camere */
/* 23/10/2026: barra indietro sempre sopra il contenuto (Per te); Verifica disponibilita sotto le camere, non fluttuante */
@media (max-width:1199.98px){
html body #offcanvasNavbar .ss-pt,html body #offcanvasNavbar .ss-pt > *{position:relative;z-index:0}
}
/* 23/10/2026 (bozza 12b): Chiama / WhatsApp / Posizione come tre tasti rotondi, piu in basso nel menu */
@media (max-width:1199.98px){
html body #offcanvasNavbar .offcanvas-body{display:flex !important;flex-direction:column}
html body #offcanvasNavbar .ss-oc-az{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
html body #offcanvasNavbar .ss-oc-t{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none !important}
html body #offcanvasNavbar .ss-oc-t span{width:60px;height:60px;border-radius:50%;border:1.5px solid var(--ss-marrone-sec);color:#6b4f3c;display:flex;align-items:center;justify-content:center;box-sizing:border-box;background:#fff}
html body #offcanvasNavbar .ss-oc-t b{font:500 16px Jost,sans-serif;color:var(--ss-testo)}
html body #offcanvasNavbar .ss-oc-t-wa span{background:var(--ss-wa);border-color:var(--ss-wa);color:#fff}
html body #offcanvasNavbar .ss-oc-t:active span{transform:scale(.94)}
html[data-bs-theme=dark] body #offcanvasNavbar .ss-oc-t b{color:var(--ss-riq)}
}
/* 23/10/2026: fondo pagina uguale al computer (var(--ss-fondo)) su tutte le pagine del telefono; riquadri var(--ss-riq).
   Tasti Chiama / WhatsApp / Posizione in fondo al menu, sopra Tema e lingua */
@media (max-width:1199.98px){
html body #offcanvasNavbar .ss-oc-az{order:99 !important;margin-top:auto !important;padding:24px 0 4px !important}
html body #offcanvasNavbar .offcanvas-body > .offcanvas-divider{order:98}
}
/* 23/10/2026 (bozza 13a): prenotazione senza il blu. Prenota / Continua / Conferma in rosso primario var(--ss-rosso),
   Modifica secondario bordato marrone, scelte (tariffa, orario, caselle) in marrone. Passi in rosso, testi da 16 px */
@media (max-width: 1199.98px) {
  .ss-passi b, .ss-passi a { width: 34px !important; height: 34px !important; font-size: 16px !important; }
  .ss-passi li + li::before { top: 16px !important; }
  .ss-passi span { font-size: 15px !important; }
  body.ss-pren #availSummary .avail-summary-btn, .ss-riep > a, .ss-riep-2 > div > a { min-height: 44px; font-size: 16px !important; font-weight: 500 !important; }
  .ss-avanti-btn { height: 52px !important; min-height: 52px !important; font-size: 18px !important; font-weight: 500 !important; }
  .ss-avanti-btn::after { border-top-width: 26px !important; border-bottom-width: 26px !important; border-left-color: var(--ss-rosso) !important; }
}
/* 23/10/2026: richiesta cliente. Pulsanti principali marrone come il template (var(--ss-marrone));
   il rosso var(--ss-rosso) resta solo al carrello: Continua nella barra in basso e conferma finale */
@media (max-width: 1199.98px) {
  .ss-passi li.is-fatto + li::before, .ss-passi li.is-ora::before { background: var(--ss-marrone) !important; }
  .ss-passi li.is-fatto b, .ss-passi li.is-fatto a { background: var(--ss-marrone) !important; border-color: var(--ss-marrone) !important; }
  .ss-passi li.is-ora b { border-color: var(--ss-marrone) !important; color: #1f1712 !important; }
}
/* ==========================================================================
   23/10/2026 RIORDINO passo 2: PULSANTI DELLA PRENOTAZIONE, una sola regola ciascuno
   (tolte le versioni precedenti sparse nel file). Marrone = primario, rosso = carrello.
   ========================================================================== */
@media (max-width: 1199.98px) {
  #reservation .room-book-btn.btn-secondary, .card.card-selected .room-book-btn.btn-secondary { background: var(--ss-marrone) !important; border-color: var(--ss-marrone) !important; color: #fff !important; border-radius: 0 !important; box-shadow: none !important; min-height: 52px; font: 500 18px Jost, sans-serif !important; }
  #reservation .room-book-btn.btn-secondary:active { background: var(--ss-marrone-scuro) !important; border-color: var(--ss-marrone-scuro) !important; }
  #reservation .room-book-btn.btn-outline-light { background: #fff !important; border: 1.5px solid var(--ss-marrone-sec) !important; color: var(--ss-marrone-scuro) !important; border-radius: 0 !important; }
  #availSummary .avail-summary-btn { display: inline-flex !important; align-items: center; gap: 6px; min-height: 44px; background: #fff !important; color: var(--ss-marrone-scuro) !important; border: 1.5px solid var(--ss-marrone-sec) !important; border-radius: 0 !important; padding: 8px 14px !important; font: 500 16px Jost, sans-serif !important; }
  .ss-avanti .ss-avanti-btn { background: var(--ss-rosso) !important; border-color: var(--ss-rosso) !important; color: #fff !important; }
  .ss-avanti .ss-avanti-btn::after { border-left-color: var(--ss-rosso) !important; }
  .ss-avanti .ss-avanti-btn:active { background: var(--ss-rosso-scuro) !important; }
  .ss-avanti .ss-avanti-btn:active::after { border-left-color: var(--ss-rosso-scuro) !important; }
}