/* Reservations are a section of the existing site, not a separate theme. */
.page-booking { --booking-paper: var(--bg); --booking-card: var(--surface); --booking-muted: var(--ink-soft); --booking-accent: var(--salmon); --booking-wash: var(--bg-soft); --booking-error: #a72c22; }
html[data-theme="dark"] .page-booking { --booking-error: #ffad98; }
.page-booking .page-hero--booking { padding: clamp(26px,4vw,54px) 0 32px; }
.page-booking .page-hero--booking h1 { font-size: clamp(3.1rem,6.4vw,5.5rem); margin: 12px 0 22px; line-height: 1; }
.page-booking .page-hero__copy > p { max-width: 770px; }
.page-booking .booking-section { padding-top: 8px; padding-bottom: 80px; }
.booking-layout { display:grid; grid-template-columns:minmax(0,1.85fr) minmax(235px,1fr); gap:clamp(24px,4.5vw,64px); align-items:start; }
.booking-card { min-width:0; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--booking-card); padding:clamp(22px,3vw,38px); box-shadow:var(--shadow-sm); }
.booking-card h2 { font-family:var(--serif); font-weight:500; font-size:clamp(1.75rem,2.5vw,2.3rem); line-height:1.12; margin:0 0 20px; }
.booking-card h3 { font-size:1rem; margin:24px 0 14px; }
.booking-card p { line-height:1.65; }
.booking-sidebar { position:sticky; top:112px; border-top:1px solid var(--line); padding-top:24px; color:var(--booking-muted); }
.booking-sidebar h2 { font-family:var(--serif); color:var(--ink); font-weight:500; font-size:clamp(1.65rem,2.5vw,2.1rem); line-height:1.15; margin:0 0 16px; }
.booking-sidebar > p { line-height:1.65; font-size:.9rem; margin:0 0 18px; }
.booking-how { list-style:none; padding:0; margin:22px 0; display:grid; gap:16px; }
.booking-how li { display:flex; gap:12px; align-items:center; }
.booking-how span { display:grid; place-items:center; flex:0 0 32px; height:32px; border:1px solid var(--line); border-radius:50%; font-size:.7rem; font-weight:700; color:var(--salmon); }
.booking-how p { margin:0; font-size:.8rem; }
.booking-sidebar .info-pill { display:inline-block; border:1px solid var(--line); padding:9px 12px; border-radius:99px; font-size:.7rem; }
.contact-link { display:inline-flex; padding:12px 0; color:var(--ink); font-weight:700; font-size:.9rem; }
.booking-visit { display:flex; gap:12px; align-items:center; margin:0 0 20px; font-size:.8rem; }
.booking-sidebar .intro-note, .booking-privacy { font-size:.74rem; }
.booking-language { height:42px; max-width:62px; border:1px solid var(--line); border-radius:99px; padding:0 8px; color:var(--ink); background:var(--surface); font:inherit; font-size:.74rem; font-weight:700; cursor:pointer; }
.booking-language option { color:var(--ink); background:var(--surface); }
.booking-mobile-languages { display:flex; gap:16px; flex-wrap:wrap; }
.booking-mobile-languages a[aria-current] { color:var(--salmon); text-decoration:underline; text-underline-offset:6px; }
.booking-progress { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:0 0 28px; padding:0; font-size:.8rem; color:var(--booking-muted); }
.booking-progress li { padding:0 0 13px; border-bottom:2px solid var(--line); }
.booking-progress li.active { color:var(--ink); border-color:var(--salmon); font-weight:750; }
.booking-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 20px; }
.booking-field { display:grid; gap:9px; min-width:0; font-size:.8rem; font-weight:650; margin-bottom:18px; }
.booking-field input,.booking-field select,.booking-field textarea { width:100%; min-width:0; border:1px solid var(--line); background:var(--booking-card); color:var(--ink); border-radius:var(--radius-sm); padding:13px 12px; min-height:48px; font:inherit; font-weight:400; font-size:16px; }
.booking-field textarea { resize:vertical; }
.booking-field input:focus,.booking-field select:focus,.booking-field textarea:focus { border-color:var(--salmon); }
.booking-field small { color:var(--booking-muted); font-weight:400; font-size:.72rem; line-height:1.5; }
.booking-hint { color:var(--booking-muted); font-size:.8rem; line-height:1.6; }
.booking-group { background:var(--booking-wash); border-radius:var(--radius-sm); padding:12px 14px; margin-bottom:20px; }
.booking-group small { color:var(--booking-muted); font-size:.75rem; }
.booking-check { display:flex; gap:11px; align-items:flex-start; font-size:.82rem; line-height:1.6; margin:12px 0; }
.booking-check input { width:18px; height:18px; flex-shrink:0; margin-top:3px; accent-color:var(--salmon); }
.booking-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }
.booking-button { display:inline-flex; justify-content:center; align-items:center; gap:8px; min-height:48px; border-radius:99px; padding:13px 22px; text-decoration:none; font:inherit; font-size:.85rem; font-weight:750; border:1px solid transparent; cursor:pointer; }
.booking-button.primary { background:var(--ink); color:var(--bg); }
.booking-button.secondary { border-color:var(--line); background:var(--booking-card); color:var(--ink); }
.booking-button.danger { border-color:var(--booking-error); background:transparent; color:var(--booking-error); }
.booking-button:hover:not(:disabled) { box-shadow:var(--shadow-sm); }
.booking-button:disabled { opacity:.55; cursor:not-allowed; }
.booking-actions > .primary { flex:1; }
.slot-service { border:0; padding:0; margin:0 0 20px; min-width:0; }
.slot-service legend { padding:0; font-size:.8rem; color:var(--booking-muted); margin-bottom:10px; }
.slot-buttons { display:grid; grid-template-columns:repeat(auto-fill,minmax(76px,1fr)); gap:9px; }
.slot-choice,.area-choice { position:relative; cursor:pointer; }
.slot-choice input,.area-choice input { position:absolute; opacity:0; width:1px; height:1px; }
.slot-choice span,.area-choice span { display:block; border:1px solid var(--line); border-radius:var(--radius-sm); padding:12px 8px; text-align:center; font-size:.82rem; min-height:46px; background:var(--booking-card); }
.slot-choice input:checked+span,.area-choice input:checked+span { border:2px solid var(--salmon); padding:11px 7px; background:var(--booking-wash); color:var(--ink); font-weight:750; }
.slot-choice input:focus-visible+span,.area-choice input:focus-visible+span { outline:3px solid var(--salmon); outline-offset:3px; }
.area-choices { display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(135px,1fr)); }
.booking-error { padding:14px; margin:12px 0 20px; border:1px solid var(--booking-error); border-radius:var(--radius-sm); color:var(--booking-error); font-size:.85rem; line-height:1.5; }
.booking-summary { margin:15px 0 24px; }
.booking-summary div { display:flex; gap:16px; justify-content:space-between; border-bottom:1px solid var(--line); padding:12px 0; font-size:.85rem; }
.booking-summary dt { color:var(--booking-muted); }
.booking-summary dd { font-weight:600; text-align:right; margin:0; overflow-wrap:anywhere; max-width:65%; }
.booking-note { background:var(--booking-wash); padding:16px; border-radius:var(--radius-sm); font-size:.8rem; line-height:1.65; }
.status-pill { display:inline-block; background:var(--booking-wash); color:var(--ink); border-radius:99px; padding:8px 13px; font-weight:700; font-size:.75rem; }
.success-mark { width:52px; height:52px; display:grid; place-items:center; border-radius:50%; background:var(--booking-wash); color:var(--salmon); font-size:27px; margin-bottom:16px; }
.proposal-card { padding:20px; border:1px solid var(--salmon); border-radius:var(--radius-md); margin:24px 0; }
.proposal-card h3 { margin-top:0; }
.loading-text { padding:20px 0; color:var(--booking-muted); }
.booking-dialog { max-width:min(520px,90vw); padding:28px; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--surface); color:var(--ink); }
.booking-dialog::backdrop { background:rgba(20,15,14,.62); }
.turnstile-container { margin:20px 0; max-width:100%; min-height:65px; }
@media(max-width:900px) { .booking-layout { grid-template-columns:minmax(0,1fr); gap:28px; } .booking-sidebar { position:static; max-width:none; } .booking-how { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:680px) { .page-booking .page-hero--booking { padding:20px 0 26px; } .page-booking .page-hero--booking h1 { font-size:clamp(2.7rem,11vw,4rem); } .page-booking .booking-section { padding-bottom:45px; } .booking-card { padding:22px 18px; } .booking-grid { gap:4px 12px; } .booking-progress { gap:10px; font-size:.7rem; } .booking-actions .booking-button { flex:1; } .booking-how { grid-template-columns:1fr; } .booking-language { height:40px; } }
@media(max-width:380px) { .booking-grid { grid-template-columns:1fr; } .booking-card { padding:20px 14px; } .area-choices { grid-template-columns:1fr; } }

/* v2.10: reflow controls instead of shrinking text or clipping a challenge. */
.booking-stage, .booking-slots, .booking-sidebar, .booking-group,
.booking-actions > *, .booking-progress > li, .proposal-card { min-width: 0; }
.booking-grid { align-items: start; }
.booking-field { align-content: start; }
.booking-field input, .booking-field select { min-height: 48px; height: auto; }
.booking-field input[type="date"] { display: block; max-width: 100%; }
.booking-field input[type="date"]::-webkit-date-and-time-value { min-width: 0; text-align: left; }
.booking-check > span, .booking-progress li, .booking-note, .booking-error,
.booking-card h2, .booking-card h3, .booking-sidebar p { overflow-wrap: anywhere; }
.booking-check { min-height: 44px; align-items: flex-start; }
.booking-check input { margin-top: 4px; }
.booking-button { max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: center; line-height: 1.5; }
.booking-stage { scroll-margin-top: calc(var(--header-height, 80px) + 18px); }
.booking-stage:focus { outline: none; }
.booking-stage:focus-visible { outline: 2px solid var(--salmon); outline-offset: 5px; }
.area-choice, .slot-choice { min-width: 0; }
.area-choice span { height: 100%; overflow-wrap: anywhere; display: grid; place-items: center; }
.turnstile-container { width: 100%; min-width: 0; display: grid; justify-items: start; }
.turnstile-container[data-size="compact"] { min-height: 140px; }
.booking-dialog { box-sizing: border-box; width: min(520px, calc(100vw - 24px)); max-width: calc(100vw - 24px); max-height: calc(var(--visible-height, 100dvh) - 24px); overflow-y: auto; overscroll-behavior: contain; }
.booking-dialog h2 { overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .booking-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .booking-field { gap: 8px; margin-bottom: 20px; font-size: .875rem; }
  .booking-field small, .booking-hint, .booking-group small { font-size: .8125rem; }
  .booking-card { padding: 22px 16px; }
  .booking-language { font-size: 16px; min-height: 44px; max-width: 66px; }
  .booking-progress { gap: 8px; font-size: .8125rem; line-height: 1.5; }
  .booking-progress li { padding-bottom: 10px; }
  .booking-summary div { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .booking-summary dd { max-width: none; text-align: left; }
  .booking-actions { gap: 10px; }
  .booking-actions .booking-button { flex: 1 1 140px; padding-inline: 16px; }
  .proposal-card { padding: 16px; }
  .booking-dialog { padding: 22px 18px; }
}
@media (max-width: 380px) {
  .booking-card { padding: 20px 14px; }
  .booking-actions .booking-button { flex-basis: 100%; }
  .booking-progress { font-size: .75rem; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .booking-sidebar { position: static; }
  .booking-dialog { padding: 16px; }
}
/* v2.10.1 - Native date/time controls must fit their own field, not just the page.
 * Put padding on the wrapper: iOS WebKit issue 301648 ignores it when calculating
 * the width of temporal inputs. Never clip the card or change the input to text.
 */
.booking-field { min-inline-size: 0; max-inline-size: 100%; grid-template-columns: minmax(0, 1fr); }
.booking-field .booking-temporal-control {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  inline-size: 100%;
  min-width: 0;
  min-inline-size: 0;
  max-width: 100%;
  max-inline-size: 100%;
  min-height: 48px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--booking-card);
  color: var(--ink);
  transition: border-color .15s, box-shadow .15s;
}
.booking-field .booking-temporal-control:hover { border-color: var(--salmon); }
.booking-field .booking-temporal-control:focus-within { border-color: var(--salmon); outline: 2px solid var(--salmon); outline-offset: 3px; }
.booking-field--error .booking-temporal-control { border-color: var(--booking-error); }
.booking-field .booking-temporal-control--disabled { opacity: .6; background: var(--booking-wash); }
.booking-field .booking-temporal-control > input {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  box-sizing: border-box;
  flex: 1 1 0%;
  width: 0;
  inline-size: 0;
  min-width: 0;
  min-inline-size: 0;
  max-width: 100%;
  max-inline-size: 100%;
  height: 1.5em;
  min-height: 1.5em;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
  opacity: 1;
  color: inherit;
  font: inherit;
  font-weight: 400;
  font-size: max(16px, 1rem);
  line-height: 1.5;
  text-align: start;
}
.booking-temporal-control > input::-webkit-date-and-time-value { min-width: 0; margin: 0; padding: 0; text-align: start; }
.booking-temporal-control > input::-webkit-datetime-edit { min-width: 0; padding: 0; }
.booking-temporal-control > input::-webkit-datetime-edit-fields-wrapper { padding: 0; }
.booking-temporal-control > input::-webkit-calendar-picker-indicator { flex-shrink: 0; margin: 0; padding: 0; }

/* Calendario do dia da reserva (booking-datepicker.js). */
.booking-field--date { position: relative; }
.booking-date { position: relative; min-width: 0; }
.booking-date__trigger { width: 100%; min-height: 48px; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--booking-card); color: var(--ink); font: inherit; font-size: 16px; font-weight: 500; text-align: left; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.booking-date__trigger:hover, .booking-date.is-open .booking-date__trigger { border-color: var(--salmon); }
.booking-date__trigger:focus-visible { outline: 2px solid var(--salmon); outline-offset: 3px; }
.booking-date__trigger svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: var(--salmon); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.booking-date__text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.booking-date__trigger .booking-date__chevron { stroke: var(--booking-muted); transition: transform .2s; }
.booking-date.is-open .booking-date__chevron { transform: rotate(180deg); }

.booking-calendar { position: absolute; z-index: 30; top: calc(100% + 8px); left: 0; width: min(340px, calc(100vw - 32px)); padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); color: var(--ink); box-shadow: 0 24px 60px rgba(28, 21, 18, .18), 0 2px 6px rgba(28, 21, 18, .06); animation: booking-calendar-in .16s ease-out; }
.booking-calendar[hidden] { display: none; }
@keyframes booking-calendar-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.booking-calendar__header { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; align-items: center; gap: 6px; margin-bottom: 12px; }
.booking-calendar__title { margin: 0; font-family: var(--serif); font-size: 1.2rem; font-weight: 500; text-align: center; }
.booking-calendar__nav { width: 40px; height: 40px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; transition: background .15s, border-color .15s; }
.booking-calendar__nav:hover:not(:disabled) { border-color: var(--salmon); background: var(--booking-wash); }
.booking-calendar__nav:disabled { opacity: .3; cursor: default; }
.booking-calendar__nav svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.booking-calendar__weekdays, .booking-calendar__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.booking-calendar__weekdays { margin-bottom: 6px; }
.booking-calendar__weekdays span { padding: 4px 0; color: var(--booking-muted); font-size: .68rem; font-weight: 750; letter-spacing: .06em; text-align: center; text-transform: uppercase; }
.booking-calendar__day { aspect-ratio: 1; min-height: 38px; display: grid; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--ink); font: inherit; font-size: .9rem; font-weight: 600; cursor: pointer; transition: background .12s, border-color .12s, color .12s; }
.booking-calendar__day.is-weekend { color: var(--salmon); }
.booking-calendar__day:hover:not(:disabled) { background: var(--booking-wash); border-color: var(--line); }
.booking-calendar__day.is-today { border-color: var(--salmon); }
.booking-calendar__day.is-selected { background: var(--salmon); border-color: var(--salmon); color: #fff; box-shadow: 0 6px 16px rgba(197, 56, 35, .32); }
.booking-calendar__day:disabled { color: var(--booking-muted); opacity: .35; cursor: default; text-decoration: line-through; text-decoration-thickness: 1px; }
.booking-calendar__day:focus-visible { outline: 2px solid var(--salmon); outline-offset: 2px; }
.booking-calendar__footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.booking-calendar__today, .booking-calendar__close { min-height: 40px; padding: 8px 14px; border: 0; border-radius: 99px; background: transparent; color: var(--ink); font: inherit; font-size: .8rem; font-weight: 750; cursor: pointer; }
.booking-calendar__today { color: var(--salmon); }
.booking-calendar__today:hover, .booking-calendar__close:hover { background: var(--booking-wash); }
@media (max-width: 600px) {
  /* No telemovel o calendario ocupa a largura do campo, por baixo dele. */
  .booking-calendar { position: relative; top: auto; width: 100%; margin-top: 8px; box-shadow: 0 12px 30px rgba(28, 21, 18, .12); }
  .booking-calendar__day { min-height: 40px; font-size: .95rem; }
}
@media (prefers-reduced-motion: reduce) { .booking-calendar { animation: none; } .booking-date__chevron { transition: none; } }
