/* Adaptive booking popup — everything is scoped to .adapt-booking-overlay
   so nothing here can affect the rest of the site. */
.adapt-booking-overlay, .adapt-booking-overlay * { box-sizing: border-box; }

/* ============================================================
   ADAPTIVE BOOKING POPUP  — namespaced: adapt-booking-*
   ============================================================ */
.adapt-booking-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  flex-direction: column;            /* mobile: external close sits above the sheet */
  justify-content: flex-end;         /* bottom sheet on mobile */
  align-items: center;
  background: rgba(9, 26, 45, 0);
  padding: 0;
  pointer-events: none;               /* inert while closed — never intercepts clicks */
  /* Stay rendered long enough for the sheet to slide out, then stop painting
     altogether. A closed-but-painted overlay still draws the sheet's upward
     box-shadow just below the viewport: that bleeds a sliver into view and
     Safari samples it to tint its toolbar grey. The 0s visibility transition
     is delayed on close and immediate on open. */
  visibility: hidden;
  transition: background .28s ease, visibility 0s linear .34s;
}
.adapt-booking-overlay.is-open {
  background: rgba(9, 26, 45, .55);
  pointer-events: auto;
  visibility: visible;
  transition: background .28s ease, visibility 0s linear 0s;
}
.adapt-booking-overlay:focus { outline: none; }

/* external close — mobile only, white, floats above the sheet */
.adapt-booking-close-ext-wrap {
  width: 100%;
  max-width: 540px;
  display: flex;
  justify-content: flex-end;
  padding: 0 12px 10px;
  pointer-events: none;              /* let taps beside the X fall through to the backdrop */
  /* The sheet slides away on close, but this sits outside it and has no
     transform — so hide it explicitly or it lingers on the page. visibility
     also takes it out of hit-testing, which pointer-events alone would not
     (the button re-enables pointer-events on itself). */
  visibility: hidden;
  opacity: 0;
  transition: opacity .28s ease;      /* not visibility — transitioning it delays the flip */
}
.adapt-booking-overlay.is-open .adapt-booking-close-ext-wrap {
  visibility: visible;
  opacity: 1;
}
.adapt-booking-close-ext {
  pointer-events: auto;
  border: none;
  background: transparent;
  color: #ffffff;
  cursor: pointer;
  padding: 6px;
  display: grid;
  place-items: center;
  -webkit-tap-highlight-color: transparent;
}

