/* =====================================================================
   richiesta-veloce-lista.css  (25/10/2026, richiesta di Andrea - M1)
   Bottone "Preventivo" sulle card delle liste Dormire (.pc-quick) e
   finestra con il mini form della sidebar della scheda (.rvl).
   Le regole del form sono COPIATE da scheda-dettaglio.css (sidebar
   .elm-side-form) e limitate a .rvl: stessa resa, nessun effetto sul resto.
   Markup: App_Code/RichiestaVeloceLista.cs - script: App_Script/richiesta-veloce-lista.js
   ===================================================================== */

/* ---------- BOTTONE SULLA CARD ---------- */
/* 25/10/2026 (Andrea, versione scelta alle 23:50): bottone LARGO QUANTO LA
   CARD, in fondo, con la scritta sempre visibile ("Richiedi preventivo" /
   "Request a quote" / "Angebot anfordern" / "Demander un devis").
   Bordo rosso sottile su bianco (resta secondario rispetto alla card, che
   apre la scheda), si riempie solo al passaggio del mouse. Niente animazione.
   La riga e' l'ultimo figlio della card (dopo .pc-body): su desktop la card e'
   in colonna e .pc-body (flex:1) la spinge in fondo; su telefono (card a
   griglia foto|testo) occupa tutta la larghezza sotto foto e testo. */
