/* ============================================
   RESERVATION WIDGET (v6 — live availability)
   ============================================ */

/* Dark native controls everywhere: fixes white dropdown lists on Windows/Chrome */
select, input[type="date"], input[type="time"] { color-scheme: dark; }
select option, select optgroup { background-color: #141414; color: #faf8f5; }

.rsv-intro { font-family: var(--font-ui); font-size: 0.8rem; letter-spacing: 0.06em; color: var(--gold-light); margin: 0 0 2rem; }
.rsv { --rsv-line: rgba(201,169,98,0.28); --rsv-ink: #f3efe6; --rsv-muted: #b9b2a5; color: var(--rsv-ink); }
.rsv-step { padding: 0 0 1.6rem; margin: 0 0 1.6rem; border-bottom: 1px solid rgba(255,255,255,0.07); }
.rsv-label { display: flex; align-items: center; gap: 0.75rem; font-family: var(--font-ui); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); margin: 0 0 1rem; }
.rsv-num { display: inline-grid; place-items: center; width: 1.7rem; height: 1.7rem; border: 1px solid var(--gold); border-radius: 50%; font-size: 0.75rem; letter-spacing: 0; color: var(--gold); }

.rsv-guests { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.rsv-chip { min-width: 3rem; padding: 0.75rem 0.9rem; background: #151515; border: 1px solid rgba(255,255,255,0.14); color: var(--rsv-ink); font-family: var(--font-ui); font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: border-color .2s, background .2s, color .2s, transform .1s; }
.rsv-chip:hover:not(:disabled) { border-color: var(--gold); }
.rsv-chip:active:not(:disabled) { transform: scale(0.97); }
.rsv-chip[aria-checked="true"] { background: var(--gold); border-color: var(--gold); color: #0a0a0a; font-weight: 700; }
.rsv-chip:focus-visible, .rsv-day:focus-visible, .rsv-strip-nav:focus-visible, .rsv-submit:focus-visible, .rsv-btn:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 2px; }
.rsv-note { margin: 0.9rem 0 0; padding: 0.8rem 1rem; border-left: 2px solid var(--gold); background: rgba(201,169,98,0.08); font-size: 1rem; line-height: 1.5; color: var(--rsv-ink); }
.rsv-note a { color: var(--gold-light); }

.rsv-strip-wrap { display: grid; grid-template-columns: 2.2rem 1fr 2.2rem; gap: 0.4rem; align-items: stretch; }
.rsv-strip { display: flex; gap: 0.45rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px; }
.rsv-strip::-webkit-scrollbar { display: none; }
.rsv-strip-nav { background: #151515; border: 1px solid rgba(255,255,255,0.14); color: var(--gold); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.rsv-strip-nav:hover { border-color: var(--gold); }
.rsv-day { flex: 0 0 4.4rem; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; gap: 0.15rem; padding: 0.65rem 0.2rem; background: #151515; border: 1px solid rgba(255,255,255,0.14); color: var(--rsv-ink); cursor: pointer; font-family: var(--font-ui); transition: border-color .2s, background .2s; }
.rsv-day .d-w { font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--rsv-muted); }
.rsv-day .d-n { font-family: var(--font-display); font-size: 1.45rem; line-height: 1.1; }
.rsv-day .d-m { font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--rsv-muted); }
.rsv-day:hover:not(:disabled) { border-color: var(--gold); }
.rsv-day[aria-checked="true"] { background: var(--gold); border-color: var(--gold); color: #0a0a0a; }
.rsv-day[aria-checked="true"] .d-w, .rsv-day[aria-checked="true"] .d-m { color: #2a2416; }
.rsv-day:disabled { opacity: 0.38; cursor: not-allowed; }
.rsv-day:disabled .d-m { text-decoration: none; }

.rsv-times { min-height: 4rem; }
.rsv-group + .rsv-group { margin-top: 1rem; }
.rsv-group-title { font-family: var(--font-ui); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--rsv-muted); margin: 0 0 0.55rem; }
.rsv-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(4.6rem, 1fr)); gap: 0.45rem; }
.rsv-slot { padding: 0.7rem 0.3rem; background: #151515; border: 1px solid rgba(201,169,98,0.45); color: var(--rsv-ink); font-family: var(--font-ui); font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: background .2s, border-color .2s; }
.rsv-slot:hover:not(:disabled) { border-color: var(--gold-light); background: #1d1a13; }
.rsv-slot[aria-checked="true"], .rsv-slot[aria-checked="true"]:hover:not(:disabled) { background: var(--gold); border-color: var(--gold); color: #0a0a0a; font-weight: 700; }
.rsv-slot:disabled { border-color: rgba(255,255,255,0.08); color: #6f6a62; text-decoration: line-through; cursor: not-allowed; background: transparent; }
.rsv-empty { padding: 1rem 1.1rem; border: 1px dashed var(--rsv-line); font-size: 1.05rem; line-height: 1.55; color: var(--rsv-ink); }
.rsv-empty strong { color: var(--gold-light); font-weight: 600; }
.rsv-suggest { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.8rem; }
.rsv-suggest button { padding: 0.55rem 0.8rem; background: transparent; border: 1px solid var(--gold); color: var(--gold-light); font-family: var(--font-ui); font-size: 0.82rem; cursor: pointer; }
.rsv-suggest button:hover { background: rgba(201,169,98,0.12); }
.rsv-skeleton { display: grid; grid-template-columns: repeat(auto-fill, minmax(4.6rem, 1fr)); gap: 0.45rem; }
.rsv-skeleton span { height: 2.75rem; background: linear-gradient(90deg, #151515 0%, #22201b 50%, #151515 100%); background-size: 200% 100%; animation: rsvShimmer 1.2s infinite linear; }
@keyframes rsvShimmer { to { background-position: -200% 0; } }

.rsv-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1rem; }
.rsv-field { display: flex; flex-direction: column; gap: 0.4rem; }
.rsv-field > span { font-family: var(--font-ui); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold-light); }
.rsv-field small { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--rsv-muted); }
.rsv-field input, .rsv-field textarea { width: 100%; padding: 0.85rem 0.95rem; background: #141414; border: 1px solid rgba(255,255,255,0.18); color: #faf8f5; font-family: var(--font-body); font-size: 1.1rem; outline: none; transition: border-color .2s; color-scheme: dark; }
.rsv-field input::placeholder, .rsv-field textarea::placeholder { color: #7d776d; }
.rsv-field input:focus, .rsv-field textarea:focus { border-color: var(--gold); }
.rsv-field textarea { resize: vertical; min-height: 3.2rem; }
.rsv-field.has-error input { border-color: #e07a7a; }
.rsv-err { font-style: normal; font-family: var(--font-ui); font-size: 0.78rem; color: #f09a9a; min-height: 0; }
.rsv-wide { grid-column: 1 / -1; }
.rsv-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.rsv-summary { margin: 1.3rem 0 0.9rem; padding: 0.9rem 1rem; background: rgba(201,169,98,0.08); border: 1px solid var(--rsv-line); font-family: var(--font-body); font-size: 1.15rem; color: var(--rsv-ink); }
.rsv-summary strong { color: var(--gold-light); font-weight: 600; }
.rsv-msg { margin: 0 0 0.9rem; padding: 0.85rem 1rem; border-left: 3px solid #e07a7a; background: rgba(224,122,122,0.1); font-size: 1.05rem; line-height: 1.5; color: #fbe3e3; }
.rsv-msg.ok { border-left-color: var(--gold); background: rgba(201,169,98,0.1); color: var(--rsv-ink); }
.rsv-submit { width: 100%; padding: 1.1rem 1.5rem; background: var(--gold); border: none; color: #0a0a0a; font-family: var(--font-ui); font-size: 0.85rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; cursor: pointer; transition: background .2s, opacity .2s; }
.rsv-submit:hover:not(:disabled) { background: var(--gold-light); }
.rsv-submit:disabled { opacity: 0.45; cursor: not-allowed; }
.rsv-submit.is-busy { opacity: 0.75; cursor: progress; }
.rsv-fine { margin: 0.9rem 0 0; font-size: 0.9rem; line-height: 1.5; color: var(--rsv-muted); }
.rsv-fine a { color: var(--gold-light); }

.rsv-done { text-align: center; padding: 2rem 1.5rem; border: 1px solid var(--rsv-line); background: #111; outline: none; }
.rsv-check { width: 4rem; height: 4rem; margin: 0 auto 1.2rem; display: grid; place-items: center; border: 2px solid var(--gold); border-radius: 50%; color: var(--gold); font-size: 1.9rem; }
.rsv-done h3 { font-family: var(--font-display); font-weight: 400; font-size: 1.7rem; letter-spacing: 0.06em; margin: 0 0 0.4rem; }
.rsv-code { font-family: var(--font-ui); font-size: 0.85rem; letter-spacing: 0.08em; color: var(--rsv-muted); margin: 0 0 1.3rem; }
.rsv-code strong { color: var(--gold-light); font-size: 1.05rem; letter-spacing: 0.14em; }
.rsv-dl { display: grid; grid-template-columns: auto 1fr; gap: 0.5rem 1.2rem; text-align: left; margin: 0 auto 1.3rem; max-width: 26rem; padding: 1rem 1.2rem; border: 1px solid rgba(255,255,255,0.08); }
.rsv-dl dt { font-family: var(--font-ui); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--rsv-muted); padding-top: 0.25rem; }
.rsv-dl dd { margin: 0; font-size: 1.1rem; }
.rsv-mailnote { font-size: 1.02rem; line-height: 1.55; color: var(--rsv-ink); margin: 0 auto 1.4rem; max-width: 30rem; }
.rsv-mailnote.warn { color: #f3c98b; }
.rsv-actions { display: flex; gap: 0.6rem; justify-content: center; flex-wrap: wrap; }
.rsv-btn { padding: 0.9rem 1.3rem; background: var(--gold); border: 1px solid var(--gold); color: #0a0a0a; font-family: var(--font-ui); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none; cursor: pointer; }
.rsv-btn-ghost { background: transparent; color: var(--gold-light); }

@media (max-width: 600px) {
    .reservation-form-wrapper { padding: 3rem 1rem 3.5rem !important; }
    .rsv-fields { grid-template-columns: 1fr; }
    .rsv-strip-wrap { grid-template-columns: 1fr; }
    .rsv-strip-nav { display: none; }
    .rsv-day { flex-basis: 4.1rem; }
    .rsv-slots, .rsv-skeleton { grid-template-columns: repeat(auto-fill, minmax(4.3rem, 1fr)); }
}