#booking-continue {
  display: inline-flex;
  align-self: flex-end;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  margin-top: 8px;
  padding: 4px 2px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--primary);
  font-size: .9375rem;
  font-weight: 600;
}
#booking-continue::after {
  content: "";
  width: 7px;
  height: 7px;
  border: solid var(--accent);
  border-width: 1.5px 1.5px 0 0;
  transform: rotate(45deg);
}
#booking-continue:disabled { color: var(--muted); cursor: default; font-weight: 400; }
#booking-continue:disabled::after { border-color: currentColor; }
#booking-continue:enabled {
  align-self: stretch;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  margin-top: 14px;
  padding: 10px 18px;
  border: 1px solid var(--selected-bg);
  border-radius: 10px;
  background: var(--selected-bg);
  color: var(--selected-ink);
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.35;
}
#booking-continue:enabled::after {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-color: currentColor;
  border-width: 2px 2px 0 0;
}
#booking-continue:enabled:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
#booking-draft [hidden] { display: none !important; }
#booking-trip-feedback { margin: 8px 0 0; color: var(--error); font-size: .875rem; }
#booking-trip-feedback:empty { display: none; }
#booking-manual-addresses {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}
#booking-manual-addresses label { margin: 0 0 5px; line-height: 1.4; }
#booking-manual-addresses input {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--field-line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--primary);
  font-size: 1rem;
}
#booking-continue:focus-visible, #booking-manual-addresses input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

#booking-dialog {
  position: fixed;
  inset: var(--booking-center, 50dvh) 0 auto;
  width: min(710px, calc(100% - 24px));
  max-width: none;
  max-height: min(calc(100dvh - 24px), calc(var(--booking-viewport, 100dvh) - 24px));
  margin: 0 auto;
  padding: 0;
  transform: translateY(-50%);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--surface) 88%, var(--field-line));
  border-radius: 22px;
  color: var(--primary);
  background: linear-gradient(145deg, #ffffff80, #ffffff0a 50%, #ffffff30), color-mix(in srgb, var(--surface) 82%, transparent);
  box-shadow: 0 22px 58px #17263838;
  backdrop-filter: blur(22px) saturate(.75);
  -webkit-backdrop-filter: blur(22px) saturate(.75);
}
#booking-dialog[open] { display: flex; flex-direction: column; }
#booking-dialog::backdrop {
  background: rgb(23 36 51 / 18%);
  backdrop-filter: blur(5px) saturate(.82);
  -webkit-backdrop-filter: blur(5px) saturate(.82);
}
[data-appearance="dark"] #booking-dialog {
  background: linear-gradient(145deg, #ffffff12, #ffffff02 52%, #ffffff09), color-mix(in srgb, var(--surface) 85%, transparent);
  border-color: color-mix(in srgb, var(--field-line) 65%, var(--surface));
}
[data-appearance="dark"] #booking-dialog::backdrop { background: rgb(3 7 13 / 28%); }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  #booking-dialog, [data-appearance="dark"] #booking-dialog { background: var(--surface); }
}
@media (prefers-reduced-transparency:reduce) {
  #booking-dialog, [data-appearance="dark"] #booking-dialog { background: var(--surface); backdrop-filter: none; -webkit-backdrop-filter: none; }
  #booking-dialog::backdrop { backdrop-filter: none; -webkit-backdrop-filter: none; }
}
#booking-draft {
  display: flex;
  flex-direction: column;
  min-height: 0;
  color: var(--primary);
}
#booking-dialog-scroll {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 20px 30px 12px;
  scroll-padding-block: 12px;
}
#booking-summary-credit span { font-weight:400; }
#booking-draft .booking-progress-row {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px 16px;
  padding: 9px 22px 9px 30px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: .8125rem;
}
#booking-draft .booking-progress-row p { margin: 0; }
#booking-draft #booking-progress { font-weight: 600; color: var(--primary); }
#booking-close {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  margin-inline-start: auto;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--surface);
  color: var(--primary);
}
#booking-draft h2, #booking-draft h3 { color: var(--primary); margin: 0; }
#booking-draft h2 { font-size: 1.6875rem; line-height: 1.2; letter-spacing: -.025em; text-wrap: balance; }
#booking-draft h3, #booking-draft legend { font-size: 1.0625rem; font-weight: 600; line-height: 1.4; }
#booking-draft fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
#booking-draft legend { padding: 0 0 6px; color: var(--primary); }
#booking-draft .booking-lead { margin: 6px 0 0; font-size: .9375rem; color: var(--muted); }
#booking-draft .booking-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 26px 42px;
  margin-top: 26px;
}
#booking-draft .booking-count-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-block: 10px;
  border-bottom: 1px solid var(--line);
}
#booking-draft label { margin: 0; font-size: .9375rem; font-weight: 600; }
#booking-draft small { display: block; color: var(--muted); font-size: .8125rem; line-height: 1.45; }
#booking-draft .booking-counter {
  display: inline-grid;
  grid-template-columns: 44px 2.5rem 44px;
  align-items: stretch;
  flex-shrink: 0;
  overflow: visible;
  border: 1px solid var(--field-line);
  border-radius: 10px;
  background: var(--paper);
}
#booking-draft .booking-counter button {
  position: relative;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--primary);
}
#booking-draft .booking-counter button::before,
#booking-draft .booking-counter button[data-delta="1"]::after {
  position: absolute;
  content: "";
  top: calc(50% - 1px);
  left: calc(50% - 6px);
  width: 12px;
  height: 2px;
  background: currentColor;
}
#booking-draft .booking-counter button[data-delta="1"]::after { transform: rotate(90deg); }
#booking-draft .booking-counter button:disabled { color: var(--muted); opacity: .55; cursor: default; }
#booking-draft .booking-counter input {
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--primary);
  font-weight: 600;
  font-size: 1rem;
  text-align: center;
  appearance: textfield;
  -moz-appearance: textfield;
}
#booking-draft .booking-counter input::-webkit-inner-spin-button,
#booking-draft .booking-counter input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
#booking-draft .booking-field { display: grid; gap: 6px; margin: 14px 0 0; }
#booking-draft label small { display: inline; font-weight: 400; }
#booking-draft .booking-field input,
#booking-draft textarea,
#booking-draft #booking-child-list input,
#booking-draft #booking-child-list select {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 9px 12px;
  border: 1px solid var(--field-line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--primary);
  font: inherit;
  font-size: 1rem;
}
#booking-draft textarea { resize: vertical; }
#booking-draft :is(input,textarea)::placeholder { opacity: 1; color: var(--muted); }
#booking-draft .booking-check {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin-top: 6px;
  cursor: pointer;
  font-weight: 500;
}
#booking-draft .booking-check input {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  margin: 0;
  accent-color: var(--brand-name);
}
#booking-draft #booking-child-list > * { margin-top: 16px; }
#booking-draft #booking-child-list legend { font-size: .9375rem; }
#booking-draft #booking-child-list label { display: grid; gap: 4px; margin-block: 6px; }
#booking-draft .booking-summary-section {
  max-width: 42rem;
  margin-top: 20px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
