/*
 * pcbr-booking.css — generated by scripts/build-css.sh. Do not edit.
 * Edit the sources in assets/css/src/ and re-run the script.
 */

/* == src/stepper.css == */
/**
 * Stepper: 40px round buttons inside 44px touch areas, the value is aria-live.
 * .pcbr-stepper__input is the pre-v2 numeric field and shares the value slot's typography.
 */
.pcbr-stepper { display: inline-flex; align-items: center; gap: var(--pcbr-space-1); }
.pcbr-stepper__btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: var(--pcbr-touch); height: var(--pcbr-touch); padding: 0;
  background: none; border: 0; cursor: pointer; color: var(--pcbr-ink);
  font-family: inherit; font-size: var(--pcbr-fs-lead); font-weight: var(--pcbr-weight-strong); line-height: 1;
}
.pcbr-stepper__btn::before {
  content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: var(--pcbr-control-h-sm); height: var(--pcbr-control-h-sm);
  border: 1px solid var(--pcbr-ink); border-radius: var(--pcbr-r-full); background: var(--pcbr-surface);
}
.pcbr-stepper__btn > *, .pcbr-stepper__btn svg { position: relative; }
.pcbr-stepper__btn svg { width: 20px; height: 20px; }
.pcbr-stepper__btn:hover::before { background: var(--pcbr-surface-2); }
.pcbr-stepper__btn:focus-visible { border-radius: var(--pcbr-r-full); }
.pcbr-stepper__btn[disabled] { cursor: not-allowed; color: var(--pcbr-ink-3); }
.pcbr-stepper__btn[disabled]::before { border-color: var(--pcbr-line); background: var(--pcbr-surface-2); }
.pcbr-stepper__value, .pcbr-stepper__input {
  min-width: 48px; text-align: center; border: 0; background: none; padding: 0;
  font-family: inherit; font-size: var(--pcbr-fs-lead); line-height: var(--pcbr-lh-lead);
  font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
}
.pcbr-stepper__input::-webkit-outer-spin-button, .pcbr-stepper__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Typed count (owner, 2026-09-24): the number is a real field between the buttons, its unit word beside it. */
.pcbr-stepper--typed .pcbr-stepper__input { width: 3.5ch; min-width: 0; height: var(--pcbr-touch); padding: 0 var(--pcbr-space-1); border-radius: var(--pcbr-r-control); } /* the field is the full 44px row it sits in (ledger A-06) */
.pcbr-stepper--typed .pcbr-stepper__input:focus-visible { outline: 0; box-shadow: var(--pcbr-ring-focus); }
.pcbr-stepper__unit { font-size: var(--pcbr-fs-lead); line-height: var(--pcbr-lh-lead); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); padding-right: var(--pcbr-space-1); }
.pcbr-stepper--compact .pcbr-stepper__btn { width: 36px; height: 36px; }
.pcbr-stepper--compact .pcbr-stepper__btn::before { width: 32px; height: 32px; }
.pcbr-stepper--compact .pcbr-stepper__value, .pcbr-stepper--compact .pcbr-stepper__input { min-width: 36px; font-size: var(--pcbr-fs-body); }

/* == src/option-card.css == */
/**
 * Option card: a label wrapping a radio or checkbox. The only bordered object inside the
 * booking surface. Selected is a 2px ink ring plus accent-soft fill; padding drops 1px so
 * nothing shifts. Never a shadow. --row is the add-on layout.
 */
.pcbr-options { display: grid; gap: var(--pcbr-space-3); }
.pcbr-options--times { gap: var(--pcbr-space-3); }
.pcbr-options--addons { gap: 0; }
.pcbr-option__label { display: contents; }
.pcbr-option {
  position: relative; display: flex; align-items: flex-start; gap: var(--pcbr-space-4);
  min-height: 88px; padding: var(--pcbr-space-4); margin: 0; cursor: pointer;
  border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-control); background: var(--pcbr-surface);
}
.pcbr-option input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.pcbr-option:hover { background: var(--pcbr-surface-2); }
.pcbr-option__body { display: grid; gap: var(--pcbr-space-1); flex: 1 1 auto; min-width: 0; }
.pcbr-option__title { font-size: var(--pcbr-fs-body); line-height: var(--pcbr-lh-body); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
.pcbr-option__meta { font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-2); }
.pcbr-option__price { text-align: right; white-space: nowrap; font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
.pcbr-option__price small { display: block; font-weight: var(--pcbr-weight-body); color: var(--pcbr-ink-3); }
.pcbr-option__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--pcbr-space-3); }
.pcbr-option__row { display: flex; align-items: center; justify-content: space-between; gap: var(--pcbr-space-3); }
.pcbr-option__input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.pcbr-option__formula, .pcbr-option__carried { font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-3); }
.pcbr-option__check { display: none; width: 20px; height: 20px; flex: 0 0 20px; color: var(--pcbr-ink); }

/* :has() rules stay in their own blocks: one unsupported selector would drop a whole list. */
.pcbr-option.is-selected { border: 2px solid var(--pcbr-ink); padding: 15px; background: var(--pcbr-accent-soft); }
.pcbr-option:has(input:checked) { border: 2px solid var(--pcbr-ink); padding: 15px; background: var(--pcbr-accent-soft); }
.pcbr-option.is-selected .pcbr-option__check { display: block; }
.pcbr-option:has(input:checked) .pcbr-option__check { display: block; }
.pcbr-option:has(input:focus-visible) { box-shadow: var(--pcbr-ring-focus); }
.pcbr-option.is-disabled { background: var(--pcbr-surface-2); color: var(--pcbr-ink-3); cursor: not-allowed; }
.pcbr-option:has(input[disabled]) { background: var(--pcbr-surface-2); color: var(--pcbr-ink-3); cursor: not-allowed; }
.pcbr-option.is-disabled .pcbr-option__title { color: var(--pcbr-ink-2); }

/* The chosen time collapses to one compact row plus "Change", so the rest of the widget stands out (FB-2).
   The other radios stay in the DOM, only hidden; a single slot never collapses (nothing to change). */
.pcbr-options--times.is-collapsed { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.pcbr-options--times.is-collapsed .pcbr-option:not(.is-selected) { display: none; }
.pcbr-options--times.is-collapsed .pcbr-option.is-selected { min-height: var(--pcbr-touch); align-items: baseline; gap: var(--pcbr-space-2); padding: 11px 15px; }
.pcbr-options--times.is-collapsed .pcbr-notice { grid-column: 1 / -1; }
.pcbr-options__change { justify-self: end; }

/* Row variant: add-on lines. Also the pre-v2 .pcbr-addon markup until V2 renames it. */
.pcbr-option--row, .pcbr-addon {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--pcbr-space-3);
  min-height: var(--pcbr-touch); padding: var(--pcbr-space-3) 0; margin: 0;
  border: 0; border-bottom: 1px solid var(--pcbr-line); border-radius: 0; background: none;
}
.pcbr-option--row:hover, .pcbr-addon:hover { background: none; }
.pcbr-option--row input, .pcbr-addon__toggle { position: static; width: 20px; height: 20px; opacity: 1; accent-color: var(--pcbr-accent); }
.pcbr-addons { list-style: none; margin: 0; padding: 0; display: grid; }
.pcbr-addon__label { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--pcbr-space-3); margin: 0; min-height: var(--pcbr-touch); cursor: pointer; }
.pcbr-addon__price, .pcbr-option--row .pcbr-option__price { font-size: var(--pcbr-fs-small); color: var(--pcbr-ink-2); white-space: nowrap; }
.pcbr-addon__qty { display: flex; align-items: center; gap: var(--pcbr-space-3); padding-left: 32px; }
.pcbr-addon__count { width: 72px; min-height: 36px; padding: 0 var(--pcbr-space-2); border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-control); font: inherit; }

/* Closed season for the chosen trip date (FB-3b): the row stays legible, says why, and cannot be counted. */
.pcbr-option--row.is-unavailable .pcbr-option__title, .pcbr-option--row.is-unavailable .pcbr-option__meta:not(.pcbr-option__season) { color: var(--pcbr-ink-3); }
.pcbr-option--row.is-unavailable .pcbr-stepper__btn, .pcbr-option--row.is-unavailable .pcbr-option__check { opacity: .45; cursor: not-allowed; }
.pcbr-option__season { color: var(--pcbr-warning); }
.pcbr-option--class { min-height: 0; }
/* The selected option card (the widget's answer, rendered by the server and repainted by the script) reads top to bottom:
   the title with its check, the price with its basis, then "fits your N guests" under the price. As a row of three flex
   items it squeezed the annotation into a narrow third column at 1440 and, at 320, could not shrink below the nowrap
   price beside the title, pushing the page 7-11px wide once a date was chosen (follow-ups F-07, T3.3 item 6). */
.pcbr-option--class { flex-direction: column; align-items: stretch; gap: var(--pcbr-space-1); }
.pcbr-option--class .pcbr-option__head { align-items: flex-start; }
.pcbr-option--class .pcbr-option__head svg { width: 20px; height: 20px; flex: 0 0 20px; }
.pcbr-option--class .pcbr-option__row { flex-direction: column; align-items: flex-start; gap: 0; }
.pcbr-option--class .pcbr-option__price { text-align: left; white-space: normal; }
.pcbr-option--class .pcbr-option__price small { display: inline; }
.pcbr-option--handoff { border-color: var(--pcbr-warning); background: var(--pcbr-warning-soft); }
.pcbr-addons-panel { display: grid; gap: var(--pcbr-space-3); }
.pcbr-class__ask { justify-self: start; }

/* The availability answer above the option card (FB-1): one quiet line, success ink, never a box. */
.pcbr-class__avail { display: flex; align-items: center; gap: var(--pcbr-space-1); margin: 0 0 var(--pcbr-space-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-success); }
.pcbr-class__avail svg { width: 16px; height: 16px; flex: 0 0 16px; }

/* Pre-v2 class card, retokenised. */
.pcbr-class__card { display: grid; gap: var(--pcbr-space-1); padding: var(--pcbr-space-4); border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-control); background: var(--pcbr-surface-2); }
.pcbr-class__card--handoff { border-color: var(--pcbr-warning); background: var(--pcbr-warning-soft); }
.pcbr-class__card--error { border-color: var(--pcbr-error); background: var(--pcbr-error-soft); }
.pcbr-class__title { margin: 0; font-size: var(--pcbr-fs-body); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
.pcbr-class__blurb, .pcbr-class__price { margin: 0; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-3); }
.pcbr-class__price strong { font-size: var(--pcbr-fs-body); color: var(--pcbr-ink); }

/* == src/price-row.css == */
/**
 * Price row and status. Every price carries its mode qualifier; the total is the largest
 * number on its surface and sits under a 1px rule.
 */
.pcbr-prices { display: grid; gap: var(--pcbr-space-3); }
.pcbr-price { display: flex; align-items: baseline; justify-content: space-between; gap: var(--pcbr-space-4); }
.pcbr-price__label { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); min-width: 0; }
.pcbr-price__amount { white-space: nowrap; font-weight: var(--pcbr-weight-medium); color: var(--pcbr-ink); font-variant-numeric: tabular-nums; }
.pcbr-price--sub .pcbr-price__amount { font-weight: var(--pcbr-weight-body); color: var(--pcbr-ink-2); }

