/* RoomRent - noleggio sale
 *
 * Questo foglio NON ridefinisce la grafica: si appoggia a quello di
 * Rentalis (ng.css), che viene caricato prima come dipendenza. Qui ci
 * sono solo il calendario e le poche cose che li' non esistono, cosi'
 * le due pagine si somigliano e il CSS personalizzato scritto nelle
 * impostazioni di Rentalis vale anche per le sale.
 */

.rr-sala { max-width: 62rem; }
.rr-foto { width: 100%; height: auto; display: block; border-radius: .5rem; margin-bottom: 1rem; }
.rr-vuoto { color: #666; }
.rr-diagnosi { font-size: .85rem; background: #fff8e1; padding: .75rem 1rem; border-radius: .375rem; }

.rr-sommario { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: .25rem 0 1rem; }
.rr-prezzo { font-size: 1.35rem; margin: 0 0 1rem; }
.rr-prezzo small { font-size: .9rem; opacity: .7; }
.rr-nota { display: block; font-size: .85rem; opacity: .7; font-weight: 400; }

.rr-step { margin-top: 1.5rem; }
.rr-fatto .ng-step-n { opacity: .5; }
.rr-nascosto { display: none; }

/* --- calendario --- */

.rr-cal-testata {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1rem; margin: 1rem 0 .5rem; font-size: 1.1rem; font-weight: 600;
}
.rr-cal-testata .rr-btn-nav {
    -webkit-appearance: none; appearance: none; box-sizing: border-box;
    display: flex; align-items: center; justify-content: center;
    width: 2.5rem; height: 2.5rem; padding: 0; margin: 0; min-width: 0;
    border: 1px solid rgba(0,0,0,.15); border-radius: 50%;
    background: transparent; color: inherit; cursor: pointer; line-height: 1;
}
.rr-cal-testata .rr-btn-nav:hover { background: rgba(0,0,0,.06); }

.rr-cal-giorni { display: grid; grid-template-columns: repeat(7, 1fr); gap: .35rem; }
.rr-cal-int {
    text-align: center; font-size: .75rem; text-transform: uppercase;
    letter-spacing: .04em; opacity: .55; padding-bottom: .25rem;
}
.rr-cal-vuota { min-height: 62px; }

.rr-cal-g {
    -webkit-appearance: none; appearance: none; box-sizing: border-box;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-height: 62px; padding: .25rem; margin: 0; min-width: 0;
    border: 1px solid rgba(0,0,0,.1); border-radius: .375rem;
    background: #f6f6f7; color: inherit; font: inherit; line-height: 1.2;
}
.rr-cal-n { font-weight: 600; }
.rr-cal-p { font-size: .72rem; opacity: .7; }

.rr-libero { background: #eaf7ee; border-color: #bfe3c9; cursor: pointer; }
.rr-libero:hover, .rr-libero:focus-visible { background: #d8f0e1; }
.rr-no { opacity: .45; cursor: not-allowed; }
.rr-scelto { outline: 2px solid #2b6cb0; outline-offset: 1px; }

.rr-legenda { display: flex; gap: 1rem; align-items: center; font-size: .85rem; margin-top: .6rem; opacity: .75; }
.rr-l { display: inline-block; width: .9rem; height: .9rem; border-radius: .2rem; vertical-align: -1px; margin-right: .25rem; }
.rr-l-libero { background: #eaf7ee; border: 1px solid #bfe3c9; }
.rr-l-no { background: #f6f6f7; border: 1px solid #ddd; }

/* --- modulo --- */

.rr-nascosto { display: none; }
.rr-form { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(0,0,0,.1); }
.rr-form label { display: block; margin-bottom: .75rem; }
.rr-form input, .rr-form textarea { width: 100%; }
.rr-riga2 { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.rr-scelto { font-size: 1.05rem; }

.rr-btn {
    -webkit-appearance: none; appearance: none; box-sizing: border-box;
    display: inline-block; padding: .7rem 1.4rem; border: 0; border-radius: .375rem;
    background: #2b6cb0; color: #fff; font: inherit; cursor: pointer;
}
.rr-btn:hover { background: #245a94; }
.rr-btn[disabled] { opacity: .6; cursor: default; }
.rr-btn-link { background: none; color: #2b6cb0; padding: .25rem .5rem; text-decoration: underline; }

/* --- le mie prenotazioni --- */

.rr-pren {
    display: flex; align-items: center; gap: 1rem;
    padding: .75rem 0; border-bottom: 1px solid rgba(0,0,0,.08);
}
.rr-pren-info { flex: 1; }
.rr-st-annullata { opacity: .5; }

.rr-regolamento { margin-top: 1.5rem; }
.rr-regolamento summary { cursor: pointer; font-weight: 600; }

@media (max-width: 560px) {
    .rr-riga2 { grid-template-columns: 1fr; }
    .rr-cal-g, .rr-cal-vuota { min-height: 50px; }
    .rr-cal-p { display: none; }
}


/* ------------------------------------------------------------------
   Rete di sicurezza: se Rentalis NON e' installato, ng.css non c'e'.
   Queste poche regole tengono la pagina leggibile lo stesso.
   ------------------------------------------------------------------ */

.ng-nascosto { display: none; }
.ng-disabilitato { opacity: .45; pointer-events: none; }
.ng-slide { overflow: hidden; max-height: 3000px; opacity: 1;
            transition: max-height .35s ease, opacity .25s ease; }
.ng-slide.ng-chiuso { max-height: 0; opacity: 0; pointer-events: none; }
.ng-step-n { display: inline-flex; align-items: center; justify-content: center;
             width: 1.6rem; height: 1.6rem; border-radius: 50%;
             background: currentColor; color: #fff; font-size: .85rem; margin-right: .5rem; }
.ng-step-n::after { content: ''; }
.ng-form label { display: block; margin-bottom: .75rem; }
.ng-form input, .ng-form textarea, .ng-form select { width: 100%; }
.ng-riga2 { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.ng-riga3 { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: .75rem; }
.ng-separatore { display: flex; align-items: center; gap: .75rem;
                 margin: 1.4rem 0 1rem; color: #8a8f98; font-size: .9rem; }
.ng-separatore::before, .ng-separatore::after {
    content: ''; flex: 1; height: 1px; background: currentColor; opacity: .3; }
.ng-nota-sezione { margin: 1.2rem 0 .4rem; font-weight: 600; }
.ng-lead { margin: 0 0 .25rem; }

@media (max-width: 560px) {
    .ng-riga2, .ng-riga3 { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .ng-slide { transition: none; } }


/* ------------------------------------------------------------------
   Se lo shortcode finisce dentro un blocco Tabella dell'editor
   (<table class="has-fixed-layout">), il tema gli disegna intorno i
   bordi della tabella e stringe le colonne. Capita spesso, perche' in
   Gutenberg la tabella e' un modo comodo per impaginare.
   Qui si neutralizza: il riquadro della sala torna a larghezza piena
   e senza cornice, ovunque sia stato incollato.
   ------------------------------------------------------------------ */

table .rr-sala,
td .rr-sala,
th .rr-sala {
    max-width: 100%;
}
td:has(.rr-sala),
th:has(.rr-sala) {
    border: 0 !important;
    padding: 0 !important;
    background: none !important;
}
table:has(.rr-sala) {
    border: 0 !important;
    border-collapse: collapse;
    table-layout: auto !important;
    width: 100% !important;
    background: none !important;
}
table:has(.rr-sala) tr,
table:has(.rr-sala) tbody {
    border: 0 !important;
    background: none !important;
}


/* UI v1.2 — stessa scala visiva di Giò Party / Rentalis */
.rr-sala{--rr-ink:#161a37;--rr-accent:#f0448b;--rr-line:rgba(22,26,55,.16)}
.rr-form input,.rr-form textarea,.rr-form select,.rr-sala .ng-form input,.rr-sala .ng-form textarea,.rr-sala .ng-form select{box-sizing:border-box;width:100%;min-height:54px;padding:0 16px;border:1px solid var(--rr-line);border-radius:14px;background:#fff;color:var(--rr-ink);font:inherit}.rr-form textarea,.rr-sala .ng-form textarea{padding:13px 16px;min-height:105px}.rr-form input:focus,.rr-form select:focus,.rr-form textarea:focus,.rr-sala .ng-form input:focus{outline:0;border-color:var(--rr-accent);box-shadow:0 0 0 4px rgba(240,68,139,.09)}.rr-btn{min-height:50px;padding:0 20px;border-radius:999px;background:var(--rr-accent);font-weight:750}.rr-btn:hover{background:#d93b7c}.rr-cal-g{border-radius:12px;transition:.15s transform,.15s box-shadow}.rr-libero:hover{transform:translateY(-2px);box-shadow:0 7px 18px rgba(22,26,55,.08)}


/* ==================================================================
   UI v1.3 — sessione condivisa e conferma sala
   ================================================================== */
.rr-session-loading{margin:18px 0;padding:14px 18px;border-radius:18px;background:#f7f8fb;color:#6b6f80;font-size:.88rem}.rr-session-ok{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:18px 0;padding:15px 18px;border:1px solid rgba(35,166,95,.24);border-radius:18px;background:#f2fbf6;color:#174f32;font-size:.92rem}.rr-session-ok b{color:#126b3d}.rr-session-ok button{border:0;background:none;text-decoration:underline;color:#6b6f80;font:inherit;font-size:.82rem;cursor:pointer}.rr-session-ok.rr-nascosto{display:none!important}
.rr-confirm{text-align:center;max-width:820px;margin:0 auto;padding:36px 0 20px;color:#161a37}.rr-confirm__icon{display:grid;place-items:center;width:82px;height:82px;margin:0 auto 20px;border-radius:50%;background:#effbf4;color:#159052;font-size:38px;font-weight:950;box-shadow:0 0 0 10px rgba(21,144,82,.07)}.rr-confirm__eyebrow{margin:0 0 9px;font-size:.73rem;font-weight:900;letter-spacing:.16em;color:#f0448b}.rr-confirm h1{margin:0;font-size:clamp(2.4rem,6vw,4.8rem);line-height:.96;letter-spacing:-.055em}.rr-confirm__lead{max-width:620px;margin:18px auto 28px;color:#6b6f80;font-size:1.05rem;line-height:1.65}.rr-confirm__card{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;text-align:left;padding:14px;border:1px solid rgba(22,26,55,.1);border-radius:24px;background:#f7f8fb}.rr-confirm__card>div,.rr-confirm__card:not(:has(>div)){padding:16px 18px;border-radius:16px;background:#fff}.rr-confirm__card span{display:block;margin-bottom:5px;color:#8a8f9f;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.rr-confirm__card strong{display:block;font-size:1.02rem}.rr-confirm__card small{display:block;margin-top:5px;color:#777}
@media(max-width:680px){.rr-session-ok{align-items:flex-start;flex-direction:column;gap:7px}.rr-session-ok button{padding:0}.rr-confirm__card{grid-template-columns:1fr 1fr}}
@media(max-width:460px){.rr-confirm__card{grid-template-columns:1fr}}


/* UI v1.3.2 — checkbox/radio non devono ereditare le dimensioni dei campi testo */
.rr-sala .rr-form input[type="checkbox"],
.rr-sala .rr-form input[type="radio"],
.rr-sala .ng-form input[type="checkbox"],
.rr-sala .ng-form input[type="radio"]{
    -webkit-appearance:none;appearance:none;box-sizing:border-box;
    flex:0 0 20px;width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;
    margin:1px 0 0!important;padding:0!important;border:2px solid #a6a9b5!important;background:#fff!important;box-shadow:none!important;
}
.rr-sala .rr-form input[type="checkbox"],.rr-sala .ng-form input[type="checkbox"]{border-radius:6px!important}
.rr-sala .rr-form input[type="checkbox"]:checked,.rr-sala .ng-form input[type="checkbox"]:checked{border-color:#f0448b!important;background-color:#f0448b!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.3 8.2 14l7.3-8' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;background-position:center!important;background-repeat:no-repeat!important;background-size:16px 16px!important;box-shadow:none!important}
.rr-sala .rr-form input[type="radio"],.rr-sala .ng-form input[type="radio"]{border-radius:50%!important}
.rr-sala .rr-form input[type="radio"]:checked,.rr-sala .ng-form input[type="radio"]:checked{border:6px solid #f0448b!important}
.rr-sala label.ng-check{display:flex!important;flex-direction:row!important;align-items:flex-start!important;gap:10px!important;line-height:1.35}