/* One content-sized date/time sheet for creation, guest links and the cabinet. */
body:is([data-external-booking],.gb-in-flow,.guest-confirmation,.booking-cabinet) :is(#external-date-dialog,#guest-dialog,#ab-dialog).booking-time-sheet {
 box-sizing:border-box; width:min(560px,calc(100vw - 32px)); max-width:calc(100vw - 32px); min-height:0; height:fit-content;
 max-height:90dvh; inset:0; margin:auto; overflow:hidden; border:0; border-radius:20px;
}
body:is([data-external-booking],.gb-in-flow,.guest-confirmation) .booking-time-sheet[open] { display:flex; flex-direction:column; }
.booking-time-sheet::backdrop { background:rgba(0,0,0,var(--external-backdrop-opacity,.45)); }
body.booking-cabinet #ab-dialog.booking-time-sheet .ab-dialog-inner { box-sizing:border-box; height:auto; max-height:90dvh; display:flex; flex-direction:column; padding:20px 16px 16px; overflow:hidden; }
body.booking-cabinet #ab-dialog.booking-time-sheet .ab-dialog-heading { flex:0 0 auto; margin:0 0 12px; padding:0; }
body.booking-cabinet #ab-dialog.booking-time-sheet .ab-visit-frame-body { flex:0 1 auto; min-height:0; overflow:hidden; }
body.booking-cabinet #ab-dialog.booking-time-sheet :is(#ab-reschedule-calendar,.ab-reschedule-summary,.ab-resource-check) { flex:0 0 auto; }
body.booking-cabinet #ab-dialog.booking-time-sheet #ab-reschedule-slots { flex:0 1 auto; min-height:64px; overflow:auto; margin:0; align-content:start; }
body.booking-cabinet #ab-dialog.booking-time-sheet .ab-resource-check { margin:12px 0 0; }
body.booking-cabinet #ab-dialog.booking-time-sheet .ab-reschedule-footer { flex:0 0 auto; margin:0; padding-top:16px; }
body:is([data-external-booking],.gb-in-flow,.guest-confirmation) :is(#external-date-dialog,#guest-dialog).booking-time-sheet :is(#guest-time-step,.gb-slots) { flex:0 1 auto; min-height:0; overflow:auto; }
body[data-external-booking] #external-date-dialog.booking-time-sheet #guest-time-step { display:flex; flex-direction:column; overflow:hidden; }
body[data-external-booking] #external-date-dialog.booking-time-sheet #guest-booking-calendar { flex:0 0 auto; }
body:is([data-external-booking],.gb-in-flow,.guest-confirmation) :is(#external-date-dialog,#guest-dialog).booking-time-sheet .gb-slots { min-height:64px; align-content:start; }
body.guest-confirmation #guest-dialog.booking-time-sheet .gb-dialog-footer { flex:0 0 auto; position:static; margin:0; padding-top:16px; }
body[data-external-booking] #external-date-dialog.booking-time-sheet #guest-flow-footer { margin:0; padding-top:16px; }
body.booking-cabinet #ab-dialog.booking-time-sheet .external-sheet-handle,
body:is([data-external-booking],.gb-in-flow,.guest-confirmation) .booking-time-sheet .external-sheet-handle { display:none; flex:0 0 20px; align-items:center; justify-content:center; margin:-12px 0 8px; touch-action:none; }
.booking-time-sheet .external-sheet-handle > span { width:36px; height:4px; border-radius:10px; background:#d5d7da; }
body.booking-cabinet #ab-dialog .ab-slots-state { grid-column:1/-1; width:100%; max-width:320px; margin:16px auto; align-self:center; color:var(--text-secondary); text-align:center; font-size:14px; line-height:1.5; white-space:normal; overflow-wrap:normal; text-wrap:balance; }
body:is([data-external-booking],.gb-in-flow,.guest-confirmation) .booking-time-sheet :is(.gb-slots-empty,.external-slots-loading) { grid-column:1/-1; display:block; max-width:320px; margin:16px auto; color:var(--text-secondary); text-align:center; font-size:14px; line-height:1.5; white-space:normal; overflow-wrap:normal; text-wrap:balance; }
body.booking-cabinet .ab-dialog button.ab-back-action { flex:0 0 44px; width:44px; min-width:44px; min-height:44px; padding:10px; border:0; border-radius:0; background:transparent; box-shadow:none; color:var(--text-primary); }
body.booking-cabinet .ab-dialog button.ab-back-action:is(:hover,:active,:focus) { border-color:transparent; background:transparent; box-shadow:none; transform:none; }
@media(max-width:768px) {
 body:is([data-external-booking],.gb-in-flow,.guest-confirmation,.booking-cabinet) :is(#external-date-dialog,#guest-dialog,#ab-dialog).booking-time-sheet { inset:auto 0 0; margin:0; width:100%; max-width:100%; min-height:0; height:auto; max-height:90dvh; border-radius:20px 20px 0 0; }
 body.booking-cabinet #ab-dialog.booking-time-sheet .ab-dialog-inner { padding-bottom:calc(16px + env(safe-area-inset-bottom,0px)); }
 body.booking-cabinet #ab-dialog.booking-time-sheet .external-sheet-handle,
 body:is([data-external-booking],.gb-in-flow,.guest-confirmation) .booking-time-sheet .external-sheet-handle { display:flex; }
}
body:is([data-external-booking],.gb-in-flow,.guest-confirmation) .booking-time-sheet .gb-slots { margin-bottom:0; }
body.booking-cabinet #ab-dialog.booking-time-sheet #ab-reschedule-status { width:100%; max-width:320px; margin:12px auto; text-align:center; line-height:1.5; overflow-wrap:normal; text-wrap:balance; }

/* Identical time groups in the client flow, guest link and company cabinet. */
:is(#guest-slots,#guest-reschedule-slots,#ab-reschedule-slots,#ab-staff-slots).booking-slot-periods { display:flex; flex-direction:column; gap:16px; padding:4px 2px; }
.booking-slot-periods .external-slot-period { min-width:0; }
.booking-slot-periods .external-slot-period > h3 { margin:0 0 8px; color:#777d85; font-size:13px; font-weight:500; line-height:20px; }
.booking-slot-periods .external-slot-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); gap:8px; }
.booking-time-sheet :is(#guest-slots,#guest-reschedule-slots,#ab-reschedule-slots,#ab-staff-slots).booking-slot-periods .gb-slot { display:flex; flex-direction:column; align-items:center; justify-content:center; box-sizing:border-box; width:100%; min-width:0; height:40px; min-height:40px; margin:0; padding:4px; border:0; border-radius:12px; background:#f1f2f4; color:#3b414a; box-shadow:none; font-size:14px; font-weight:500; line-height:20px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.booking-time-sheet :is(#guest-slots,#guest-reschedule-slots,#ab-reschedule-slots,#ab-staff-slots).booking-slot-periods .gb-slot:hover { background:#e7e9ed; box-shadow:none; }
.booking-time-sheet :is(#guest-slots,#guest-reschedule-slots,#ab-reschedule-slots,#ab-staff-slots).booking-slot-periods .gb-slot[aria-pressed=true] { background:#343941; color:#fff; }
.booking-slot-periods .external-slot-offset { font-size:10px; line-height:12px; }
.booking-slot-periods[aria-busy=true] .gb-slot { opacity:.45; pointer-events:none; }
.booking-slot-periods .gb-slot:focus-visible { outline:2px solid #6f7783; outline-offset:2px; }
.booking-slots-empty { container-type:inline-size; box-sizing:border-box; width:100%; margin:16px auto; color:#777d85; text-align:center; }
.booking-slots-empty > span { display:block; font-size:14px; font-size:min(14px,4.6cqi); line-height:1.6; white-space:nowrap; }
.booking-slots-loading { margin:16px 0; text-align:center; color:#777d85; font-size:14px; }
body.gb-in-flow #external-date-dialog #guest-booking-calendar { flex:0 0 auto; }
body.gb-in-flow #external-date-dialog #guest-time-step { display:flex; flex-direction:column; min-height:0; overflow:hidden; }
body.gb-in-flow #external-date-dialog #guest-selected-date,body.gb-in-flow #external-date-dialog #guest-timezone,body.gb-in-flow #external-date-dialog .gb-date-fallback { display:none; }
body.gb-in-flow #external-date-dialog .external-sheet-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
body.gb-in-flow #external-date-dialog .external-sheet-header h2 { font-size:20px; margin:0; }
body.gb-in-flow #external-date-dialog .external-sheet-back { display:grid; place-items:center; width:32px; height:32px; flex:none; padding:4px; border:0; border-radius:8px; background:transparent; box-shadow:none; }
body.gb-in-flow #external-date-dialog .external-sheet-back svg { width:22px; height:22px; }
body.gb-in-flow #external-date-dialog #guest-flow-footer { position:static; display:flex; justify-content:flex-end; align-items:center; gap:12px; padding:16px 0 0; border:0; background:transparent; box-shadow:none; }
body.gb-in-flow #external-date-dialog #guest-flow-footer[hidden] { display:none; }
body.gb-in-flow #external-date-dialog #guest-flow-footer > button { min-height:44px; border-radius:12px; }

/* Retire the old focus-only close control in the public booking sheet. */
:is(body[data-external-booking],body.gb-in-flow) #external-date-dialog .external-sheet-header { position:static; flex:none; width:100%; margin:0 0 12px; }
:is(body[data-external-booking],body.gb-in-flow) #external-date-dialog #external-date-title { position:static; flex:1; width:auto; height:auto; min-width:0; margin:0; padding:0; overflow:visible; clip-path:none; white-space:normal; text-align:left; font-size:18px; }
:is(body[data-external-booking],body.gb-in-flow) #external-date-dialog .external-sheet-header .external-sheet-back { position:static; flex:0 0 32px; width:32px; height:32px; min-height:32px; margin:0; padding:4px; overflow:visible; clip-path:none; white-space:normal; border:0; border-radius:8px; background:transparent; box-shadow:none; }

/* Back and refresh share the heading; the amount always has its own row. */
body.booking-cabinet #ab-dialog .booking-retry,
:is(body[data-external-booking],body.gb-in-flow) #external-date-dialog #guest-refresh { flex:none; width:auto; min-width:0; min-height:32px; margin:0; padding:6px 10px; border:0; border-radius:10px; background:#f1f2f4; color:#5f6671; box-shadow:0 2px 7px #20263012; font-size:12px; }
:is(body[data-external-booking],body.gb-in-flow) #external-date-dialog #guest-refresh[hidden] { display:none; }
:is(body[data-external-booking],body.gb-in-flow) #external-date-dialog .external-sheet-previous { display:grid; place-items:center; flex:none; width:32px; height:32px; padding:4px; border:0; background:transparent; box-shadow:none; }
.external-sheet-previous svg { width:22px; height:22px; }
body.gb-in-flow #external-date-dialog #guest-flow-footer { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; flex:none; padding-top:12px; }
body.gb-in-flow #external-date-dialog #guest-flow-footer > :is(.external-action-summary,.btn) { grid-column:1; box-sizing:border-box; width:100%; min-width:0; position:static; transform:none; }
.booking-date-strip [data-flow-date].has-open-times .external-date-number::after { content:''; position:absolute; bottom:3px; left:calc(50% - 1.5px); width:3px; height:3px; border-radius:50%; background:#8c929c; }
.booking-date-strip [data-flow-date].selected.has-open-times .external-date-number::after { background:#d8dbe1; }
.booking-date-strip [data-flow-date].has-no-times:not(.selected) { color:#969ca5; }
body.booking-cabinet #ab-dialog .booking-retry[hidden] { display:none; }
body.guest-confirmation #guest-dialog .booking-retry { flex:none; min-height:32px; margin:0; padding:6px 10px; border:0; border-radius:10px; background:#f1f2f4; color:#5f6671; box-shadow:0 2px 7px #20263012; font-size:12px; }
body.guest-confirmation #guest-dialog .booking-retry[hidden] { display:none; }
body.guest-confirmation #guest-dialog .external-sheet-previous { display:grid; place-items:center; flex:none; width:32px; height:32px; margin:0; padding:4px; border:0; background:transparent; box-shadow:none; }
body.guest-confirmation #guest-dialog .gb-dialog-header { gap:8px; }
body.guest-confirmation #guest-dialog .gb-dialog-header h2 { flex:1; }