.pcbr-price--total, .pcbr-total {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--pcbr-space-4);
  padding-top: var(--pcbr-space-3); border-top: 1px solid var(--pcbr-line);
}
.pcbr-price--total .pcbr-price__label, .pcbr-total__label { font-size: var(--pcbr-fs-body); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
.pcbr-price--total .pcbr-price__mode { display: block; font-size: var(--pcbr-fs-small); font-weight: var(--pcbr-weight-body); color: var(--pcbr-ink-3); }
.pcbr-price--total .pcbr-price__amount, .pcbr-total__value {
  font-size: var(--pcbr-fs-money); line-height: var(--pcbr-lh-money);
  font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); font-variant-numeric: tabular-nums;
}
.pcbr-total__value.is-estimate { color: var(--pcbr-ink-2); }
.pcbr-price--from { align-items: baseline; }
.pcbr-price--from .pcbr-price__amount { font-size: var(--pcbr-fs-h3); line-height: var(--pcbr-lh-h3); font-weight: var(--pcbr-weight-strong); }
.pcbr-price__head { font-size: var(--pcbr-fs-body); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
.pcbr-price__caption { font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); color: var(--pcbr-ink-3); }
.pcbr-price__breakdown { display: grid; gap: var(--pcbr-space-2); }
.pcbr-price__note { margin: var(--pcbr-space-1) 0 0; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-warning); }
.pcbr-price.is-updated .pcbr-price__amount { color: var(--pcbr-warning); }
.pcbr-price.is-pending .pcbr-price__amount { display: inline-block; min-width: 96px; height: 30px; border-radius: 6px; background: var(--pcbr-surface-3); color: transparent; }

/* The widget's total (T3.3, ledger A-06 "date-selected state"): a two-column grid instead of the flex row. The label and its
   Details toggle on the left, the amount on the right at the label's baseline. The "Confirmed price" caption shares the
   amount's cell at its foot, inside the height the label and toggle already take, so its arrival moves nothing (as a
   third flex column it pushed the amount sideways and the buttons down 150-500ms after a date was chosen: 0.025 on a
   phone). The price note and the opened breakdown take full rows below (the breakdown opened as a fourth column beside
   the amount and ran out of the card). The pending skeleton sits inside the amount's own line, top-aligned, so the row
   keeps the text's baseline while the price loads. Scoped to the widget: the cart, checkout and order-received totals
   (inc/checkout-display.php) reuse .pcbr-price--total and keep the base flex row (checkout structure is frozen). */
.pcbr-widget .pcbr-price--total { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; column-gap: var(--pcbr-space-4); row-gap: var(--pcbr-space-2); }
.pcbr-widget .pcbr-price--total > .pcbr-price__head { grid-area: 1 / 1; }
.pcbr-widget .pcbr-price--total > .pcbr-price__amount { grid-area: 1 / 2; justify-self: end; }
.pcbr-widget .pcbr-price--total > .pcbr-price__caption { grid-area: 1 / 2; align-self: end; justify-self: end; margin: 0; }
.pcbr-widget .pcbr-price--total > :is(.pcbr-price__note, .pcbr-price__breakdown) { grid-column: 1 / -1; }
.pcbr-widget .pcbr-price--total.is-pending .pcbr-price__amount { height: auto; }
.pcbr-widget .pcbr-price--total .pcbr-skel--amount { display: inline-block; vertical-align: top; }
/* The Details toggle keeps its label and chevron together at the left (the cell is now wider than the label), and the
   breakdown's rows keep the sub-row type the base rules intend: the total's own label and money rules are descendant
   selectors and reached into the breakdown, printing each row at the total's 26-28px. */
.pcbr-widget .pcbr-price--total .pcbr-price__head .pcbr-acc__btn { width: auto; justify-content: flex-start; }
.pcbr-widget .pcbr-price--total .pcbr-price--sub :is(.pcbr-price__label, .pcbr-price__amount) { font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); font-weight: var(--pcbr-weight-body); color: var(--pcbr-ink-2); }

.pcbr-status { display: inline-flex; align-items: center; gap: var(--pcbr-space-1); font-size: var(--pcbr-fs-small); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
.pcbr-status__dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: var(--pcbr-r-full); background: var(--pcbr-ink-3); }
.pcbr-status--paid .pcbr-status__dot, .pcbr-status--confirmed .pcbr-status__dot { background: var(--pcbr-success); }
.pcbr-status--pending .pcbr-status__dot { background: var(--pcbr-warning); }

/* Pre-v2 CTA block and terms list, retokenised. */
.pcbr-cta { display: grid; gap: var(--pcbr-space-2); }
.pcbr-cta__primary { width: 100%; }
.pcbr-cta__concierge { justify-self: center; }
.pcbr-cta__reason { margin: 0; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-warning); }
.pcbr-terms__summary { margin: 0; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-2); }
.pcbr-terms--compact { font-size: var(--pcbr-fs-caption); }
.pcbr-term { color: inherit; }
.pcbr-widget--concierge-only .pcbr-price--total, .pcbr-widget--concierge-only .pcbr-options--addons { display: none; }
.pcbr-cta__line { margin: 0; text-align: center; font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); color: var(--pcbr-ink-3); }
.pcbr-terms { margin: 0; padding-left: 1.1em; display: grid; gap: var(--pcbr-space-1); font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); color: var(--pcbr-ink-3); }
.pcbr-widget.is-busy .pcbr-cta__reserve { opacity: .6; pointer-events: none; }
.pcbr-widget.is-concierge .pcbr-field--pickup, .pcbr-widget.is-concierge .pcbr-field--addons, .pcbr-widget.is-concierge .pcbr-total { display: none; }

/* == src/summary.css == */
/**
 * Summary: the reservation card used by cart, checkout and thank-you. 12px radius, 1px line,
 * dt/dd rows. --collapsed is the mobile mini-summary.
 */
.pcbr-summary {
  display: grid; gap: var(--pcbr-space-3); padding: var(--pcbr-space-4); margin: 0;
  border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-surface); background: var(--pcbr-surface);
}
.pcbr-summary__head { display: flex; align-items: flex-start; gap: var(--pcbr-space-3); }
.pcbr-summary__thumb { width: 72px; height: 48px; flex: 0 0 72px; object-fit: cover; border-radius: var(--pcbr-r-control); background: var(--pcbr-surface-3); }
.pcbr-summary__title { margin: 0; font-size: var(--pcbr-fs-body); line-height: var(--pcbr-lh-body); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
.pcbr-summary__rows { display: grid; gap: var(--pcbr-space-2); margin: 0; }
/* The label keeps its own width (up to 45%) and the value wraps; `minmax(0,1fr) auto` let a long value squeeze the label to nothing (FB-14). */
.pcbr-summary__row { display: grid; grid-template-columns: fit-content(45%) minmax(0, 1fr); gap: var(--pcbr-space-3); align-items: baseline; }
.pcbr-summary__row dt { font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-3); }
.pcbr-summary__row dd { margin: 0; text-align: right; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink); font-weight: var(--pcbr-weight-medium); }
.pcbr-summary__actions { display: flex; flex-wrap: wrap; gap: var(--pcbr-space-3); padding-top: var(--pcbr-space-3); border-top: 1px solid var(--pcbr-line); }
.pcbr-summary__row dd, .pcbr-summary__title { min-width: 0; overflow-wrap: anywhere; }

.pcbr-summary--collapsed { gap: 0; padding: var(--pcbr-space-3) var(--pcbr-space-4); background: var(--pcbr-surface-2); }
.pcbr-summary--collapsed .pcbr-summary__rows, .pcbr-summary--collapsed .pcbr-summary__actions { display: none; }
.pcbr-summary--collapsed.is-open .pcbr-summary__rows { display: grid; padding-top: var(--pcbr-space-3); }
/* Concierge prefill card: its "change" link stays visible (audit 6.9); the checkout mini-summary keeps actions hidden. */
.pcbr-summary--collapsed.pcbr-concierge__summary .pcbr-summary__actions { display: flex; justify-content: space-between; align-items: baseline; padding-top: 0; border-top: 0; }
.pcbr-concierge__summary .pcbr-label { color: var(--pcbr-ink-2); } /* caption on a sand surface: ink-2, like every tinted caption */
@media (min-width: 1024px) { .pcbr-summary { padding: var(--pcbr-space-6); } }

/* -- Trip snapshot --------------------------------------------------------
   One itinerary model for the wizard's Review, the checkout card and the mobile mini-summary
   (inc/transfer-display.php renders it server side; assets/js/pujgo-wizard.js fills the same structure).
   It reads like a trip, not a record: "Round trip · 2 travelers", the stay behind a pin, one rule, then Flight in /
   Flight home ("Fri, Nov 6 · 1:45 PM" over "TS398 · Air Transat") and the pickup from the stay as a large time.
   Sentence-case labels with an icon carry the structure; whitespace, not borders, separates the groups. */
.pcbr-trip { display: grid; gap: var(--pcbr-space-5); min-width: 0; }
.pcbr-trip__kind { margin: 0; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-2); }
.pcbr-trip__groups { display: grid; gap: var(--pcbr-space-5); margin: 0; }
.pcbr-trip__journey { padding-top: var(--pcbr-space-5); border-top: 1px solid var(--pcbr-line); }
.pcbr-trip__group { display: grid; align-content: start; gap: 2px; min-width: 0; }
.pcbr-trip__group[hidden] { display: none; }
.pcbr-trip__label {
  display: flex; align-items: center; gap: var(--pcbr-space-2); margin-bottom: var(--pcbr-space-1);
  font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); font-weight: var(--pcbr-weight-medium); color: var(--pcbr-ink-2);
}
.pcbr-trip__icon { width: 18px; height: 18px; flex: 0 0 18px; color: var(--pcbr-ink-3); }
.pcbr-trip__line { margin: 0; min-width: 0; overflow-wrap: anywhere; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-2); }
.pcbr-trip__line[hidden] { display: none; }
.pcbr-trip__line--lead { font-size: var(--pcbr-fs-body); line-height: var(--pcbr-lh-body); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }
/* The stay leads with its pin (its label is for screen readers); the name is the largest line in the place group. */
.pcbr-trip__place .pcbr-trip__line--lead { display: flex; align-items: flex-start; gap: var(--pcbr-space-2); font-size: var(--pcbr-fs-lead); line-height: var(--pcbr-lh-lead); }
.pcbr-trip__place .pcbr-trip__line--lead .pcbr-trip__icon { margin-top: 4px; }
.pcbr-trip__place .pcbr-trip__line--note { padding-left: calc(18px + var(--pcbr-space-2)); }
.pcbr-trip__line--time { font-size: var(--pcbr-fs-h3); line-height: var(--pcbr-lh-h3); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); font-variant-numeric: tabular-nums; }
.pcbr-trip__line--note { color: var(--pcbr-ink-3); }
.pcbr-trip__line--source { display: flex; align-items: center; gap: var(--pcbr-space-1); margin-top: var(--pcbr-space-1); color: var(--pcbr-ink-3); }
/* Confirmed pickup: derived from a flight the lookup resolved, so it sits on the success tint with a check and names
   the flight. A typed time keeps the neutral treatment and says so. */
.pcbr-trip__check { display: none; width: 16px; height: 16px; flex: 0 0 16px; color: var(--pcbr-success); }
.pcbr-trip__group--confirmed { padding: var(--pcbr-space-3) var(--pcbr-space-4); border-radius: var(--pcbr-r-control); background: var(--pcbr-success-soft); }
.pcbr-trip__group--confirmed .pcbr-trip__icon { color: var(--pcbr-success); }
.pcbr-trip__group--confirmed .pcbr-trip__line--note { color: var(--pcbr-ink-2); }
.pcbr-trip__group--confirmed .pcbr-trip__line--source { color: var(--pcbr-success); font-weight: var(--pcbr-weight-medium); }
.pcbr-trip__group--confirmed .pcbr-trip__check { display: inline-block; }
/* Contextual edits (wizard Review): one quiet pencil per concept, top-right of its section, a 44px target that
   occupies no layout of its own. */
