/* ═══════════════════════════════════════════════════════════
   Raízes do Sobreiro — janela de reserva em dois passos
   Módulo autónomo. Depende apenas das variáveis de cor e
   tipografia definidas em styles.css.
   ═══════════════════════════════════════════════════════════ */

/* ── secção de reservas na página ─────────────────────── */
.alcova__facts{
  list-style:none; margin:2rem 0 1.8rem; padding:0;
  display:grid; gap:0; border-top:1px solid var(--linha-cl);
}
.alcova__facts li{
  padding:.85rem 0; border-bottom:1px solid var(--linha-cl);
  display:grid; gap:.1rem;
}
.alcova__facts b{
  font-family:var(--disp); font-weight:400; font-size:1rem; color:var(--creme-cl);
}
.alcova__facts span{ font-size:.88rem; color:rgba(239,233,223,.62) }
@media (min-width:640px){
  .alcova__facts{
    grid-template-columns:repeat(3,1fr); gap:0 1.5rem;
    border-bottom:1px solid var(--linha-cl);
  }
  .alcova__facts li{ border-bottom:0 }
}
.alcova__cta{ display:flex; flex-wrap:wrap; gap:.7rem; margin-bottom:1rem }

/* ── janela ───────────────────────────────────────────── */
.rv{
  position:fixed; inset:0; z-index:300;
  display:flex; align-items:center; justify-content:center;
  padding:clamp(0px,3vw,24px);
}
.rv[hidden]{ display:none }

.rv__scrim{
  position:absolute; inset:0;
  background:rgba(32,34,27,.62);
  backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);
  animation:rvFade .2s ease-out;
}

.rv__panel{
  position:relative; z-index:1;
  width:100%; max-width:620px; max-height:min(94vh,860px);
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--creme); color:var(--carvao);
  border:1px solid rgba(87,92,74,.28);
  border-radius:22px;
  box-shadow:0 30px 70px rgba(28,30,24,.42);
  animation:rvUp .24s cubic-bezier(.2,.8,.3,1);
}

@keyframes rvFade{ from{ opacity:0 } to{ opacity:1 } }
@keyframes rvUp{
  from{ opacity:0; transform:translateY(14px) scale(.985) }
  to{ opacity:1; transform:none }
}

/* ── cabeçalho ────────────────────────────────────────── */
.rv__head{
  display:flex; align-items:center; gap:.9rem; flex:none;
  padding:1.15rem 1.4rem 1rem;
  border-bottom:1px solid var(--linha);
}
.rv__badge{
  width:44px; height:44px; border-radius:50%; flex:none;
  background:var(--oliva); color:var(--areia-cl);
  display:grid; place-items:center;
}
.rv__badge svg{ width:100%; height:100% }
.rv__title{ flex:1; min-width:0 }
.rv__eyebrow{
  margin:0; font-family:var(--disp); font-size:.62rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--oliva); opacity:.8;
}
.rv__h{
  margin:.15rem 0 0; font-family:var(--disp); font-weight:300;
  font-size:1.65rem; line-height:1; color:var(--oliva-esc);
}
.rv__x{
  flex:none; width:38px; height:38px; border-radius:50%; cursor:pointer;
  background:transparent; border:1px solid var(--linha); color:var(--oliva-esc);
  font-size:1.4rem; line-height:1; display:grid; place-items:center;
  transition:background-color .16s, border-color .16s;
}
.rv__x:hover{ background:var(--areia); border-color:var(--areia) }

/* ── passos ───────────────────────────────────────────── */
.rv__steps{
  display:flex; gap:.5rem; flex:none;
  padding:.85rem 1.4rem; border-bottom:1px solid var(--linha);
}
.rv__step{
  flex:1; display:flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.55rem .8rem; border-radius:999px; cursor:pointer;
  background:transparent; border:1px solid var(--linha);
  font-family:var(--disp); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--oliva);
  transition:background-color .18s, color .18s, border-color .18s;
}
.rv__step i{
  width:19px; height:19px; border-radius:50%; flex:none;
  display:grid; place-items:center; font-style:normal; font-size:.68rem;
  border:1px solid currentColor;
}
.rv__step.is-on{ background:var(--oliva); border-color:var(--oliva); color:var(--creme-cl) }
.rv__step.is-on i{ background:var(--brasa); border-color:var(--brasa); color:#FFF }
.rv__step[disabled]{ opacity:.4; cursor:default }

/* ── corpo ────────────────────────────────────────────── */
.rv__body{ flex:1; overflow-y:auto; padding:1.35rem 1.4rem 1.5rem }
.rv__pane{ display:grid; gap:1.5rem }
.rv__grp{ display:grid; gap:.6rem }
.rv__lbl{
  margin:0; font-family:var(--disp); font-size:.68rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--oliva);
}

