.posBookings{margin:18px 0}.posBookings h2,.posBookings h3{margin-top:0}.bookingLayout{display:grid;grid-template-columns:minmax(270px,.8fr) minmax(320px,1.2fr);gap:28px;margin-top:20px}.bookingForm{padding:20px;background:rgba(143,183,202,.08);border-radius:16px}.bookingFilters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.bookingFilters input{width:155px}.bookingFilters button{padding:9px 12px}.bookingAgenda>input,.bookingAgenda>select{margin:6px 0 12px}.bookingEntry{display:grid;grid-template-columns:145px minmax(0,1fr);gap:18px;padding:20px 0;border-bottom:1px solid #d8e5eb}.bookingWhen{display:flex;flex-direction:column;gap:6px;color:#31546b;font-size:14px}.bookingEntry h3{font-size:18px;margin-bottom:8px}.bookingEntry p{margin:8px 0}.bookingItemPicker{display:flex;gap:8px}.bookingItemPicker select{flex:1;min-width:0}.bookingItem{display:grid;grid-template-columns:1fr 90px auto;gap:10px;align-items:center;border-bottom:1px solid #d8e5eb;padding:10px 0;font-size:14px}.bookingItem input{width:100%}.bookingPayment{font-size:14px}.posBookingSelection{margin-bottom:12px;padding:12px;border:1px solid #adc7d7;border-radius:12px}.posBookingSelection button{margin-top:8px}.bookingForm [role=status]{min-height:24px;overflow-wrap:anywhere}@media(max-width:900px){.bookingLayout{grid-template-columns:1fr}.bookingEntry{grid-template-columns:1fr;gap:8px}.bookingWhen{flex-direction:row;flex-wrap:wrap}.bookingItem{grid-template-columns:1fr 75px}.bookingItem button{grid-column:1/-1}.bookingForm{padding:14px}}
/* Booking controls share the portal's spacing and input treatment. */
.posBookings{padding:24px!important;min-width:0}.bookingLayout{align-items:start;gap:32px}.bookingAgenda{min-width:0}.bookingToolbar{display:grid;grid-template-columns:minmax(120px,1fr) minmax(160px,1.2fr);gap:16px;align-items:end}.bookingField{display:flex;flex-direction:column;gap:8px;min-width:0}.bookingField label{font-size:13px;font-weight:600;color:#31546b;line-height:1.4;margin:0}.bookingAgenda input,.bookingAgenda select{box-sizing:border-box;display:block;width:100%;min-width:0;min-height:46px;padding:11px 13px;border:1px solid #d5e3eb;border-radius:12px;background:#f8fcfe;color:#142c43;font:inherit;line-height:1.4;margin:0}.bookingAgenda input:focus-visible,.bookingAgenda select:focus-visible,.bookingAgenda button:focus-visible{outline:2px solid #577f9c;outline-offset:3px}.bookingNavigation{grid-column:1/-1;display:flex;align-items:center;gap:10px}.bookingNavigation button{min-height:44px;padding:10px 16px;margin:0}.bookingNavigation button:first-child,.bookingNavigation button:last-child{width:46px;padding:10px}.bookingRange{margin:16px 0 22px;color:#526f83;font-size:14px;line-height:1.5}.bookingSearchFilters{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(140px,1fr);gap:16px}.bookingAgenda [data-book-count]{margin:20px 0 12px;font-size:14px;line-height:1.5}.bookingAgenda .empty{padding:28px 20px;border-radius:14px;line-height:1.6}.bookingMore{margin-top:20px}.bookingMore[hidden]{display:none}.bookingAgenda :disabled{opacity:.5;cursor:default}.bookingForm{margin:0}.bookingForm .two{gap:14px}.bookingForm .actions{gap:10px;flex-wrap:wrap}.bookingEntry .actions{gap:10px;flex-wrap:wrap}
@media(min-width:1400px){.bookingToolbar{grid-template-columns:minmax(120px,1fr) minmax(160px,1.2fr) auto}.bookingNavigation{grid-column:auto}}
@media(max-width:600px){.posBookings{padding:16px!important}.bookingLayout{gap:24px}.bookingToolbar,.bookingSearchFilters{grid-template-columns:1fr}.bookingNavigation{grid-column:1}.bookingForm .two{grid-template-columns:1fr}.bookingField{gap:7px}.bookingRange{margin:14px 0 18px}}
/* A full-width, aligned calendar makes staff commitments visible. */
.bookingLayout{grid-template-columns:1fr}.bookingAgenda{order:-1}.bookingForm{max-width:720px;width:100%;box-sizing:border-box;justify-self:start}.bookingToolbar{grid-template-columns:minmax(140px,1fr) minmax(180px,1fr) auto}.bookingNavigation{grid-column:auto}.bookingNavigation button{min-height:46px}.bookingLegend{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:16px 0;font-size:13px;color:#526f83}.bookingCalendarScroll{overflow-x:auto;border:1px solid #d5e3eb;border-radius:16px;margin-bottom:24px}.bookingCalendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));min-width:840px;background:#d5e3eb;gap:1px}.bookingCalendar.singleDay{grid-template-columns:1fr;min-width:0}.bookingWeekday{padding:12px;text-align:center;background:#eef5f9;font-size:13px;font-weight:700;color:#31546b}.bookingDay{min-height:145px;background:#fcfeff;padding:8px;min-width:0}.bookingDay.outside{background:#edf3f6}.bookingDay.today{box-shadow:inset 0 3px #397b9d}.bookingDayDate{display:block!important;background:transparent!important;color:#31546b!important;box-shadow:none!important;padding:6px!important;margin:0 0 8px!important;min-height:32px;font-size:13px!important;border:0!important}.bookingBlock{display:flex!important;flex-direction:column;gap:4px;width:100%;box-sizing:border-box;text-align:left;white-space:normal;overflow-wrap:anywhere;border:1px solid #b8d7e6!important;border-left:4px solid #397b9d!important;border-radius:8px!important;background:#eaf5fb!important;color:#173b53!important;box-shadow:none!important;padding:9px!important;margin:0 0 8px!important;font-size:12px!important;line-height:1.45!important}.bookingBlock span,.bookingBlock small{display:block}.bookingBlock.status-completed{background:#edf7ef!important;border-left-color:#3c8558!important}.bookingBlock.status-cancelled,.bookingBlock.status-no_show{background:#f0f2f4!important;color:#647481!important;border-left-color:#9daab3!important}.bookingBlock.conflict{background:#fff0ed!important;border-color:#d98678!important;border-left-color:#b23c29!important;color:#8f3022!important}.bookingConflictLabel{color:#a33727;font-size:13px}.bookingAvailability{padding:14px;border-radius:12px;background:#edf3f7;font-size:14px;line-height:1.6;margin:12px 0}.bookingAvailability.isAvailable{background:#edf7ef;color:#25603a}.bookingAvailability.isConflict{background:#fff0ed;color:#913729}.bookingAvailability button{display:block;margin-top:12px;white-space:normal;text-align:left}.bookingForm .two>div{min-width:0}
@media(max-width:700px){.bookingToolbar{grid-template-columns:1fr}.bookingNavigation{grid-column:1}.bookingCalendar{min-width:770px}.bookingDay{min-height:130px}.bookingForm{max-width:none}}

/* Keep booking dates and appointment details readable in the installed app. */
.posBookings button{touch-action:manipulation;min-height:44px;white-space:normal}
.bookingForm{scroll-margin-top:90px;min-width:0}
.bookingDayDate{min-height:44px;line-height:1.5!important}
.bookingBlock:focus-visible,.bookingDayDate:focus-visible{outline:3px solid #173b53;outline-offset:2px}
.bookingNavigation{flex-wrap:wrap}
.bookingEntry>div,.bookingItem>span{min-width:0;overflow-wrap:anywhere}
.bookingForm input,.bookingForm select,.bookingForm textarea{box-sizing:border-box;min-width:0;max-width:100%}
@media(max-width:850px){
 .bookingCalendar{grid-template-columns:minmax(0,1fr);min-width:0}
 .bookingCalendarScroll{overflow-x:visible;max-width:100%}
 .bookingWeekday{display:none}
 .bookingDay{min-height:0;padding:12px}
 .bookingDay.outside{display:none}
 .bookingDayDate{font-size:16px!important;width:100%;text-align:left}
 .bookingBlock{font-size:15px!important;padding:12px!important}
 .bookingBlock small{font-size:13px}
 .bookingToolbar,.bookingSearchFilters{grid-template-columns:minmax(0,1fr)}
 .bookingNavigation{grid-column:1}
 .bookingForm input,.bookingForm select,.bookingForm textarea,.bookingAgenda input,.bookingAgenda select{font-size:16px;min-height:46px;width:100%}
 .posBookings>.clientCard{flex-wrap:wrap;gap:12px}
 .posBookings .actions{flex-wrap:wrap}
}