.p-card .pc-quick-row {
    padding: 0 16px 14px;      /* come i lati di .pc-body */
}
.p-card .pc-quick {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    width: 100%;
    height: 38px;
    padding: 0 12px;
    border: 1.5px solid var(--cta-red);
    border-radius: var(--r-btn, 8px);
    background: #fff;
    color: var(--cta-red);
    font-family: inherit;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease;
}
.p-card .pc-quick .bi { flex: none; font-size: .95rem; line-height: 1; }
.p-card .pc-quick span { overflow: hidden; text-overflow: ellipsis; }
@media (hover: hover) {
    .p-card .pc-quick:hover { background: var(--cta-red); color: #fff; }
}
.p-card .pc-quick:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
/* telefono e tablet: card a griglia (foto | testo) -> il bottone va a capo e prende tutta la larghezza */
@media (max-width: 991.98px) {
    #main-content > section .p-card .pc-quick-row { grid-column: 1 / -1; padding: 10px 10px 10px; }
    #main-content > section .p-card .pc-quick { height: 40px; }
}
/* modalita' mappa (card compatte): niente bottone, come il cuore */
#main-content.elm-split-active .p-card .pc-quick-row { display: none; }

/* ---------- FINESTRA ---------- */
.rvl { position: fixed; inset: 0; z-index: 100002; display: flex; align-items: center; justify-content: center; padding: 16px; }
.rvl[hidden] { display: none; }
.rvl-bg { position: absolute; inset: 0; background: rgba(20,18,15,.55); }
.rvl-pan { position: relative; width: 100%; max-width: 400px; max-height: calc(100vh - 32px); overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.rvl-pan:focus { outline: none; }
.rvl-x { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border: none; border-radius: 50%; background: var(--ivory); color: var(--ink); font-size: 1rem; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; z-index: 2; }
.rvl-x:hover { background: var(--line); }
.rvl .elm-side-form-head .ti { font-style: italic; }
.rvl .rvl-chev { float: right; color: var(--ink-3); }
body.rvl-aperta { overflow: hidden; }
body.rvl-aperta .flatpickr-calendar { z-index: 100005; }
@media (max-width: 640px) {
    .rvl { align-items: flex-end; padding: 0; }
    .rvl-pan { max-width: none; max-height: 92vh; border-radius: 14px 14px 0 0; }
}

/* ---------- FORM: copia della sidebar (scheda-dettaglio.css) ---------- */
.rvl .elm-side-form, .rvl.elm-side-form, .rvl-pan.elm-side-form { background: #fff; border-radius: 10px; box-shadow: 0 20px 50px -20px rgba(10,10,10,.18); }
.rvl .elm-side-form-head { padding: 1.4rem 1.4rem 1rem; text-align: center; }
.rvl .elm-side-form-head .lb { font-size: .75rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-dk); margin-bottom: .4rem; }
.rvl .elm-side-form-head .ti { font-family: 'Lora', serif; font-weight: 500; font-size: 1.4rem; color: var(--ink); line-height: 1.15; margin: 0; }
.rvl .elm-side-form-body { padding: 0 1.4rem 1.4rem; }
.rvl .elm-tm-submit { width: 100%; background: var(--cta-red); color: #fff; padding: 1rem .8rem; font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; border: 1.5px solid var(--cta-red); border-radius: var(--r-btn, 8px); cursor: pointer; margin-top: .7rem; transition: background .2s, color .2s, border; }
.rvl .elm-tm-submit:hover { background: #fff; color: var(--cta-red); border-color: var(--cta-red); transform: translateY(-2px); box-shadow: 0 16px 32px rgba(223,104,52,.32); }
.rvl .elm-tm-submit:disabled { opacity: .6; cursor: wait; transform: none; box-shadow: none; }
.rvl .elm-side-form-foot { padding: .85rem 1.2rem; background: var(--ivory); border-top: 1px solid var(--line); font-size: .78rem; color: var(--ink-2); line-height: 1.4; display: flex; flex-direction: column; gap: .5rem; }
.rvl .elm-side-form-foot strong { color: var(--ink-2); font-weight: 700; }
.rvl .elm-trust-row { display: flex; align-items: center; gap: .55rem; }
.rvl .elm-trust-row i { flex-shrink: 0; font-size: 1.05rem; color: var(--gold-dk); width: 1.6rem; height: 1.6rem; display: inline-flex; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--line); border-radius: 50%; }
.rvl .elm-fld-lb { display: block; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-2); font-weight: 600; margin: .85rem 0 .3rem; }
.rvl .elm-fld-lb i { margin-right: .3rem; color: var(--gold-dk); }
.rvl .elm-fld { display: block; width: 100%; box-sizing: border-box; font-family: inherit; font-size: .88rem; padding: .6rem .8rem; border: 1.5px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); transition: border-color .15s, box-shadow .15s; }
.rvl .elm-fld:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(184,140,79,.14); }
.rvl .elm-fld::placeholder { color: #b8b3aa; font-weight: 400; }
.rvl input.elm-fld[readonly] { cursor: pointer; background: #fff; }
.rvl .elm-sb-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.rvl .elm-guests-wrap { position: relative; }
.rvl .elm-guests-display { text-align: left; cursor: pointer; }
.rvl .elm-guests-display:hover { border-color: var(--gold-lt); }
.rvl .elm-guests-popup { position: absolute; top: calc(100% + .4rem); left: 0; right: 0; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: .9rem; box-shadow: 0 12px 32px rgba(0,0,0,.14); z-index: 30; }
.rvl .elm-guests-popup[hidden] { display: none; }
.rvl .elm-guests-row { display: flex; justify-content: space-between; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--line-soft, #f1eee8); }
.rvl .elm-guests-row:last-of-type { border-bottom: none; }
.rvl .elm-guests-lb { font-size: .85rem; color: var(--ink); font-weight: 600; }
.rvl .elm-guests-lb small { font-size: .75rem; color: var(--ink-3); font-weight: 400; }
.rvl .elm-guests-ctrl { display: flex; align-items: center; gap: .6rem; }
.rvl .elm-g-minus, .rvl .elm-g-plus { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid var(--gold-dk); background: #fff; color: var(--gold-dk); font-size: 1rem; font-weight: 700; cursor: pointer; line-height: 1; transition: background .15s, color .15s; padding: 0; }
.rvl .elm-g-minus:hover, .rvl .elm-g-plus:hover { background: var(--gold-dk); color: #fff; }
.rvl .elm-g-minus:disabled { opacity: .3; cursor: not-allowed; }
.rvl .elm-g-val { min-width: 18px; text-align: center; font-weight: 700; color: var(--ink); font-size: .95rem; }
.rvl .elm-guests-close { display: block; width: 100%; margin-top: .7rem; padding: .5rem; background: var(--ink); color: #fff; border: none; border-radius: 6px; font-size: .82rem; font-weight: 600; cursor: pointer; }
.rvl .elm-guests-close:hover { background: var(--gold-dk); }
.rvl .elm-fld-privacy { display: flex; align-items: flex-start; gap: .4rem; font-size: .75rem; color: var(--ink-3); margin: .9rem 0 .8rem; line-height: 1.4; cursor: pointer; text-transform: none; letter-spacing: 0; }
.rvl .elm-fld-privacy input { margin-top: .15rem; accent-color: var(--gold-dk); }
.rvl .elm-fld-privacy a { color: var(--gold-dk); text-decoration: underline; }
.rvl .elm-sb-detail-link { display: block; text-align: center; margin-top: .9rem; font-size: .78rem; color: var(--ink-3); text-decoration: none; padding: .5rem; border-top: 1px dashed var(--line); padding-top: .8rem; }
.rvl .elm-sb-detail-link strong { color: var(--gold-dk); font-weight: 600; }
.rvl .elm-sb-detail-link:hover strong { color: var(--ink); }
.rvl .elm-sb-status { margin-top: .7rem; padding: .65rem .8rem; border-radius: 8px; font-size: .82rem; font-weight: 500; }
.rvl .elm-sb-status[hidden] { display: none; }
.rvl .elm-sb-status.is-error { background: #fdeaea; color: #a51d23; border: 1px solid #f1a8ab; }
.rvl .elm-sb-status.is-loading { background: #fff8e7; color: #7a5b14; border: 1px solid #f0d99c; }

/* ---------- ESITO POSITIVO ---------- */
.rvl .rvl-ok { text-align: center; padding: .6rem 0 .2rem; }
.rvl .rvl-ok[hidden] { display: none; }
.rvl .rvl-ok > .bi { font-size: 2.4rem; color: #2e7d32; }
.rvl .rvl-ok-t { font-family: 'Lora', serif; font-size: 1.25rem; color: var(--ink); margin: .5rem 0 .3rem; }
.rvl .rvl-ok-s { font-size: .88rem; color: var(--ink-2); line-height: 1.5; margin: 0 0 .6rem; }

/* telefono: pannello che sale dal basso (dopo le regole del form, cosi' vince sul raggio) */
@media (max-width: 640px) {
    .rvl-pan.elm-side-form { border-radius: 14px 14px 0 0; box-shadow: 0 -10px 40px rgba(10,10,10,.25); }
}