/**
 * Benefit Path - Survey / Path funnel CSS
 * Public paths never load bp-system.css. Tokens + body reset live here under
 * html[data-path-ui]. Editor still loads CORE (bp-system); do not redefine
 * global :root (that leaked Catppuccin over agency packs).
 */

/* ── 1. Path-owned tokens + body reset (public funnels) ──────────────────── */

html[data-path-ui],
html[data-path-ui] .survey-page {
  color-scheme: light;
  --c-bg: #f9fafb;
  --c-surface: #fff;
  --c-border: #e5e7eb;
  --c-text: #111827;
  --c-text-muted: #6b7280;
  --c-text-light: #9ca3af;
  --c-muted: var(--c-text-muted);
  --c-primary: #5050ff;
  --c-primary-light: color-mix(in srgb, var(--c-primary) 14%, white);
  --c-primary-hover: color-mix(in srgb, var(--c-primary) 86%, black);
  --c-secondary: #06b6d4;
  --c-tertiary: #d946ef;
  --c-tertiary: oklch(from var(--c-secondary) l c calc(h + 110));
  --primary-color: var(--c-primary);
  --c-primary-color: var(--primary-color);
  --c-danger: #ef4444;
  --c-warning: #f59e0b;
  --c-success: #10b981;
  --c-info: #3b82f6;
  --bp-card-bg: #fff;
  --bp-card-border: #e5e7eb;
  --bp-card-section-bg: color-mix(in srgb, var(--c-border) 40%, var(--c-bg));
  --bp-card-header-bg: var(--bp-card-section-bg);
  --bp-card-footer-bg: var(--bp-card-section-bg);
  --bp-card-radius: var(--radius-lg, 12px);
  --bp-card-inset: var(--space-8, .5rem);
  --bp-page-bg: transparent;
  --bp-shell-bg: #fff;
  --media-accent-video: var(--c-primary-color, var(--c-primary));
  --media-accent-audio: var(--c-primary-color, var(--c-primary));
  --btn-chrome-bg: var(--bp-card-section-bg);
  --btn-chrome-bg-hover: color-mix(in srgb, var(--c-border) 58%, var(--c-bg));
  --btn-surface-bg: #fff;
  --btn-surface-bg-hover: color-mix(in srgb, var(--c-border) 24%, #fff);
  --bp-field-outline: color-mix(
    in srgb,
    var(--c-primary-color, var(--c-primary)) 16%,
    color-mix(in srgb, var(--c-text) 14%, var(--c-border))
  );
  --bp-field-outline-hover: color-mix(
    in srgb,
    var(--c-primary-color, var(--c-primary)) 36%,
    var(--bp-field-outline)
  );
  --bp-field-ring: 0 0 0 3px color-mix(in srgb, var(--c-primary-color, var(--c-primary)) 22%, transparent);
  --bp-shadow: none;
  --bp-shadow-hover: none;
  --bp-shadow-focus: none;
  --radius: 8px;
  --radius-sm: 4px;
  --radius-lg: 12px;
  --space-0: .05rem;
  --space-1: .15rem;
  --space-1a: .1rem;
  --space-1b: .12rem;
  --space-1c: .18rem;
  --space-2: .2rem;
  --space-2a: .22rem;
  --space-2b: .28rem;
  --space-3: .25rem;
  --space-4: .3rem;
  --space-5: .35rem;
  --space-6: .4rem;
  --space-6a: .42rem;
  --space-7: .45rem;
  --space-8: .5rem;
  --space-8a: .6rem;
  --space-8b: .625rem;
  --space-9: .55rem;
  --space-10: .65rem;
  --space-10a: .7rem;
  --space-11: .75rem;
  --space-12: .85rem;
  --space-12a: .9rem;
  --space-13: 1rem;
  --space-13a: 1.1rem;
  --space-13b: 1.15rem;
  --space-14: 1.25rem;
  --space-14a: 1.35rem;
  --space-15: 1.5rem;
  --space-15a: 1.75rem;
  --space-16: 2rem;
  --space-17: 2.5rem;
  --ease: cubic-bezier(.4, 0, .2, 1);
  --dur: 200ms;
  --dur-fast: 120ms;
  --dur-slow: 280ms;
  /* Match dashboard five-step type scale (public paths do not load bp-system). */
  --bp-text-xs: 0.6875rem;
  --bp-text-sm: 0.8125rem;
  --bp-text-md: 0.875rem;
  --bp-text-lg: 1rem;
  --bp-text-xl: 1.25rem;
  --bp-field-font-size: var(--bp-text-md);
  --btn-font-size: var(--bp-text-sm);
  --bp-icon-size-sm: 17px;
  --bp-chevron-down: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 9L12 15L18 9'/%3E%3C/svg%3E");
  --bp-checkbox-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10' fill='none'%3E%3Cpath stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1.2 5.2 4.4 8.4 10.8 1.6'/%3E%3C/svg%3E");
  --bp-checkbox-indeterminate: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 2'%3E%3Crect fill='%23fff' width='10' height='2' rx='1'/%3E%3C/svg%3E");
}

html[data-path-ui] body {
  margin: 0;
  background: transparent;
  color: var(--c-text, #111827);
  min-height: 100dvh;
}

.form-label {
  gap: var(--space-5);
  color: var(--c-text)
}

.form-question {
  display: block;
  gap: var(--space-5);
  /* Inherit seat Design defaults (1rem / 400 / black / center). */
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-align: inherit;
  color: inherit;
}

.form-question:empty {
  display: none;
}

/* ── 9. Form fields ────────────────────────────────────────────────────── */

.form-group {
  display: flex;
  flex-direction: column;
  gap: .375rem;
  position: relative;
}

.form-label {
  font-size: var(--bp-text-md);
  font-weight: 500;
  color: var(--c-text);
}

.form-input,
.form-select,
.form-textarea {
  box-sizing: border-box;
  border: 1px solid var(--bp-field-outline);
  border-radius: var(--radius);
  font-size: var(--bp-field-font-size);
  font-family: inherit;
  color: var(--c-text);
  background-color: var(--c-surface);
  box-shadow: none;
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background-color var(--dur) var(--ease);
}

.form-input,
.form-select,
select.form-select {
  height: var(--bp-field-height);
  min-height: var(--bp-field-height);
  padding: var(--bp-field-padding-y, 0) var(--bp-field-padding-x);
  line-height: var(--bp-field-line-height);
}

.survey-step,
.bp-el[data-bp-el="question"] {
  --bp-field-font-size: var(--bp-text-lg);
  --bp-field-padding-y: .65rem;
}

.survey-step input.form-input:not([type="checkbox"]):not([type="radio"]),
.survey-step select.form-select,
.survey-step select.form-input.form-select,
.survey-step .form-select-trigger,
.bp-el[data-bp-el="question"] input.form-input:not([type="checkbox"]):not([type="radio"]),
.bp-el[data-bp-el="question"] select.form-select,
.bp-el[data-bp-el="question"] select.form-input.form-select,
.bp-el[data-bp-el="question"] .form-select-trigger,
.bp-el[data-bp-el="question"] .survey-other-input,
.bp-el[data-bp-el="question"] .survey-place-search-input {
  height: auto;
  min-height: unset;
  padding-top: var(--bp-field-padding-y, var(--space-10));
  padding-bottom: var(--bp-field-padding-y, var(--space-10));
  font-size: var(--bp-field-font-size);
  font-weight: 400;
  line-height: var(--bp-field-line-height);
}

/* Title/search underline fields: no survey boxed chrome / icon gutter. */
.bp-search-wrap > :is(.form-input.bp-title-input, .form-input[type="search"]) {
  padding-left: 0;
  padding-right: 0;
}

.form-textarea {
  height: auto;
  min-height: 5.25rem;
  padding: var(--space-8) var(--space-11);
  line-height: 1.5;
  resize: vertical;
}

.form-select,
select.form-select {
  appearance: none;
  padding-right: var(--bp-field-select-padding-right);
  cursor: pointer;
  background-image: var(--bp-chevron-down);
  background-repeat: no-repeat;
  background-position: right .65rem center;
  background-size: 1rem 1rem;
}

.form-input:hover:not(:disabled),
.form-select:hover:not(:disabled),
.form-textarea:hover:not(:disabled) {
  border-color: var(--bp-field-outline-hover);
  background-color: var(--c-surface);
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--bp-field-outline-focus);
  box-shadow: var(--bp-field-ring);
}

.form-input:disabled,
.form-select:disabled,
.form-textarea:disabled {
  cursor: not-allowed;
  opacity: .72;
  background-color: color-mix(in srgb, var(--bp-card-bg) 84%, var(--c-border));
}

/* Dropdowns / triggers - soft fill with a thin accent outline */
.form-select,
select.form-select,
.form-input[type="number"],
.form-input[type="date"],
.form-input[type="tel"],
.form-input[type="email"],
.form-input[type="password"],
.form-input[type="search"],
.form-input[type="url"],
.form-input[type="text"],
.survey-other-input,
.bp-dur-trigger,
.bp-dtp-trigger,
.form-select-trigger {
  border: 1px solid var(--bp-field-outline);
  border-radius: var(--radius);
  background-color: var(--c-surface);
  box-shadow: none;
  color: var(--c-text);
}

.form-select:hover:not(:disabled),
select.form-select:hover:not(:disabled),
.form-input[type="number"]:hover:not(:disabled),
.form-input[type="date"]:hover:not(:disabled),
.form-input[type="tel"]:hover:not(:disabled),
.form-input[type="email"]:hover:not(:disabled),
.form-input[type="password"]:hover:not(:disabled),
.form-input[type="search"]:hover:not(:disabled),
.form-input[type="url"]:hover:not(:disabled),
.form-input[type="text"]:hover:not(:disabled),
.survey-other-input:hover:not(:disabled),
.bp-dur-trigger:hover:not(:disabled),
.bp-dtp-trigger:hover:not(:disabled),
.form-select-trigger:hover:not(:disabled) {
  border-color: var(--bp-field-outline-hover);
  background-color: var(--c-surface);
  box-shadow: none;
}

.form-select:focus,
select.form-select:focus,
.form-input[type="number"]:focus,
.form-input[type="date"]:focus,
.form-input[type="tel"]:focus,
.form-input[type="email"]:focus,
.form-input[type="password"]:focus,
.form-input[type="search"]:focus,
.form-input[type="url"]:focus,
.form-input[type="text"]:focus,
.survey-other-input:focus,
.bp-dur-trigger:focus-visible,
.bp-dtp-trigger:focus-visible,
.form-select-trigger:focus-visible,
.form-select-wrap.is-open .form-select-trigger,
.bp-dtp-wrap.is-open .bp-dtp-trigger,
.bp-dur-wrap.is-open .bp-dur-trigger {
  outline: none;
  border-color: var(--bp-field-outline-focus);
  box-shadow: var(--bp-field-ring);
}

.form-select:disabled,
select.form-select:disabled {
  border-color: var(--bp-field-outline);
  box-shadow: none;
}

.form-select:has(option[value=""]:checked) {
  color: var(--c-text-muted);
}

.form-select optgroup,
.form-select option {
  padding: var(--space-8) var(--space-11);
  background-color: var(--bp-card-bg);
  color: var(--c-text);
}

select[multiple]:not(.bp-url-field) {
  padding: var(--space-8) var(--space-10);
  border: 1px solid var(--bp-field-outline);
  border-radius: var(--radius);
  background-color: var(--c-surface);
  color: var(--c-text);
  min-height: 6rem;
  box-shadow: none;
}

select[multiple]:not(.bp-url-field):focus {
  outline: none;
  border-color: var(--bp-field-outline-focus);
  box-shadow: var(--bp-field-ring);
}

.form-input.error,
.form-select.error,
.form-textarea.error {
  border-color: var(--c-danger);
  box-shadow: none;
}

.survey-field-error {
  display: block;
  font-size: var(--bp-text-md);
  color: var(--c-danger);
  margin: .35em 0 0;
}

.survey-choice-list.survey-field-invalid,
.survey-star-rating.survey-field-invalid,
.survey-checkbox-list.survey-field-invalid,
.survey-star-wrap.survey-field-invalid {
  outline: 2px solid var(--c-danger);
  outline-offset: 3px;
  border-radius: var(--radius);
}

.form-hint {
  font-size: var(--bp-text-sm);
  color: var(--c-text-muted);
}

.form-error {
  font-size: var(--bp-text-sm);
  color: var(--c-danger);
}

.form-checkbox,
input[type="checkbox"] {
  --checkbox-accent: var(--c-primary-color, var(--c-primary));
  --checkbox-size: 1.0625rem;
  appearance: none;
  width: var(--checkbox-size);
  height: var(--checkbox-size);
  min-width: var(--checkbox-size);
  min-height: var(--checkbox-size);
  margin: 0;
  cursor: pointer;
  border: 1.5px solid color-mix(in srgb, var(--checkbox-accent) 32%, var(--c-border));
  border-radius: 5px;
  background-color: var(--bp-card-bg);
  box-shadow: var(--bp-shadow);
  display: inline-grid;
  place-content: center;
  vertical-align: middle;
  transition: border-color var(--dur) var(--ease), background-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

.form-checkbox:hover:not(:disabled):not(:focus-visible),
input[type="checkbox"]:hover:not(:disabled):not(:focus-visible) {
  box-shadow: var(--bp-shadow-hover);
}

.form-checkbox:checked,
input[type="checkbox"]:checked {
  background-color: var(--checkbox-accent);
  border-color: var(--checkbox-accent);
  background-image: var(--bp-checkbox-check);
  background-repeat: no-repeat;
  background-position: center;
  background-size: .7rem .7rem;
}

.form-checkbox:indeterminate,
input[type="checkbox"]:indeterminate {
  background-color: var(--checkbox-accent);
  border-color: var(--checkbox-accent);
  background-image: var(--bp-checkbox-indeterminate);
  background-repeat: no-repeat;
  background-position: center;
  background-size: .55rem auto;
}

.form-checkbox:focus-visible,
input[type="checkbox"]:focus-visible {
  outline: none;
  box-shadow: var(--bp-shadow), 0 0 0 3px color-mix(in srgb, var(--checkbox-accent) 22%, transparent);
}

.modal-check-row {
  display: flex;
  align-items: center;
  gap: var(--space-8a);

  color: var(--c-primary-color, var(--c-primary));
}

.form-select-wrap {
  position: relative;
  display: block;
  width: 100%;
}

/* Toolbar / header selects - never width:100% (collapses in flex rows) */
.form-select-wrap--toolbar,
.form-select-wrap.bp-toolbar-control,
.bp-dtp-wrap--toolbar,
.bp-dtp-wrap.bp-toolbar-control {
  --bp-field-height: 2.3rem;
  --bp-field-font-size: var(--bp-text-sm);
  --bp-field-line-height: 1.25;
  display: inline-flex;
  width: auto;
  min-width: 10.5rem;
  max-width: 100%;
  flex: 0 0 auto;
}

.form-select-wrap--toolbar .form-select-trigger,
.form-select-wrap.bp-toolbar-control .form-select-trigger,
.bp-dtp-wrap--toolbar .bp-dtp-trigger,
.bp-dtp-wrap.bp-toolbar-control .bp-dtp-trigger {
  height: var(--bp-field-height);
  min-height: var(--bp-field-height);
  font-size: var(--bp-field-font-size);
  line-height: var(--bp-field-line-height);
}

.form-select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
}

/* Never clip the wrap - only the native <select> inside it */
.form-select-wrap.form-select-native {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: var(--bp-field-height);
  overflow: visible !important;
  clip: auto !important;
}

.form-select-trigger {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  width: 100%;
  height: var(--bp-field-height);
  min-height: var(--bp-field-height);
  padding: 0 var(--bp-field-padding-x);
  font-family: var(--bp-font-family, Poppins, system-ui, -apple-system, sans-serif);
  font-size: var(--bp-field-font-size);
  font-weight: 400;
  line-height: var(--bp-field-line-height);
  cursor: pointer;
  text-align: left;
  box-sizing: border-box;
  transition: background-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}

.form-select-trigger.is-placeholder .form-select-trigger-label {
  color: var(--c-text-muted);
}

.form-select-trigger-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.form-select-wrap.is-open .form-select-trigger-caret {
  transform: rotate(180deg);
}

.form-select-menu {
  display: none;
  min-width: 100%;
  max-height: min(280px, 55vh);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.form-select-menu--floating {
  position: fixed;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
  z-index: 400;
  min-width: 10.5rem;
  max-height: min(280px, calc(100vh - 16px));
  margin: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.form-select-group-label {
  padding: var(--space-5) var(--space-9) var(--space-1);
  font-size: var(--bp-text-xs);
  font-weight: 600;
  letter-spacing: .05em;

  box-shadow: var(--bp-shadow-hover);
}

.bp-caret,
.form-select-trigger-caret,
.bp-chevron {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  pointer-events: none;
  color: var(--c-text-muted);
  background-color: currentColor;
  -webkit-mask: var(--bp-icon-chevron-down) center / contain no-repeat;
  mask: var(--bp-icon-chevron-down) center / contain no-repeat;
}

.bp-chevron--up {
  -webkit-mask-image: var(--bp-icon-chevron-up);
  mask-image: var(--bp-icon-chevron-up);
}

.bp-chevron--left {
  -webkit-mask-image: var(--bp-icon-chevron-left);
  mask-image: var(--bp-icon-chevron-left);
}

.bp-chevron--right {
  -webkit-mask-image: var(--bp-icon-chevron-right);
  mask-image: var(--bp-icon-chevron-right);
}

.form-select-menu,
.bp-dtp-panel,
.topbar-bell-menu,
.topbar-user-menu{
  --bp-menu-pad: .4rem;
  background: var(--bp-card-bg);
  border: 1px solid transparent;
  border-radius: var(--bp-card-radius);
  box-shadow: var(--bp-dropdown-shadow);
  overflow: hidden;
  color: var(--c-text);
}
.form-select-menu,
.tag-input-dropdown,
.modal-combobox-results,
.cal-contact-results {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.form-select-menu.open,
.topbar-bell-menu:not([hidden]),
.topbar-user-menu:not([hidden]){
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--bp-menu-pad);
}
.form-select-option {
  display: block;
  width: 100%;
  padding: var(--space-8) var(--space-10a);
  border: none;
  border-radius: calc(var(--radius) + 2px);
  background: transparent;
  color: var(--c-text);
  font-size: var(--bp-text-sm);
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
  font-family: inherit;
  box-sizing: border-box;
  text-decoration: none;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.form-select-option:hover {
  color: var(--c-text);
  background: var(--c-bg);
  box-shadow: var(--bp-shadow);
}

.auth-divider {
  display: flex;
  align-items: center;
  gap: var(--space-11);
  margin: var(--space-3) 0;
  color: var(--c-text-muted);
  font-size: var(--bp-text-sm);
}

.auth-divider::before,
.auth-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: color-mix(in srgb, var(--c-border) 88%, var(--c-text) 12%);
}

.auth-legal-consent {
  display: flex;
  align-items: flex-start;
  gap: var(--space-9);
  margin: var(--space-8) 0 0;
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  .page-nav-loader {
    transition: none !important;
  }

  .page-nav-loader__spinner {
    animation: none !important;
  }
}

/* ── 30. Empty / upgrade gate ────────────────────────────────────────────── */

.bp-empty-state{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-11);
  padding: var(--space-17) var(--space-15);
  color: var(--c-text-muted);
}

.bp-empty-state-title{
  margin: 0;
  font-size: var(--bp-text-lg);
  font-weight: 600;
  color: var(--c-text);
}

.bp-empty-state-body{
  margin: 0;
  max-width: 28rem;
  line-height: 1.6;
}

/* ── 31. Utilities ─────────────────────────────────────────────────────── */

/* ── Survey funnel + booking embed ── */

.survey-page {
  /* Design / sections / path custom CSS own the fill - do not force --c-bg. */
  background: transparent;
}

/* Draft / signed-in preview bar - inset + rounded; jelly pill colors (static) */
/* Preview banner chrome lives in bp-system.css (.bp-preview-banner). */

/* Preview / signed-in Data Helper - full-height right drawer (path-editor wing chrome) */
.bp-preview-data-drawer {
  --bp-preview-data-inset: var(--bp-side-drawer-inset, var(--bp-card-inset, .5rem));
  --bp-preview-data-drawer-handle-w: var(--bp-side-drawer-handle-w, 2.55rem);
  --bp-preview-data-drawer-w: var(--bp-side-drawer-w, 22rem);
  --bp-preview-data-drawer-content-w: var(--bp-side-drawer-content-w, 16rem);
  position: fixed;
  top: calc(var(--bp-preview-banner-h, 0px) + var(--bp-preview-data-inset));
  right: var(--bp-preview-data-inset);
  bottom: var(--bp-preview-data-inset);
  z-index: 9998;
  width: var(--bp-preview-data-drawer-w);
  max-width: calc(100vw - (2 * var(--bp-preview-data-inset)));
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: var(--bp-preview-data-inset);
  box-sizing: border-box;
  overflow: hidden;
  padding: var(--bp-preview-data-inset);
  background: var(--bp-card-bg, var(--c-surface));
  border: 1px solid transparent;
  border-radius: var(--bp-card-radius, var(--radius-lg, 12px));
  box-shadow: var(--bp-shadow);
  color: var(--c-text);
  font-family: inherit;
  font-size: var(--bp-text-sm);
  line-height: 1.35;
  transition: transform var(--sidebar-dur, 280ms) var(--ease, cubic-bezier(.4, 0, .2, 1));
  will-change: transform;
}

.bp-preview-data-drawer.is-resizing,
.bp-preview-data-drawer.is-shell-animating {
  transition: none;
}

.bp-preview-data-drawer.is-resizing {
  user-select: none;
}

.bp-preview-data-drawer.is-shell-animating {
  contain: layout paint;
  pointer-events: none;
}

/* Survey stays centered: overlay/small-view reserves the handle strip; dock (≥1600)
   uses the full --bp-preview-data-gutter-right from bp.sideDrawerContentGutterPx. */
body.bp-preview-has-data-drawer .survey-page {
  box-sizing: border-box;
  width: 100%;
  --bp-preview-data-handle-gutter: calc(
    var(--bp-side-drawer-handle-w, 2.55rem)
    + (2 * var(--bp-card-inset, .5rem))
  );
  padding-right: var(--bp-preview-data-handle-gutter);
  padding-bottom: var(--bp-preview-data-gutter-bottom, 0px);
  /* Gutter snaps with drawer FLIP - no padding tween. */
}

@media (min-width: 1600px) {
  body.bp-preview-has-data-drawer .survey-page {
    padding-right: var(--bp-preview-data-gutter-right, 0px);
  }
}

body.bp-preview-has-data-drawer:has(.bp-preview-data-drawer.is-shell-animating) .survey-page {
  contain: layout style;
}

.bp-preview-data-drawer-handle {
  position: relative;
  z-index: 2;
  flex: 0 0 var(--bp-preview-data-drawer-handle-w);
  width: var(--bp-preview-data-drawer-handle-w);
  max-width: var(--bp-preview-data-drawer-handle-w);
  align-self: stretch;
  min-height: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  margin: 0;
  padding: var(--space-10) var(--space-2);
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: var(--radius, 8px);
  background: var(--btn-chrome-bg, var(--bp-card-header-bg, var(--bp-card-section-bg)));
  box-shadow: var(--bp-shadow);
  color: inherit;
  font: inherit;
  cursor: grab;
  touch-action: none;
  user-select: none;
  box-sizing: border-box;
  opacity: 1;
  transition: background var(--dur, .15s) var(--ease, cubic-bezier(.4, 0, .2, 1));
}

.bp-preview-data-drawer-handle:hover {
  background: var(--btn-chrome-bg-hover, var(--btn-chrome-bg, var(--bp-card-header-bg)));
}

.bp-preview-data-drawer-handle:active,
.bp-preview-data-drawer.is-resizing .bp-preview-data-drawer-handle {
  cursor: grabbing;
}

.bp-preview-data-drawer-grab {
  display: block;
  flex: none;
  width: .25rem;
  height: 2.35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--c-text-muted, #6b7280) 38%, transparent);
}

.bp-preview-data-drawer-label {
  display: block;
  flex: none;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: nowrap;
  font-size: var(--bp-text-xs);
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1;
  transform: rotate(180deg);
  color: var(--c-text-muted, #6b7280);
}

.bp-preview-data-drawer-body {
  /* Out of flex flow so locked content width never shoves the handle off-screen
     (that looked like the title was fading). Shell overflow clips; opacity fades. */
  position: absolute;
  top: var(--bp-preview-data-inset);
  bottom: var(--bp-preview-data-inset);
  left: calc(var(--bp-preview-data-inset) + var(--bp-preview-data-drawer-handle-w) + var(--bp-preview-data-inset));
  display: flex;
  flex-direction: column;
  width: var(--bp-preview-data-drawer-content-w, 16rem);
  min-width: var(--bp-preview-data-drawer-content-w, 16rem);
  max-width: var(--bp-preview-data-drawer-content-w, 16rem);
  min-height: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  z-index: 0;
  transition: opacity var(--sidebar-dur, 280ms) var(--ease, cubic-bezier(.4, 0, .2, 1));
}

/* Fade in/out with the shell motion (same duration as width). */
.bp-preview-data-drawer.is-content-visible:not(.is-collapsed) .bp-preview-data-drawer-body {
  opacity: 1;
  pointer-events: auto;
}

.bp-preview-data-drawer.is-collapsed .bp-preview-data-drawer-body {
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
}

/* After collapse width settles, hide body so only the handle remains. */
.bp-preview-data-drawer.is-collapsed.is-settled .bp-preview-data-drawer-body {
  visibility: hidden;
  width: 0;
  min-width: 0;
  max-width: 0;
  overflow: hidden;
  padding: 0;
}

/* Drop gap only - keep handle on the canvas edge while width animates. */
.bp-preview-data-drawer.is-collapsed {
  gap: 0;
  justify-content: flex-start;
}

.bp-preview-data-drawer.is-resizing .bp-preview-data-drawer-body,
.bp-preview-data-drawer.bp-drawer-no-transition .bp-preview-data-drawer-body {
  transition: none;
}

/* Drag-open: reveal content as the shell grows (don't wait for pointerup). */
.bp-preview-data-drawer.is-resizing:not(.is-collapsed) .bp-preview-data-drawer-body {
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}

/* Match path-editor inspector heading (title + bottom divider). */
.bp-preview-data-heading {
  flex-shrink: 0;
  margin: 0;
  padding: var(--space-10) var(--space-13);
  font-size: var(--bp-text-sm);
  font-weight: 700;
  line-height: 1.3;
  color: var(--c-text, #111827);
  border-bottom: 1px solid var(--c-border, #e5e7eb);
}

/* Path pages do not load bp-system.css - tip icon + floating bubble live here. */
.tip {
  position: relative;
  display: inline-flex;
  align-items: center;
  color: var(--c-text-muted, #6b7280);
  cursor: help;
  flex-shrink: 0;
  line-height: 1;
}

.tip svg {
  width: calc(var(--bp-ui-font-size, var(--bp-text-sm, 14px)) * 0.9);
  height: calc(var(--bp-ui-font-size, var(--bp-text-sm, 14px)) * 0.9);
}

.bp-tooltip {
  position: fixed;
  z-index: 50000;
  max-width: min(16rem, calc(100vw - 1rem));
  padding: var(--space-6a, .42rem) .68rem;
  font-size: var(--bp-text-sm, 0.8125rem);
  font-weight: 500;
  line-height: 1.35;
  color: var(--c-text, #111827);
  background: var(--bp-shell-bg, #fff);
  border: 1px solid transparent;
  border-radius: var(--radius, 8px);
  box-shadow: var(--bp-dropdown-shadow, 0 2px 3px -1px color-mix(in srgb, var(--c-text, #111827) 11%, transparent));
  pointer-events: none;
  opacity: 0;
  white-space: pre-line;
  text-align: center;
  color-scheme: light;
  transition: opacity var(--dur, 200ms) var(--ease, cubic-bezier(.4, 0, .2, 1));
}

.bp-tooltip.is-visible {
  opacity: 1;
}

.bp-tooltip--help {
  max-width: min(440px, calc(100vw - 1rem));
  min-width: min(200px, calc(100vw - 1rem));
  text-align: center;
  line-height: 1.45;
  padding: var(--space-6, .4rem) var(--space-10, .65rem);
}

@media (prefers-reduced-motion: reduce) {
  .bp-tooltip {
    transition: none;
  }
}

.bp-preview-data-heading .tip {
  display: inline-flex;
  align-items: center;
  margin-left: var(--space-4);
  color: inherit;
  opacity: .85;
}

.bp-preview-data-activity {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-height: 0;
  overflow: hidden;
  padding: var(--space-9) var(--space-11) var(--space-5);
}

/* Match path-editor settings folds (pb-unity-fold): divider + chevron header. */
.bp-preview-data-fold {
  border-top: 1px solid var(--c-border, #e5e7eb);
  margin-top: var(--space-2);
  padding-top: var(--space-1);
}

.bp-preview-data-fold > summary {
  list-style: none;
  cursor: pointer;
  font-size: var(--bp-text-sm);
  font-weight: 700;
  color: var(--c-text, #111827);
  padding: var(--space-5) 0;
  user-select: none;
}

.bp-preview-data-fold > summary::-webkit-details-marker { display: none; }

.bp-preview-data-fold > summary::before {
  content: '';
  display: inline-block;
  width: .85rem;
  height: .85rem;
  margin-right: var(--space-2);
  vertical-align: -0.12em;
  color: var(--c-text-muted, #6b7280);
  background-color: currentColor;
  -webkit-mask: url('/static/img/icons/dazzle-line-icons/chevron-right.svg') center / contain no-repeat;
  mask: url('/static/img/icons/dazzle-line-icons/chevron-right.svg') center / contain no-repeat;
  transition: transform .12s ease;
}

.bp-preview-data-fold[open] > summary::before {
  transform: rotate(90deg);
}

.bp-preview-data-fold-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding: var(--space-1a) 0 var(--space-5) var(--space-1);
}

.bp-preview-data-fold:not([open]) > .bp-preview-data-fold-body {
  display: none;
}

.bp-preview-data-drawer-scroll {
  position: relative;
  z-index: 0;
  padding: var(--space-1) var(--space-1) var(--space-5);
  overflow: auto;
  flex: 1 1 auto;
  min-height: 0;
}

.bp-preview-data-empty {
  margin: var(--space-5) 0 0;
  color: var(--c-text-muted, #6b7280);
  font-size: var(--bp-text-sm);
  line-height: 1.4;
}

.bp-preview-data-drawer-scroll > .bp-activity {
  padding: var(--space-0) 0 var(--space-2);
}

.bp-preview-msg {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
  width: 100%;
}

/* Full-width message row - jelly wash (no jelly-unique shadow). */
.bp-preview-msg-blob {
  --bp-preview-jelly-accent: var(--bp-chip-color, var(--c-primary-color, var(--c-primary)));
  --bp-preview-jelly-fg: var(--bp-chip-fg, var(--bp-preview-jelly-accent));
  --bp-preview-jelly-light: color-mix(in srgb, var(--bp-preview-jelly-accent) 15%, var(--c-surface, #eff1f5));
  width: 100%;
  box-sizing: border-box;
  min-width: 0;
  padding: var(--space-8) var(--space-10a);
  border-radius: var(--radius, 8px);
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--bp-preview-jelly-light) 72%, var(--bp-card-bg, var(--c-surface, #fff)));
  color: var(--bp-preview-jelly-fg);
  box-shadow: none;
  word-break: break-word;
}

[data-theme="dark"] .bp-preview-msg-blob {
  --bp-preview-jelly-light: color-mix(in srgb, var(--bp-preview-jelly-accent) 25%, #292c3c);
}

.bp-preview-msg-blob.is-orange {
  --bp-chip-color: var(--c-warning);
  --bp-chip-fg: var(--c-warning);
}

.bp-preview-msg-blob.is-green {
  --bp-chip-color: var(--c-success);
  --bp-chip-fg: var(--c-success);
}

.bp-preview-msg-blob.is-red {
  --bp-chip-color: var(--c-danger);
  --bp-chip-fg: var(--c-danger);
}

/* Logic-block accents (match path-builder `--pb-logic-accent`). */
.bp-preview-msg-blob.is-action-tag {
  --bp-chip-color: var(--c-secondary);
  --bp-chip-fg: var(--c-secondary);
}
.bp-preview-msg-blob.is-action-ab-split {
  --bp-chip-color: var(--c-accent);
  --bp-chip-fg: var(--c-accent);
}
.bp-preview-msg-blob.is-action-voice-ai {
  /* Catppuccin Sapphire - overridden to the Frappé sapphire in dark mode. */
  --bp-chip-color: #209fb5;
  --bp-chip-fg: #209fb5;
}
.bp-preview-msg-blob.is-action-if {
  --bp-chip-color: var(--c-warning);
  --bp-chip-fg: var(--c-warning);
}
.bp-preview-msg-blob.is-action-if-else {
  --bp-chip-color: var(--c-text-muted);
  --bp-chip-fg: var(--c-text-muted);
}
.bp-preview-msg-blob.is-action-visibility {
  --bp-chip-color: var(--c-agency);
  --bp-chip-fg: var(--c-agency);
}
.bp-preview-msg-blob.is-action-redirect {
  --bp-chip-color: var(--c-info);
  --bp-chip-fg: var(--c-info);
}
.bp-preview-msg-blob.is-action-analytics-meta {
  --bp-chip-color: #1877f2;
  --bp-chip-fg: #1d4ed8;
}
.bp-preview-msg-blob.is-action-analytics-google {
  --bp-chip-color: #e37400;
  --bp-chip-fg: #c2410c;
}
.bp-preview-msg-blob.is-action-submit-contact {
  --bp-chip-color: var(--c-success);
  --bp-chip-fg: var(--c-success);
}
.bp-preview-msg-blob.is-action-swrr {
  --bp-chip-color: var(--c-platform);
  --bp-chip-fg: var(--c-platform-fg);
}
.bp-preview-msg-blob.is-action-loading {
  --bp-chip-color: var(--c-primary);
  --bp-chip-fg: var(--c-primary);
}
.bp-preview-msg-blob.is-action-badge {
  --bp-chip-color: var(--c-info);
  --bp-chip-fg: var(--c-info);
}

/* Block-element bubbles: match Flow node chrome (inset, header, body). */
.bp-preview-msg-blob.is-block-action {
  text-align: left;
  padding: var(--bp-card-inset, var(--space-8));
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  border: 1px solid color-mix(in srgb, var(--bp-preview-jelly-accent) 28%, var(--c-border, #e5e7eb));
  border-radius: var(--bp-card-radius, var(--radius-lg, .75rem));
  background: var(--bp-card-bg, var(--c-surface, #fff));
  color: var(--c-text, #111827);
  box-shadow: var(--bp-shadow);
}

.bp-preview-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  min-width: 0;
}

.bp-preview-block-header {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  min-width: 0;
  padding: var(--space-7) var(--space-5) var(--space-7) var(--space-9);
  border-radius: var(--radius, .5rem);
  background: color-mix(in srgb, var(--bp-preview-jelly-accent) 16%, var(--btn-chrome-bg, var(--bp-card-section-bg, var(--c-bg-subtle, #f3f4f6))));
  box-shadow: none;
  font-weight: 600;
  font-size: var(--bp-text-md);
  line-height: 1.35;
  color: var(--c-text, #111827);
}

.bp-preview-block-icon {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  background-color: currentColor;
  color: color-mix(in srgb, var(--bp-preview-jelly-accent) 72%, var(--c-text, #111827));
  -webkit-mask: var(--pb-icon) center / contain no-repeat;
  mask: var(--pb-icon) center / contain no-repeat;
}

.bp-preview-block-kind {
  flex: 1;
  min-width: 0;
  font-size: var(--bp-text-md);
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: color-mix(in srgb, var(--bp-preview-jelly-accent) 55%, var(--c-text, #111827));
}

.bp-preview-block-body {
  padding: var(--space-1) var(--space-5) var(--space-2);
  font-size: var(--bp-text-sm);
  font-weight: 500;
  line-height: 1.35;
  color: var(--c-text, #111827);
  word-break: break-word;
}

.bp-preview-msg-blob.is-block-action .bp-preview-data-tags,
.bp-preview-msg-blob.is-block-action .bp-preview-data-badges {
  justify-content: flex-start;
}

.bp-preview-msg-blob.is-block-action.is-red {
  border-color: color-mix(in srgb, var(--c-danger, #dc2626) 45%, var(--c-border, #e5e7eb));
}

.bp-preview-msg-blob.is-block-action.is-red .bp-preview-block-header {
  background: color-mix(in srgb, var(--c-danger, #dc2626) 14%, var(--btn-chrome-bg, var(--bp-card-section-bg, var(--c-bg-subtle, #f3f4f6))));
  box-shadow: none;
}

.bp-preview-msg-blob.is-block-action.is-red .bp-preview-block-kind,
.bp-preview-msg-blob.is-block-action.is-red .bp-preview-block-icon {
  color: color-mix(in srgb, var(--c-danger, #dc2626) 70%, var(--c-text, #111827));
}

[data-theme="dark"] .bp-preview-msg-blob.is-action-voice-ai {
  --bp-chip-color: #85c1dc;
  --bp-chip-fg: #85c1dc;
}
[data-theme="dark"] .bp-preview-msg-blob.is-action-loading {
  --bp-chip-color: var(--c-primary);
  --bp-chip-fg: var(--c-primary);
}

.bp-preview-msg-title {
  font-size: var(--bp-text-sm);
  font-weight: 700;
  letter-spacing: .01em;
  text-transform: none;
  color: inherit;
  opacity: .9;
  margin-bottom: var(--space-1b);
}

.bp-preview-msg-kv {
  display: grid;
  grid-template-columns: 4.75rem minmax(0, 1fr);
  gap: var(--space-1) var(--space-6);
  align-items: start;
  margin-bottom: var(--space-1c);
}

.bp-preview-msg-kv:last-child {
  margin-bottom: 0;
}

/* Place / prescription cards: Value label above the card (same rhythm as Label / Field Id). */
.bp-preview-msg-kv:has(.bp-preview-rx-stack) {
  display: flex;
  flex-direction: column;
  gap: var(--space-1c);
  margin-bottom: 0;
}

.bp-preview-msg-kv:has(.bp-preview-rx-stack) > .bp-preview-msg-kv-val {
  width: 100%;
  min-width: 0;
}

.bp-preview-msg-kv-key {
  font-size: var(--bp-text-xs);
  font-weight: 700;
  opacity: .85;
  line-height: 1.35;
}

.bp-preview-msg-kv-val {
  font-size: var(--bp-text-sm);
  font-weight: 500;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
}

.bp-preview-msg-kv-val--mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: var(--bp-text-xs);
  font-weight: 500;
  opacity: .85;
}

.bp-preview-rx-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  width: 100%;
}

.bp-preview-rx-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-1c);
  padding: var(--space-6) var(--space-8);
  border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
  border-radius: var(--radius, .5rem);
  background: color-mix(in srgb, currentColor 5%, transparent);
}

.bp-preview-rx-card-title {
  font-size: var(--bp-text-xs);
  font-weight: 700;
  opacity: .8;
  margin-bottom: 0;
}

.bp-preview-rx-card .bp-preview-msg-kv {
  grid-template-columns: 5.75rem minmax(0, 1fr);
  gap: var(--space-1) var(--space-6);
  margin-bottom: 0;
}

.bp-preview-place-line {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.35;
}

.bp-preview-msg-body {
  font-size: var(--bp-text-sm);
  font-weight: 600;
  line-height: 1.35;
  color: inherit;
}

.bp-preview-msg-body-sub {
  display: block;
  margin-top: var(--space-1);
  font-size: var(--bp-text-sm);
  font-weight: 500;
  opacity: .88;
  line-height: 1.3;
}

.bp-preview-msg-body strong {
  font-weight: 700;
}

.bp-preview-data-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2b);
  align-items: center;
}

.bp-preview-data-tags .contacts-pill,
.bp-preview-data-tags .tag-pill {
  padding: var(--space-1b) var(--space-7);
  font-size: var(--bp-text-xs);
  line-height: 1.2;
  box-shadow: none;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bp-preview-data-badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2b);
  align-items: center;
}

.bp-preview-data-badges .contacts-high-intent-badge,
.bp-preview-data-badges .contacts-appointment-badge,
.bp-preview-data-badges .contacts-t65-badge,
.bp-preview-data-badges .contacts-lead-order-badge,
.bp-preview-data-badges .tag-pill {
  margin-left: 0;
}

.bp-preview-data-redirect-url {
  display: block;
  font-size: var(--bp-text-sm);
  font-weight: 600;
  word-break: break-all;
  color: inherit;
}

@media (max-width: 720px) {
  .bp-preview-data-drawer {
    top: auto;
    left: var(--bp-preview-data-inset);
    right: var(--bp-preview-data-inset);
    bottom: var(--bp-preview-data-inset);
    width: auto !important;
    max-width: none;
    max-height: min(46dvh, 24rem);
    flex-direction: column;
  }

  .bp-preview-data-drawer-handle {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    height: var(--pb-bottom-drawer-handle-h, 2.45rem);
    min-height: var(--pb-bottom-drawer-handle-h, 2.45rem);
    flex-direction: column;
    padding: var(--space-7) var(--space-12a);
  }

  .bp-preview-data-drawer-grab {
    width: 2.35rem;
    height: .25rem;
  }

  .bp-preview-data-drawer-label {
    writing-mode: horizontal-tb;
    transform: none;
    letter-spacing: .04em;
  }

  .bp-preview-data-drawer-body {
    top: calc(var(--bp-preview-data-inset) + var(--pb-bottom-drawer-handle-h, 2.45rem) + var(--bp-preview-data-inset));
    left: var(--bp-preview-data-inset);
    right: var(--bp-preview-data-inset);
    bottom: var(--bp-preview-data-inset);
    width: auto;
    min-width: 0;
    max-width: none;
  }

  .bp-preview-data-drawer.is-collapsed {
    left: auto;
    width: auto !important;
    max-height: none;
  }

  .bp-preview-data-drawer.is-collapsed .bp-preview-data-drawer-body {
    display: none;
  }
}

.survey-main,
.survey-page {
  min-height: calc(100dvh - var(--bp-preview-banner-h, 0px));
  display: flex;
  flex-direction: column;
  align-items: center
}

/* Extend the path page fill under the floating signed-in banner so the strip
   behind the title matches the background beside Data Helper (not bare `body`). */
body:has(.bp-preview-banner) .survey-page {
  margin-top: calc(-1 * var(--bp-preview-banner-h, 0px));
  padding-top: var(--bp-preview-banner-h, 0px);
  min-height: 100dvh;
  box-sizing: border-box;
}

.survey-main {
  width: 100%
}

.survey-header {
  padding: var(--space-15) var(--space-13) var(--space-13a);
  text-align: center
}

.survey-header-cta-row {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto var(--space-13);
  gap: var(--space-12);
}

.survey-header-logo {
  display: block;
  margin: 0
}

.survey-header-call-wrap {
  display: flex;
  justify-content: center
}

.survey-header h1 {
  font-size: clamp(1.55rem, 2.6vw, 2rem);
  margin-bottom: var(--space-9);
}

.survey-header .text-muted {
  font-size: var(--bp-text-lg)
}

.survey-card {
  width: 100%;
  max-width: none;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}

.survey-step:has(.survey-page-blocks--sections) {
  padding: 0;
}

.survey-step.active:has(.survey-page-blocks--sections) {
  min-height: 0;
}

/* Section pages: match path-editor full-bleed column (not a shrink-wrapped center). */
.survey-page:has(.survey-page-blocks--sections),
.survey-main:has(.survey-page-blocks--sections) {
  align-items: stretch;
}

.bp-survey-form:has(.survey-page-blocks--sections),
#survey-steps:has(.survey-page-blocks--sections),
.survey-step:has(.survey-page-blocks--sections) {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.medicare-disclaimer {
  width: 100%;
  max-width: 920px;
  margin: 0 auto;
  padding: var(--space-13) var(--space-13) var(--space-15a);
  color: var(--c-text-muted);
  font-size: var(--bp-text-sm);
  line-height: 1.4;
  text-align: center;
  display: block
}

.medicare-disclaimer p {
  margin: 0 0 var(--space-12a);
}

.medicare-disclaimer p:last-child {
  margin-bottom: 0
}

.agent-page-shell--disclaimer-inline .survey-main {
  min-height: auto
}

.agent-page-main {
  padding: 0 var(--space-13) 3rem;
  width: 100%;
  max-width: 920px
}

/* Layout editor pages: authored section width owns the canvas (no legacy 920px clamp). */
.agent-page-shell--layout .agent-page-main {
  max-width: none;
  padding: 0;
  align-self: stretch;
}

.agent-page-shell--layout {
  align-items: stretch;
  width: 100%;
}

.agent-page-shell--layout .survey-main {
  width: 100%;
  max-width: none;
  align-self: stretch;
}

.agent-page-header {
  position: sticky;
  top: 0;
  z-index: 20;
  width: 100%;
  display: flex;
  justify-content: center;
  padding: var(--space-9) 0;
  background: var(--bp-card-bg, var(--c-surface));
  border-bottom: 1px solid var(--c-border)
}

.agent-page-header-inner {
  width: 100%;
  max-width: 860px;
  display: flex;
  justify-content: center;
  align-items: center
}

.agent-page-logo {
  height: 48px;
  max-width: min(360px, 80vw);
  object-fit: contain;
  display: block
}

.agent-page-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: var(--space-13);
  align-items: start;
  width: 100%;
  max-width: 860px;
  margin-top: var(--space-13);
}

.agent-page-card,
.agent-message-card {
  margin: 0
}

.agent-message-card {
  width: 100%;
  align-self: start
}

.agent-page-main-col {
  display: flex;
  flex-direction: column;
  gap: var(--space-13);
  min-width: 0
}

.agent-hero-row {
  gap: var(--space-13);
  align-items: center;
  justify-content: center;
  flex-wrap: wrap
}

.agent-identity-wrap {
  gap: var(--space-13);
  align-items: center;
  flex-wrap: wrap
}

.agent-photo {
  width: 86px;
  height: 86px;
  border-radius: 999px;
  object-fit: cover;
  border: 1px solid var(--c-border);
  flex-shrink: 0
}

.agent-page-title {
  margin: 0 0 var(--space-5);
  font-size: clamp(1.45rem, 2.8vw, 1.85rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--c-text)
}

/* Inside path seats, Design/RTE size wins (Preview + published). */
.bp-el .agent-page-title,
.bp-el .agent-page-subtitle {
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  margin: 0;
}

.agent-page-subtitle {
  margin: 0
}

.agent-primary-cta-wrap {
  display: flex;
  justify-content: center;
  margin-top: var(--space-3);
}

.agent-primary-cta {
  font-weight: 700;
  padding: var(--space-11) var(--space-15);
  font-size: var(--bp-text-lg)
}

.agent-section-label {
  margin: 0 0 var(--space-5);
  font-weight: 600;
  color: var(--c-text)
}

.agent-about-section,
.agent-contact-list,
.agent-licensed-states {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.agent-contact-list {
  margin-top: var(--space-1);
  padding-top: var(--space-5);
  border-top: 1px solid color-mix(in srgb, var(--c-border) 70%, transparent)
}

.agent-intro {
  margin: 0;
  line-height: 1.55;
  color: var(--c-text)
}

.agent-contact-row {
  display: flex;
  align-items: center;
  gap: var(--space-9);
  margin: var(--space-2) 0;
}

.agent-contact-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 999px;
  background: var(--c-primary);
  color: #fff;
  flex-shrink: 0
}

.agent-contact-value {
  font-weight: 600;
  color: var(--c-text);
  text-decoration: none
}

.agent-contact-value:hover {
  color: var(--c-primary)
}

.agent-licensed-states {
  margin-top: var(--space-3);
}

.agent-licensed-states-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-7);
}

.agent-message-intro {
  margin: 0 0 var(--space-11);
}

.agent-message-consent {
  display: flex;
  align-items: flex-start;
  gap: var(--space-9);
  margin: 0
}

.agent-message-consent .form-checkbox {
  margin-top: var(--space-1c);
  flex-shrink: 0
}

.agent-message-consent .text-sm {
  line-height: 1.45
}

.agent-message-status {
  margin: 0;
  min-height: 1.2rem
}

.agent-message-card .card-header {
  font-weight: 700
}

.survey-step-progress {
  --bp-progress-thickness: 8px;
  height: var(--bp-progress-thickness, 8px);
  min-height: var(--bp-progress-thickness, 8px);
  background: var(--bp-progress-track, var(--c-border));
  border-radius: 999px;
  margin: 0 0 1.4rem;
  overflow: hidden
}

.survey-progress-text {
  margin-bottom: var(--space-13);
}

.survey-progress-bar {
  height: 100%;
  background: var(--bp-progress-fill, var(--c-primary));
  transition: width .4s var(--ease)
}

.survey-page-blocks--sections .survey-progress-bar,
body.pb-preview-embed .survey-progress-bar,
body.pb-preview-standalone .survey-progress-bar {
  transition: none;
}

.bp-el[data-bp-el="progress"] .survey-step-progress {
  height: var(--bp-progress-thickness, 8px);
  min-height: var(--bp-progress-thickness, 8px);
  background: var(--bp-progress-track, var(--c-border));
}

.bp-el[data-bp-el="progress"]:not([data-bp-page-css]) .survey-progress-bar {
  background: var(--bp-progress-fill, var(--c-primary));
}

.survey-step {
  padding: var(--space-16) var(--space-16) 1.65rem;
  display: none
}

.survey-step.active {
  display: block;
  animation: survey-step-in .3s ease;
  min-height: 25rem
}

/* New section editor pages + path-builder preview: no legacy step fade. */
.survey-step.active:has(.survey-page-blocks--sections),
body.pb-preview-embed .survey-step.active,
body.pb-preview-standalone .survey-step.active {
  animation: none;
}

@keyframes survey-step-in {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.survey-step-supertitle {
  color: var(--primary-color, var(--c-primary));
  margin-bottom: var(--space-3);
}

/* Legacy step chrome (non–path-seat pages). Path seats (.bp-el) inherit Design/RTE. */
.survey-step-supertitle,
.survey-step-title {
  font-size: var(--bp-text-xl);
  font-weight: 600;
  text-align: center
}

.survey-step-title {
  margin-bottom: var(--space-13);
}

.survey-step-subtitle {
  margin: var(--space-9);
  font-size: var(--bp-text-lg);
  line-height: 1.45;
  color: var(--c-muted);
  text-align: center
}

.bp-el :is(.survey-step-supertitle, .survey-step-title, .survey-step-subtitle) {
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  text-align: inherit;
  margin: 0;
}

.survey-step-image {
  display: flex;
  justify-content: center;
  margin: 0 0 var(--space-14);
}

.survey-step-image img {
  max-width: 50%;
  max-height: 320px;
  border-radius: .5rem;
  object-fit: contain
}

.survey-page-blocks {
  --survey-block-gap: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: var(--survey-block-gap);
  width: 100%;
  align-items: center
}

.survey-page-block {
  width: 100%;
  margin: 0;
  text-align: center
}

.survey-page-block--custom_code,
.survey-page-block--input {
  text-align: left
}

.survey-page-block--progress {
  display: flex;
  flex-direction: column;
  gap: var(--space-10);
  align-items: stretch
}

.survey-page-blocks :is(.survey-step-supertitle, .survey-step-title, .survey-step-subtitle, .survey-step-image, .survey-step-progress, .survey-progress-text, .survey-step-information, .survey-step-disclaimers, .survey-custom-code-block, .form-group, .survey-field-disclaimer, .survey-page-badge, .survey-page-bullets, .survey-styled-text, .survey-page-stats, .survey-page-body, .survey-page-heading, .survey-page-subheading, .survey-page-disclaimer, .survey-page-image, .survey-page-cta, .survey-page-phone, .survey-page-booking, .survey-google-review-btn) {
  margin-top: 0;
  margin-bottom: 0
}

/* Path seats: Design + RTE own type. Do not force size/weight/color here. */
.survey-page-heading,
.survey-page-subheading,
.survey-page-body,
.survey-page-disclaimer {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
}

.survey-page-disclaimer {
  max-width: 480px;
}

.survey-styled-text {
  max-width: 100%;
  box-sizing: border-box
}

.survey-page-block--styled_text {
  text-align: inherit
}

.survey-page-block--styled_text .survey-page-bullets.survey-styled-text,
.survey-page-block--styled_text .survey-styled-text[style*="text-align: left"] {
  margin-left: auto;
  margin-right: auto
}

.survey-page-image {
  width: 100%;
  max-width: 420px;
  border-radius: var(--radius, .75rem);
  display: block;
  object-fit: cover;
  cursor: pointer
}

.survey-page-bullets {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: left;
  display: inline-flex;
  flex-direction: column;
  gap: var(--space-8);
}

.survey-page-bullets-item {
  display: flex;
  align-items: baseline;
  gap: var(--space-9);
  font-size: var(--bp-text-lg);
  line-height: 1.45
}

.survey-page-bullets-icon {
  color: var(--c-primary);
  font-weight: 700;
  flex-shrink: 0
}

.survey-page-stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-15);
  padding: var(--space-12) var(--space-13);
  background: var(--c-surface, #f9fafb);
  border: 1px solid var(--c-border, #e5e7eb);
  border-radius: var(--radius, .75rem)
}

.survey-page-stats-item {
  text-align: center;
  min-width: 60px
}

.survey-page-stats-value {
  font-size: var(--bp-text-xl);
  font-weight: 700;
  color: var(--c-primary)
}

.survey-page-stats-label {
  font-size: var(--bp-text-sm);
  color: var(--c-muted, #6b7280);
  margin-top: var(--space-1a);
}

.survey-page-cta {
  font-size: var(--bp-text-lg);
  padding: var(--space-11) var(--space-17);
  display: inline-block
}

/* Path button seats: Design on the host wins over the CTA theme size above. */
.bp-el[data-bp-el="button"] {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* Intrinsic sizer when Width/Height are auto (label on data-bp-text). */
.bp-el[data-bp-el="button"]::before {
  content: attr(data-bp-text);
  visibility: hidden;
  display: inline;
  pointer-events: none;
  white-space: nowrap;
  font: inherit;
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  line-height: inherit;
}

.bp-el[data-bp-el="button"]:not([data-bp-page-css]) > :is(.btn, a.btn, button, .survey-page-cta, a.survey-page-cta) {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  line-height: inherit;
  padding: 0;
  min-height: 0;
  width: auto;
  height: auto;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
}

.bp-el[data-bp-el="button"]:not([data-bp-page-css]) > :is(.btn, a.btn, button, .survey-page-cta, a.survey-page-cta):hover:not(:disabled),
.bp-el[data-bp-el="button"]:not([data-bp-page-css]) > :is(.btn, a.btn, button, .survey-page-cta, a.survey-page-cta):focus-visible {
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
}

.survey-page-block--phone,
.survey-page-phone {
  display: flex;
  flex-direction: column;
  align-items: center
}

.survey-page-phone-label {
  width: 100%;
  text-align: center
}

.survey-page-phone-label {
  margin: 0 0 var(--space-11);
  font-size: var(--bp-text-lg);
  color: var(--c-muted, #6b7280)
}

.survey-page-phone-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto
}

.survey-page-booking-title {
  font-size: var(--bp-text-xl);
  font-weight: 600;
  margin: 0 0 var(--space-4);
}

.survey-page-booking-sub {
  font-size: var(--bp-text-md);
  color: var(--c-muted, #6b7280);
  margin: 0 0 var(--space-13);
}

.survey-page-booking-widget {
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box
}

.survey-page-voice-ai {
  display: flex;
  align-items: flex-start;
  gap: var(--space-11);
  max-width: 480px;
  margin: 0 auto var(--space-15);
  padding: var(--space-12) var(--space-13);
  text-align: left;
  background: color-mix(in srgb, var(--c-primary) 8%, var(--c-surface));
  border: 1px solid color-mix(in srgb, var(--c-primary) 22%, var(--c-border));
  border-radius: var(--radius, .75rem);
  box-sizing: border-box
}

.survey-page-voice-ai-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--c-primary) 14%, var(--c-surface))
}

.survey-page-voice-ai-text {
  margin: 0;
  font-size: var(--bp-text-lg);
  line-height: 1.45;
  color: var(--c-text, #111827)
}

.survey-page-blocks .survey-field-disclaimer,
.survey-page-blocks .survey-step-information .survey-field-information {
  margin-top: 0;
  margin-left: auto;
  margin-right: auto
}

.survey-custom-code-block {
  margin: 0;
  width: 100%;
  text-align: initial
}

.survey-loading-step {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: var(--space-13);
  padding: var(--space-16) var(--space-13);
  margin: 0 auto;
  width: 100%;
  max-width: 24rem;
}

.spinner,
.bp-spinner {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  border: 2px solid color-mix(in srgb, var(--bp-spinner-color, var(--c-primary)) 20%, transparent);
  border-top-color: var(--bp-spinner-color, var(--c-primary));
  border-radius: 50%;
  animation: bp-spin .7s linear infinite;
}

@keyframes bp-spin {
  to { transform: rotate(360deg); }
}

.survey-loading-step .spinner {
  width: 2.75rem;
  height: 2.75rem;
  border-width: 3px;
  align-self: center;
  flex-shrink: 0;
}

.survey-submit-retry {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-10) var(--space-13);
  margin: 0 0 var(--space-13);
  padding: var(--space-12) var(--space-13);
  border-radius: .5rem;
  border: 1px solid color-mix(in srgb, var(--c-danger, #c0392b) 35%, transparent);
  background: color-mix(in srgb, var(--c-danger, #c0392b) 8%, #fff);
  color: var(--c-danger, #c0392b);
  text-align: center;
}

.survey-submit-retry-msg {
  margin: 0;
  font-weight: 500;
  font-size: var(--bp-text-lg);
  flex: 1 1 12rem;
}

.survey-submit-retry-btn {
  flex: 0 0 auto;
}

.survey-loading-message {
  font-size: var(--bp-text-lg);
  margin: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  text-align: inherit;
}

.survey-loading-message p {
  margin: 0;
}

.survey-loading-message p + p {
  margin-top: 0.35em;
}

@media (max-width:768px) {
  .agent-page-grid {
    grid-template-columns: 1fr
  }

  .survey-header-cta-row {
    width: 100%;
    gap: var(--space-7);
    justify-content: space-between
  }

  .survey-header-call-wrap,
  .survey-header-cta-row .survey-header-logo {
    width: 48%
  }

  .survey-header-cta-row .survey-header-logo {
    height: auto !important;
    max-height: 40px;
    max-width: 100% !important;
    object-fit: contain
  }

  .survey-header-call-wrap .btn-call-agent {
    width: 100%;
    padding: var(--space-9) var(--space-8);
    min-height: 40px;
    font-size: var(--bp-text-lg);
    gap: var(--space-1b);
  }

  .survey-header-call-wrap .btn-call-agent-title {
    font-size: var(--bp-text-sm)
  }

  .survey-header-call-wrap .btn-call-agent-phone {
    font-size: var(--bp-text-sm)
  }

  .agent-page-card>.card-body {
    align-items: center
  }

  .agent-page-card .agent-hero-row {
    justify-content: center !important;
    text-align: center
  }

  .agent-page-card .agent-identity-wrap {
    justify-content: center;
    text-align: center
  }

  .agent-page-card .agent-identity-copy,
  .agent-page-card .agent-intro {
    text-align: center
  }

  .agent-page-card .agent-photo {
    width: 102px !important;
    height: 102px !important
  }

  .agent-page-card .agent-primary-cta {
    align-self: center
  }

  .agent-page-card .agent-contact-card {
    width: 100%
  }

  .agent-page-card .agent-contact-list {
    text-align: left
  }

  .agent-page-card .agent-licensed-states {
    align-items: center;
    text-align: center
  }

  .agent-page-card .agent-licensed-states-list {
    justify-content: center
  }

  .agent-page-main {
    padding-left: 0;
    padding-right: 0
  }

  .agent-page-header {
    padding-left: var(--space-13);
    padding-right: var(--space-13);
  }
}

.survey-step .form-group {
  gap: var(--space-8a);
  margin-bottom: var(--space-3);
  text-align: center
}

/* Legacy funnel steps only - path preview/live (html[data-path-ui], .bp-el seats) use padding-driven fields. */
.survey-step:not(:has(.bp-el)):not(:has(.survey-page-blocks--sections)) {
  --bp-field-height: 3.125rem;
  font-size: var(--bp-text-lg);
  /* Weight belongs to Design / RTE on .bp-el seats - do not force 400 here. */
  text-align: center
}

html[data-path-ui] .survey-step {
  font-size: inherit;
}

.survey-step .survey-field-subtext {
  margin: -var(--space-0) 0 var(--space-2);
  font-size: var(--bp-text-lg);
  line-height: 1.45;
  color: var(--c-muted);
  text-align: center
}

.survey-required {
  color: var(--c-danger, #e11d48);
  font-weight: 700;
  margin-left: .15em;
  line-height: 1;
}

.survey-field-disclaimer {
  padding: var(--space-11) var(--space-12a);
  border: 1px solid color-mix(in srgb, var(--c-border) 88%, #fff);
  border-radius: calc(var(--radius) + 2px);
  background: color-mix(in srgb, var(--c-bg) 92%, var(--c-text-light) 8%);
  color: var(--c-text-muted);
  font-size: var(--bp-text-sm);
  line-height: 1.5
}

/* Inside path seats, Design/RTE win over the boxed disclaimer theme. */
.bp-el .survey-field-disclaimer {
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  padding: 0;
  box-shadow: none;
}

.survey-field-disclaimer,
.survey-step .survey-field-information {
  margin: var(--space-8) auto 0;
  max-width: 520px;
  text-align: left;
  box-shadow: var(--bp-shadow)
}

.survey-step .survey-field-information {
  padding: var(--space-12a) var(--space-13);
  border: 1px solid color-mix(in srgb, var(--c-accent) 55%, #fff);
  border-radius: calc(var(--radius) + 2px);
  background: color-mix(in srgb, var(--c-accent) 8%, #fff);
  color: color-mix(in srgb, #0891b2 95%, #fff);
  font-size: var(--bp-text-lg);
  font-weight: 500;
  line-height: 1.6;
  display: flex;
  align-items: flex-start;
  gap: var(--space-8);
}

.survey-info-icon {
  flex-shrink: 0;
  font-size: var(--bp-text-lg);
  color: var(--c-accent);
  margin-top: var(--space-0);
}

.survey-google-review-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-8a);
  padding: var(--space-12) var(--space-15a);
  font-size: var(--bp-text-lg);
  font-weight: 600;
  color: #fff;
  background: #4285f4;
  border: none;
  border-radius: var(--radius);
  cursor: pointer;
  text-decoration: none;
  transition: background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  box-shadow: var(--bp-shadow);
  margin: var(--space-8) auto 0;
}

.survey-google-review-btn:hover {
  background: #3367d6;
  box-shadow: var(--bp-shadow);
  color: #fff
}

.survey-google-icon {
  flex-shrink: 0
}

.survey-step-disclaimers {
  margin-top: var(--space-13);
}

.survey-nav+.survey-step-disclaimers,
.survey-step .survey-step-disclaimers:last-child {
  margin-top: var(--space-14);
}

.survey-step .survey-address-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-11);
}

.survey-step .survey-places-host gmp-place-autocomplete {
  width: 100%
}

.survey-places-fallback {
  position: fixed;
  inset: auto auto auto auto;
  z-index: 1500;
  min-width: 12rem;
  max-height: min(280px, 55vh);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  display: none;
  /* BP form-select panel chrome (shared with .form-select-menu / prescription suggestions) */
  --bp-menu-pad: .4rem;
  background: var(--c-surface, #fff);
  border: 1px solid transparent;
  border-radius: var(--bp-card-radius, var(--radius));
  box-shadow: var(--bp-shadow-hover);
  color: var(--c-text, #0f172a);
  box-sizing: border-box;
}

.survey-places-fallback.open {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--bp-menu-pad);
  transform-origin: top;
  /* Opacity only - transform animations fight position:fixed scroll pinning. */
  animation: bp-menu-in-fade var(--dur, .18s) var(--ease-emphasis, ease);
}

.survey-places-option {
  /* Row look comes from .form-select-option; wrap long place names. */
  white-space: normal;
  width: 100%;
}

.survey-step input[data-places-hidden="1"] {
  display: none
}

.survey-step .form-input,
.survey-step .form-select,
.survey-step .form-textarea {
  text-align: left
}

.survey-step .form-textarea {
  min-height: 118px
}

.survey-choice-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-11);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.survey-choice-list-1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-11);
}

.survey-choice-list-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-11);
}

.survey-choice-list-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-11);
}

.survey-choice-list-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-11);
}

@media (max-width:640px) {
  .survey-choice-list-2 {
    grid-template-columns: repeat(2, 1fr)
  }

  .survey-choice-list-3 {
    grid-template-columns: repeat(3, 1fr)
  }

  .survey-choice-list-4 {
    grid-template-columns: repeat(2, 1fr)
  }
}

.survey-choice {
  position: relative;
  display: block
}

.survey-choice-input,
.survey-star-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  pointer-events: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background: transparent !important;
  box-shadow: none !important
}

.survey-choice-input::before,
.survey-star-input::before {
  content: none !important;
  display: none !important
}

.survey-choice-btn {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: 0;
  /* Padding / fill / color / radius / type / shadow are authored inline (Button defaults). */
  text-align: center;
  cursor: pointer;
  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease), box-shadow var(--dur) var(--ease), filter var(--dur) var(--ease)
}

.survey-choice-btn:hover {
  filter: brightness(0.96)
}

.survey-other-wrap {
  margin-top: var(--space-8);
  grid-column: 1/-1
}

.survey-other-row,
.survey-place-name-row {
  display: flex;
  align-items: stretch;
  gap: var(--space-8);
  width: 100%;
}

.survey-other-row .survey-other-input,
.survey-other-row .form-input,
.survey-place-name-row .form-input {
  flex: 1 1 auto;
  min-width: 0;
}

.survey-other-row .survey-other-submit,
.survey-other-row .survey-place-other-submit,
.survey-place-name-row .survey-place-other-submit {
  flex: 0 0 auto;
  align-self: stretch;
  white-space: nowrap;
  color: var(--c-text, #111827);
  background: var(--c-surface, #fff);
  border: 1px solid var(--c-border, #d1d5db);
  box-shadow: none;
}

.survey-other-row .survey-other-submit:hover:not(:disabled),
.survey-other-row .survey-place-other-submit:hover:not(:disabled),
.survey-place-name-row .survey-place-other-submit:hover:not(:disabled) {
  background: var(--c-bg, #f3f4f6);
  border-color: var(--c-border, #d1d5db);
  color: var(--c-text, #111827);
}

.survey-place-other-list {
  margin-top: var(--space-10);
}

.survey-place-other-list .survey-place-other-wrap {
  margin-top: var(--space-8);
}

.survey-place-other-toggle {
  display: none;
}

.survey-other-input {
  width: 100%;
  box-sizing: border-box;
  padding: var(--space-9) var(--space-11);
  font-size: var(--bp-text-lg);
  outline: none;
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background-color var(--dur) var(--ease)
}

.survey-page-block--other-continue {
  margin-top: var(--space-11);
}

.survey-star-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-9);
  margin-top: var(--space-5);
}

.survey-star-rating {
  display: inline-flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
}

.survey-star-input {
  position: absolute;
  opacity: 0;
  pointer-events: none
}

.survey-star-label {
  cursor: pointer;
  font-size: clamp(2.1rem, 5vw, 2.8rem);
  line-height: 1;
  color: color-mix(in srgb, var(--c-text-muted) 45%, var(--c-border));
  transition: color var(--dur) var(--ease), text-shadow var(--dur) var(--ease);
  user-select: none
}

.survey-star-label:hover,
.survey-star-label:hover~.survey-star-label {
  color: #f5b301;
}

.survey-star-input:checked~.survey-star-label {
  color: #f5b301;
  text-shadow: none
}

.survey-star-hint {
  text-align: center
}

.survey-prescription-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-11);
  width: 100%
}

.survey-prescription-entries {
  display: flex;
  flex-direction: column;
  gap: .8rem;
  width: 100%
}

.survey-prescription-entry {
  border: 1px solid var(--bp-field-outline, var(--c-border));
  /* Radius comes from the question seat via path-layout inherit chain (same as address). */
  padding: var(--space-12a);
  background: var(--c-surface);
  display: flex;
  flex-direction: column;
  gap: var(--space-11);
  width: 100%;
  box-sizing: border-box;
  overflow: visible
}

.survey-prescription-entry-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-11);
  width: 100%;
  overflow: visible
}

.survey-prescription-field {
  position: relative;
  width: 100%;
  min-width: 0
}

/* Drug name full width; dosage / qty / refill share the row below when space allows. */
.survey-prescription-field.is-prescription-name {
  grid-column: 1 / -1
}

@media (max-width: 720px) {
  .survey-prescription-entry-fields {
    grid-template-columns: 1fr
  }
}

.survey-prescription-remove {
  align-self: flex-end
}

.survey-prescription-empty {
  margin: 0
}

.survey-prescription-add {
  align-self: center
}

.survey-hospital-list,
.survey-hospital-entries,
.survey-physician-list,
.survey-physician-entries,
.survey-pharmacy-list,
.survey-pharmacy-entries {
  display: flex;
  flex-direction: column;
  gap: var(--space-10);
  width: 100%
}

.survey-hospital-entry,
.survey-physician-entry,
.survey-pharmacy-entry {
  width: 100%
}

.survey-hospital-entry-row,
.survey-physician-entry-row,
.survey-pharmacy-entry-row {
  display: flex;
  align-items: stretch;
  gap: var(--space-10);
  width: 100%
}

.survey-hospital-entry-row .survey-place-search-input,
.survey-hospital-entry-row .form-input,
.survey-physician-entry-row .survey-place-search-input,
.survey-physician-entry-row .form-input,
.survey-pharmacy-entry-row .survey-place-search-input,
.survey-pharmacy-entry-row .form-input {
  flex: 1 1 auto;
  min-width: 0
}

.survey-add-another {
  appearance: none;
  background: none;
  border: 0;
  box-shadow: none;
  padding: var(--space-1) 0;
  margin: 0;
  font: inherit;
  font-size: var(--bp-text-lg);
  font-weight: 600;
  color: var(--bp-btn-fill, var(--c-primary, #5050ff));
  cursor: pointer;
  align-self: flex-start;
  text-align: left;
  width: auto;
  max-width: 100%;
  line-height: 1.3
}

.survey-add-another:hover {
  text-decoration: underline
}

.survey-hospital-remove,
.survey-physician-remove,
.survey-pharmacy-remove {
  appearance: none;
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
  font: inherit;
  font-size: var(--bp-text-md);
  font-weight: 500;
  color: var(--c-text-muted, #6b7280);
  cursor: pointer;
  flex: 0 0 auto;
  align-self: center;
  white-space: nowrap
}

.survey-hospital-remove:hover,
.survey-physician-remove:hover,
.survey-pharmacy-remove:hover {
  color: var(--c-text, #111827);
  text-decoration: underline
}

.survey-hospital-list.is-single .survey-hospital-remove,
.survey-physician-list.is-single .survey-physician-remove,
.survey-pharmacy-list.is-single .survey-pharmacy-remove {
  display: none
}

.survey-physician-add.survey-add-another {
  align-self: flex-start
}

.survey-physician-list:not([data-allow-other="1"]) .survey-physician-add,
.survey-physician-list:not([data-allow-other="1"]) .survey-physician-remove,
.survey-physician-list:not([data-allow-other="1"]) .survey-add-another,
.survey-hospital-list:not([data-allow-other="1"]) .survey-hospital-add,
.survey-hospital-list:not([data-allow-other="1"]) .survey-hospital-remove,
.survey-hospital-list:not([data-allow-other="1"]) .survey-add-another,
.survey-pharmacy-list:not([data-allow-other="1"]) .survey-pharmacy-add,
.survey-pharmacy-list:not([data-allow-other="1"]) .survey-pharmacy-remove,
.survey-pharmacy-list:not([data-allow-other="1"]) .survey-add-another {
  display: none
}

.survey-prescription-suggestions {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 40;
  min-width: 100%;
  max-height: min(280px, 55vh);
  /* BP form-select panel chrome (shared with .form-select-menu) */
  --bp-menu-pad: .4rem;
  background: var(--c-surface);
  border: 1px solid transparent;
  border-radius: var(--bp-card-radius, var(--radius));
  box-shadow: var(--bp-shadow-hover);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  color: var(--c-text)
}

/* Floated to document.body so path-canvas transforms / overflow don't trap the menu in layout. */
.survey-prescription-suggestions--floating,
.survey-places-fallback.survey-floating-menu {
  position: fixed !important;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  min-width: 0;
  z-index: 10050;
  transform: none !important;
  animation: none !important;
}

.survey-prescription-suggestions[hidden] {
  display: none !important
}

.survey-prescription-suggestions.open,
.survey-prescription-suggestions:not([hidden]) {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--bp-menu-pad);
  transform-origin: top;
  animation: bp-menu-in-fade var(--dur, .18s) var(--ease-emphasis, ease)
}

.survey-prescription-suggestions--floating.open,
.survey-prescription-suggestions.survey-floating-menu.open {
  animation: none !important;
  transform: none !important;
}

@keyframes bp-menu-in-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

.survey-prescription-option {
  /* Row look comes from .form-select-option; keep white-space wrapping for long drug names. */
  white-space: normal;
  width: 100%
}

.survey-prescription-error {
  cursor: default;
  color: var(--c-danger);
  font-weight: 500;
  white-space: normal
}

.survey-prescription-error:hover {
  background: color-mix(in srgb, var(--c-danger) 8%, var(--c-surface));
  box-shadow: none;
  color: var(--c-danger)
}

.survey-nav {
  display: flex;
  justify-content: flex-end;
  padding: 1.2rem var(--space-16) var(--space-15);
}

.survey-nav #survey-next {
  width: 100%;
  min-height: 54px;
  font-size: var(--bp-text-lg);
  font-weight: 700
}

/* Booking widget (.bw-*) moved to booking-widget.css.
 * Path seats (.bp-*) moved to path-layout.css (structure only).
 * Public paths no longer load this file for seat presentation.
 */