/* pessoas */
.rv__pax{ display:flex; flex-wrap:wrap; gap:.4rem }
.rv__pax button{
  min-width:46px; height:46px; padding:0 .7rem; cursor:pointer;
  border-radius:12px; border:1px solid var(--linha); background:var(--creme-cl);
  font-family:var(--disp); font-size:1.02rem; color:var(--oliva-esc);
  transition:background-color .16s, color .16s, border-color .16s, transform .16s;
}
.rv__pax button:hover{ border-color:var(--oliva); transform:translateY(-1px) }
.rv__pax button.is-on{ background:var(--oliva); border-color:var(--oliva); color:var(--creme-cl) }
.rv__mais{
  display:inline-flex; align-items:center; gap:.6rem; margin-top:.2rem;
  font-family:var(--disp); font-size:.76rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--oliva);
}
.rv__mais select{
  border-radius:10px; border:1px solid var(--linha); background:var(--creme-cl);
  padding:.4rem .6rem; font-family:var(--disp); color:var(--oliva-esc); cursor:pointer;
}

/* dias */
.rv__dias{
  display:flex; gap:.45rem; overflow-x:auto; padding-bottom:.5rem;
  scroll-snap-type:x proximity; scrollbar-width:thin;
  scrollbar-color:rgba(87,92,74,.35) transparent;
}
.rv__dias::-webkit-scrollbar{ height:6px }
.rv__dias::-webkit-scrollbar-thumb{ background:rgba(87,92,74,.3); border-radius:99px }
.rv__dias button{
  flex:none; width:76px; padding:.55rem .3rem .5rem; cursor:pointer;
  scroll-snap-align:start; text-align:center;
  border-radius:12px; border:1px solid var(--linha); background:var(--creme-cl);
  display:grid; gap:.05rem; color:var(--oliva-esc);
  transition:background-color .16s, color .16s, border-color .16s;
}
.rv__dias button em{
  font-style:normal; font-family:var(--disp); font-size:.58rem;
  letter-spacing:.14em; text-transform:uppercase; opacity:.7;
}
.rv__dias button b{ font-family:var(--disp); font-weight:400; font-size:1.3rem; line-height:1.15 }
.rv__dias button i{
  font-style:normal; font-family:var(--disp); font-size:.56rem;
  letter-spacing:.14em; text-transform:uppercase; opacity:.6;
}
.rv__dias button:not([disabled]):hover{ border-color:var(--oliva) }
.rv__dias button.is-on{ background:var(--oliva); border-color:var(--oliva); color:var(--creme-cl) }
.rv__dias button[disabled]{ opacity:.34; cursor:not-allowed; background:transparent }
.rv__dias button.is-fechado i{ color:var(--brasa); opacity:.95 }

/* horas */
.rv__horas{ display:flex; flex-wrap:wrap; gap:.4rem }
.rv__horas button{
  padding:.55rem .95rem; cursor:pointer; border-radius:10px;
  border:1px solid var(--linha); background:var(--creme-cl);
  font-family:var(--body); font-size:.95rem; color:var(--oliva-esc);
  font-variant-numeric:tabular-nums;
  transition:background-color .16s, color .16s, border-color .16s;
}
.rv__horas button:not([disabled]):hover{ border-color:var(--oliva) }
.rv__horas button.is-on{ background:var(--oliva); border-color:var(--oliva); color:var(--creme-cl) }
.rv__horas button[disabled]{ opacity:.3; cursor:not-allowed }
.rv__servico{
  width:100%; margin:.3rem 0 -.1rem; font-family:var(--disp);
  font-size:.62rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--oliva); opacity:.75;
}
.rv__vazio{ margin:0; font-size:.88rem; color:var(--brasa) }
.rv__dica{ margin:0; font-size:.88rem; color:var(--oliva); opacity:.65 }

/* zona */
.rv__zona{ display:flex; flex-wrap:wrap; gap:.4rem }
.rv__z{
  padding:.5rem 1rem; cursor:pointer; border-radius:999px;
  border:1px solid var(--linha); background:var(--creme-cl);
  font-size:.9rem; color:var(--oliva-esc);
  transition:background-color .16s, color .16s, border-color .16s;
}
.rv__z:hover{ border-color:var(--oliva) }
.rv__z.is-on{ background:var(--oliva); border-color:var(--oliva); color:var(--creme-cl) }

