.rr-booking {
  --rr-primary: #245b4a;
  --rr-primary-contrast: #fff;
  --rr-text: #17211d;
  --rr-muted: #5d6a64;
  --rr-border: #d9e1dd;
  --rr-background: #f5f8f6;
  --rr-success: #176b45;
  --rr-warning: #8a5a00;
  --rr-error: #a52828;
  box-sizing: border-box;
  width: min(100%, 780px);
  margin: 18px auto;
  color: var(--rr-text);
  font: 400 16px/1.55 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.rr-booking *, .rr-booking *::before, .rr-booking *::after { box-sizing: inherit; }
.rr-booking--demo { width: min(100%, 1120px); }
.rr-booking__header { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 8px; }
.rr-booking__demo-role-nav { display: flex; justify-content: flex-end; margin-bottom: 10px; }
.rr-booking__header h2 { flex-basis: 100%; }
.rr-booking__brand-logo { display: block; width: auto; max-width: min(220px, 70%); max-height: 72px; object-fit: contain; }
.rr-booking__profile-photo { width: 56px; height: 56px; border-radius: 999px; object-fit: cover; }
.rr-booking__eyebrow { margin: 0 0 4px; color: var(--rr-primary); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: 13px; }
.rr-booking h2, .rr-booking h3, .rr-booking h4 { color: var(--rr-text); line-height: 1.2; margin: 0 0 10px; }
.rr-booking__header h2 { font-size: 22px; }
.rr-progress { display: grid; grid-template-columns: repeat(5, 1fr); gap: 3px; margin: 0 0 8px; padding: 0; list-style: none; }
.rr-progress li { text-align: center; color: var(--rr-muted); font-size: 12px; }
.rr-progress li::before { content: ""; display: block; height: 2px; margin-bottom: 0; border-radius: 3px; background: var(--rr-border); }
.rr-progress li.is-current::before, .rr-progress li.is-complete::before { background: var(--rr-primary); }
.rr-progress li.is-current { color: var(--rr-text); font-weight: 700; }
.rr-progress span, .rr-progress small { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rr-flow { display: grid; gap: 3px; }
.rr-flow-step { scroll-margin-top: 84px; }
.rr-flow-step--active { margin-top: 10px; scroll-margin-top: 92px; }
.rr-flow-step--complete .rr-step-summary { min-height: 28px; padding: 2px 0; border-color: transparent; background: transparent; box-shadow: none; }
.rr-flow-step--complete .rr-step-summary__mark { width: 18px; height: 18px; border: 1px solid color-mix(in srgb, var(--rr-success) 35%, var(--rr-border)); color: var(--rr-success); background: transparent; font-size: 12px; }
.rr-flow-step--complete .rr-step-summary h3 { overflow: hidden; margin: 0; color: var(--rr-muted); font-size: 13px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.rr-flow-step--complete .rr-step-summary p { display: none; }
.rr-flow-step--complete .rr-step-summary__edit .rr-button { min-height: 28px; padding: 3px 4px; color: var(--rr-muted); font-size: 12px; }
.rr-flow-step--active .rr-booking__card { border: 0; border-left: 3px solid var(--rr-primary); border-radius: 0; background: transparent; box-shadow: none; }
.rr-flow-step--active .rr-booking__card > h3 { margin-bottom: 16px; font-size: 24px; font-weight: 850; letter-spacing: 0; }
.rr-step-summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 54px; padding: 9px 10px; border: 1px solid var(--rr-border); border-radius: 8px; background: #fff; }
.rr-step-summary__mark { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: var(--rr-success); font-size: 14px; font-weight: 800; }
.rr-step-summary__body { min-width: 0; }
.rr-step-summary h3 { margin: 0 0 2px; font-size: 15px; }
.rr-step-summary p { overflow: hidden; margin: 0; color: var(--rr-muted); font-size: 13px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.rr-step-summary__edit { margin: 0; }
.rr-step-summary__edit .rr-button { min-height: 40px; padding: 8px 6px; font-size: 14px; }
.rr-step-summary--pending { min-height: 32px; padding: 3px 0; border-color: transparent; color: var(--rr-muted); background: transparent; }
.rr-step-summary--pending .rr-step-summary__mark { width: 22px; height: 22px; color: var(--rr-muted); background: var(--rr-border); font-size: 12px; }
.rr-step-summary--pending h3 { color: var(--rr-muted); font-size: 13px; font-weight: 700; }
.rr-step-summary--pending p { display: none; }
.rr-flow-step--pending + .rr-flow-step--pending { margin-top: -3px; }
.rr-booking__card { padding: 18px 0 18px 18px; border: 0; border-left: 3px solid var(--rr-primary); border-radius: 0; background: transparent; box-shadow: none; }
.rr-field { margin: 14px 0; }
.rr-field > label, .rr-field__label { display: block; margin-bottom: 7px; font-weight: 700; }
.rr-field input, .rr-field textarea { width: 100%; min-height: 48px; border: 1px solid var(--rr-border); border-radius: 8px; padding: 10px 12px; color: var(--rr-text); background: #fff; font: inherit; }
.rr-field textarea { min-height: 110px; resize: vertical; }
.rr-field__help { color: var(--rr-muted); font-size: 14px; margin: -3px 0 7px; }
.rr-field__error { color: var(--rr-error); font-size: 14px; margin: 6px 0 0; }
.rr-address-confirmation { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; margin: 10px 0 14px; padding: 10px 0; border-top: 1px solid var(--rr-border); border-bottom: 1px solid var(--rr-border); color: var(--rr-muted); }
.rr-address-confirmation__mark { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; color: var(--rr-success); border: 1px solid color-mix(in srgb, var(--rr-success) 35%, var(--rr-border)); font-size: 12px; font-weight: 800; }
.rr-address-confirmation h4 { margin: 0 0 2px; color: var(--rr-text); font-size: 14px; }
.rr-address-confirmation p { margin: 0; font-size: 14px; line-height: 1.35; }
.rr-booking input:focus-visible, .rr-booking textarea:focus-visible, .rr-booking button:focus-visible { outline: 3px solid color-mix(in srgb, var(--rr-primary) 35%, transparent); outline-offset: 2px; }
.rr-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; border: 1px solid transparent; border-radius: 8px; padding: 10px 17px; font: 700 15px/1.2 inherit; cursor: pointer; }
.rr-button--primary { color: var(--rr-primary-contrast); background: var(--rr-primary); }
.rr-button--secondary { color: var(--rr-primary); background: #fff; border-color: var(--rr-primary); }
.rr-button--text { color: var(--rr-primary); background: transparent; text-decoration: underline; }
.rr-button[aria-disabled="true"], .rr-booking__form[data-rr-submitting="1"] .rr-button.is-busy { opacity: .72; pointer-events: none; cursor: progress; }
.rr-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.rr-person { margin: 14px 0; border: 1px solid var(--rr-border); border-radius: 8px; overflow: clip; background: #fff; }
.rr-person--single { margin: 10px 0 0; border: 0; border-radius: 0; overflow: visible; background: transparent; }
.rr-person--single .rr-person__panel { padding: 0; border-top: 0; }
.rr-person__toggle { appearance: none; -webkit-appearance: none; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 14px; width: 100%; min-height: 64px; padding: 14px 16px; border: 0; color: var(--rr-text); background: #f9fbfa; text-align: left; font: inherit; cursor: pointer; }
.rr-person__toggle::after { content: "▾"; grid-column: 2; grid-row: 1 / span 3; align-self: center; color: var(--rr-primary); font-size: 18px; transition: transform .18s ease; }
.rr-person__toggle[aria-expanded="false"]::after { transform: rotate(-90deg); }
.rr-person__title { font-weight: 800; }
.rr-person__meta { color: var(--rr-primary); font-size: 14px; font-weight: 700; }
.rr-person__details { grid-column: 1 / -1; color: var(--rr-muted); font-size: 14px; }
.rr-person__panel { padding: 16px; border-top: 1px solid var(--rr-border); }
.rr-booking.is-enhanced .rr-person[data-rr-collapsed="true"] .rr-person__panel { display: none; }
.rr-person__remove { margin-top: 4px; }
.rr-person legend, .rr-slots legend, .rr-inline-choices legend { padding: 0 6px; font-weight: 800; }
.rr-service-grid { display: grid; gap: 9px; }
.rr-choice, .rr-slot { display: flex; gap: 12px; align-items: flex-start; min-height: 52px; margin: 8px 0; padding: 12px; border: 1px solid var(--rr-border); border-radius: 8px; cursor: pointer; }
.rr-service-card { margin: 0; background: #fff; }
.rr-choice input, .rr-slot input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--rr-primary); }
.rr-choice span, .rr-slot span { display: grid; gap: 3px; min-width: 0; }
.rr-choice small, .rr-slot small { color: var(--rr-muted); }
.rr-slot:has(input:checked), .rr-choice:has(input:checked) { border-color: var(--rr-primary); background: var(--rr-background); box-shadow: inset 0 0 0 1px var(--rr-primary); }
.rr-slot__daypart { color: var(--rr-primary); font-size: 15px; }
.rr-slots, .rr-inline-choices { border: 0; padding: 0; margin: 16px 0; }
.rr-inline-choices label { display: block; min-height: 44px; padding: 8px 0; }
.rr-summary { margin: 12px 0; padding: 10px 0; border-top: 1px solid var(--rr-border); border-bottom: 1px solid var(--rr-border); border-radius: 0; background: transparent; }
.rr-summary ul { padding: 0; margin: 0; list-style: none; }
.rr-summary li, .rr-summary > p { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; padding: 7px 0; margin: 0; }
.rr-summary > p { border-top: 1px solid var(--rr-border); margin-top: 8px; }
.rr-summary > p span { flex-basis: 100%; }
.rr-recognition-card { margin: 14px 0; padding: 12px 0; border: 0; border-top: 1px solid var(--rr-border); border-bottom: 1px solid var(--rr-border); border-radius: 0; background: transparent; }
.rr-recognition-card--confirm { margin-top: 0; }
.rr-recognition-card--compact { padding: 14px; background: #fff; }
.rr-recognition-card > p { margin: 0 0 12px; color: var(--rr-muted); }
.rr-recognition-card .rr-summary-list { margin: 0; }
.rr-booking__notice, .rr-booking__error { padding: 12px 14px; border-radius: 8px; border-left: 4px solid; }
.rr-booking__notice { color: var(--rr-success); background: #eef8f2; }
.rr-booking__error { color: var(--rr-error); background: #fff1f1; }
.rr-booking__error p { margin: 0 0 10px; }
.rr-booking__error p:last-child { margin-bottom: 0; }
.rr-booking__retry { margin-top: 2px; }
.rr-booking__debug { margin: 10px 0; padding: 10px 12px; border: 1px dashed var(--rr-border); border-radius: 8px; color: var(--rr-muted); background: #fbfcfb; font-size: 12px; }
.rr-booking__debug h3 { margin: 0 0 8px; font-size: 13px; }
.rr-booking__debug dl { display: grid; grid-template-columns: minmax(120px, auto) minmax(0, 1fr); gap: 3px 10px; margin: 0; }
.rr-booking__debug dt { font-weight: 700; }
.rr-booking__debug dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.rr-booking__preview-note { color: var(--rr-muted); font-size: 13px; margin: 14px 4px; }
.rr-availability-busy { align-items: center; gap: 12px; margin: 14px 0; padding: 12px 14px; border: 1px solid var(--rr-border); border-radius: 8px; background: var(--rr-background); }
.rr-availability-busy:not([hidden]) { display: flex; }
.rr-availability-busy > span:last-child { display: grid; gap: 2px; }
.rr-availability-busy strong { color: var(--rr-text); }
.rr-availability-busy small { color: var(--rr-muted); }
.rr-availability-busy__spinner { flex: 0 0 auto; width: 22px; height: 22px; border: 3px solid var(--rr-border); border-top-color: var(--rr-primary); border-radius: 50%; animation: rr-spin .8s linear infinite; }
@keyframes rr-spin { to { transform: rotate(360deg); } }
.rr-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.rr-result { text-align: center; }
.rr-result__icon { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 14px; border-radius: 50%; color: #fff; background: var(--rr-success); font-size: 28px; }
.rr-summary-list { text-align: left; }
.rr-summary-list div { padding: 9px 0; border-bottom: 1px solid var(--rr-border); }
.rr-summary-list dt { font-weight: 700; }
.rr-summary-list dd { margin: 2px 0 0; }
.rr-demo-badge { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; margin: 0 0 16px; padding: 12px 14px; border: 1px solid var(--rr-border); border-radius: 8px; color: var(--rr-text); background: #eef8f2; font-size: 14px; }
.rr-demo-badge span { color: var(--rr-muted); }
.rr-demo-layout { display: grid; gap: 18px; }
.rr-demo-flow { min-width: 0; }
.rr-demo-explainer { padding: 18px; border: 1px solid var(--rr-border); border-radius: 8px; background: #fff; box-shadow: 0 8px 22px rgba(23,33,29,.06); }
.rr-demo-explainer__eyebrow, .rr-demo-result__label { margin: 0 0 6px; color: var(--rr-primary); font-size: 13px; font-weight: 800; text-transform: uppercase; }
.rr-demo-explainer ul, .rr-demo-value ul { margin: 10px 0 0; padding-left: 20px; color: var(--rr-muted); }
.rr-demo-explainer li, .rr-demo-value li { margin: 5px 0; }
.rr-demo-cta { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--rr-border); }
.rr-demo-cta h4, .rr-demo-value h4 { margin-bottom: 8px; }
.rr-demo-value { margin: 20px 0; padding: 16px; border-radius: 8px; background: var(--rr-background); text-align: left; }
@media (max-width: 639px) {
  .rr-booking { width: 100%; margin: 10px auto; padding: 0 12px; font-size: 15px; line-height: 1.5; }
  .rr-booking__header { margin-bottom: 7px; }
  .rr-booking__eyebrow { font-size: 12px; }
  .rr-booking h2 { font-size: 22px; }
  .rr-booking h3 { font-size: 20px; }
  .rr-booking__card { padding: 15px 0 16px 14px; box-shadow: none; }
  .rr-progress { margin-bottom: 7px; }
  .rr-progress small { font-size: 11px; }
  .rr-flow { gap: 2px; }
  .rr-flow-step--active { margin-top: 8px; }
  .rr-flow-step--active .rr-booking__card { padding: 15px 0 16px 14px; box-shadow: none; }
  .rr-flow-step--active .rr-booking__card > h3 { font-size: 22px; }
  .rr-step-summary { min-height: 44px; padding: 7px 8px; }
  .rr-flow-step--complete .rr-step-summary { min-height: 28px; padding: 2px 0; }
  .rr-field { margin: 13px 0; }
  .rr-field input, .rr-field textarea { min-height: 50px; font-size: 16px; }
  .rr-field textarea { min-height: 92px; }
  .rr-actions { gap: 8px; }
  .rr-actions .rr-button--primary, .rr-actions .rr-button--secondary { flex: 1 1 100%; width: 100%; min-height: 50px; }
  .rr-choice, .rr-slot { min-height: 54px; margin: 7px 0; padding: 11px; }
  .rr-person__toggle { min-height: 56px; padding: 12px; }
  .rr-person__panel { padding: 13px; }
  .rr-summary { margin: 13px 0; padding: 12px; }
  .rr-recognition-card { margin: 13px 0; padding: 12px; }
}
@media (min-width: 640px) { .rr-booking__card { padding: 28px; } .rr-progress span { display: inline; margin-right: 4px; } .rr-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .rr-demo-layout { grid-template-columns: minmax(0, 3fr) minmax(280px, 2fr); align-items: start; } .rr-demo-explainer { position: sticky; top: 24px; } body.admin-bar .rr-demo-explainer { top: 56px; } }
@media (prefers-reduced-motion: reduce) { .rr-booking * { scroll-behavior: auto !important; transition: none !important; } .rr-availability-busy__spinner { animation: none; border-top-color: var(--rr-border); border-right-color: var(--rr-primary); } }