#booking-draft .booking-summary-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
#booking-draft dl {
  display: grid;
  grid-template-columns: minmax(6.5rem, 1fr) minmax(0, 2fr);
  gap: 6px 16px;
  margin: 6px 0 0;
  font-size: .9375rem;
}
#booking-draft dl > div { display: contents; }
#booking-draft dt { color: var(--muted); }
#booking-draft dd { margin: 0; min-width: 0; white-space: pre-line; overflow-wrap: anywhere; }
#booking-draft .booking-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 25px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
#booking-draft .booking-primary,
#booking-draft .booking-secondary,
#booking-draft .booking-edit {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid var(--field-line);
  border-radius: 10px;
  font-weight: 600;
  font-size: .9375rem;
  line-height: 1.35;
  color: var(--primary);
  background: var(--surface);
}
#booking-draft .booking-primary { background: var(--selected-bg); color: var(--selected-ink); border-color: var(--selected-bg); }
#booking-draft .booking-primary:disabled { opacity: .65; cursor: default; }
#booking-draft .booking-edit { background: transparent; border: 0; padding-inline: 6px; color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
#booking-draft .booking-note-test, #booking-draft .booking-example-label { color: var(--muted); font-size: .875rem; margin: 20px 0 0; }
#booking-draft .booking-test-receipt { font-size: 1rem; font-weight: 600; margin: 12px 0 20px; }
#booking-draft blockquote {
  max-width: 38rem;
  margin: 10px 0 24px;
  padding: 14px 18px;
  border-radius: 12px;
  background: var(--tint);
  color: var(--primary);
}
#booking-draft blockquote strong { font-size: 1.0625rem; }
#booking-draft blockquote p { margin: 6px 0 0; }
#booking-draft .booking-help { margin: 6px 0 0; font-size: .8125rem; color: var(--muted); }
#booking-draft .booking-help a { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 4px; color: var(--accent); text-underline-offset: 3px; }
#booking-draft #booking-feedback { color: var(--error); margin: 0 0 10px; font-weight: 600; font-size: .875rem; }
#booking-draft #booking-feedback:empty { margin: 0; }
#booking-draft [aria-invalid="true"] { border-color: var(--error); }
#booking-draft :is(input,select,textarea,button,a):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#booking-draft h2:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
@media (hover:hover) {
  #booking-continue:enabled:hover { background: color-mix(in srgb, var(--selected-bg) 92%, var(--selected-ink)); }
  #booking-close:hover { background: var(--tint); }
  #booking-draft .booking-counter button:not(:disabled):hover,
  #booking-draft .booking-secondary:hover { background: var(--tint); }
  #booking-draft .booking-primary:not(:disabled):hover { background: color-mix(in srgb,var(--selected-bg) 94%,var(--accent)); }
}
@media (max-width:700px) {
  #booking-draft .booking-columns { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 22px; }
  #booking-dialog-scroll { padding: 18px 22px 8px; }
  #booking-draft .booking-progress-row { padding-inline: 22px 14px; }
  #booking-draft h2 { font-size: 1.375rem; }
}
@media (max-width:440px) {
  #booking-dialog-scroll { padding: 16px 18px 8px; }
  #booking-draft .booking-progress-row { padding-inline: 18px 12px; }
  #booking-draft .booking-actions { display: grid; grid-template-columns: auto minmax(0,1fr); }
  #booking-draft .booking-actions button { padding-inline: 10px; }
}