.pcbr-trip__section { position: relative; min-width: 0; padding-right: calc(var(--pcbr-touch) + var(--pcbr-space-2)); }
.pcbr-trip__section--journey { padding-right: 0; }
.pcbr-trip__section--journey > .pcbr-trip__edit { top: calc(var(--pcbr-space-5) - 12px); }
.pcbr-trip__edit {
  position: absolute; top: -12px; right: 0; display: inline-flex; align-items: center; justify-content: center;
  width: var(--pcbr-touch); height: var(--pcbr-touch); padding: 0; border: 0; border-radius: var(--pcbr-r-full);
  background: none; color: var(--pcbr-ink-3); cursor: pointer;
}
.pcbr-trip__edit:hover { color: var(--pcbr-ink); background: var(--pcbr-surface-2); }
.pcbr-trip__edit-icon { width: 18px; height: 18px; }
/* Two flight columns: the wizard dialog above the phone sheet, the reservation card once the aside is 400px (tokens.css). */
@media (min-width: 641px) {
  .pujgo-wizard .pcbr-trip__journey { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--pcbr-space-5); }
  .pujgo-wizard .pcbr-trip__journey > :not(.pcbr-trip__group--arrival, .pcbr-trip__group--departure) { grid-column: 1 / -1; }
  /* A one-way trip has a single flight: it takes the full row rather than leaving an empty column. */
  .pujgo-wizard .pcbr-trip__journey > .pcbr-trip__group--departure:first-child,
  .pujgo-wizard .pcbr-trip__journey > .pcbr-trip__group--arrival[hidden] ~ .pcbr-trip__group--departure,
  .pujgo-wizard .pcbr-trip__journey > .pcbr-trip__group--arrival:not(:has(~ .pcbr-trip__group--departure:not([hidden]))) { grid-column: 1 / -1; }
}
@media (min-width: 1200px) {
  .pcbr-summary .pcbr-trip__journey { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--pcbr-space-5); }
  .pcbr-summary .pcbr-trip__journey > :not(.pcbr-trip__group--arrival, .pcbr-trip__group--departure) { grid-column: 1 / -1; }
  /* A one-way trip has a single flight: it takes the full row rather than leaving an empty column. */
  .pcbr-summary .pcbr-trip__journey > .pcbr-trip__group--departure:first-child,
  .pcbr-summary .pcbr-trip__journey > .pcbr-trip__group--arrival[hidden] ~ .pcbr-trip__group--departure,
  .pcbr-summary .pcbr-trip__journey > .pcbr-trip__group--arrival:not(:has(~ .pcbr-trip__group--departure:not([hidden]))) { grid-column: 1 / -1; }
}

/* == src/sticky-bar.css == */
/**
 * Bottom booking bar: 64px, e-sticky (the shadow points up), safe-area aware.
 * Three things and no more: the total (underlined, opens the breakdown) with its qualifier in one
 * column, and one 48px button. Hidden inside sheets and behind the photo viewer.
 *
 * Availability (experience audit L-14, M-05, M-06): the box, position and type below are not
 * media-gated; only `display` is granted, in two places. Below 1024px every page that renders a bar
 * gets it (cart, large groups, occasion pages). The tour gets it at every width: the widget's
 * presentation block alone decides when it shows, from whether the inline Reserve button
 * ([data-pcbr="reserve"]) is in view, so a released sidebar on a short desktop or the wide region
 * under both columns still carries the action. The grant stays below `.pcbr [hidden]` (0,2,0) so the
 * `hidden` attribute always wins.
 *
 * Qualifier (M-07): `.pcbr-bar__meta` holds two parts, the guest count and the date part, each kept whole;
 * the only break sits after the dot between them, so a narrow phone reads two lines ("1 guest ·" over
 * "No date yet") under an amount that is never truncated, beside a button that keeps its 48px. Nothing
 * is clipped or ellipsised: when the block and the button cannot both stay whole (a long label at 320),
 * the button's label wraps instead.
 *
 * Safe area (A-05): the bottom inset (--pcbr-safe-bottom, tokens.css) is read once into --pcbr-bar-inset, so the
 * padding, the measured footprint and the footer's clearance all follow it; a test can stand in a device inset there.
 * The viewport meta carries viewport-fit=cover (owner decision 2026-10-01), so real devices report it. The side
 * insets (landscape) arrive through --pcbr-gutter, which is never less than them: the base padding and the tour's
 * desktop alignment max(gutter, (100% - container) / 2) both start from it.
 *
 * Scope: the qualifier parts and the column/button flex policy apply to the widget's bar
 * ([data-pcbr="sticky-bar"]) only. The cart's bar (inc/checkout-display.php) reuses .pcbr-bar__col,
 * __meta and __cta and keeps exactly the base rules (checkout structure is frozen).
 *
 * Desktop (L-14): on the tour the surface stays full width while its content aligns with the tour
 * container (1280 max inside the tour gutters); below 1360 that is the gutter itself, as before.
 *
 * Motion: the slide is a transition on `transform`, present only for visitors who have not asked for
 * less. The widget drops `hidden` one frame before adding `.is-visible`, and on hide removes
 * `.is-visible` first and sets `hidden` on `transitionend` (250ms fallback), so the slide plays.
 * Under reduced motion the bar never slides: it is on screen whenever it is not hidden, and it hides at once.
 */
.pcbr-bar, .pcbr-sticky {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
  align-items: center; justify-content: space-between; gap: var(--pcbr-space-3);
  min-height: 64px; padding: var(--pcbr-space-2) var(--pcbr-gutter);
  --pcbr-bar-inset: var(--pcbr-safe-bottom, 0px);
  padding-bottom: calc(var(--pcbr-space-2) + var(--pcbr-bar-inset));
  background: var(--pcbr-surface); border-top: 1px solid var(--pcbr-line); box-shadow: var(--pcbr-e-sticky);
}
.pcbr-bar { transform: translateY(100%); }
.pcbr-bar.is-visible { transform: none; }
@media (prefers-reduced-motion: no-preference) { .pcbr-bar { transition: transform .18s ease; } }
/* Reduced motion (T3.3b): no slide, so nothing may sit between "focusable" and "on screen". The widget's bar is on screen
   whenever it is not [hidden] (the one frame between unhiding and .is-visible included), and it has no transition, so the
   widget hides it at once (transitionDuration 0s) instead of waiting for a transitionend that base.css's 0.001ms
   catch-all would otherwise leave pending with the bar off screen yet focusable. The cart's bar is untouched. */
@media (prefers-reduced-motion: reduce) {
  [data-pcbr="sticky-bar"].pcbr-bar { transition: none; }
  [data-pcbr="sticky-bar"].pcbr-bar:not([hidden]) { transform: none; }
}
.pcbr-bar__col { display: grid; gap: 2px; min-width: 0; }
.pcbr-bar__total {
  padding: 0; background: none; border: 0; text-align: left; cursor: pointer;
  font-family: inherit; font-size: var(--pcbr-fs-lead); line-height: var(--pcbr-lh-lead);
  font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); text-decoration: underline; text-underline-offset: var(--pcbr-underline-offset);
}
.pcbr-bar__meta, .pcbr-sticky__price small {
  display: block; font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption);
  font-weight: var(--pcbr-weight-body); color: var(--pcbr-ink-3);
}
.pcbr-bar__cta { flex: 0 0 auto; min-height: var(--pcbr-control-h); }
/* The widget's bar only (the cart builds its own bar from the same classes and keeps the rules above): the
   block starts at its narrowest unbroken width (the whole amount, each whole qualifier part) and takes the
   rest of the row; when even that cannot sit beside the button, the button yields width and its label takes
   a second line inside the same 48px minimum. */
[data-pcbr="sticky-bar"] .pcbr-bar__col { justify-items: start; flex: 1 0 auto; width: min-content; min-width: auto; }
[data-pcbr="sticky-bar"] .pcbr-bar__cta { flex: 0 1 auto; }
[data-pcbr="sticky-bar"] .pcbr-bar__part { white-space: nowrap; }
/* The amount is a button (it opens the breakdown): a 44px target (ledger A-06) laid out in its 26px line. Negative block
   margins give the extra height back, and the qualifier under it lets taps through to the button. */
[data-pcbr="sticky-bar"] .pcbr-bar__total { min-width: var(--pcbr-touch); min-height: var(--pcbr-touch); margin-block: calc((var(--pcbr-lh-lead) - var(--pcbr-touch)) / 2); }
[data-pcbr="sticky-bar"] .pcbr-bar__meta { pointer-events: none; }
.pcbr-sticky__price { font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); }

/* Display grants: every page below 1024px; the tour at every width (:where keeps it at 0,1,0). */
@media (max-width: 1023.98px) { .pcbr-bar, .pcbr-sticky { display: flex; } }
:where(.single-st_tours) .pcbr-bar, :where(.single-st_tours) .pcbr-sticky { display: flex; }
/* The tour's content edges, on a full-width surface. */
.single-st_tours .pcbr-bar { padding-inline: max(var(--pcbr-gutter), calc((100% - var(--pcbr-container)) / 2)); }
/* Modal surfaces own the screen: the menu and widget sheets, the photo viewer. */
body.pcbr-sheet-open :is(.pcbr-bar, .pcbr-sticky), html.pcbr-viewer-open :is(.pcbr-bar, .pcbr-sticky) { display: none; }

/* Focus not obscured (WCAG 2.4.11; experience audit N, PR 3): keyboard focus and in-page jumps keep the focused control
   clear of the bar. --pcbr-bar-h is published on <html> only where a bar can show, so other pages keep no padding.
   It reserves the bar's height even while the bar is hidden or translated off-screen (the Reserve button in view): a
   focused control then stops up to one bar-height above the bottom edge, which costs nothing and keeps the rule static. */
html { scroll-padding-bottom: var(--pcbr-bar-h, 0px); }

/* Footer clearance on the tour (M-05): the bar's measured footprint (--pcbr-bar-h, set on <html> by the
   widget where a bar can show; the measurement already contains the bar's own safe-area padding) plus a
   16px allowance, so the copyright line sits above the bar at max scroll. The shell's 32px footer padding
   is the floor, and what remains when the property is unset. */
.single-st_tours .pcbr-footer { padding-bottom: max(var(--pcbr-space-7), calc(var(--pcbr-bar-h, 0px) + var(--pcbr-space-4))); }

/* == src/skeleton.css == */
/**
 * Skeleton: surface-3 blocks sized to the content they replace, so nothing reflows when the
 * server answers. Shimmer is decorative and stops under prefers-reduced-motion.
 */
.pcbr-skel {
  display: block; border-radius: 6px; background: var(--pcbr-surface-3);
  background-image: linear-gradient(90deg, var(--pcbr-surface-3) 0%, var(--pcbr-surface-2) 50%, var(--pcbr-surface-3) 100%);
  background-size: 200% 100%; animation: pcbr-shimmer 1.4s linear infinite; color: transparent;
}
@keyframes pcbr-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .pcbr-skel { animation: none; } }

.pcbr-skel--text { height: 16px; width: 60%; border-radius: 4px; }
.pcbr-skel--amount { height: 30px; width: 96px; }
.pcbr-skel--card { aspect-ratio: 3 / 2; width: 100%; border-radius: var(--pcbr-r-surface); }

/* == src/calendar.css == */
/**
 * Availability calendar (flatpickr). Selectors are unchanged from the ported PCA stylesheet;
 * every hard-coded colour, radius and shadow now comes from tokens.css. The --fp-* variables
 * stay as the calendar's own indirection layer so the vendor rules below are untouched.
 * Tom Select rules were dropped: the port does not ship Tom Select (see inc/calendar-assets.php).
 */

/* ==============================================
   DESIGN TOKENS (mapped onto the v2 tokens)
   ============================================== */
:root {
    /* Availability states */
    --fp-available-bg: var(--pcbr-accent-soft);
    --fp-available-text: var(--pcbr-ink);
    --fp-available-hover: var(--pcbr-surface-3);
    --fp-available-border: var(--pcbr-accent);

    /* Selection */
    --fp-selected-bg: var(--pcbr-ink);
    --fp-selected-text: #fff;

    /* Today */
    --fp-today-border: var(--pcbr-ink);

    /* Disabled/Unavailable */
    --fp-disabled-text: var(--pcbr-ink-3);
    --fp-disabled-strike: var(--pcbr-line);

    /* Calendar chrome */
    --fp-header-text: var(--pcbr-ink);
    --fp-weekday-text: var(--pcbr-ink-3);
    --fp-day-text: var(--pcbr-ink-2);
    --fp-day-hover-bg: var(--pcbr-surface-2);
    --fp-border: var(--pcbr-line);
    --fp-shadow: var(--pcbr-e-sheet);
    --fp-bg: var(--pcbr-surface);
}

