body{background:#f3f7f5}.booking-shell{max-width:960px;margin:0 auto;padding:30px 24px 55px}.booking-brand{display:flex;align-items:center;justify-content:space-between;margin-bottom:42px}.booking-brand .brand small{font-size:9px}.languages{display:flex;gap:5px}.languages button{font-size:11px;padding:7px 10px}.languages button.active{background:var(--green);color:white;border-color:var(--green)}.booking-intro{margin-bottom:27px}.booking-intro h1{font-size:36px;max-width:540px;line-height:1.15}.booking-intro p{color:var(--muted);font-size:15px}.booking-card{background:white;border:1px solid var(--line);border-radius:17px;overflow:hidden;box-shadow:0 5px 24px #264e3d06}.booking-card .steps{padding:22px}.booking-body{padding:28px}.booking-body .treatments{grid-template-columns:repeat(2,1fr)}.booking-footer{padding:20px 28px;display:flex;justify-content:space-between;border-top:1px solid var(--line);background:#fafcfb}.channel-select{display:flex;gap:10px;margin:20px 0}.channel-select label{padding:14px 20px;border:1px solid var(--line);border-radius:9px;display:flex;align-items:center;gap:8px;cursor:pointer}.channel-select input{accent-color:var(--green)}.code-input{max-width:220px;font-size:27px!important;letter-spacing:8px;text-align:center}.booking-bottom{font-size:11px;color:var(--muted);margin-top:22px}.success-mark{width:54px;height:54px;background:#e3f1e9;border-radius:50%;display:grid;place-items:center;font-size:26px;color:var(--green);margin-bottom:20px}.booking-body .slots{grid-template-columns:repeat(3,1fr)}@media(max-width:600px){.booking-shell{padding:20px 12px}.booking-brand{margin-bottom:28px}.booking-intro h1{font-size:29px}.booking-body{padding:19px}.booking-body .treatments{grid-template-columns:1fr}.booking-body .slots{grid-template-columns:repeat(2,1fr)}.booking-card .steps{padding:16px 10px}.booking-footer{padding:18px}.channel-select label{padding:12px}}
.patient-modes{display:flex;background:#f1f5f2;border-radius:10px;padding:4px;margin:18px 0 24px;gap:4px}.patient-modes button{flex:1;background:transparent;border:1px solid transparent;color:#667d71}.patient-modes button.active{background:white;border-color:#d4e2d9;color:var(--green);box-shadow:0 2px 5px #25483b0a;font-weight:600}.booking-body input::placeholder{color:#98a49e;opacity:1}.mobile-inputs{display:flex;gap:7px}.mobile-inputs #mobile-prefix{flex:0 0 82px;width:82px}.mobile-inputs #mobile-number{min-width:0;flex:1}.code-preference,.return-channels{border:0;margin:0;padding:0;min-width:0}.code-preference legend,.return-channels legend{font-size:14px;font-weight:600;margin-bottom:12px;line-height:1.5}.code-preference .channel-select{margin:0}.return-channel{display:grid;grid-template-columns:100px minmax(0,1fr);gap:15px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:11px;margin-bottom:12px}.return-channel.chosen{border-color:#91b8a5;background:#f6faf7}.return-channel .field{margin:0}.return-channel input:disabled{background:#f3f5f3;color:#a2afa6;cursor:not-allowed}.channel-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink)}.channel-label input{accent-color:var(--green)}.return-channels{margin-bottom:16px}@media(max-width:560px){.return-channel{grid-template-columns:1fr;gap:10px;padding:13px}.mobile-inputs #mobile-prefix{flex-basis:75px;width:75px}.patient-modes button{font-size:13px}}

.return-channel .channel-label{white-space:nowrap;gap:8px}.return-channel .channel-label input{flex-shrink:0}

.practice-contact{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:16px}
.practice-call{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border-radius:10px;background:#315b50;color:#fff;text-decoration:none;font-weight:600}
.practice-call:hover{background:#24473e}
.practice-call:focus-visible{outline:3px solid #315b50;outline-offset:3px}
.practice-contact span{font-size:14px}
.treatment-description{display:block;margin-top:8px;font-size:13px;line-height:1.5;font-weight:400;color:#5d7369}
.duration-hint{display:inline-block;float:right;font-size:12px;font-weight:400;white-space:nowrap;margin-left:10px;color:#5d7369}
/* Mobile booking: readable inputs, comfortable touch targets and compact progress. */
.booking-shell button{min-height:44px}
.booking-shell input:not([type=radio]):not([type=checkbox]),.booking-shell select,.booking-shell textarea{font-size:16px;min-height:44px}
.booking-shell a{color:var(--green);text-underline-offset:3px}
.booking-shell button:focus-visible,.booking-shell a:focus-visible,.booking-shell input:focus-visible{outline:3px solid #397963;outline-offset:3px}
.booking-body .check{align-items:flex-start;line-height:1.5}.booking-body .check input{flex-shrink:0;margin-top:3px}
.booking-body .treatment-description{color:#53695e}
@media(max-width:600px){
 .booking-shell{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
 .booking-brand{margin-bottom:20px}.booking-brand .brand{font-size:23px}
 .languages button{min-width:44px;padding:8px}
 .booking-intro h1{font-size:27px}.booking-intro p{line-height:1.5}
 .booking-body .row{display:flex;flex-direction:column;gap:0}.booking-body .field{min-width:0;width:100%}
 .booking-card .steps{gap:4px}.booking-card .step{flex-direction:column;text-align:center;font-size:11px;gap:5px;line-height:1.3;min-width:0}
 .booking-card .step b{width:26px;height:26px;flex-shrink:0}
 .booking-footer{gap:10px;padding:14px}.booking-footer .primary{flex:1;white-space:normal;line-height:1.4}
 .booking-body{padding:18px}.booking-body .summary strong{font-size:19px}
 .booking-body .return-channel .channel-label{min-height:44px}
 .booking-body .slots{gap:8px}.booking-body .slot{padding:12px 10px}
 .booking-shell .warning{overflow-wrap:anywhere}
}

/* Day-first availability picker: the patient chooses a real day before seeing its slots. */
.booking-calendar-step{max-width:820px}.calendar-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.calendar-heading h3{margin:5px 0 0}.eyebrow{display:block;color:var(--booking-gold);font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.calendar-month-nav{display:flex;align-items:center;gap:12px}.calendar-month-nav strong{min-width:145px;text-align:center;font:500 20px Georgia,serif;text-transform:capitalize}.calendar-month-nav button{width:42px;min-width:42px;padding:0;border:1px solid var(--booking-line);background:var(--booking-paper);color:var(--booking-ink);font-size:27px;line-height:1}.calendar-month-nav button:disabled{opacity:.3;cursor:not-allowed}.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.calendar-weekdays{margin-bottom:6px;color:var(--booking-muted);font-size:11px;font-weight:800;letter-spacing:.06em;text-align:center;text-transform:uppercase}.calendar-day{min-height:56px;padding:8px 4px;border:1px solid transparent;border-radius:2px;background:transparent;color:#aaa49b;font-size:16px}.calendar-day.available{border-color:var(--booking-line);background:var(--booking-paper);color:var(--booking-ink);cursor:pointer}.calendar-day.available:hover{border-color:var(--booking-gold);background:#fbf8f1}.calendar-day.available::after{content:"";display:block;width:5px;height:5px;margin:5px auto 0;border-radius:50%;background:var(--booking-gold)}.calendar-day.selected{border-color:var(--booking-ink);background:var(--booking-ink);color:#fff}.calendar-day.selected::after{background:var(--booking-gold-soft)}.calendar-day:disabled{cursor:default}.empty-day{pointer-events:none}.calendar-status{margin:22px 0 0;color:var(--booking-muted)}.day-slots{margin-top:32px;padding-top:24px;border-top:1px solid var(--booking-line)}.selected-day-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:14px}.selected-day-heading strong{font:500 23px Georgia,serif;text-transform:capitalize}.day-slots .slots{grid-template-columns:repeat(4,minmax(0,1fr))}.day-slots .slot{min-height:72px;padding:12px 8px}.day-slots .slot strong{font-size:18px}.day-slots .slot small{color:var(--booking-muted)}.day-slots .slot.selected small{color:#ddd6c8}
@media(max-width:720px){.calendar-heading{align-items:flex-start;flex-direction:column}.calendar-month-nav{align-self:stretch;justify-content:space-between}.calendar-month-nav strong{flex:1}.calendar-day{min-height:48px}.day-slots .slots{grid-template-columns:repeat(2,minmax(0,1fr))}.selected-day-heading{align-items:flex-start;flex-direction:column;gap:5px}}
.calendar-day.available{display:grid;place-items:center;text-decoration:none}
/* The chosen day must remain unmistakable after its slots are loaded. */
.calendar-day.available.selected{border:2px solid #c5a065;background:#1a1a1d;color:#fff;box-shadow:0 0 0 3px rgba(197,160,101,.28);font-weight:800}
.calendar-day.available.selected::after{background:#f0c878;width:7px;height:7px}
.booking-shell input[type=radio]{width:18px;min-width:18px;height:18px;padding:0;flex:0 0 18px;margin:0}
.booking-shell .return-channel{min-width:0}.booking-shell .return-channel .field{min-width:0}
.field-validation{display:block;margin-top:6px;color:#9b3e35;font-size:13px;line-height:1.35}.field.has-error input{border-color:#b85c52;box-shadow:0 0 0 2px rgba(184,92,82,.12)}.field-validation span{display:block}.field-validation:not([hidden]){margin:12px 0;padding:10px 12px;border-left:3px solid #b85c52;background:#fff4f2;color:#7d302b}.field-validation.hidden{display:none}

/* Smile4Life public booking: dark, champagne and gold from the website brand. */
.booking-shell{--green:#1a1a1d;--ink:#1a1a1d;--muted:#666569;--line:#e6dfd2}
body{background:#faf9f6;color:#1a1a1d}
.booking-intro h1{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;letter-spacing:-.02em}
.booking-intro p,.treatment-description,.booking-body .treatment-description{color:#666569}
.booking-card{border-color:#e6dfd2;box-shadow:0 18px 55px rgba(26,26,29,.08)}
.booking-card .steps,.booking-footer{background:#faf9f6;border-color:#e6dfd2}
.booking-card .step b{border-color:#c5a065;color:#775925;background:#fff}
.booking-card .step.current b,.booking-card .step.done b{background:#1a1a1d;border-color:#1a1a1d;color:#fff}
.booking-card .steps{position:relative}
.booking-card .steps:after{content:"";position:absolute;left:22px;right:22px;bottom:0;height:2px;background:linear-gradient(90deg,#c5a065,#f0ebe0 52%,transparent)}
.booking-shell button.primary,.practice-call{background:#1a1a1d;color:#fff;border-color:#1a1a1d}
.booking-shell button.primary:hover,.practice-call:hover{background:#333338}
.booking-shell button:focus-visible,.booking-shell a:focus-visible,.booking-shell input:focus-visible{outline-color:#c5a065}
.booking-shell .treatment.selected,.booking-shell .slot.selected,.return-channel.chosen{border-color:#c5a065;background:#f8f4ec;box-shadow:0 0 0 1px #c5a065}
.booking-shell .languages button.active{background:#1a1a1d;border-color:#1a1a1d}
.success-mark{background:#f0ebe0;color:#775925}
.return-channels .channel-or{display:flex;align-items:center;gap:12px;margin:0 0 12px;color:#775925;font-size:14px;font-weight:850;letter-spacing:.18em;line-height:1}
.return-channels .channel-or:before,.return-channels .channel-or:after{content:"";height:1px;flex:1;background:#d9c9a9}

/* Embedded on /termin: Webflow supplies the hero, logo and explanatory content. */
.booking-embedded body{background:transparent}
.booking-embedded .booking-shell{max-width:none;padding:0}
.booking-embedded .booking-brand,.booking-embedded .booking-intro,.booking-embedded .booking-bottom{display:none}
.booking-embedded .booking-card{border:0;border-radius:0;box-shadow:none}
.booking-embedded .booking-body{min-height:420px}
@media(max-width:600px){
 .booking-embedded .booking-body{min-height:0;padding:18px 14px}
 .booking-embedded .booking-card .steps{padding:14px 8px}
 .booking-embedded .booking-footer{position:sticky;bottom:0;z-index:3;padding-bottom:calc(14px + env(safe-area-inset-bottom));box-shadow:0 -8px 24px rgba(26,26,29,.07)}
}