/* Avi date-range picker. Uses the page's design tokens (--brand, --ink, --sand,
   --card, --line ...) so it follows light and dark mode with the rest of the site. */

.rp-native{display:none !important}
html.rp-lock{overflow:hidden}

/* ---- trigger: one field showing the whole stay --------------------------- */
.rp-trigger{
  display:flex; align-items:center; gap:.6rem; width:100%; margin:0 0 .75rem;
  padding:.55rem .75rem; text-align:left; cursor:pointer;
  background:var(--sand); color:var(--ink); font:inherit;
  border:1px solid var(--line); border-radius:3px;
  transition:border-color .15s, box-shadow .15s;
}
.rp-trigger:hover, .rp-trigger:focus-visible{border-color:var(--brand); outline:none;
  box-shadow:0 0 0 3px rgba(0,174,174,.18)}
.rp-tcol{display:flex; flex-direction:column; min-width:0}
.rp-tlbl{font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); font-weight:550}
.rp-tval{font-size:.95rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.rp-trigger.rp-empty .rp-tval{color:var(--ink-soft); font-weight:450}
.rp-tarrow{color:var(--ink-soft); flex:none}
.rp-tn{margin-left:auto; flex:none; font-size:.75rem; font-weight:600; color:var(--accent);
  background:var(--sand-deep, rgba(0,0,0,.04)); border-radius:99px; padding:.2rem .55rem}
.rp-tn:empty{display:none}

/* ---- dialog ----------------------------------------------------------------- */
.rp-backdrop{position:fixed; inset:0; z-index:300; background:rgba(8,30,34,.42);
  display:flex; align-items:center; justify-content:center; padding:1rem}
.rp-backdrop[hidden]{display:none}
.rp-panel{
  position:relative; width:min(780px, 100%); max-height:calc(100vh - 2rem); overflow:auto;
  background:var(--card); color:var(--ink); border-radius:10px;
  box-shadow:0 24px 70px rgba(5,25,28,.32); padding:1.1rem 1.4rem 1rem;
}
.rp-head{display:flex; align-items:center; gap:1rem; min-height:2rem; margin-bottom:.4rem}
.rp-hint{margin:0; font-size:.88rem; color:var(--ink-soft)}
.rp-close{margin-left:auto; flex:none; width:2.1rem; height:2.1rem; border-radius:50%;
  border:none; background:transparent; color:var(--ink); font-size:1.5rem; line-height:1; cursor:pointer}
.rp-close:hover{background:var(--sand-deep, rgba(0,0,0,.05))}

.rp-nav{position:absolute; left:1rem; right:1rem; top:3.35rem; display:flex; justify-content:space-between; pointer-events:none}
.rp-nav button{pointer-events:auto; width:2.1rem; height:2.1rem; border-radius:50%;
  border:1px solid var(--line); background:var(--card); color:var(--ink); font-size:1.3rem; line-height:1; cursor:pointer}
.rp-nav button:hover:not(:disabled){border-color:var(--brand); color:var(--accent)}
.rp-nav button:disabled{opacity:.3; cursor:default}

.rp-months{display:grid; grid-template-columns:1fr 1fr; gap:2.2rem}
.rp-mtitle{margin:.35rem 0 .7rem; text-align:center; font-size:1rem; font-weight:650; text-transform:capitalize}
.rp-row{display:grid; grid-template-columns:repeat(7, 1fr)}
.rp-wd{text-align:center; font-size:.68rem; font-weight:600; color:var(--ink-soft); padding:.2rem 0 .45rem; text-transform:uppercase}

/* ---- day cells -------------------------------------------------------------- */
.rp-day{
  position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;
  height:3.15rem; margin:1px 0; padding:0; border:none; background:transparent; color:var(--ink);
  font:inherit; cursor:pointer; border-radius:6px;
}
.rp-n{font-size:.95rem; font-weight:550; line-height:1.1}
.rp-p{font-size:.64rem; line-height:1.2; margin-top:.15rem; color:var(--ink-soft); font-variant-numeric:tabular-nums}
.rp-p:empty{display:none}
.rp-day:hover:not([aria-disabled="true"]){background:var(--sand-deep, rgba(0,0,0,.05))}
.rp-day:focus-visible{outline:2px solid var(--brand); outline-offset:-2px}
.rp-day[aria-disabled="true"]{cursor:default}
.rp-day[aria-disabled="true"] .rp-n{opacity:.32}
.rp-sold .rp-n{text-decoration:line-through; text-decoration-thickness:1px}
.rp-past .rp-n{opacity:.25}
.rp-cheap .rp-p{color:var(--accent); font-weight:700}

/* range: the stay reads as one band */
.rp-in{border-radius:0; background:rgba(0,174,174,.12)}
.rp-in .rp-n{opacity:1 !important}
.rp-start, .rp-end{background:var(--btn, #0A8486) !important; color:#fff}
.rp-start .rp-p, .rp-end .rp-p{color:rgba(255,255,255,.85)}
.rp-start .rp-n, .rp-end .rp-n{opacity:1 !important; text-decoration:none}
.rp-start{border-radius:6px 0 0 6px}
.rp-end{border-radius:0 6px 6px 0}
.rp-start.rp-end{border-radius:6px}
.rp-solo{border-radius:6px}   /* check-in picked, no check-out yet */
.rp-preview{background:rgba(0,174,174,.35) !important}
@media (prefers-color-scheme: dark){
  .rp-start, .rp-end{color:#062A2C}
  .rp-start .rp-p, .rp-end .rp-p{color:rgba(6,42,44,.8)}
  .rp-in{background:rgba(44,200,200,.16)}
}

/* ---- footer ----------------------------------------------------------------- */
.rp-more{display:block; margin:.8rem auto 0; padding:.5rem 1rem; background:none; cursor:pointer;
  border:1px solid var(--line); border-radius:99px; color:var(--accent); font:inherit; font-size:.82rem; font-weight:600}
.rp-more[hidden]{display:none}
.rp-foot{display:flex; align-items:center; gap:1rem; margin-top:1rem; padding-top:.85rem; border-top:1px solid var(--line)}
.rp-sum{margin:0; font-size:.88rem; font-weight:600; min-height:1.2em}
.rp-actions{margin-left:auto; display:flex; align-items:center; gap:.4rem; flex:none}
.rp-clear{background:none; border:none; cursor:pointer; color:var(--ink-soft); font:inherit; font-size:.85rem; text-decoration:underline; padding:.5rem}
.rp-done{border:none; border-radius:3px; cursor:pointer; padding:.6rem 1.5rem;
  background:var(--btn, #0A8486); color:#fff; font:inherit; font-size:.82rem; font-weight:650; letter-spacing:.08em; text-transform:uppercase}
.rp-done:disabled{opacity:.4; cursor:default}
@media (prefers-color-scheme: dark){ .rp-done{color:#062A2C} }
.rp-note{margin:.6rem 0 0; font-size:.72rem; color:var(--ink-soft)}

/* ---- phones: a full-screen sheet with months stacked --------------------- */
.rp-sheet{padding:0; align-items:stretch}
.rp-sheet .rp-panel{width:100%; max-height:none; height:100%; border-radius:0; padding:0;
  display:flex; flex-direction:column}
.rp-sheet .rp-head{position:sticky; top:0; z-index:2; background:var(--card);
  padding:.7rem 1rem; margin:0; border-bottom:1px solid var(--line)}
.rp-sheet .rp-nav{display:none}
.rp-sheet .rp-months{grid-template-columns:1fr; gap:1.4rem; padding:.6rem .8rem 0; flex:1}
.rp-sheet .rp-day{height:3.3rem}
.rp-sheet .rp-more{margin-bottom:1rem}
.rp-sheet .rp-foot{position:sticky; bottom:0; z-index:2; background:var(--card);
  margin:0; padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); flex-wrap:wrap}
.rp-sheet .rp-sum{width:100%}
.rp-sheet .rp-actions{width:100%}
.rp-sheet .rp-done{flex:1; padding:.85rem}
.rp-sheet .rp-note{padding:0 1rem .6rem; margin:0; background:var(--card)}

/* CJK: no tracking or uppercasing on labels */
:lang(zh) .rp-tlbl, :lang(ko) .rp-tlbl, :lang(zh) .rp-done, :lang(ko) .rp-done{letter-spacing:0; text-transform:none}