/* ==============================================
   CALENDAR CONTAINER
   ============================================== */
.pca-flatpickr {
    background: var(--fp-bg);
    border: 1px solid var(--fp-border);
    border-radius: var(--pcbr-r-surface);
    box-shadow: var(--fp-shadow);
    font-family: var(--pcbr-font);
    padding: 16px;
    z-index: 99999;
}

.pca-flatpickr.open {
    display: block;
    visibility: visible;
    opacity: 1;
}

/* ==============================================
   MONTH HEADER
   ============================================== */
.pca-flatpickr .flatpickr-months {
    padding: 0 8px 12px 8px;
    position: relative;
}

.pca-flatpickr .flatpickr-current-month {
    font-size: 16px;
    font-weight: 600;
    color: var(--fp-header-text);
}

.pca-flatpickr .flatpickr-current-month .flatpickr-monthDropdown-months {
    font-size: 16px;
    font-weight: 600;
    color: var(--fp-header-text);
    background: transparent;
}

.pca-flatpickr .flatpickr-current-month .numInputWrapper input {
    font-size: 16px;
    font-weight: 600;
    color: var(--fp-header-text);
}

/* ==============================================
   NAVIGATION ARROWS
   ============================================== */
.pca-flatpickr .flatpickr-prev-month,
.pca-flatpickr .flatpickr-next-month {
    color: var(--fp-header-text);
    padding: 8px;
    border-radius: var(--pcbr-r-full);
    transition: background-color 0.15s ease;
    cursor: pointer;
    z-index: 10;
}

.pca-flatpickr .flatpickr-prev-month:hover,
.pca-flatpickr .flatpickr-next-month:hover {
    background-color: var(--fp-day-hover-bg);
}

.pca-flatpickr .flatpickr-prev-month svg,
.pca-flatpickr .flatpickr-next-month svg {
    fill: var(--fp-header-text);
    stroke: var(--fp-header-text);
}

/* ==============================================
   WEEKDAY HEADERS
   ============================================== */
.pca-flatpickr .flatpickr-weekday {
    font-size: 12px;
    font-weight: 500;
    color: var(--fp-weekday-text);
    text-transform: uppercase;
}

/* ==============================================
   DAY CONTAINER - FLEXBOX LAYOUT
   ============================================== */
.pca-flatpickr .flatpickr-days {
    width: 100%;
}

.pca-flatpickr .dayContainer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    min-width: 280px;
    max-width: 320px;
    margin: 0 auto;
}

/* ==============================================
   DAY CELLS - BASE STYLES
   ============================================== */
.pca-flatpickr .flatpickr-day {
    flex: 0 0 calc(100% / 7 - 2px);
    max-width: calc(100% / 7 - 2px);
    height: 38px;
    line-height: 38px;
    margin: 1px;
    color: var(--fp-day-text);
    font-weight: 400;
    font-size: 14px;
    border-radius: var(--pcbr-r-full);
    border: 1px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    position: relative;
    box-sizing: border-box;
}

.pca-flatpickr .flatpickr-day:hover:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay) {
    background-color: var(--fp-day-hover-bg);
}

/* ==============================================
   AVAILABLE DATES - GREEN CIRCLE
   ============================================== */
.pca-flatpickr .flatpickr-day.available-date:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay) {
    background-color: var(--fp-available-bg);
    color: var(--fp-available-text);
    font-weight: 500;
}

.pca-flatpickr .flatpickr-day.available-date:not(.flatpickr-disabled):hover {
    background-color: var(--fp-available-hover);
    border-color: var(--fp-available-border);
}

/* ==============================================
   UNAVAILABLE/DISABLED DATES - STRIKETHROUGH
   ============================================== */
.pca-flatpickr .flatpickr-day.unavailable-date,
.pca-flatpickr .flatpickr-day.flatpickr-disabled {
    color: var(--fp-disabled-text);
    cursor: not-allowed;
    pointer-events: none;
    background-color: transparent;
}

.pca-flatpickr .flatpickr-day.unavailable-date::after,
.pca-flatpickr .flatpickr-day.flatpickr-disabled::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 15%;
    right: 15%;
    height: 1.5px;
    background-color: var(--fp-disabled-strike);
    transform: translateY(-50%);
    pointer-events: none;
}

/* ==============================================
   SELECTED DATE - FOREST GREEN CIRCLE
   ============================================== */
.pca-flatpickr .flatpickr-day.selected,
.pca-flatpickr .flatpickr-day.selected.available-date,
.pca-flatpickr .flatpickr-day.selected:hover {
    background-color: var(--fp-selected-bg);
    color: var(--fp-selected-text);
    border-color: var(--fp-selected-bg);
    font-weight: 600;
}

/* ==============================================
   TODAY INDICATOR
   ============================================== */
.pca-flatpickr .flatpickr-day.today:not(.selected) {
    border: 1px solid var(--fp-today-border);
    font-weight: 600;
}

.pca-flatpickr .flatpickr-day.today.available-date:not(.selected) {
    border: 1px solid var(--fp-today-border);
}

/* ==============================================
   PREV/NEXT MONTH DAYS - HIDDEN BUT GRID-ALIGNED
   ============================================== */
.pca-flatpickr .flatpickr-day.prevMonthDay {
    color: transparent;
    background: transparent;
    cursor: default;
    pointer-events: none;
}

.pca-flatpickr .flatpickr-day.nextMonthDay {
    visibility: hidden;
    cursor: default;
    pointer-events: none;
}

/* No strikethrough on prev/next month days */
.pca-flatpickr .flatpickr-day.prevMonthDay::after,
.pca-flatpickr .flatpickr-day.nextMonthDay::after {
    display: none;
}

/* ==============================================
   ACCESSIBILITY - FOCUS STATES (WCAG 2.4.7)
   ============================================== */
.pca-flatpickr .flatpickr-day:focus-visible {
    outline: 2px solid var(--fp-today-border);
    outline-offset: 2px;
    z-index: 1;
}

.pca-flatpickr .flatpickr-prev-month:focus-visible,
.pca-flatpickr .flatpickr-next-month:focus-visible {
    outline: 2px solid var(--fp-today-border);
    outline-offset: 2px;
}

/* ==============================================
   ARIA LIVE REGION - SCREEN READER ONLY
   ============================================== */
.pca-flatpickr .pca-status {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ==============================================
   LOADING STATE
   ============================================== */
.pca-flatpickr.loading {
    opacity: 0.6;
    position: relative;
}

.pca-flatpickr.loading::after {
    content: 'Loading availability…';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--pcbr-surface);
    padding: 10px 20px;
    border-radius: 4px;
    box-shadow: var(--pcbr-e-sheet);
    z-index: 1000;
    font-size: 14px;
    color: var(--pcbr-ink-2);
    pointer-events: none;
}

/* Navigation arrows stay clickable during loading */
.pca-flatpickr.loading .flatpickr-prev-month,
.pca-flatpickr.loading .flatpickr-next-month {
    pointer-events: auto;
    z-index: 1001;
}

/* ==============================================
   FORM DATE SEARCH LOADING STATE
   ============================================== */
.form-date-search.loading-availability {
    opacity: 0.6;
    position: relative;
}

.form-date-search.loading-availability .date-picker-button,
.form-date-search.loading-availability input[type="text"] {
    pointer-events: none;
}

.form-date-search.loading-availability::after {
    content: 'Loading availability…';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--pcbr-surface);
    padding: 10px 20px;
    border-radius: 4px;
    box-shadow: var(--pcbr-e-sheet);
    z-index: 1000;
    font-size: 14px;
    color: var(--pcbr-ink-2);
    pointer-events: none;
}

/* ==============================================
   DESKTOP - FLOATING OVERLAY
   ============================================== */
@media (min-width: 769px) {
    .pca-flatpickr {
        position: absolute;
        z-index: 99999;
    }
}

/* Mobile backdrop removed — booking widget covers full viewport */
.pca-flatpickr-backdrop {
    display: none;
}

/* ==============================================
   MOBILE - CENTERED MODAL WITH BACKDROP
   ============================================== */
@media (max-width: 768px) {
    .pca-flatpickr {
        position: fixed !important;
        top: calc(50% + (var(--pcbr-safe-top) - var(--pcbr-safe-bottom)) / 2) !important; /* centred in the safe area */
        left: calc(50% + (var(--pcbr-safe-left) - var(--pcbr-safe-right)) / 2) !important;
        transform: translate(-50%, -50%) !important;
        z-index: 99999 !important;
        max-width: 320px;
        width: calc(100% - 32px - var(--pcbr-safe-left) - var(--pcbr-safe-right));
    }
    
    /* Touch-friendly day cells - Apple's 44px minimum */
    .pca-flatpickr .flatpickr-day {
        min-height: 44px;
        font-size: 15px;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }
    
    /* Touch-friendly navigation */
    .pca-flatpickr .flatpickr-prev-month,
    .pca-flatpickr .flatpickr-next-month {
        min-width: 44px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Prevent double-tap zoom */
    .pca-flatpickr {
        touch-action: manipulation;
    }
}

/* ==============================================
   REDUCED MOTION - WCAG 2.3.3
   ============================================== */
@media (prefers-reduced-motion: reduce) {
    .pca-flatpickr,
    .pca-flatpickr .flatpickr-day,
    .pca-flatpickr .flatpickr-prev-month,
    .pca-flatpickr .flatpickr-next-month {
        transition: none;
    }
}

/* ==============================================
   ANIMATION
   ============================================== */
@keyframes pca-flatpickr-fade-in {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

@media (max-width: 768px) {
    .pca-flatpickr.open {
        animation: pca-flatpickr-fade-in 0.2s ease-out;
    }
}

/* ==============================================
   LEGACY COMPATIBILITY
   Support for existing selectors during migration
   ============================================== */

/* Support traveler-flatpickr class used in some places */
.traveler-flatpickr.has-availability {
    z-index: 9999;
}

/* Support #tour-date-calendar ID */
#tour-date-calendar {
    z-index: 99999;
    pointer-events: auto;
}

#tour-date-calendar .flatpickr-prev-month,
#tour-date-calendar .flatpickr-next-month {
    pointer-events: auto;
    z-index: 10001;
    cursor: pointer;
}

/* ==============================================
   AVAILABILITY LEGEND
   Color key below day grid
   ============================================== */
.flatpickr-availability-legend {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 10px 8px 6px;
    border-top: 1px solid var(--fp-border);
    margin-top: 4px;
}

.flatpickr-availability-legend .legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 500;
    color: var(--fp-weekday-text);
    white-space: nowrap;
}

.flatpickr-availability-legend .legend-swatch {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: var(--pcbr-r-full);
    flex-shrink: 0;
}

.flatpickr-availability-legend .legend-available .legend-swatch {
    background-color: var(--fp-available-bg);
    border: 1.5px solid var(--fp-available-border);
}

.flatpickr-availability-legend .legend-unavailable .legend-swatch {
    background-color: var(--pcbr-surface-2);
    border: 1.5px solid var(--fp-disabled-strike);
    position: relative;
}

.flatpickr-availability-legend .legend-unavailable .legend-swatch::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 1px;
    right: 1px;
    height: 1.5px;
    background: var(--fp-disabled-strike);
    transform: translateY(-50%);
}

.flatpickr-availability-legend .legend-selected .legend-swatch {
    background-color: var(--fp-selected-bg);
    border: 1.5px solid var(--fp-selected-bg);
}