.adapt-booking-sheet {
  position: relative;
  width: 100%;
  max-width: 540px;
  max-height: 92dvh;
  overflow-y: auto;
  overflow-x: hidden;                  /* clip the tab-swap wipe; no transient sideways scrollbar */
  -webkit-overflow-scrolling: touch;
  background: #ffffff;
  border-radius: 22px 22px 0 0;
  box-shadow: 0 -18px 60px -20px rgba(9,26,45,.5);
  transform: translateY(100%);
  transition: transform .34s cubic-bezier(.22,.61,.36,1);
  padding: 0 0 env(safe-area-inset-bottom);
  scrollbar-width: thin;                        /* Firefox: slim scrollbar */
  scrollbar-color: #cdd9e5 transparent;
}
/* WebKit: slim, rounded, floating thumb that doesn't square off the corner */
.adapt-booking-sheet::-webkit-scrollbar { width: 10px; }
.adapt-booking-sheet::-webkit-scrollbar-track { background: transparent; margin: 14px 0; }
.adapt-booking-sheet::-webkit-scrollbar-thumb {
  background: #cdd9e5;
  border-radius: 999px;
  border: 3px solid transparent;
  background-clip: padding-box;
}
.adapt-booking-sheet::-webkit-scrollbar-thumb:hover { background: #b6c4d2; background-clip: padding-box; }
.adapt-booking-overlay.is-open .adapt-booking-sheet { transform: translateY(0); }

/* header */
.adapt-booking-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 28px 28px 0;
}
.adapt-booking-heading { display: flex; flex-direction: column; gap: 12px; }
.adapt-booking-title {
  margin: 0;
  font-size: 23px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: #0d2033;
}
.adapt-booking-address {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #738799;
  line-height: 1.2;
}
.adapt-booking-address-icon {
  flex: 0 0 auto;
  display: inline-flex;
}
.adapt-booking-address-icon svg { width: 14px; height: 14px; fill: currentColor; }
.adapt-booking-close {
  flex: 0 0 auto;
  margin: 0;
  width: 40px; height: 40px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #56708a;
  line-height: 1;
  cursor: pointer;
  display: none;                       /* mobile: X lives outside the sheet (see close-ext) */
  place-items: center;
  -webkit-tap-highlight-color: transparent;
}
.adapt-booking-close:hover { color: #0d2033; }

/* segmented control */
.adapt-booking-seg {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 10px 28px 0;
  padding: 4px;
  background: #e4edf4;
  border-radius: 14px;
}
.adapt-booking-seg button {
  appearance: none;
  border: none;
  background: transparent;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  color: #5b7086;
  padding: 10px 8px;
  border-radius: 10px;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
  -webkit-tap-highlight-color: transparent;
}
.adapt-booking-seg button[aria-selected="true"] {
  background: #389DD7;
  color: #ffffff;
  box-shadow: 0 2px 6px -2px rgba(56,157,215,.45);
}

/* reassurance / prompt block */
.adapt-booking-lead {
  margin: 20px 28px 4px;
}
.adapt-booking-usps { display: grid; gap: 10px; }
.adapt-booking-usp {
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: 14px;
  line-height: 1.35;
  color: #33475b;
  font-weight: 400;
}
.adapt-booking-uspicon { flex: 0 0 auto; color: #389DD7; display: inline-flex; }
.adapt-booking-uspicon svg { width: 22px; height: 22px; display: block; }
.adapt-booking-prompt {
  font-size: 17px;
  font-weight: 500;
  color: #0d2033;
  margin: 0 0 4px;
}

/* list */
.adapt-booking-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 14px 28px 22px;
}

/* content wipe on tab switch */
@keyframes adaptContentIn {
  from { opacity: 0; transform: translateX(10px); }
  to   { opacity: 1; transform: translateX(0); }
}
.adapt-booking-anim { animation: adaptContentIn .28s cubic-bezier(.22,.61,.36,1); }

/* section heading */
.adapt-booking-section {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #8095a6;
  margin: 4px 2px 10px;
}
.adapt-booking-section + .adapt-booking-section,
.adapt-booking-grid + .adapt-booking-section { margin-top: 20px; }

/* 2-up grid of worker cards */
.adapt-booking-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

/* worker row — full-width, avatar left, text, buttons right. Divider-separated. */
.adapt-booking-card {
  width: 100%;
  font-family: inherit;
  padding: 14px 0;
  border-bottom: 1px solid #edf1f5;
}
.adapt-booking-card:last-child { border-bottom: none; }
.adapt-booking-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: left;
  gap: 13px;
}
/* practitioner rows toggle the description on tap; the "Any" row does not */
.adapt-booking-card:not(.is-fast) .adapt-booking-row { cursor: pointer; }