/* ── passo 2 ──────────────────────────────────────────── */
.rv__f{ display:grid; gap:.35rem; align-content:start; min-width:0 }
.rv__f label{
  font-family:var(--disp); font-size:.68rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--oliva);
}
.rv__f input,.rv__f textarea{
  width:100%; padding:.75rem .9rem; font-size:1rem; font-family:var(--body);
  color:var(--carvao); background:var(--creme-cl);
  border:1px solid var(--linha); border-radius:12px;
  transition:border-color .16s, background-color .16s;
}
.rv__f textarea{ resize:vertical; min-height:82px }
.rv__f input::placeholder,.rv__f textarea::placeholder{ color:rgba(35,36,30,.36) }
.rv__f input:focus,.rv__f textarea:focus{ outline:none; border-color:var(--oliva); background:#FFF }
.rv__f2{ display:grid; gap:1.5rem }
@media (min-width:520px){ .rv__f2{ grid-template-columns:1fr 1fr; gap:1rem } }
.rv__f.is-bad input,.rv__f.is-bad textarea{ border-color:var(--brasa); background:rgba(184,92,42,.06) }
.rv__err{ margin:0; font-size:.8rem; color:var(--brasa) }
.rv__err:empty{ display:none }

.rv__rgpd{
  display:flex; align-items:flex-start; gap:.65rem; cursor:pointer;
  font-size:.9rem; line-height:1.5; color:rgba(35,36,30,.8);
}
.rv__rgpd input{
  margin-top:.22rem; width:17px; height:17px;
  accent-color:var(--oliva); flex:none; cursor:pointer;
}
.rv__rgpd.is-bad{ color:var(--brasa) }

/* ── rodapé ───────────────────────────────────────────── */
.rv__foot{
  flex:none; display:flex; align-items:center; gap:.7rem;
  padding:.9rem 1.4rem; border-top:1px solid var(--linha); background:var(--creme-cl);
}
.rv__resumo{
  flex:1; margin:0; font-size:.8rem; line-height:1.45; color:var(--oliva); min-width:0;
}
.rv__resumo b{
  display:block; font-family:var(--disp); font-weight:400; font-size:.92rem;
  color:var(--oliva-esc); font-variant-numeric:tabular-nums;
}
.rv__acoes{ display:flex; gap:.5rem; flex:none }
.rv__foot .btn[disabled]{ opacity:.38; pointer-events:none }

/* ── passo 3 ──────────────────────────────────────────── */
.rv__done{ text-align:center; justify-items:center; gap:.9rem; padding:.5rem 0 }
.rv__seal{ width:58px; height:58px; color:var(--oliva) }
.rv__doneT{
  margin:0; font-family:var(--disp); font-weight:300;
  font-size:1.9rem; line-height:1.1; color:var(--oliva-esc);
}
.rv__doneS{ margin:0; font-size:.96rem; color:rgba(35,36,30,.75); max-width:44ch }
.rv__lista{
  width:100%; margin:.2rem 0 0; padding:1.1rem 1.2rem; text-align:left;
  border:1px solid var(--linha); border-radius:14px; background:var(--creme-cl);
  display:grid; grid-template-columns:auto 1fr; gap:.5rem 1.2rem;
}
.rv__lista dt{
  font-family:var(--disp); font-size:.66rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--oliva);
}
.rv__lista dd{ margin:0; font-size:.96rem; color:var(--carvao) }
.rv__ref{
  margin:0; font-family:var(--disp); font-size:.74rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--oliva); opacity:.8;
}
.rv__doneCta{ display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center }

/* ── telemóvel: folha a subir do fundo ────────────────── */
@media (max-width:560px){
  .rv{ padding:0; align-items:flex-end }
  .rv__panel{
    max-width:none; max-height:96vh;
    border-radius:22px 22px 0 0; border-bottom:0;
    animation:rvSheet .26s cubic-bezier(.2,.8,.3,1);
  }
  @keyframes rvSheet{ from{ transform:translateY(100%) } to{ transform:none } }
  .rv__head,.rv__steps,.rv__body,.rv__foot{ padding-left:1.1rem; padding-right:1.1rem }
  .rv__foot{ flex-wrap:wrap }
  .rv__resumo{ flex-basis:100%; order:-1 }
  .rv__acoes{ flex:1 }
  .rv__acoes .btn{ flex:1 }
}

@media (prefers-reduced-motion:reduce){
  .rv__scrim,.rv__panel{ animation:none }
}
