/* Guest booking on the phone (static/js/booking-v2/guest-desk.js): the
 * desktop Booking page (static/css/booking/booking.css) on a 390px screen.
 *
 * Everything is scoped to #booking-main-area #bk-guestx and states its colour
 * with !important plus -webkit-text-fill-color, because the page's blanket
 * theme sweeps ([data-theme="light"] * * *, fixed-parent sweeps) set both on
 * every element. Neutrals are literal (white, black, hairline greys) so
 * mobile-page-colors.js can twin them into the owner's page colour; the app
 * colour is --primary-color. No grey fills: tints of the app colour or
 * hairlines instead.
 */
html body #booking-main-area #bk-guestx { 
  --bgx-paper: #ffffff;
  --bgx-ink: #0e0e0e;
  --bgx-dim: #555555;
  --bgx-faint: #8a8a8a;
  --bgx-off: #c2c2c2;
  --bgx-edge: #ececec;
  --bgx-field: #e2e2e2;
  --bgx-hl: var(--primary-color, #111111);
  --bgx-hl-soft: color-mix(in srgb, var(--primary-color, #111111) 12%, transparent);
  --bgx-hl-line: color-mix(in srgb, var(--primary-color, #111111) 40%, transparent);
  --bgx-good: #16a34a;
  --bgx-good-bg: rgba(22, 163, 74, 0.1);
  --bgx-warn: #92400e;
  --bgx-warn-bg: rgba(245, 158, 11, 0.16);
  --bgx-bad: #dc2626;
  --bgx-wide: "Archivo", -apple-system, system-ui, sans-serif;
  --bgx-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;
  display: block !important;
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 10px 0 150px !important;
  background: var(--bgx-paper) !important;
  color: var(--bgx-ink) !important;
  -webkit-text-fill-color: var(--bgx-ink) !important;
  font-family: var(--bgx-wide) !important;
  font-size: 15px !important;
  text-align: left !important;
  -webkit-font-smoothing: antialiased;
}
html body #booking-main-area #bk-guestx[hidden] { display: none !important; }
:is(html[data-theme="dark"], html[data-theme="dark-accent"]) body #booking-main-area #bk-guestx {
  --bgx-paper: #000000;
  --bgx-ink: #ffffff;
  --bgx-dim: #b4b4b8;
  --bgx-faint: #86868c;
  --bgx-off: #4a4a50;
  --bgx-edge: #232327;
  --bgx-field: #34343a;
  --bgx-hl-soft: color-mix(in srgb, var(--primary-color, #ffffff) 22%, transparent);
  --bgx-good: #4ade80;
  --bgx-good-bg: rgba(74, 222, 128, 0.14);
  --bgx-warn: #fbbf24;
  --bgx-bad: #f87171;
}
html body #booking-main-area #bk-guestx :where(*) {
  box-sizing: border-box !important;
  font-family: inherit;
  letter-spacing: normal;
  text-transform: none;
  text-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body #booking-main-area #bk-guestx :is(div, span, b, strong, small, em, p, h1, h2, h3, label, a, button, li, dt, dd, sup, section, header, aside, form, i) {
  color: var(--bgx-ink) !important;
  -webkit-text-fill-color: var(--bgx-ink) !important;
  font-family: var(--bgx-wide) !important;
  font-weight: 400 !important;
}
html body #booking-main-area #bk-guestx :is(b, strong) { font-weight: 700 !important; }
html body #booking-main-area #bk-guestx button { -webkit-tap-highlight-color: transparent; cursor: pointer; font: inherit; margin: 0; }
html body #booking-main-area #bk-guestx svg { color: inherit !important; }
html body #booking-main-area #bk-guestx .bgx-back svg { color: var(--bgx-ink) !important; stroke: var(--bgx-ink) !important; }
html body #booking-main-area #bk-guestx svg :is(path, circle, rect, line, polyline) { fill: none !important; stroke: inherit !important; color: inherit !important; }
html body #booking-main-area #bk-guestx svg { width: 17px !important; height: 17px !important; flex: 0 0 auto !important; fill: none !important; stroke: currentColor !important; stroke-width: 2 !important; stroke-linecap: round; stroke-linejoin: round; }

/* The older header, week strip and list stay underneath, out of sight. */
html body #booking-main-area.bgx-on #mobile-services-selection > .booking-header-bar,
html body #booking-main-area.bgx-on #mobile-services-selection > .mobile-booking-week-shell,
html body #booking-main-area.bgx-on #mobile-services-selection > #mobile-services-selection-list { display: none !important; }
html body #booking-main-area.bgx-on { background: #ffffff !important; }
:is(html[data-theme="dark"], html[data-theme="dark-accent"]) body #booking-main-area.bgx-on { background: #000000 !important; }

html body #booking-main-area #bk-guestx .bgx-label { font-family: var(--bgx-mono) !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.14em !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; margin: 0 0 10px !important; }

/* loading + empty */
html body #booking-main-area #bk-guestx .bgx-load { display: flex !important; flex-direction: column !important; gap: 12px !important; padding: 8px 18px !important; }
html body #booking-main-area #bk-guestx .bgx-load[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-load i { display: block !important; height: 88px !important; border-radius: 16px !important; border: 1px solid var(--bgx-edge) !important; background: linear-gradient(90deg, transparent, var(--bgx-hl-soft), transparent) !important; background-size: 200% 100% !important; animation: bgx-shimmer 1.2s linear infinite !important; }
html body #booking-main-area #bk-guestx .bgx-load i:nth-child(2) { height: 260px !important; }
@keyframes bgx-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
html body #booking-main-area #bk-guestx .bgx-empty { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 8px !important; padding: 80px 28px !important; text-align: center !important; }
html body #booking-main-area #bk-guestx .bgx-empty[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-empty strong { font-size: 22px !important; font-weight: 900 !important; }
html body #booking-main-area #bk-guestx .bgx-empty span { font-size: 15px !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; line-height: 1.5 !important; }

/* who */
html body #booking-main-area #bk-guestx .bgx-who { display: flex !important; align-items: center !important; gap: 12px !important; padding: 6px 18px 18px !important; }
html body #booking-main-area #bk-guestx .bgx-who img { width: 46px !important; height: 46px !important; border-radius: 50% !important; object-fit: cover !important; flex: 0 0 auto !important; box-shadow: 0 0 0 3px var(--bgx-paper), 0 0 0 4.5px var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-who div { display: flex !important; flex-direction: column !important; min-width: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-who small { font-family: var(--bgx-mono) !important; font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-who b { font-size: 17px !important; font-weight: 800 !important; line-height: 1.2 !important; }
html body #booking-main-area #bk-guestx .bgx-who em { font-style: normal !important; font-size: 13px !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-who em:empty { display: none !important; }

/* booking types: cards in a row */
html body #booking-main-area #bk-guestx .bgx-types { padding: 0 0 20px !important; }
html body #booking-main-area #bk-guestx .bgx-types .bgx-label { padding: 0 18px !important; }
html body #booking-main-area #bk-guestx .bgx-types__row { display: flex !important; gap: 10px !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; padding: 2px 18px 6px !important; scrollbar-width: none !important; }
html body #booking-main-area #bk-guestx .bgx-types__row::-webkit-scrollbar { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-type { flex: 0 0 76% !important; max-width: 300px !important; scroll-snap-align: start !important; scroll-margin-left: 18px !important; display: flex !important; flex-direction: column !important; gap: 6px !important; padding: 14px 16px !important; border-radius: 16px !important; border: 1.5px solid var(--bgx-edge) !important; background: var(--bgx-paper) !important; text-align: left !important; box-shadow: none !important; min-height: 0 !important; transition: border-color 0.12s, box-shadow 0.12s !important; }
html body #booking-main-area #bk-guestx .bgx-types__row.is-one .bgx-type { flex-basis: 100% !important; max-width: none !important; }
html body #booking-main-area #bk-guestx .bgx-type.is-on { border-color: var(--bgx-hl) !important; box-shadow: 0 0 0 3px var(--bgx-hl-soft) !important; }
html body #booking-main-area #bk-guestx .bgx-type__top { display: flex !important; align-items: baseline !important; gap: 10px !important; }
html body #booking-main-area #bk-guestx .bgx-type__name { flex: 1 !important; min-width: 0 !important; font-size: 15px !important; font-weight: 800 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html body #booking-main-area #bk-guestx .bgx-type__price { font-family: var(--bgx-mono) !important; font-size: 13px !important; font-weight: 700 !important; }
html body #booking-main-area #bk-guestx .bgx-type__price.is-free { color: var(--bgx-good) !important; -webkit-text-fill-color: var(--bgx-good) !important; }
html body #booking-main-area #bk-guestx .bgx-type__desc { font-size: 13px !important; line-height: 1.4 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 36px !important; }
html body #booking-main-area #bk-guestx .bgx-type__meta { display: flex !important; gap: 6px !important; flex-wrap: wrap !important; }
html body #booking-main-area #bk-guestx .bgx-type__meta span { padding: 3px 8px !important; border-radius: 6px !important; border: 1px solid var(--bgx-edge) !important; font-size: 11px !important; font-weight: 700 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }

/* the chosen type */
html body #booking-main-area #bk-guestx .bgx-svc { display: flex !important; flex-direction: column !important; gap: 10px !important; padding: 18px 18px 22px !important; border-top: 1px solid var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-svc h1 { margin: 0 !important; font-size: 28px !important; font-weight: 900 !important; font-stretch: 108% !important; letter-spacing: -0.025em !important; line-height: 1.08 !important; overflow-wrap: anywhere !important; }
html body #booking-main-area #bk-guestx .bgx-svc p { margin: 0 !important; font-size: 15px !important; line-height: 1.5 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; white-space: pre-wrap !important; }
html body #booking-main-area #bk-guestx .bgx-svc p:empty { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-facts { display: flex !important; flex-direction: column !important; gap: 9px !important; margin-top: 2px !important; }
html body #booking-main-area #bk-guestx .bgx-fact { display: flex !important; align-items: center !important; gap: 10px !important; font-size: 14px !important; font-weight: 600 !important; }
html body #booking-main-area #bk-guestx .bgx-fact svg { color: var(--bgx-dim) !important; }

/* the month */
html body #booking-main-area #bk-guestx .bgx-cal { display: flex !important; flex-direction: column !important; gap: 16px !important; padding: 20px 18px !important; border-top: 1px solid var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-soon[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-soon__row { display: flex !important; gap: 8px !important; overflow-x: auto !important; margin: 0 -18px !important; padding: 0 18px 2px !important; scrollbar-width: none !important; }
html body #booking-main-area #bk-guestx .bgx-soon__row::-webkit-scrollbar { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-chip { flex: 0 0 auto !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 1px !important; padding: 8px 14px !important; border-radius: 12px !important; border: 1.5px solid var(--bgx-edge) !important; background: var(--bgx-paper) !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-chip strong { font-size: 14px !important; font-weight: 800 !important; }
html body #booking-main-area #bk-guestx .bgx-chip span { font-size: 12px !important; font-weight: 700 !important; color: var(--bgx-good) !important; -webkit-text-fill-color: var(--bgx-good) !important; }
html body #booking-main-area #bk-guestx .bgx-chip.is-on { border-color: var(--bgx-hl) !important; background: var(--bgx-hl-soft) !important; }
html body #booking-main-area #bk-guestx .bgx-cal__head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; }
html body #booking-main-area #bk-guestx .bgx-cal__month { font-size: 20px !important; font-weight: 900 !important; }
html body #booking-main-area #bk-guestx .bgx-cal__month span { font-size: 20px !important; font-weight: 900 !important; }
html body #booking-main-area #bk-guestx .bgx-cal__month .bgx-cal__year { color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; font-weight: 600 !important; }
html body #booking-main-area #bk-guestx .bgx-cal__nav { display: flex !important; gap: 6px !important; }
html body #booking-main-area #bk-guestx .bgx-nav { width: 38px !important; height: 38px !important; border-radius: 50% !important; border: 1.5px solid var(--bgx-field) !important; background: var(--bgx-paper) !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1 !important; padding: 0 !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-nav:disabled { color: var(--bgx-off) !important; -webkit-text-fill-color: var(--bgx-off) !important; border-color: var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-gridwrap { position: relative !important; }
html body #booking-main-area #bk-guestx .bgx-grid { display: grid !important; grid-template-columns: repeat(7, minmax(0, 1fr)) !important; gap: 4px !important; }
html body #booking-main-area #bk-guestx .bgx-grid.is-dead { opacity: 0.3 !important; pointer-events: none !important; }
html body #booking-main-area #bk-guestx .bgx-dow { font-family: var(--bgx-mono) !important; font-size: 11px !important; font-weight: 700 !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; text-align: center !important; padding: 2px 0 6px !important; }
html body #booking-main-area #bk-guestx .bgx-day { position: relative !important; aspect-ratio: 1 !important; min-width: 0 !important; width: 100% !important; padding: 0 !important; border-radius: 50% !important; border: 0 !important; background: transparent !important; font-size: 15px !important; font-weight: 500 !important; color: var(--bgx-off) !important; -webkit-text-fill-color: var(--bgx-off) !important; box-shadow: none !important; min-height: 0 !important; cursor: default !important; }
html body #booking-main-area #bk-guestx .bgx-day.is-today { text-decoration: underline !important; text-underline-offset: 4px !important; }
html body #booking-main-area #bk-guestx .bgx-day.is-full { text-decoration: line-through !important; }
html body #booking-main-area #bk-guestx .bgx-day.is-open { background: var(--bgx-hl-soft) !important; color: var(--bgx-ink) !important; -webkit-text-fill-color: var(--bgx-ink) !important; font-weight: 800 !important; cursor: pointer !important; }
html body #booking-main-area #bk-guestx .bgx-day.is-on { background: var(--bgx-hl) !important; color: var(--bgx-on-hl, #fff) !important; -webkit-text-fill-color: var(--bgx-on-hl, #fff) !important; font-weight: 800 !important; }
html body #booking-main-area #bk-guestx .bgx-day__dot { position: absolute !important; left: 50% !important; bottom: 14% !important; width: 4px !important; height: 4px !important; margin-left: -2px !important; border-radius: 50% !important; background: currentColor !important; opacity: 0.7 !important; }
html body #booking-main-area #bk-guestx .bgx-day.is-on .bgx-day__dot { background: var(--bgx-on-hl, #fff) !important; }
html body #booking-main-area #bk-guestx .bgx-day--blank { visibility: hidden !important; }
html body #booking-main-area #bk-guestx .bgx-nomonth { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -45%) !important; width: 92% !important; padding: 20px !important; border-radius: 16px !important; background: var(--bgx-paper) !important; border: 1.5px solid var(--bgx-edge) !important; box-shadow: 0 18px 50px rgba(0, 0, 0, 0.14) !important; text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important; gap: 6px !important; }
html body #booking-main-area #bk-guestx .bgx-nomonth[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-nomonth strong { font-size: 17px !important; font-weight: 900 !important; }
html body #booking-main-area #bk-guestx .bgx-nomonth span { font-size: 14px !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; margin-bottom: 6px !important; }

/* the times */
html body #booking-main-area #bk-guestx .bgx-times { display: flex !important; flex-direction: column !important; gap: 12px !important; padding: 20px 18px 8px !important; border-top: 1px solid var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-times__head { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 8px !important; }
html body #booking-main-area #bk-guestx .bgx-times__day { font-size: 19px !important; font-weight: 900 !important; }
html body #booking-main-area #bk-guestx .bgx-times__sub { margin-top: 3px !important; font-size: 13px !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-times__sub:empty { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-fmt { display: flex !important; padding: 3px !important; border-radius: 10px !important; border: 1px solid var(--bgx-edge) !important; flex: 0 0 auto !important; }
html body #booking-main-area #bk-guestx .bgx-fmt button { height: 28px !important; padding: 0 10px !important; border-radius: 7px !important; border: 0 !important; background: transparent !important; font-family: var(--bgx-mono) !important; font-size: 11px !important; font-weight: 700 !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-fmt button[aria-pressed="true"] { background: var(--bgx-hl-soft) !important; color: var(--bgx-ink) !important; -webkit-text-fill-color: var(--bgx-ink) !important; }
html body #booking-main-area #bk-guestx .bgx-tz { display: flex !important; align-items: center !important; gap: 8px !important; height: 42px !important; padding: 0 12px !important; border-radius: 12px !important; border: 1.5px solid var(--bgx-edge) !important; background: var(--bgx-paper) !important; }
html body #booking-main-area #bk-guestx .bgx-tz[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-tz svg { color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-tz select { flex: 1 !important; min-width: 0 !important; height: 40px !important; border: 0 !important; background: transparent !important; color: var(--bgx-ink) !important; -webkit-text-fill-color: var(--bgx-ink) !important; font-family: var(--bgx-wide) !important; font-size: 14px !important; font-weight: 700 !important; outline: none !important; -webkit-appearance: none !important; appearance: none !important; }
html body #booking-main-area #bk-guestx .bgx-tznote { margin: -4px 0 0 !important; font-size: 12.5px !important; line-height: 1.45 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-tznote[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-slots { display: flex !important; flex-direction: column !important; gap: 16px !important; padding-bottom: 8px !important; }
html body #booking-main-area #bk-guestx .bgx-tgroup__label { font-family: var(--bgx-mono) !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; margin-bottom: 8px !important; }
html body #booking-main-area #bk-guestx .bgx-tgrid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
html body #booking-main-area #bk-guestx .bgx-slot { position: relative !important; height: 46px !important; padding: 0 !important; border-radius: 12px !important; border: 1.5px solid var(--bgx-field) !important; background: var(--bgx-paper) !important; font-family: var(--bgx-mono) !important; font-size: 14px !important; font-weight: 700 !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-slot.is-on { background: var(--bgx-hl) !important; border-color: var(--bgx-hl) !important; color: var(--bgx-on-hl, #fff) !important; -webkit-text-fill-color: var(--bgx-on-hl, #fff) !important; }
html body #booking-main-area #bk-guestx .bgx-slot sup { margin-left: 3px !important; font-size: 9px !important; opacity: 0.7 !important; color: inherit !important; -webkit-text-fill-color: currentColor !important; }
html body #booking-main-area #bk-guestx .bgx-none { padding: 14px 2px !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }

/* sticky Continue, above the booking nav */
html body #booking-main-area #bk-guestx .bgx-bar { position: sticky !important; z-index: 5 !important; bottom: var(--bgx-nav, 96px) !important; margin: 12px 12px 0 !important; padding: 12px 12px 12px 16px !important; border-radius: 18px !important; background: var(--bgx-paper) !important; border: 1px solid var(--bgx-edge) !important; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.16) !important; display: flex !important; align-items: center !important; gap: 12px !important; animation: bgx-in 0.18s ease !important; }
html body #booking-main-area #bk-guestx .bgx-bar[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-bar__pick { flex: 1 !important; min-width: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-bar__pick strong { display: block !important; font-size: 13.5px !important; font-weight: 800 !important; line-height: 1.3 !important; }
html body #booking-main-area #bk-guestx .bgx-bar__pick span { display: block !important; margin-top: 2px !important; font-size: 12px !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html body #booking-main-area #bk-guestx .bgx-bar .bgx-btn { flex: 0 0 auto !important; min-width: 118px !important; }
@keyframes bgx-in { from { opacity: 0; transform: translateY(8px); } }

/* buttons */
html body #booking-main-area #bk-guestx .bgx-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; height: 44px !important; padding: 0 18px !important; border-radius: 12px !important; border: 0 !important; background: transparent !important; font-size: 14px !important; font-weight: 800 !important; white-space: nowrap !important; text-decoration: none !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-btn--solid { background: var(--bgx-hl) !important; color: var(--bgx-on-hl, #fff) !important; -webkit-text-fill-color: var(--bgx-on-hl, #fff) !important; }
html body #booking-main-area #bk-guestx .bgx-btn--solid:disabled { opacity: 0.35 !important; }
/* .bgx-btn's display:inline-flex !important beat the hidden attribute, so the
   "No openings in <month>" card showed its Jump-to button with no label when
   there was no next date to jump to: an empty orange block. */
html body #booking-main-area #bk-guestx .bgx-btn[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-btn--line { height: 42px !important; padding: 0 16px !important; border: 1.5px solid var(--bgx-field) !important; background: var(--bgx-paper) !important; font-size: 13px !important; }
html body #booking-main-area #bk-guestx .bgx-btn--ghost { color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-btn--wide { height: 52px !important; padding: 0 22px !important; font-size: 15px !important; border-radius: 14px !important; }
html body #booking-main-area #bk-guestx .bgx-btn.is-busy { position: relative !important; color: transparent !important; -webkit-text-fill-color: transparent !important; opacity: 0.9 !important; }
html body #booking-main-area #bk-guestx .bgx-btn.is-busy::after { content: "" !important; position: absolute !important; left: 50% !important; top: 50% !important; width: 18px !important; height: 18px !important; margin: -9px 0 0 -9px !important; border-radius: 50% !important; border: 2px solid var(--bgx-on-hl, #fff) !important; border-top-color: transparent !important; animation: bgx-spin 0.7s linear infinite !important; }
@keyframes bgx-spin { to { transform: rotate(360deg); } }
html body #booking-main-area #bk-guestx .bgx-danger { color: var(--bgx-bad) !important; -webkit-text-fill-color: var(--bgx-bad) !important; }

/* ---------------------------------------------------------------- checkout */
html body #booking-main-area #bk-guestx .bgx-co { display: flex !important; flex-direction: column !important; gap: 18px !important; padding: 4px 18px 0 !important; animation: bgx-in 0.18s ease !important; }
html body #booking-main-area #bk-guestx .bgx-co[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-co__top { display: flex !important; align-items: center !important; gap: 12px !important; }
html body #booking-main-area #bk-guestx .bgx-back { width: 38px !important; height: 38px !important; flex: 0 0 auto !important; display: grid !important; place-items: center !important; border-radius: 50% !important; border: 1.5px solid var(--bgx-field) !important; background: var(--bgx-paper) !important; padding: 0 !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-back[hidden] { visibility: hidden !important; display: grid !important; }
html body #booking-main-area #bk-guestx .bgx-steps { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; flex: 1 !important; min-width: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-steps__item { display: flex !important; align-items: center !important; gap: 6px !important; flex: 0 1 auto !important; min-width: 0 !important; font-size: 12px !important; font-weight: 700 !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-steps__item + .bgx-steps__item::before { content: "" !important; width: 12px !important; height: 2px !important; margin: 0 6px 0 2px !important; border-radius: 1px !important; background: var(--bgx-edge) !important; flex: 0 0 auto !important; }
html body #booking-main-area #bk-guestx .bgx-steps__item.is-done + .bgx-steps__item::before, html body #booking-main-area #bk-guestx .bgx-steps__item.is-on::before { background: var(--bgx-hl) !important; }
html body #booking-main-area #bk-guestx .bgx-steps__dot { width: 22px !important; height: 22px !important; flex: 0 0 auto !important; border-radius: 50% !important; display: grid !important; place-items: center !important; border: 1.5px solid var(--bgx-field) !important; font-family: var(--bgx-mono) !important; font-size: 11px !important; font-weight: 700 !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-steps__dot svg { width: 12px !important; height: 12px !important; stroke-width: 3 !important; }
html body #booking-main-area #bk-guestx .bgx-steps__item.is-on .bgx-steps__label, html body #booking-main-area #bk-guestx .bgx-steps__item.is-done .bgx-steps__label { color: var(--bgx-ink) !important; -webkit-text-fill-color: var(--bgx-ink) !important; }
html body #booking-main-area #bk-guestx .bgx-steps__label { color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; font-size: 12px !important; font-weight: 700 !important; }
html body #booking-main-area #bk-guestx .bgx-steps__item.is-on .bgx-steps__dot { background: var(--bgx-hl) !important; border-color: var(--bgx-hl) !important; color: var(--bgx-on-hl, #fff) !important; -webkit-text-fill-color: var(--bgx-on-hl, #fff) !important; }
html body #booking-main-area #bk-guestx .bgx-steps__item.is-done .bgx-steps__dot { background: var(--bgx-hl-soft) !important; border-color: transparent !important; color: var(--bgx-hl) !important; -webkit-text-fill-color: var(--bgx-hl) !important; }
html body #booking-main-area #bk-guestx .bgx-steps__item.is-done .bgx-steps__dot svg { color: var(--bgx-hl) !important; }

/* order summary */
html body #booking-main-area #bk-guestx .bgx-sum { display: flex !important; flex-direction: column !important; gap: 14px !important; padding: 16px !important; border-radius: 18px !important; border: 1.5px solid var(--bgx-edge) !important; background: var(--bgx-paper) !important; box-shadow: 0 12px 34px rgba(0, 0, 0, 0.06) !important; }
html body #booking-main-area #bk-guestx .bgx-sum.is-folded { gap: 10px !important; padding: 12px 14px !important; }
html body #booking-main-area #bk-guestx .bgx-sum__line { display: flex !important; align-items: center !important; gap: 8px !important; width: 100% !important; padding: 10px 0 0 !important; border: 0 !important; border-top: 1px solid var(--bgx-edge) !important; background: transparent !important; text-align: left !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-sum__line svg { color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-sum__line span { flex: 1 !important; min-width: 0 !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1.3 !important; }
html body #booking-main-area #bk-guestx .bgx-sum__line b { font-family: var(--bgx-mono) !important; font-size: 14px !important; font-weight: 700 !important; }
html body #booking-main-area #bk-guestx .bgx-sum__line em { font-style: normal !important; font-size: 12px !important; font-weight: 700 !important; color: var(--bgx-hl) !important; -webkit-text-fill-color: var(--bgx-hl) !important; }
html body #booking-main-area #bk-guestx .bgx-sum__fold { align-self: flex-start !important; padding: 0 !important; border: 0 !important; background: transparent !important; font-size: 12px !important; font-weight: 700 !important; color: var(--bgx-hl) !important; -webkit-text-fill-color: var(--bgx-hl) !important; box-shadow: none !important; min-height: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-sum__who { display: flex !important; align-items: center !important; gap: 10px !important; }
html body #booking-main-area #bk-guestx .bgx-sum__who img { width: 38px !important; height: 38px !important; border-radius: 50% !important; object-fit: cover !important; }
html body #booking-main-area #bk-guestx .bgx-sum__who > div { flex: 1 !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; }
html body #booking-main-area #bk-guestx .bgx-sum__who b { font-size: 16px !important; font-weight: 900 !important; line-height: 1.2 !important; overflow-wrap: anywhere !important; }
html body #booking-main-area #bk-guestx .bgx-sum__who small { font-size: 12.5px !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-badge { padding: 4px 10px !important; border-radius: 20px !important; font-size: 12px !important; font-weight: 800 !important; }
html body #booking-main-area #bk-guestx .bgx-badge.is-ok { background: var(--bgx-good-bg) !important; color: var(--bgx-good) !important; -webkit-text-fill-color: var(--bgx-good) !important; }
html body #booking-main-area #bk-guestx .bgx-badge.is-wait { background: var(--bgx-warn-bg) !important; color: var(--bgx-warn) !important; -webkit-text-fill-color: var(--bgx-warn) !important; }
html body #booking-main-area #bk-guestx .bgx-badge.is-off { border: 1px solid var(--bgx-edge) !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-sum__facts { display: flex !important; flex-direction: column !important; gap: 10px !important; }
html body #booking-main-area #bk-guestx .bgx-sum__fact { display: flex !important; gap: 10px !important; align-items: flex-start !important; }
html body #booking-main-area #bk-guestx .bgx-sum__fact svg { margin-top: 1px !important; color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-sum__fact div { display: flex !important; flex-direction: column !important; gap: 2px !important; min-width: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-sum__fact span { font-size: 14px !important; font-weight: 700 !important; line-height: 1.35 !important; }
html body #booking-main-area #bk-guestx .bgx-sum__fact small { font-size: 12px !important; line-height: 1.4 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-sum__rows { margin: 0 !important; padding-top: 12px !important; border-top: 1px solid var(--bgx-edge) !important; display: grid !important; grid-template-columns: 1fr auto !important; gap: 7px 0 !important; font-size: 14px !important; }
html body #booking-main-area #bk-guestx .bgx-sum__rows dt { color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; font-size: 14px !important; }
html body #booking-main-area #bk-guestx .bgx-sum__rows dd { margin: 0 !important; padding-left: 14px !important; font-family: var(--bgx-mono) !important; font-weight: 700 !important; text-align: right !important; font-size: 14px !important; }
html body #booking-main-area #bk-guestx .bgx-sum__rows .is-total { padding-top: 9px !important; border-top: 1px solid var(--bgx-edge) !important; color: var(--bgx-ink) !important; -webkit-text-fill-color: var(--bgx-ink) !important; font-size: 16px !important; font-weight: 900 !important; }
html body #booking-main-area #bk-guestx .bgx-sum__hold { display: flex !important; flex-direction: column !important; gap: 6px !important; }
html body #booking-main-area #bk-guestx .bgx-sum__hold[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-sum__hold span { font-size: 12px !important; font-weight: 700 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-sum__bar { height: 4px !important; border-radius: 2px !important; border: 0 !important; background: var(--bgx-edge) !important; overflow: hidden !important; }
html body #booking-main-area #bk-guestx .bgx-sum__bar i { display: block !important; height: 100% !important; background: var(--bgx-good) !important; border-radius: 2px !important; transition: width 1s linear !important; }
html body #booking-main-area #bk-guestx .bgx-sum__hold.is-low span { color: var(--bgx-warn) !important; -webkit-text-fill-color: var(--bgx-warn) !important; }
html body #booking-main-area #bk-guestx .bgx-sum__hold.is-low .bgx-sum__bar i { background: #f59e0b !important; }
html body #booking-main-area #bk-guestx .bgx-sum__hold.is-out span { color: var(--bgx-bad) !important; -webkit-text-fill-color: var(--bgx-bad) !important; }

/* steps */
html body #booking-main-area #bk-guestx .bgx-step { display: flex !important; flex-direction: column !important; gap: 16px !important; animation: bgx-in 0.18s ease !important; }
html body #booking-main-area #bk-guestx .bgx-step[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-step__title { margin: 4px 0 0 !important; font-size: 26px !important; font-weight: 900 !important; font-stretch: 108% !important; letter-spacing: -0.02em !important; }
html body #booking-main-area #bk-guestx .bgx-step__sub { margin: -8px 0 0 !important; font-size: 14.5px !important; line-height: 1.5 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-seg { display: grid !important; grid-template-columns: 1fr 1fr !important; padding: 3px !important; border-radius: 12px !important; border: 1px solid var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-seg button { height: 36px !important; border-radius: 9px !important; border: 0 !important; background: transparent !important; font-size: 13px !important; font-weight: 700 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; box-shadow: none !important; min-height: 0 !important; padding: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-seg button[aria-pressed="true"] { background: var(--bgx-hl-soft) !important; color: var(--bgx-ink) !important; -webkit-text-fill-color: var(--bgx-ink) !important; }
html body #booking-main-area #bk-guestx .bgx-field { display: flex !important; flex-direction: column !important; gap: 7px !important; margin-bottom: 14px !important; }
/* Signed in: the guest/app switch and the login fields step aside. */
html body #booking-main-area #bk-guestx .bgx-seg[hidden],
html body #booking-main-area #bk-guestx .bgx-field[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-field > span { font-size: 14px !important; font-weight: 700 !important; }
html body #booking-main-area #bk-guestx .bgx-field input { height: 52px !important; width: 100% !important; padding: 0 16px !important; border-radius: 12px !important; border: 1.5px solid var(--bgx-field) !important; background: var(--bgx-paper) !important; color: var(--bgx-ink) !important; -webkit-text-fill-color: var(--bgx-ink) !important; font-family: var(--bgx-wide) !important; font-size: 16px !important; outline: none !important; box-shadow: none !important; -webkit-appearance: none !important; appearance: none !important; }
html body #booking-main-area #bk-guestx .bgx-field input::placeholder { color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-field input:focus { border-color: var(--bgx-hl) !important; box-shadow: 0 0 0 3px var(--bgx-hl-soft) !important; }
html body #booking-main-area #bk-guestx .bgx-field.is-good input { border-color: var(--bgx-good) !important; }
html body #booking-main-area #bk-guestx .bgx-field.is-good input:focus { border-color: var(--bgx-hl) !important; }
html body #booking-main-area #bk-guestx .bgx-field.is-bad input { border-color: var(--bgx-bad) !important; }
html body #booking-main-area #bk-guestx .bgx-field__msg { font-size: 13px !important; font-weight: 600 !important; color: var(--bgx-bad) !important; -webkit-text-fill-color: var(--bgx-bad) !important; }
html body #booking-main-area #bk-guestx .bgx-field__msg:empty { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-note { margin: 0 !important; font-size: 13px !important; font-weight: 700 !important; color: var(--bgx-good) !important; -webkit-text-fill-color: var(--bgx-good) !important; }
html body #booking-main-area #bk-guestx .bgx-note[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-err { margin: 0 !important; font-size: 13px !important; font-weight: 600 !important; color: var(--bgx-bad) !important; -webkit-text-fill-color: var(--bgx-bad) !important; }
html body #booking-main-area #bk-guestx .bgx-err:empty { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-express[hidden], html body #booking-main-area #bk-guestx .bgx-or[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-or { display: flex !important; align-items: center !important; gap: 12px !important; font-size: 12px !important; font-weight: 700 !important; }
html body #booking-main-area #bk-guestx .bgx-or span { color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-or::before, html body #booking-main-area #bk-guestx .bgx-or::after { content: "" !important; flex: 1 !important; height: 1px !important; background: var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-payel { min-height: 120px !important; }
html body #booking-main-area #bk-guestx .bgx-alert { display: flex !important; align-items: flex-start !important; gap: 10px !important; padding: 12px 14px !important; border-radius: 12px !important; border: 1px solid color-mix(in srgb, var(--bgx-bad) 35%, transparent) !important; background: color-mix(in srgb, var(--bgx-bad) 8%, transparent) !important; }
html body #booking-main-area #bk-guestx .bgx-alert[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-alert svg { color: var(--bgx-bad) !important; margin-top: 1px !important; }
html body #booking-main-area #bk-guestx .bgx-alert span { font-size: 14px !important; font-weight: 700 !important; line-height: 1.4 !important; color: var(--bgx-bad) !important; -webkit-text-fill-color: var(--bgx-bad) !important; }
html body #booking-main-area #bk-guestx .bgx-secure { display: flex !important; align-items: center !important; gap: 8px !important; margin: 0 !important; font-size: 12px !important; line-height: 1.4 !important; color: var(--bgx-faint) !important; -webkit-text-fill-color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-secure svg { width: 14px !important; height: 14px !important; color: var(--bgx-faint) !important; }
html body #booking-main-area #bk-guestx .bgx-cobar { position: sticky !important; z-index: 5 !important; bottom: var(--bgx-nav, 96px) !important; margin: 4px -6px 0 !important; padding: 8px !important; border-radius: 20px !important; background: var(--bgx-paper) !important; border: 1px solid var(--bgx-edge) !important; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.14) !important; }
html body #booking-main-area #bk-guestx .bgx-cobar[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-cobar .bgx-btn { width: 100% !important; }

/* confirmed */
html body #booking-main-area #bk-guestx .bgx-done { align-items: flex-start !important; }
html body #booking-main-area #bk-guestx .bgx-done__mark { width: 62px !important; height: 62px !important; border-radius: 50% !important; background: var(--bgx-good) !important; display: grid !important; place-items: center !important; animation: bgx-pop 0.4s cubic-bezier(0.2, 1.4, 0.4, 1) !important; }
html body #booking-main-area #bk-guestx .bgx-done__mark svg { width: 32px !important; height: 32px !important; stroke-width: 3 !important; color: #ffffff !important; }
html body #booking-main-area #bk-guestx .bgx-done.is-cancelled .bgx-done__mark { background: transparent !important; border: 1.5px solid var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-done.is-cancelled .bgx-done__mark svg { color: var(--bgx-faint) !important; }
@keyframes bgx-pop { from { transform: scale(0.4); opacity: 0; } }
html body #booking-main-area #bk-guestx .bgx-done__title { margin: 0 !important; font-size: 30px !important; font-weight: 900 !important; font-stretch: 108% !important; letter-spacing: -0.02em !important; }
html body #booking-main-area #bk-guestx .bgx-done__line { margin: -6px 0 0 !important; font-size: 15px !important; line-height: 1.5 !important; color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; }
html body #booking-main-area #bk-guestx .bgx-done__cal { display: flex !important; flex-direction: column !important; width: 100% !important; }
html body #booking-main-area #bk-guestx .bgx-done__cal[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-done__calbtns { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
html body #booking-main-area #bk-guestx .bgx-done__calbtns .bgx-btn { padding: 0 8px !important; }
html body #booking-main-area #bk-guestx .bgx-done__join { display: block !important; width: 100% !important; padding: 12px 14px !important; border-radius: 12px !important; background: var(--bgx-hl-soft) !important; color: var(--bgx-hl) !important; -webkit-text-fill-color: var(--bgx-hl) !important; font-size: 14px !important; font-weight: 800 !important; text-decoration: none !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html body #booking-main-area #bk-guestx .bgx-done__join[hidden] { display: none !important; }
html body #booking-main-area #bk-guestx .bgx-done__rows { width: 100% !important; border-top: 1px solid var(--bgx-edge) !important; }
html body #booking-main-area #bk-guestx .bgx-done__row { display: flex !important; justify-content: space-between !important; gap: 16px !important; padding: 12px 0 !important; border-bottom: 1px solid var(--bgx-edge) !important; font-size: 14px !important; }
html body #booking-main-area #bk-guestx .bgx-done__row span { color: var(--bgx-dim) !important; -webkit-text-fill-color: var(--bgx-dim) !important; flex: 0 0 auto !important; }
html body #booking-main-area #bk-guestx .bgx-done__row b, html body #booking-main-area #bk-guestx .bgx-done__row a { font-weight: 700 !important; text-align: right !important; overflow-wrap: anywhere !important; min-width: 0 !important; }
html body #booking-main-area #bk-guestx .bgx-done__row a { text-decoration: underline !important; text-underline-offset: 3px !important; }
html body #booking-main-area #bk-guestx .bgx-done .bgx-danger { align-self: center !important; }
html body #booking-main-area #bk-guestx .bgx-again { width: 100% !important; }


/* ================================================================ owner
 * The booking owner's Home and Dashboard (#bk-odx, booking-v2/owner-feed.js)
 * in the desktop dashboard's type: Inter, tabular figures. The shared card
 * system lives in mobile-owner-dash.css; these are the booking-only pieces.
 */
html body #bk-odx#bk-odx.odx { --odx-font: "Inter", -apple-system, system-ui, sans-serif; font-variant-numeric: tabular-nums !important; }
html body #bk-odx#bk-odx.odx .odx-num { font-variant-numeric: tabular-nums !important; }
html body #bk-odx#bk-odx.odx .odx-head .odx-btn { flex: 0 0 auto !important; }
html body #bk-odx#bk-odx.odx .odx-tabs { gap: 18px !important; }
html body #bk-odx#bk-odx.odx .odx-tab { flex: 0 0 auto !important; }
html body #bk-odx#bk-odx.odx .odx-card__acts { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; margin-top: 12px !important; }
html body #bk-odx#bk-odx.odx .odx-card.is-flush .odx-card__acts { padding: 0 14px 14px !important; }
html body #bk-odx#bk-odx.odx .odx-svc { display: flex !important; align-items: center !important; gap: 12px !important; width: 100% !important; min-height: 52px !important; padding: 10px 0 !important; border: 0 !important; border-top: 1px solid var(--odx-line) !important; border-radius: 0 !important; text-align: left !important; }
html body #bk-odx#bk-odx.odx .odx-card__head + .odx-svc { border-top: 0 !important; padding-top: 2px !important; }
html body #bk-odx#bk-odx.odx .odx-card.is-flush > .odx-svc { padding: 11px 14px !important; }
html body #bk-odx#bk-odx.odx .odx-card.is-flush > .odx-svc:first-child { border-top: 0 !important; }
html body #bk-odx#bk-odx.odx .odx-svc__copy { flex: 1 !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 2px !important; }
html body #bk-odx#bk-odx.odx .odx-svc__copy b { font-size: 14px !important; font-weight: 600 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html body #bk-odx#bk-odx.odx .odx-svc__copy span { font-size: 12.5px !important; color: var(--odx-mute) !important; -webkit-text-fill-color: var(--odx-mute) !important; }
html body #bk-odx#bk-odx.odx .odx-svc__copy em.is-warn, html body #bk-odx#bk-odx.odx .odx-num.is-warn { font-style: normal !important; color: var(--odx-warn) !important; -webkit-text-fill-color: var(--odx-warn) !important; }
html body #bk-odx#bk-odx.odx .odx-svc__end { flex: 0 0 auto !important; display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 1px !important; }
html body #bk-odx#bk-odx.odx .odx-svc__end b { font-size: 14px !important; font-weight: 600 !important; }
html body #bk-odx#bk-odx.odx .odx-svc__end small { font-size: 11.5px !important; color: var(--odx-mute) !important; -webkit-text-fill-color: var(--odx-mute) !important; }
html body #bk-odx#bk-odx.odx .odx-earn { display: flex !important; flex-direction: column !important; gap: 3px !important; padding: 9px 0 !important; border-top: 1px solid var(--odx-line) !important; }
html body #bk-odx#bk-odx.odx .odx-card__head + .odx-earn { border-top: 0 !important; padding-top: 2px !important; }
html body #bk-odx#bk-odx.odx .odx-earn__top { display: flex !important; justify-content: space-between !important; gap: 10px !important; }
html body #bk-odx#bk-odx.odx .odx-earn__top b { font-size: 14px !important; font-weight: 600 !important; }
html body #bk-odx#bk-odx.odx .odx-earn > span { font-size: 12px !important; color: var(--odx-mute) !important; -webkit-text-fill-color: var(--odx-mute) !important; }

/* ------------------------------------------------ the booking drawer (sheet) */
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx {
  --bdx-paper: #ffffff; --bdx-ink: #0a0a0a; --bdx-mute: #5f6068; --bdx-faint: #8b8c93; --bdx-line: #efefef; --bdx-edge: #e6e6e6;
  --bdx-hl: var(--primary-color, #111111); --bdx-good: #16a34a; --bdx-warn: #b45309; --bdx-warn-bg: #fef3c7; --bdx-bad: #dc2626;
  position: fixed !important; inset: 0 !important; z-index: 250000 !important; display: flex !important; align-items: flex-end !important;
  font-family: "Inter", -apple-system, system-ui, sans-serif !important; font-variant-numeric: tabular-nums !important;
  color: var(--bdx-ink) !important; -webkit-text-fill-color: var(--bdx-ink) !important;
}
:is(html[data-theme="dark"], html[data-theme="dark-accent"]) body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx {
  --bdx-paper: #000000; --bdx-ink: #f4f4f5; --bdx-mute: #a9a9b1; --bdx-faint: #7c7c85; --bdx-line: #1f1f24; --bdx-edge: #26262b;
  --bdx-good: #4ade80; --bdx-warn: #fbbf24; --bdx-warn-bg: rgba(245, 158, 11, 0.14); --bdx-bad: #f87171;
}
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx :where(*) { box-sizing: border-box !important; font-family: inherit !important; letter-spacing: normal !important; text-transform: none !important; text-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx :is(div, span, b, strong, small, em, p, h3, h4, a, button, li, section, header) { color: var(--bdx-ink) !important; -webkit-text-fill-color: var(--bdx-ink) !important; font-weight: 400 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx :is(b, strong) { font-weight: 600 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx button { -webkit-tap-highlight-color: transparent; cursor: pointer; font: inherit; margin: 0; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-backdrop { position: absolute !important; inset: 0 !important; background: rgba(10, 10, 12, 0.36) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-sheet { position: relative !important; z-index: 1 !important; width: 100% !important; max-height: 90vh !important; overflow-y: auto !important; background: var(--bdx-paper) !important; border-radius: 20px 20px 0 0 !important; border-top: 1px solid var(--bdx-edge) !important; padding: 10px 18px calc(28px + env(safe-area-inset-bottom, 0px)) !important; display: flex !important; flex-direction: column !important; gap: 16px !important; box-shadow: 0 -18px 48px rgba(0, 0, 0, 0.18) !important; animation: bdx-up 0.22s cubic-bezier(0.2, 0.8, 0.2, 1) !important; }
@keyframes bdx-up { from { transform: translateY(24px); opacity: 0; } }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-grab { align-self: center !important; width: 36px !important; height: 4px !important; border-radius: 2px !important; background: var(--bdx-edge) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-x { position: absolute !important; top: 14px !important; right: 14px !important; width: 32px !important; height: 32px !important; border-radius: 9px !important; border: 1px solid var(--bdx-edge) !important; background: var(--bdx-paper) !important; font-size: 13px !important; padding: 0 !important; min-height: 0 !important; box-shadow: none !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-head { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 6px !important; padding-right: 40px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-head h3 { margin: 0 !important; font-size: 20px !important; font-weight: 650 !important; letter-spacing: -0.01em !important; line-height: 1.2 !important; overflow-wrap: anywhere !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-head p { margin: 0 !important; font-size: 13.5px !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-pill { display: inline-flex !important; align-items: center !important; gap: 5px !important; height: 22px !important; padding: 0 9px !important; border-radius: 11px !important; font-size: 12px !important; font-weight: 600 !important; border: 1px solid var(--bdx-edge) !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-pill::before { content: "" !important; width: 6px !important; height: 6px !important; border-radius: 50% !important; background: currentColor !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-pill.is-pending { background: var(--bdx-warn-bg) !important; border-color: transparent !important; color: var(--bdx-warn) !important; -webkit-text-fill-color: var(--bdx-warn) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-pill.is-confirmed { border-color: color-mix(in srgb, var(--bdx-good) 40%, transparent) !important; color: var(--bdx-good) !important; -webkit-text-fill-color: var(--bdx-good) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-pill.is-refunded { border-color: color-mix(in srgb, var(--bdx-bad) 40%, transparent) !important; color: var(--bdx-bad) !important; -webkit-text-fill-color: var(--bdx-bad) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-acts { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; height: 36px !important; padding: 0 14px !important; border-radius: 9px !important; border: 1px solid var(--bdx-edge) !important; background: var(--bdx-paper) !important; font-size: 13.5px !important; font-weight: 600 !important; text-decoration: none !important; white-space: nowrap !important; box-shadow: none !important; min-height: 0 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-btn.is-solid { background: var(--bdx-hl) !important; border-color: var(--bdx-hl) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-btn.is-danger { color: var(--bdx-bad) !important; -webkit-text-fill-color: var(--bdx-bad) !important; border-color: color-mix(in srgb, var(--bdx-bad) 40%, transparent) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-btn:disabled { opacity: 0.5 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-sec { display: flex !important; flex-direction: column !important; padding-top: 12px !important; border-top: 1px solid var(--bdx-edge) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-sec h4 { margin: 0 0 8px !important; font-size: 11.5px !important; font-weight: 600 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; color: var(--bdx-faint) !important; -webkit-text-fill-color: var(--bdx-faint) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-sec .bdx-acts { margin-top: 10px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-cust { display: flex !important; align-items: center !important; gap: 10px !important; width: 100% !important; padding: 6px 0 !important; border: 0 !important; background: transparent !important; text-align: left !important; box-shadow: none !important; min-height: 0 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-av { flex: 0 0 34px !important; width: 34px !important; height: 34px !important; border-radius: 50% !important; border: 1px solid var(--bdx-edge) !important; display: grid !important; place-items: center !important; font-size: 12px !important; font-weight: 700 !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-cust__copy { flex: 1 !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-cust__copy b { font-size: 14px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-cust__copy small { font-size: 12.5px !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; overflow-wrap: anywhere !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-cust em { font-style: normal !important; font-size: 12.5px !important; font-weight: 600 !important; color: var(--bdx-hl) !important; -webkit-text-fill-color: var(--bdx-hl) !important; white-space: nowrap !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl { list-style: none !important; margin: 0 !important; padding: 0 0 0 4px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li { position: relative !important; display: flex !important; flex-direction: column !important; padding: 0 0 12px 20px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li::before { content: "" !important; position: absolute !important; left: 0 !important; top: 5px !important; width: 9px !important; height: 9px !important; border-radius: 50% !important; background: var(--bdx-edge) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li::after { content: "" !important; position: absolute !important; left: 4px !important; top: 16px !important; bottom: 0 !important; width: 1px !important; background: var(--bdx-edge) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li:last-child { padding-bottom: 0 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li:last-child::after { display: none !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li.is-done::before { background: var(--bdx-good) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li.is-now::before { background: var(--bdx-warn) !important; box-shadow: 0 0 0 3px var(--bdx-warn-bg) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li.is-bad::before { background: var(--bdx-bad) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl b { font-size: 13.5px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl li.is-todo b { color: var(--bdx-faint) !important; -webkit-text-fill-color: var(--bdx-faint) !important; font-weight: 400 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-tl span { font-size: 12.5px !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-kv { display: flex !important; justify-content: space-between !important; gap: 12px !important; padding: 8px 0 !important; border-top: 1px solid var(--bdx-line) !important; font-size: 13.5px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx h4 + .bdx-kv { border-top: 0 !important; padding-top: 0 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-kv span { color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; flex: 0 0 auto !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-kv b { text-align: right !important; overflow-wrap: anywhere !important; min-width: 0 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-kv b.is-ok { color: var(--bdx-good) !important; -webkit-text-fill-color: var(--bdx-good) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-kv b.is-warn { color: var(--bdx-warn) !important; -webkit-text-fill-color: var(--bdx-warn) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-kv b.is-off { color: var(--bdx-faint) !important; -webkit-text-fill-color: var(--bdx-faint) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-kv b.is-code { font-family: ui-monospace, "SF Mono", monospace !important; font-size: 11.5px !important; font-weight: 400 !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-days { display: flex !important; flex-direction: column !important; gap: 12px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-slots { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-slot { height: 40px !important; border-radius: 10px !important; border: 1px solid var(--bdx-edge) !important; background: var(--bdx-paper) !important; font-size: 13.5px !important; font-weight: 600 !important; padding: 0 !important; min-height: 0 !important; box-shadow: none !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-slot.is-taken { text-decoration: line-through !important; opacity: 0.45 !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-slot.is-current { border-color: var(--bdx-hl) !important; color: var(--bdx-hl) !important; -webkit-text-fill-color: var(--bdx-hl) !important; }
html body :is(#mobile-booking-owner-detail, #mobile-booking-reschedule).bdx .bdx-note { margin: 0 !important; font-size: 12.5px !important; color: var(--bdx-mute) !important; -webkit-text-fill-color: var(--bdx-mute) !important; }