/* More info — no background, grey text, chevron flips when expanded */
.adapt-booking-moreinfo {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  color: #738799;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 5px 4px;
  -webkit-tap-highlight-color: transparent;
}
.adapt-booking-moreinfo:hover { color: #389DD7; }
.adapt-booking-chevron { transition: transform .22s ease; }
.adapt-booking-moreinfo[aria-expanded="true"] .adapt-booking-chevron { transform: rotate(180deg); }

/* collapsible description */
.adapt-booking-desc {
  max-height: 0;
  overflow: hidden;
  transition: max-height .28s ease;
}
.adapt-booking-desc-inner {
  padding: 15px 0 4px;
  font-size: 14px;
  line-height: 1.45;
  color: #33475b;
}

/* Book button — the only interactive element in a card, never an <a> */
.adapt-booking-book {
  flex: 0 0 auto;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  background: #389DD7;
  border: none;
  border-radius: 999px;
  padding: 7px 18px;
  margin-left: -4px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .16s ease;
}
.adapt-booking-book:hover { transform: translateY(-3px); }
.adapt-booking-book:focus-visible { outline: 3px solid #7cc7f0; outline-offset: 2px; }

.adapt-booking-avatar {
  flex: 0 0 auto;
  width: 68px; height: 68px;
  border-radius: 11px;                 /* square, slightly rounded */
  object-fit: cover;
  background: #eaf4fb;                  /* light-blue fallback, matches Any practitioner */
  display: grid;
  place-items: center;
  color: #389DD7;                      /* blue initials */
  font-weight: 700;
  font-size: 19px;
  overflow: hidden;
}
.adapt-booking-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.adapt-booking-cardbody { flex: 1 1 auto; min-width: 0; }
.adapt-booking-name {
  display: block;
  font-size: 15px;
  font-weight: 500;
  color: #0d2033;
  line-height: 1.2;
}
.adapt-booking-sub {
  display: block;
  font-size: 14px;
  color: #6a7f92;
  margin-top: 2px;
  line-height: 1.25;
}

/* full-width single card (Eve) — avatar left, text left */
.adapt-booking-card--wide {
  flex-direction: row;
  align-items: center;
  text-align: left;
  gap: 14px;
  padding: 14px 16px;
}
.adapt-booking-card--wide .adapt-booking-avatar { width: 56px; height: 56px; font-size: 18px; }
.adapt-booking-card--wide .adapt-booking-cardbody { flex: 1 1 auto; }

/* the fast path — same clean row, blue icon */
.adapt-booking-card.is-fast .adapt-booking-fasticon {
  flex: 0 0 auto;
  width: 68px; height: 68px;
  border-radius: 11px;
  display: grid; place-items: center;
  background: #389DD7;                 /* full brand colour */
  padding: 12px;
}
.adapt-booking-card.is-fast .adapt-booking-fasticon svg { width: 100%; height: auto; display: block; }

/* divider */
.adapt-booking-div {
  height: 1px;
  background: #e0e9f1;
  margin: 14px 28px 4px;
}

/* quiet catch-all */
.adapt-booking-all {
  appearance: none;
  width: calc(100% - 56px);
  margin: 14px 28px 4px;
  background: transparent;
  border: none;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 600;
  color: #6a7f92;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px;
  cursor: pointer;
  border-radius: 12px;
  -webkit-tap-highlight-color: transparent;
}
.adapt-booking-all:hover { color: #389DD7; background: #eaf2f9; }

.adapt-booking-foot {
  text-align: center;
  font-size: 11px;
  color: #9fb0c0;
  padding: 4px 20px 2px;
}

/* desktop: centred modal instead of bottom sheet */
@media (min-width: 600px) {
  .adapt-booking-overlay { flex-direction: row; align-items: center; justify-content: center; padding: 24px; }
  .adapt-booking-close-ext-wrap { display: none; }        /* desktop: X lives in the header */
  .adapt-booking-close { display: grid; }
  .adapt-booking-sheet {
    border-radius: 22px;
    /* A little wider than the phone sheet, so names and the two buttons sit
       comfortably on one line. */
    max-width: 620px;
    /* Shorter than the mobile sheet: a centred modal that runs the full height
       of a desktop screen reads as a page, not a dialog. Longer staff lists
       scroll inside it. */
    max-height: min(80dvh, 680px);
    transform: translateY(24px) scale(.98);
    opacity: 0;
    transition: transform .3s cubic-bezier(.22,.61,.36,1), opacity .3s ease;
  }
  .adapt-booking-overlay.is-open .adapt-booking-sheet { transform: none; opacity: 1; }
}

/* Small phones: collapse "More info" to just the chevron so rows don't cram */
@media (max-width: 480px) {
  .adapt-booking-moreinfo-label { display: none; }
  .adapt-booking-moreinfo { padding: 8px 2px; gap: 0; }
  .adapt-booking-moreinfo .adapt-booking-chevron { width: 24px; height: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  .adapt-booking-overlay,
  .adapt-booking-sheet { transition: none !important; }
}

body.adapt-booking-locked { overflow: hidden; }

/* ============================================================
   THEME ARMOUR — stops Elementor/theme styles leaking into the
   popup. Everything is scoped to .adapt-booking-overlay.
   ============================================================ */

/* FONT — Inter is the default for the whole popup. Set explicitly on every
   element (never `inherit`) so a theme rule can't swap it out. */
.adapt-booking-overlay,
.adapt-booking-overlay *,
.adapt-booking-overlay h2,
.adapt-booking-overlay p,
.adapt-booking-overlay div,
.adapt-booking-overlay span,
.adapt-booking-overlay button {
  font-family: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
}

/* ...except these three, which stay Neuwelt */
.adapt-booking-overlay .adapt-booking-title,
.adapt-booking-overlay .adapt-booking-prompt,
.adapt-booking-overlay .adapt-booking-name {
  font-family: 'FF Neuwelt', 'Neuwelt', 'Inter', system-ui, sans-serif !important;
}

/* neutralise inherited button chrome */
.adapt-booking-overlay button {
  background: none !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  text-decoration: none !important;
  line-height: normal !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  outline: none;
}
.adapt-booking-overlay h2,
.adapt-booking-overlay p,
.adapt-booking-overlay div,
.adapt-booking-overlay span {
  text-transform: none !important;
  letter-spacing: normal !important;
}
.adapt-booking-overlay img {
  max-width: 100% !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.adapt-booking-overlay svg { vertical-align: middle; }

/* MARGINS — blanket-zero ours so no theme rule can shift the layout, then
   re-assert the margins the design needs (higher specificity + later). */
.adapt-booking-overlay h2,
.adapt-booking-overlay p { margin: 0 !important; }
.adapt-booking-overlay [class^="adapt-booking-"],
.adapt-booking-overlay div,
.adapt-booking-overlay span { margin: 0 !important; }

.adapt-booking-overlay .adapt-booking-lead { margin: 18px 28px 4px !important; }
.adapt-booking-overlay .adapt-booking-prompt { margin: 0 0 4px !important; }
.adapt-booking-overlay .adapt-booking-sub { margin: 2px 0 0 !important; }
.adapt-booking-overlay .adapt-booking-book { margin: 0 0 0 -4px !important; }

/* ICON ROWS — equal icon column so the address and USP text share one left
   edge, with a tight gap (no dead space beside the location pin). */
.adapt-booking-overlay .adapt-booking-address,
.adapt-booking-overlay .adapt-booking-usp { gap: 8px !important; }
.adapt-booking-overlay .adapt-booking-uspicon {
  flex: 0 0 20px !important;
  width: 20px !important;
  justify-content: flex-start !important;
}
/* the pin hugs its box, so its gap matches the USP icons' instead of
   carrying the extra dead space of a wider column */
.adapt-booking-overlay .adapt-booking-address-icon {
  flex: 0 0 auto !important;
  width: auto !important;
}
.adapt-booking-overlay .adapt-booking-address-icon svg { width: 16px !important; height: 16px !important; }
.adapt-booking-overlay .adapt-booking-uspicon svg { width: 20px !important; height: 20px !important; }

/* USP text: 1px nudge is enough to sit optically centred on its icon */
.adapt-booking-overlay .adapt-booking-usp { align-items: flex-start !important; }
.adapt-booking-overlay .adapt-booking-uspicon { margin: 0 !important; }
.adapt-booking-overlay .adapt-booking-usp > span:last-child { margin: 1px 0 0 !important; }

/* TYPE SCALE */
.adapt-booking-overlay .adapt-booking-title   { font-size: 23px !important; font-weight: 500 !important; line-height: 1.2 !important; color: #0d2033 !important; }
.adapt-booking-overlay .adapt-booking-address { font-size: 14px !important; color: #738799 !important; }
.adapt-booking-overlay .adapt-booking-usp     { font-size: 14px !important; font-weight: 400 !important; color: #33475b !important; }
.adapt-booking-overlay .adapt-booking-prompt  { font-size: 17px !important; font-weight: 500 !important; color: #0d2033 !important; }
.adapt-booking-overlay .adapt-booking-name    { font-size: 15px !important; font-weight: 500 !important; color: #0d2033 !important; }
.adapt-booking-overlay .adapt-booking-sub     { font-size: 14px !important; font-weight: 400 !important; color: #6a7f92 !important; }
.adapt-booking-overlay .adapt-booking-desc-inner { font-size: 14px !important; font-weight: 400 !important; color: #33475b !important; }

/* BUTTONS */
.adapt-booking-overlay .adapt-booking-book {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #ffffff !important;
  background: #389DD7 !important;
  border-radius: 999px !important;
  padding: 7px 18px !important;
}
.adapt-booking-overlay .adapt-booking-moreinfo {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #738799 !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 5px 4px !important;
}
.adapt-booking-overlay .adapt-booking-moreinfo:hover { color: #389DD7 !important; }
.adapt-booking-overlay .adapt-booking-close     { color: #56708a !important; background: transparent !important; padding: 0 !important; width: 40px !important; height: 40px !important; }
.adapt-booking-overlay .adapt-booking-close-ext { color: #ffffff !important; background: transparent !important; padding: 6px !important; }

@media (max-width: 480px) {
  .adapt-booking-overlay .adapt-booking-moreinfo { padding: 8px 2px !important; }
}