/* == src/wizard.css == */
/**
 * Transfer booking wizard (components/transfer-wizard.php, assets/js/pujgo-wizard.js).
 * One frame, two presentations: inline card (desktop) and a bottom sheet at ≤640px (.is-sheet).
 * Tokens only; every control is at least --pcbr-touch tall.
 */
.pujgo-wizard { display: grid; gap: var(--pcbr-space-4); }
.pujgo-wizard__title { margin: 0; font-size: var(--pcbr-fs-h2); line-height: var(--pcbr-lh-h2); }
.pujgo-wizard__lead { margin: 0; color: var(--pcbr-ink-2); }
.pujgo-wizard__frame {
  display: grid; gap: var(--pcbr-space-4);
  padding: var(--pcbr-space-5); border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-surface);
  background: var(--pcbr-surface);
}
.pujgo-wizard__bar { display: flex; align-items: center; gap: var(--pcbr-space-2); min-height: var(--pcbr-touch); }
.pujgo-wizard__back, .pujgo-wizard__close {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 var(--pcbr-touch);
  width: var(--pcbr-touch); height: var(--pcbr-touch); padding: 0; border: 0; border-radius: var(--pcbr-r-full);
  background: none; color: var(--pcbr-ink); cursor: pointer;
}
.pujgo-wizard__back:hover, .pujgo-wizard__close:hover { background: var(--pcbr-surface-2); }
.pujgo-wizard__close { display: none; margin-left: auto; }
.pujgo-wizard__progress { display: flex; flex-wrap: wrap; gap: var(--pcbr-space-1) var(--pcbr-space-3); margin: 0; padding: 0; list-style: none; font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); color: var(--pcbr-ink-3); }
.pujgo-wizard__progress-item.is-done { color: var(--pcbr-ink-2); }
.pujgo-wizard__progress-item.is-current { color: var(--pcbr-ink); font-weight: var(--pcbr-weight-strong); }

.pujgo-wizard__step { display: grid; gap: var(--pcbr-space-3); }
.pujgo-wizard__step[hidden] { display: none; }
.pujgo-wizard__q { margin: 0; font-size: var(--pcbr-fs-h3); line-height: var(--pcbr-lh-h3); font-weight: var(--pcbr-weight-strong); outline: none; }
/* The step heading receives focus so screen readers announce the new step; it is not a control, so no focus ring
   (iOS Safari drew the site ring under it). */
/* Outranks base.css's `.pcbr :is(…, [tabindex]):focus-visible` ring (0,3,0). */
.pcbr .pujgo-wizard .pujgo-wizard__q:is(:focus, :focus-visible) { outline: none; box-shadow: none; }
.pujgo-wizard__help { margin: 0; color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }

.pujgo-wizard__choices { display: grid; gap: var(--pcbr-space-3); grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); }
.pujgo-wizard__choice {
  position: relative; display: grid; gap: var(--pcbr-space-1); min-height: 88px; padding: var(--pcbr-space-4);
  text-align: left; border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-surface); background: var(--pcbr-surface);
  color: var(--pcbr-ink); cursor: pointer;
}
.pujgo-wizard__choice:hover { border-color: var(--pcbr-ink-3); }
.pujgo-wizard__choice[aria-pressed="true"] { border-color: var(--pcbr-accent); box-shadow: inset 0 0 0 1px var(--pcbr-accent); background: var(--pcbr-accent-soft); }
.pujgo-wizard__choice-icon { display: block; width: 22px; height: 22px; margin-bottom: var(--pcbr-space-2); color: var(--pcbr-accent); }
.pujgo-wizard__choice-icon .pcbr-icon { width: 22px; height: 22px; }
.pujgo-wizard__choice[aria-pressed="true"] .pujgo-wizard__choice-icon { color: var(--pcbr-accent-hover); }
.pujgo-wizard__badge { position: absolute; top: var(--pcbr-space-3); right: var(--pcbr-space-3); }
.pujgo-wizard__choice-title { font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__choice-sub { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-wizard__badge { justify-self: start; padding: 2px var(--pcbr-space-2); border-radius: var(--pcbr-r-full); background: var(--pcbr-surface-3); font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); }

.pujgo-wizard__tabs { display: flex; gap: var(--pcbr-space-2); }
.pujgo-wizard__tabs[hidden] { display: none; }
.pujgo-wizard__tab { flex: 1 1 0; min-height: var(--pcbr-touch); border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-control); background: var(--pcbr-surface); color: var(--pcbr-ink); cursor: pointer; font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__tab.is-active { border-color: var(--pcbr-ink); background: var(--pcbr-ink); color: var(--pcbr-surface); }

/* The Stay panels own their rhythm (label, field, results, chips or the rental link): one gap between each, and an
   empty results list takes no room, so "Popular resorts" never sits flush under the field (owner, iPhone, 2026-10-07). */
.pujgo-wizard__step [data-pw-panel] { display: grid; gap: var(--pcbr-space-3); }
.pujgo-wizard__step [data-pw-panel][hidden] { display: none; }
.pujgo-wizard__results { display: grid; gap: var(--pcbr-space-1); margin: 0; padding: 0; list-style: none; }
.pujgo-wizard__results:empty { display: none; }
.pujgo-wizard__result { display: grid; gap: 2px; min-height: var(--pcbr-touch); padding: var(--pcbr-space-2) var(--pcbr-space-3); border-radius: var(--pcbr-r-control); cursor: pointer; }
.pujgo-wizard__result:hover { background: var(--pcbr-surface-2); }
.pujgo-wizard__result:focus-visible { background: var(--pcbr-surface-2); outline: 2px solid var(--pcbr-accent); outline-offset: -2px; }
.pujgo-wizard__result-name { font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__result-sub, .pujgo-wizard__result-note { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-wizard__result-note { padding: var(--pcbr-space-2) var(--pcbr-space-3); }
.pujgo-wizard__skeleton { height: 44px; border-radius: var(--pcbr-r-control); background: linear-gradient(90deg, var(--pcbr-surface-2), var(--pcbr-surface-3), var(--pcbr-surface-2)); background-size: 200% 100%; animation: pujgo-shimmer 1.2s linear infinite; }
@keyframes pujgo-shimmer { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .pujgo-wizard__skeleton { animation: none; } }

.pujgo-wizard__chips { display: flex; flex-wrap: wrap; gap: var(--pcbr-space-2); align-items: center; }
.pujgo-wizard__chips-label { flex-basis: 100%; margin: 0; color: var(--pcbr-ink-3); font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); }
.pujgo-wizard__selected { display: grid; gap: var(--pcbr-space-1); padding: var(--pcbr-space-3); border-radius: var(--pcbr-r-control); background: var(--pcbr-accent-soft); }
.pujgo-wizard__selected[hidden] { display: none; }
.pujgo-wizard__selected p { margin: 0; }
.pujgo-wizard__selected-name { font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__selected-sub { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); }
.pujgo-wizard__selected-flag { color: var(--pcbr-warning); font-size: var(--pcbr-fs-small); }
.pujgo-wizard__link { justify-self: start; min-height: var(--pcbr-touch); padding: 0; border: 0; background: none; color: var(--pcbr-accent); font-weight: var(--pcbr-weight-strong); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.pujgo-wizard__grid { display: grid; gap: var(--pcbr-space-3); grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); }
.pujgo-wizard__grid > [hidden] { display: none; }
.pujgo-wizard__flight { margin: 0; font-size: var(--pcbr-fs-small); color: var(--pcbr-ink-2); }
.pujgo-wizard__flight.is-warning { color: var(--pcbr-error); }
.pujgo-wizard__pickup { display: flex; align-items: flex-start; gap: var(--pcbr-space-2); margin: var(--pcbr-space-3) 0 0; padding: var(--pcbr-space-3) var(--pcbr-space-4); border-radius: var(--pcbr-r-control); background: var(--pcbr-surface-2); color: var(--pcbr-ink); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-wizard__pickup[hidden] { display: none; }
.pujgo-wizard__pickup .pcbr-trip__check { margin-top: 2px; }
.pujgo-wizard__pickup.is-confirmed { background: var(--pcbr-success-soft); }
.pujgo-wizard__pickup.is-confirmed .pcbr-trip__check { display: inline-block; }

.pujgo-wizard__stepper { display: flex; align-items: center; gap: var(--pcbr-space-4); }
.pujgo-wizard__stepper-btn { width: 52px; height: 52px; border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-full); background: var(--pcbr-surface); color: var(--pcbr-ink); font-size: 24px; line-height: 1; cursor: pointer; }
.pujgo-wizard__stepper-value { min-width: 3ch; text-align: center; font-size: var(--pcbr-fs-h2); line-height: var(--pcbr-lh-h2); font-weight: var(--pcbr-weight-strong); }

.pujgo-wizard__price { display: grid; gap: var(--pcbr-space-2); padding: var(--pcbr-space-4); border-radius: var(--pcbr-r-surface); background: var(--pcbr-surface-2); }
.pujgo-wizard__price p { margin: 0; }
.pujgo-wizard__price-total { font-size: var(--pcbr-fs-h2); line-height: var(--pcbr-lh-h2); font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__price-title { font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__price-error, .pujgo-wizard__error { color: var(--pcbr-error); }
.pujgo-wizard__error { margin: 0; }
/* Validation (validateStep() in pujgo-wizard.js): one quiet message under the field that needs attention, the field
   outlined in the error colour, nothing else on the page changes. Shown after the primary action is attempted on
   the step, or once a field the traveller has left is wrong; cleared as soon as the state is valid again. */
.pujgo-wizard .pcbr-field { display: grid; gap: var(--pcbr-space-2); min-width: 0; }
.pujgo-wizard .pcbr-field[hidden] { display: none; }
.pujgo-wizard__field-error { margin: 0; color: var(--pcbr-error); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-wizard__field-error[hidden] { display: none; }
.pujgo-wizard [data-pw-field].is-invalid .pcbr-input { border-color: var(--pcbr-error); }
.pujgo-wizard [data-pw-field].is-invalid .pcbr-input:focus { box-shadow: 0 0 0 3px var(--pcbr-error-soft), 0 0 0 5px var(--pcbr-error); }
.pujgo-wizard__contact { display: flex; flex-wrap: wrap; gap: var(--pcbr-space-2); }

.pujgo-wizard__footer { display: grid; gap: var(--pcbr-space-2); }
.pujgo-wizard__hint { min-height: var(--pcbr-lh-small); margin: 0; color: var(--pcbr-ink-3); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-wizard__hint.is-emphasised { color: var(--pcbr-ink); font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__cta { width: 100%; }
.pujgo-wizard__cta[aria-disabled="true"] { opacity: .45; }
.pujgo-wizard__cta[hidden] { display: none; }
.pujgo-wizard__restart { justify-self: center; }

.pujgo-wizard__hub { display: grid; gap: var(--pcbr-space-2); padding: var(--pcbr-space-4); border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-surface); }
.pujgo-wizard__hub[hidden] { display: none; }
.pujgo-wizard__hub p { margin: 0; }
.pujgo-wizard__hub-title { font-weight: var(--pcbr-weight-strong); }

/* ≤640px: the frame becomes a bottom sheet once the guest starts. */
@media (max-width: 640px) {
  .pujgo-wizard__frame { padding: var(--pcbr-space-4); }
  .pujgo-wizard.is-sheet .pujgo-wizard__frame {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; max-height: calc(92vh - var(--pcbr-safe-top)); max-height: calc(100dvh - var(--pcbr-space-6) - var(--pcbr-safe-top));
    grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; border-radius: var(--pcbr-r-sheet) var(--pcbr-r-sheet) 0 0;
    padding-bottom: calc(var(--pcbr-space-4) + var(--pcbr-safe-bottom)); box-shadow: var(--pcbr-e-sheet);
  }
  .pujgo-wizard.is-sheet .pujgo-wizard__steps { overflow-y: auto; overscroll-behavior: contain; padding-bottom: var(--pcbr-space-2); }
  .pujgo-wizard.is-sheet .pujgo-wizard__close { display: inline-flex; }
  .pujgo-wizard.is-sheet::before { content: ""; position: fixed; inset: 0; z-index: 89; background: var(--pcbr-scrim); }
  .pujgo-wizard__choices { grid-template-columns: 1fr; }
  body.pujgo-wizard-open { overflow: hidden; }
}

/* Launch host (homepage design): the wizard waits hidden in [data-pw-host] until a [data-pw-open] control opens it.
   >640px it is a focused dialog (centred card over a scrim, steps scroll inside); ≤640px the bottom sheet above.
   The intro and the resume hub belong to the inline presentation and are not shown inside the dialog. */
[data-pw-host] .pujgo-wizard.is-sheet .pujgo-wizard__intro,
[data-pw-host] .pujgo-wizard.is-dialog .pujgo-wizard__intro,
[data-pw-host] .pujgo-wizard__hub { display: none; }
body.pujgo-wizard-open { overflow: hidden; }
.pujgo-wizard.is-dialog {
  position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: var(--pcbr-space-6);
  background: rgba(28, 27, 25, .45);
}
.pujgo-wizard.is-dialog .pujgo-wizard__frame {
  width: min(760px, 100%); max-height: calc(100vh - 2 * var(--pcbr-space-6)); max-height: calc(100dvh - 2 * var(--pcbr-space-6)); grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden;
  background: var(--pcbr-surface); box-shadow: var(--pcbr-e-sheet);
}
.pujgo-wizard.is-dialog .pujgo-wizard__steps { overflow-y: auto; overscroll-behavior: contain; }
.pujgo-wizard.is-dialog .pujgo-wizard__close { display: inline-flex; }

/* Booking UX: one trip surface, stable controls, a compact itinerary. */
:where(.pcbr) .pcbr-trip-inputs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--pcbr-space-6); }
:where(.pcbr) .pcbr-trip-leg { min-width: 0; display: grid; align-content: start; gap: var(--pcbr-space-2); }
:where(.pcbr) .pcbr-trip-leg__title { display: flex; align-items: center; gap: var(--pcbr-space-2); margin: 0 0 var(--pcbr-space-1); font-size: var(--pcbr-fs-body); line-height: var(--pcbr-lh-body); font-weight: var(--pcbr-weight-strong); }
/* Arrival and departure: the title is the date field's own label ("Arrival date"), one line above the input. */
.pujgo-wizard .pcbr-field > .pcbr-trip-leg__title { margin: 0; }
.pujgo-wizard .pcbr-trip-leg > .pcbr-field:has(> .pcbr-trip-leg__title) { gap: var(--pcbr-space-1); }
/* Resolved flight: confirmed trip information with a quiet Change, not an unfinished field. */
/* Two compact rows (owner, 2026-10-10): check, "Airline · number" and Change on the first; the time on the second.
   The flight text takes min-width: 0 and wraps, so a long airline never hides the number or pushes Change out. */
.pcbr-trip-leg__resolved { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 var(--pcbr-space-2); padding: var(--pcbr-space-2) var(--pcbr-space-3); border-radius: var(--pcbr-r-control); background: var(--pcbr-surface-2); }
.pcbr-trip-leg__resolved[hidden], .pcbr-trip-leg__entry[hidden] { display: none; }
/* The card takes focus when a lookup resolves under the traveller's typing (so focus never drops to the page); it is
   information, not a control, so no ring. Outranks base.css's `[tabindex]:focus-visible` ring, as for the step heading. */
.pcbr .pujgo-wizard .pcbr-trip-leg__resolved:is(:focus, :focus-visible) { outline: none; box-shadow: none; }
.pcbr-trip-leg__resolved p { margin: 0; }
.pcbr-trip-leg__resolved-name { grid-area: 1 / 1; display: flex; align-items: flex-start; gap: var(--pcbr-space-2); min-width: 0; font-weight: var(--pcbr-weight-strong); }
.pcbr-trip-leg__resolved-flight { min-width: 0; overflow-wrap: anywhere; }
.pcbr-trip-leg__resolved-name .pcbr-trip__check { display: inline-block; margin-top: calc((var(--pcbr-lh-body) - 16px) / 2); }
.pcbr-trip-leg__resolved-time { grid-area: 2 / 1 / 3 / 3; padding-left: calc(16px + var(--pcbr-space-2)); color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pcbr-trip-leg__resolved-clock { color: var(--pcbr-ink); font-weight: var(--pcbr-weight-medium); }
.pcbr-trip-leg__entry { display: grid; gap: var(--pcbr-space-2); }
.pcbr-trip__change {
  justify-self: start; min-height: var(--pcbr-touch); margin-block: calc((var(--pcbr-lh-small) - var(--pcbr-touch)) / 2); padding: 0;
  border: 0; background: none; color: var(--pcbr-ink-2); cursor: pointer;
  font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); font-weight: var(--pcbr-weight-medium); text-decoration: underline; text-underline-offset: var(--pcbr-underline-offset);
}
/* Change, right-aligned on the first row: the 44px hit area comes from min-height and side padding (the padding
   reaches into the card's own, so the word lines up with the card edge). */
.pcbr-trip-leg__resolved .pcbr-trip__change { grid-area: 1 / 2; align-self: start; justify-self: end; margin-top: calc((var(--pcbr-lh-body) - var(--pcbr-touch)) / 2); padding-inline: var(--pcbr-space-2); margin-inline-end: calc(-1 * var(--pcbr-space-2)); }
.pcbr-trip__change:hover { color: var(--pcbr-ink); }
.pcbr-trip__change[hidden] { display: none; }
.pujgo-wizard__resume-stay { margin: 0; }
:where(.pcbr) .pcbr-trip-leg__flight { display: grid; gap: var(--pcbr-space-2); margin-top: var(--pcbr-space-1); }
:where(.pcbr) .pcbr-trip-leg[hidden], :where(.pcbr) .pcbr-trip-inputs > [hidden], :where(.pcbr) .pcbr-trip-leg__flight[hidden], :where(.pcbr) .pcbr-trip-leg__manual[hidden] { display: none; }
:where(.pcbr) .pcbr-trip-leg__manual { display: grid; gap: var(--pcbr-space-2); }
.pujgo-wizard__stepper { gap: var(--pcbr-space-2); }
.pujgo-wizard__stepper-btn { width: var(--pcbr-touch); height: var(--pcbr-touch); }
.pujgo-wizard__stepper-btn:disabled { opacity: .4; cursor: default; }
.pujgo-wizard__stepper-value { font-size: var(--pcbr-fs-h3); }
.pujgo-wizard__steps { position: relative; isolation: isolate; overflow-x: hidden; }
.pujgo-wizard__step { gap: var(--pcbr-space-5); }
.pujgo-wizard__step.pcbr-step-exit { position: absolute; inset: 0 0 auto; pointer-events: none; background: var(--pcbr-surface); z-index: 1; }
.pujgo-wizard__bar { position: relative; padding-inline: var(--pcbr-touch); }
.pujgo-wizard__back { position: absolute; left: 0; }
.pujgo-wizard__close { position: absolute; right: 0; }
.pujgo-wizard__back[hidden] { display: none; }
.pujgo-wizard__progress { font-size: var(--pcbr-fs-small); }
.pujgo-wizard__restart { font-size: var(--pcbr-fs-small); font-weight: var(--pcbr-weight-medium); color: var(--pcbr-ink-3); text-decoration: none; }
.pujgo-wizard__restart:hover { color: var(--pcbr-ink-2); text-decoration: underline; }
.pujgo-wizard__hint:empty { min-height: 0; }
.pujgo-wizard__price { padding: var(--pcbr-space-5) 0 0; border-radius: 0; background: none; }
/* Natural height between bounds, anchored to the top so the bar and close never move: a short step is a short card,
   a long one scrolls inside. The min-height keeps Trip ↔ Review from resizing the card. The 960px cap lets Review
   and a long resort list fit a 1080px display (at 780px Review scrolled 177px with ~210px of screen unused below);
   on 900px and shorter screens the viewport bound decides, as before. */
.pujgo-wizard.is-dialog { align-items: start; padding-top: max(var(--pcbr-space-6), 6vh); }
.pujgo-wizard.is-dialog .pujgo-wizard__frame { width: min(680px, 100%); height: auto; min-height: min(560px, calc(100dvh - 2 * var(--pcbr-space-6))); max-height: min(960px, calc(100dvh - max(var(--pcbr-space-6), 6vh) - var(--pcbr-space-6))); padding: var(--pcbr-space-6); }
.pujgo-wizard.is-dialog { background: var(--pcbr-scrim); }
.pujgo-wizard.is-dialog .pujgo-wizard__steps { padding-inline: var(--pcbr-space-1); }
.pujgo-wizard__choice[aria-pressed="true"] { box-shadow: none; }
.pujgo-wizard__flight { color: var(--pcbr-accent); }
.pujgo-wizard__footer { background: var(--pcbr-surface); }
.pujgo-wizard :is(button, input, a):focus-visible { outline: 2px solid var(--pcbr-accent); outline-offset: 3px; }
@media (max-width: 640px) {
  .pujgo-wizard.is-sheet { position: fixed; inset: 0; z-index: 90; }
  .pujgo-wizard.is-sheet .pujgo-wizard__frame { bottom: var(--pcbr-wizard-bottom, 0px); height: min(740px, calc(var(--pcbr-wizard-viewport, 100dvh) - var(--pcbr-space-4))); max-height: calc(var(--pcbr-wizard-viewport, 100dvh) - var(--pcbr-space-4)); gap: var(--pcbr-space-3); }
  :where(.pcbr) .pcbr-trip-inputs { grid-template-columns: 1fr; gap: var(--pcbr-space-5); }
  .pujgo-wizard__choices { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--pcbr-space-2); }
  .pujgo-wizard__choice { padding: var(--pcbr-space-3); min-height: 128px; align-content: start; }
  .pujgo-wizard__step { gap: var(--pcbr-space-4); }
  .pujgo-wizard__restart { min-height: var(--pcbr-touch); }
  .pujgo-wizard__footer { gap: var(--pcbr-space-1); }
}
@media (prefers-reduced-motion: no-preference) {
  .pcbr-trip-leg__flight, .pcbr-trip-leg__manual, .pujgo-wizard__rental-address { animation: pcbr-booking-reveal 180ms ease-out; }
  @keyframes pcbr-booking-reveal { from { opacity: 0; } to { opacity: 1; } }
}

.pujgo-wizard.is-dialog:is([data-current-step="type"], [data-current-step="resume"]) .pujgo-wizard__frame { min-height: 0; }
/* Steps whose content is short (type, resume, the stay search before a result list) keep the sheet to their content:
   the hint and Continue follow the chips instead of waiting at the bottom of a tall sheet. Trip and Review keep the
   fixed height so the sheet does not resize between them. */
/* One sheet height for every step on a phone (owner, iPhone, 2026-10-09): the sheet used to grow from its content's
   height to the fixed one on entering Dates & flights, and the whole sheet moved under the traveller's thumb. The
   steps scroll inside; their scroll padding keeps a focused field clear of the footer. */
@media (max-width: 640px) {
  .pujgo-wizard.is-sheet .pujgo-wizard__steps { scroll-padding-block: var(--pcbr-space-4) var(--pcbr-space-6); }
  /* With the on-screen keyboard up (or a very short screen) the footer keeps only the primary action. Driven by the
     visual viewport, never by focus: a focus rule changed the footer's height as a tap on the button blurred the
     field, and the button moved out from under the finger. */
  .pujgo-wizard.is-sheet.is-keyboard :is(.pujgo-wizard__paynote, .pujgo-wizard__restart) { display: none; }
}
/* Dates & flights (owner, 2026-10-10): compact spacing from the bar to the title and between the legs, and room at
   the end of the scroll area so the last card, message or link (whose 44px hit area overhangs its line) scrolls
   fully clear of the footer. The footer is its own grid row with the safe-area inset in the frame's padding. */
.pujgo-wizard[data-current-step="trip"] .pujgo-wizard__frame { row-gap: var(--pcbr-space-3); }
.pujgo-wizard [data-step="trip"] { gap: var(--pcbr-space-4); }
:where(.pcbr) .pujgo-wizard [data-step="trip"] .pcbr-trip-inputs { gap: var(--pcbr-space-5); }
.pujgo-wizard:is(.is-sheet, .is-dialog)[data-current-step="trip"] .pujgo-wizard__steps { padding-bottom: var(--pcbr-space-6); scroll-padding-block-end: var(--pcbr-space-6); }
@media (max-width: 640px) {
  .pujgo-wizard[data-current-step="trip"] .pujgo-wizard__frame { row-gap: var(--pcbr-space-2); }
  .pujgo-wizard [data-step="trip"] { gap: var(--pcbr-space-3); }
  :where(.pcbr) .pujgo-wizard [data-step="trip"] .pcbr-trip-inputs { gap: var(--pcbr-space-4); }
}
.pujgo-wizard__resume-stay { margin: 0; font-size: var(--pcbr-fs-lead); line-height: var(--pcbr-lh-lead); font-weight: var(--pcbr-weight-strong); }

/* Route preview (Review): "A → B", an approximate drive time and distance, a note, a Google Maps link and a small
   static map loaded from Google. Fixed 2:1 box — the image's own ratio, object-fit: contain — so nothing shifts and
   Google's attribution and both endpoints are never cropped; a quiet placeholder while it loads; the map alone hides
   when the image fails, the whole figure when there is no preview. Phones: full width under the text. From 641px the
   map sits beside the text at 300×150, supporting the itinerary rather than dominating it. */
.pcbr-route { display: grid; gap: var(--pcbr-space-3); margin: 0; padding-top: var(--pcbr-space-5); border-top: 1px solid var(--pcbr-line); }
.pcbr-route[hidden] { display: none; }
.pcbr-route__text { display: grid; gap: 2px; min-width: 0; }
.pcbr-route__text .pcbr-trip__label { margin-bottom: var(--pcbr-space-1); }
.pcbr-route__line { margin: 0; font-size: var(--pcbr-fs-body); line-height: var(--pcbr-lh-body); font-weight: var(--pcbr-weight-strong); color: var(--pcbr-ink); overflow-wrap: anywhere; }
.pcbr-route__meta { margin: 0; font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-ink-2); }
.pcbr-route__note { margin: 0; font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); color: var(--pcbr-ink-3); }
.pcbr-route__note[hidden] { display: none; }
.pcbr-route__link { margin-top: var(--pcbr-space-1); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); color: var(--pcbr-accent); text-decoration: underline; text-underline-offset: var(--pcbr-underline-offset); justify-self: start; }
.pcbr-route__link[hidden] { display: none; }
.pcbr-route__map { position: relative; aspect-ratio: 2 / 1; overflow: hidden; border-radius: var(--pcbr-r-control); background: var(--pcbr-surface-2); }
.pcbr-route__map[hidden] { display: none; }
.pcbr-route__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; opacity: 1; transition: opacity 200ms ease-out; }
.pcbr-route__img:not([src]) { opacity: 0; }
.pcbr-route.is-loading .pcbr-route__map { animation: pujgo-shimmer 1.2s linear infinite; }
.pcbr-route.is-loading .pcbr-route__text { min-height: calc(var(--pcbr-lh-caption) + var(--pcbr-space-1) + var(--pcbr-lh-body) + var(--pcbr-lh-small) + 2px); }
@media (prefers-reduced-motion: reduce) { .pcbr-route.is-loading .pcbr-route__map { animation: none; } .pcbr-route__img { transition: none; } }
@media (min-width: 641px) {
  .pcbr-route { grid-template-columns: minmax(0, 1fr) 300px; align-items: center; gap: var(--pcbr-space-5); }
  .pcbr-route:has(.pcbr-route__map[hidden]) { grid-template-columns: minmax(0, 1fr); }
  .pcbr-route__map { width: 300px; }
}

/* Quote request (quote-only trips): the inquiry fields inside Review, submitted by the footer CTA. */
.pcbr-quote { display: grid; gap: var(--pcbr-space-4); margin: 0; padding-top: var(--pcbr-space-4); }
.pcbr-quote[hidden], .pcbr-quote__done[hidden] { display: none; }
.pcbr-quote__lead { margin: 0; color: var(--pcbr-ink-2); }
.pcbr-quote__grid { display: grid; gap: var(--pcbr-space-4); }
.pcbr-quote__grid .pcbr-field { display: grid; gap: var(--pcbr-space-1); min-width: 0; }
.pcbr-quote textarea.pcbr-input { min-height: calc(var(--pcbr-control-h) + var(--pcbr-lh-body)); height: auto; padding-block: var(--pcbr-space-3); resize: vertical; }
.pcbr-quote__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pcbr-quote__error { margin: 0; color: var(--pcbr-error); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pcbr-quote__error[hidden] { display: none; }
.pcbr-quote__alt { margin: 0; color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pcbr-quote__alt[hidden] { display: none; }
.pcbr-quote__alt a { color: var(--pcbr-ink); }
.pcbr-quote__done { display: grid; gap: var(--pcbr-space-2); padding: var(--pcbr-space-4); border-radius: var(--pcbr-r-control); background: var(--pcbr-success-soft); }
.pcbr-quote__done p { margin: 0; }
.pcbr-quote__done-title { display: flex; align-items: center; gap: var(--pcbr-space-2); font-weight: var(--pcbr-weight-strong); }
.pcbr-quote__done-title .pcbr-trip__check { display: inline-block; }
.pcbr-quote__done-text { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
@media (min-width: 641px) {
  .pcbr-quote__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pcbr-quote__note { grid-column: 1 / -1; }
}

/* Travelers & requests: a spacious step, the counter first and large, the optional request below. */
.pujgo-travelers { display: grid; justify-items: center; gap: var(--pcbr-space-3); padding: var(--pcbr-space-5) var(--pcbr-space-4); border: 1px solid var(--pcbr-line); border-radius: var(--pcbr-r-surface); text-align: center; }
.pujgo-travelers .pujgo-wizard__help { text-align: center; }
.pujgo-wizard__stepper--lg { gap: var(--pcbr-space-5); }
.pujgo-wizard__stepper--lg .pujgo-wizard__stepper-btn { width: 56px; height: 56px; font-size: 28px; }
.pujgo-travelers__count { display: grid; justify-items: center; margin: 0; min-width: 5ch; }
.pujgo-travelers__count .pujgo-wizard__stepper-value { font-size: var(--pcbr-fs-display); line-height: var(--pcbr-lh-display); }
.pujgo-travelers__unit { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-travelers__note textarea.pcbr-input { min-height: calc(var(--pcbr-control-h) * 2); height: auto; padding-block: var(--pcbr-space-3); resize: vertical; font-size: max(16px, var(--pcbr-fs-body)); }

/* Review: the total first (a fixed-height block, so a late price never moves the summary), then a compact summary. */
.pujgo-wizard__price { min-height: calc(var(--pcbr-lh-h2) + var(--pcbr-lh-small) + var(--pcbr-space-2)); align-content: start; }
.pujgo-wizard [data-step="review"] .pujgo-wizard__price { padding: 0; }
.pujgo-wizard__price-sub { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-wizard__price.is-loading .pujgo-wizard__price-loading { color: var(--pcbr-ink-3); }
.pujgo-wizard__price.is-error { padding: var(--pcbr-space-4); border-radius: var(--pcbr-r-control); background: var(--pcbr-error-soft); }
.pujgo-wizard__retry { justify-self: start; }
/* Review header: the total and the trip type on one row (the type wraps beneath only on a very narrow screen). One line
   tall in every state, so the loading → priced swap never moves the summary. */
.pujgo-wizard [data-step="review"] .pujgo-wizard__price { min-height: var(--pcbr-lh-h2); }
.pujgo-wizard__price-row { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0 var(--pcbr-space-3); min-width: 0; }
.pujgo-wizard__price-row .pujgo-wizard__price-sub { text-align: right; }

/* Three editable groups (where, when, who): the label and its one Edit on a line, the facts beneath. */
.pujgo-review { display: grid; margin: 0; border-block: 1px solid var(--pcbr-line); }
.pujgo-review__group { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px var(--pcbr-space-3); padding-block: var(--pcbr-space-3); }
.pujgo-review__group + .pujgo-review__group { border-top: 1px solid var(--pcbr-line); }
.pujgo-review__label { grid-area: 1 / 1; color: var(--pcbr-ink-3); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-review__edit { grid-area: 1 / 2; margin: 0; }
.pujgo-review__value { grid-area: 2 / 1 / 3 / 3; display: grid; gap: 2px; margin: 0; min-width: 0; overflow-wrap: anywhere; }
.pujgo-review__value [hidden] { display: none; }
.pujgo-review__line { font-weight: var(--pcbr-weight-strong); }
.pujgo-review__line--keyed { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); align-items: baseline; column-gap: var(--pcbr-space-2); }
.pujgo-review__key { font-weight: var(--pcbr-weight-body); color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); }
.pujgo-review__facts { min-width: 0; }
.pujgo-review__facts > [data-pw-snapshot]:not([hidden]) ~ [data-pw-snapshot]:not(.pujgo-review__sub)::before { content: " · "; font-weight: var(--pcbr-weight-body); color: var(--pcbr-ink-3); }
.pujgo-review__facts > .pujgo-review__sub { display: block; font-weight: var(--pcbr-weight-body); }
.pujgo-review__sub { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pujgo-review__note { white-space: pre-line; }
/* Keyed rows (Arrival, Departure, Pickup): the date and time prominent, the airline · flight number beneath in the
   secondary style; rows sit a little apart so each leg reads as one unit. */
.pujgo-review__line--keyed + .pujgo-review__line--keyed { margin-top: var(--pcbr-space-1); }
.pujgo-review__facts > .pujgo-review__sub { overflow-wrap: anywhere; }
/* The calculated hotel pickup is the one time the traveller must act on: emphasised a step above the other times. */
.pujgo-review__line--pickup [data-pw-snapshot="pickup"] { font-size: var(--pcbr-fs-lead); line-height: var(--pcbr-lh-lead); color: var(--pcbr-accent); }
/* Travelers: the label, the count and Edit on one line ("Travelers  2  Edit"); the optional note beneath the count. */
.pujgo-review__group--inline { grid-template-columns: auto minmax(0, 1fr) auto; align-items: baseline; }
.pujgo-review__group--inline .pujgo-review__label { grid-area: 1 / 1; }
.pujgo-review__group--inline .pujgo-review__value { grid-area: 1 / 2; }
.pujgo-review__group--inline .pujgo-review__edit { grid-area: 1 / 3; }
.pujgo-review__btn { min-height: var(--pcbr-touch); margin-block: calc((var(--pcbr-lh-small) - var(--pcbr-touch)) / 2); padding: 0 var(--pcbr-space-1); border: 0; background: none; color: var(--pcbr-accent); font-size: var(--pcbr-fs-small); font-weight: var(--pcbr-weight-strong); text-decoration: underline; text-underline-offset: var(--pcbr-underline-offset); cursor: pointer; }

/* Route on Review (owner, 2026-10-10): "Your route", the line and drive, then the map, full width. The whole route is
   always visible, never cropped (owner correction): both markers and Google's attribution. Phones show the image at its
   own 2:1 (≈179px tall at 390px), which is already the full view, so "See full route" is not offered there. In the
   desktop dialog a 200px preview (whole image contained) opens to 2:1 up to 320px. Every box is sized before the image
   arrives (zero layout shift). */
.pcbr-route--review { grid-template-columns: minmax(0, 1fr); gap: var(--pcbr-space-2); padding-top: 0; border-top: 0; }
.pcbr-route__title { margin: 0; color: var(--pcbr-ink-3); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); }
.pcbr-route__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--pcbr-space-3); min-height: var(--pcbr-lh-body); }
.pcbr-route__head .pcbr-route__toggle { margin-block: calc((var(--pcbr-lh-body) - var(--pcbr-touch)) / 2); }
.pcbr-route__toggle { min-height: var(--pcbr-touch); padding: 0 var(--pcbr-space-1); border: 0; background: none; color: var(--pcbr-accent); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); font-weight: var(--pcbr-weight-strong); text-decoration: underline; text-underline-offset: var(--pcbr-underline-offset); white-space: nowrap; cursor: pointer; }
.pcbr-route__toggle[hidden] { display: none; }
.pcbr-route--review .pcbr-route__link { margin-top: 0; white-space: nowrap; }
.pcbr-route--review .pcbr-route__map { width: 100%; height: auto; aspect-ratio: 2 / 1; max-height: 320px; }
.pcbr-route--review .pcbr-route__img { object-fit: contain; }
@media (max-width: 640px) {
  /* At most ~608px wide, so 2:1 never reaches the 320px cap: expanding would change nothing. */
  .pcbr-route--review .pcbr-route__toggle { display: none; }
}
@media (min-width: 641px) {
  .pcbr-route--review { grid-template-columns: minmax(0, 1fr); gap: var(--pcbr-space-2); }
  .pcbr-route--review:not(.is-expanded) .pcbr-route__map { height: 200px; aspect-ratio: auto; }
}
/* The steps area scrolls above the footer (its own grid row), never under it; a little extra room at the end of Review
   lets the bottom of an expanded map scroll clear of the footer's top edge, safe area included. */
.pujgo-wizard [data-step="review"] { padding-bottom: calc(var(--pcbr-space-4) + var(--pcbr-safe-bottom, 0px)); }

/* Reserve Now, Pay Later: one quiet line under the primary action, with the $1 explanation on request. */
.pujgo-wizard__paynote { display: grid; justify-items: center; gap: 2px; text-align: center; }
.pujgo-wizard__paynote[hidden] { display: none; }
.pujgo-wizard__paynote-text { margin: 0; color: var(--pcbr-success); font-size: var(--pcbr-fs-small); line-height: var(--pcbr-lh-small); font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__paynote-more { font-size: var(--pcbr-fs-caption); line-height: var(--pcbr-lh-caption); color: var(--pcbr-ink-2); }
.pujgo-wizard__paynote-more[hidden] { display: none; }
.pujgo-wizard__paynote-more summary { cursor: pointer; text-decoration: underline; text-underline-offset: var(--pcbr-underline-offset); }
.pujgo-wizard__paynote-more p { margin: var(--pcbr-space-1) 0 0; }

/* Direct party entry shares the existing counter, with the same touch target and native numeric semantics. */
:where(.pcbr) .pcbr-travelers__input { width: 3.5em; min-height: 56px; padding-inline: var(--pcbr-space-2); text-align: center; font-size: var(--pcbr-fs-h2); font-weight: var(--pcbr-weight-strong); }

/* Initial choices: short route labels in content-fitting rows, without a popularity claim. */
.pujgo-wizard .pcbr-trip-choices { grid-template-columns: minmax(0, 1fr); gap: var(--pcbr-space-2); }
.pcbr-trip-choices .pujgo-wizard__choice { display: grid; grid-template-columns: 22px minmax(0, 1fr) 16px; grid-template-rows: auto auto; column-gap: var(--pcbr-space-4); row-gap: 0; min-height: 0; padding: var(--pcbr-space-3) var(--pcbr-space-4); align-items: center; }
.pcbr-trip-choices .pujgo-wizard__choice-icon { grid-column: 1; grid-row: 1 / 3; margin: 0; }
.pcbr-trip-choices .pujgo-wizard__choice-title { grid-column: 2; grid-row: 1; font-size: var(--pcbr-fs-body); line-height: var(--pcbr-lh-body); }
.pcbr-trip-choices .pujgo-wizard__choice-sub { grid-column: 2; grid-row: 2; }
.pcbr-trip-choice-chevron { grid-column: 3; grid-row: 1 / 3; width: 16px; height: 16px; color: var(--pcbr-accent); transform: rotate(-90deg); }
.pujgo-wizard:is(.is-sheet, .is-dialog):is([data-current-step="type"], [data-current-step="resume"]) .pujgo-wizard__frame { height: auto; min-height: 0; }

/* Route → price → details. Fixed rows keep the summary and action outside the scroll area. */
.pujgo-wizard:is(.is-sheet, .is-dialog) .pujgo-wizard__frame {
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 0;
}
.pujgo-wizard__bar { grid-row: 1; padding-bottom: var(--pcbr-space-4); }
.pujgo-wizard__steps { grid-row: 3; min-height: 0; }
.pujgo-wizard__footer { grid-row: 4; padding-top: var(--pcbr-space-4); }
.pujgo-wizard__hint:empty { display: none; }
.pujgo-wizard__progress { flex-wrap: nowrap; gap: var(--pcbr-space-2); font-size: var(--pcbr-fs-small); }
.pujgo-wizard__progress li { display: inline-flex; align-items: center; gap: var(--pcbr-space-2); }
.pujgo-wizard__progress li + li::before { content: '/'; color: var(--pcbr-ink-3); font-weight: var(--pcbr-weight-body); }
.pujgo-wizard__progress .is-current { color: var(--pcbr-ink); font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard__tab.is-active { background: var(--pcbr-surface); color: var(--pcbr-ink); border-color: var(--pcbr-ink); border-bottom-width: 3px; }
.pujgo-wizard__selected { background: var(--pcbr-surface-2); grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--pcbr-space-3); }
.pujgo-wizard__selected > p { grid-column: 1; overflow-wrap: anywhere; }
.pujgo-wizard__selected > button { grid-column: 2; grid-row: 1 / 4; align-self: center; }
.pujgo-wizard__paynote { margin-top: var(--pcbr-space-4); }
:where(.pcbr) .pcbr-booking-party { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 var(--pcbr-space-2); padding-bottom: var(--pcbr-space-4); border-bottom: 1px solid var(--pcbr-line); }
:where(.pcbr) .pcbr-booking-party__label { margin: 0; font-weight: var(--pcbr-weight-strong); }
:where(.pcbr) .pcbr-booking-party__controls { grid-column: 2; grid-row: 1 / 3; gap: var(--pcbr-space-2); }
:where(.pcbr) .pcbr-booking-party__controls .pujgo-wizard__stepper-btn { width: var(--pcbr-touch); height: var(--pcbr-touch); font-size: var(--pcbr-fs-h3); }
:where(.pcbr) .pcbr-booking-party__controls .pcbr-travelers__input { width: 3ch; min-width: 3ch; height: var(--pcbr-touch); padding: 0; font-size: var(--pcbr-fs-body); text-align: center; }
:where(.pcbr) .pcbr-booking-party__controls .pujgo-travelers__unit { display: none; }
:where(.pcbr) .pcbr-booking-party .pujgo-wizard__field-error { grid-column: 1 / -1; }
:where(.pcbr) .pcbr-booking-dropoff { display: grid; gap: var(--pcbr-space-3); }
:where(.pcbr) .pcbr-booking-context { grid-row: 2; padding: var(--pcbr-space-3); margin-bottom: var(--pcbr-space-4); background: var(--pcbr-surface-2); border-radius: var(--pcbr-r-control); font-size: var(--pcbr-fs-small); }
:where(.pcbr) .pcbr-booking-context summary { display: flex; align-items: center; justify-content: space-between; gap: var(--pcbr-space-3); min-height: var(--pcbr-touch); cursor: pointer; }
:where(.pcbr) .pcbr-booking-context summary::after { content: '+'; font-size: var(--pcbr-fs-h3); }
:where(.pcbr) .pcbr-booking-context[open] summary::after { content: '−'; }
:where(.pcbr) .pcbr-booking-context summary strong { white-space: nowrap; margin-left: auto; }
:where(.pcbr) .pcbr-booking-context__route { margin: var(--pcbr-space-2) 0 0; }
:where(.pcbr) .pcbr-booking-offer__details { display: grid; gap: var(--pcbr-space-3); }
:where(.pcbr) .pcbr-booking-route { display: grid; gap: var(--pcbr-space-4); margin: 0; padding-block: var(--pcbr-space-4); border-block: 1px solid var(--pcbr-line); }
:where(.pcbr) .pcbr-booking-route div { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: var(--pcbr-space-3); }
:where(.pcbr) .pcbr-booking-route dt { color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); }
:where(.pcbr) .pcbr-booking-route dd { margin: 0; font-weight: var(--pcbr-weight-strong); }
.pujgo-wizard .pcbr-booking-offer .pujgo-wizard__price-row { display: grid; gap: var(--pcbr-space-2); }
:where(.pcbr) .pcbr-booking-flight { display: grid; gap: var(--pcbr-space-3); }
:where(.pcbr) .pcbr-booking-flight__choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--pcbr-line); }
:where(.pcbr) .pcbr-booking-flight__choices button { min-height: var(--pcbr-touch); padding: var(--pcbr-space-2) var(--pcbr-space-1); border: 0; border-bottom: 2px solid transparent; background: none; color: var(--pcbr-ink-2); font-size: var(--pcbr-fs-small); cursor: pointer; }
:where(.pcbr) .pcbr-booking-flight__choices [aria-pressed="true"] { border-bottom-color: var(--pcbr-ink); color: var(--pcbr-ink); font-weight: var(--pcbr-weight-strong); }
:where(.pcbr) .pcbr-booking-request { border-top: 1px solid var(--pcbr-line); padding-top: var(--pcbr-space-3); }
:where(.pcbr) .pcbr-booking-request summary { display: flex; align-items: center; min-height: var(--pcbr-touch); cursor: pointer; color: var(--pcbr-accent); }
:where(.pcbr) .pcbr-booking-request summary::after { content: '+'; margin-left: auto; }
:where(.pcbr) .pcbr-booking-request[open] summary::after { content: '−'; }
:where(.pcbr) .pcbr-booking-reset { margin-top: var(--pcbr-space-3); }
:where(.pcbr) :is(.pcbr-booking-context, .pcbr-booking-dropoff, .pcbr-booking-offer__details, .pcbr-booking-flight__choices, .pcbr-booking-reset)[hidden] { display: none; }
@media (max-width: 640px) {
  .pujgo-wizard.is-sheet:not([data-current-step="type"]):not([data-current-step="resume"]) .pujgo-wizard__frame { height: calc(var(--pcbr-wizard-viewport, 100dvh) - var(--pcbr-space-4)); min-height: 0; }
  .pujgo-wizard__bar { padding-bottom: var(--pcbr-space-3); }
  :where(.pcbr) .pcbr-booking-context { padding: var(--pcbr-space-1) var(--pcbr-space-3); margin-bottom: var(--pcbr-space-3); }
  .pujgo-wizard__progress { gap: var(--pcbr-space-1); }
  .pujgo-wizard__progress li { gap: var(--pcbr-space-1); }
}

:where(.pcbr) .pcbr-booking-policy summary { display: flex; align-items: center; gap: var(--pcbr-space-3); min-height: var(--pcbr-touch); font-size: var(--pcbr-fs-small); cursor: pointer; }
:where(.pcbr) .pcbr-booking-policy summary::after { content: '+'; margin-left: auto; }
:where(.pcbr) .pcbr-booking-policy[open] summary::after { content: '−'; }

:where(.pcbr) .pcbr-booking-context__actions { display: flex; flex-wrap: wrap; gap: 0 var(--pcbr-space-4); }

.pujgo-wizard .pcbr-chip { min-height: var(--pcbr-touch); }
.pujgo-wizard .pcbr-route__link { display: inline-flex; align-items: center; min-height: var(--pcbr-touch); }