/* Calendar presentation and address-only visit location, in quiet matte blue. */
.time-selection-screen { --time-blue: #536b91; --time-ink: #22334c; --time-muted: #64748b; color: var(--time-ink); }
.time-selection-screen .app-flow-heading { margin: 0 0 18px; }
.time-selection-screen .page-heading { margin: 0; font-size: 30px; line-height: 1.2; letter-spacing: -.7px; }
.address-location .location-options { gap: 4px; padding: 4px; margin: 0; border: 0; border-radius: 12px; background: #e9edf3; }
.address-location .location-option { min-height: 44px; padding: 8px 12px; gap: 8px; color: #64748b; border-radius: 9px; font-size: 14px; line-height: 1.3; }
.address-location .location-option.selected { color: #3f587b; background: #fff; box-shadow: 0 1px 3px #253b5510; font-weight: 600; }
.address-location .location-option > .icon { width: 17px; height: 17px; flex: 0 0 17px; }
.location-check { width: 14px; height: 14px; flex: 0 0 14px; display: grid; place-items: center; }
.location-check > .icon { width: 14px; height: 14px; }
.time-booking-card { padding: 20px; background: #fff; border: 1px solid #e0e6ee; border-radius: 18px; box-shadow: 0 3px 12px #26385103; }
.time-selection-screen .date-navigation { gap: 12px; margin: 0 0 14px; min-height: 44px; }
.time-selection-screen .date-navigation .calendar-month { min-width: 0; margin: 0; color: var(--time-ink); font-size: 18px; font-weight: 650; line-height: 1.3; text-transform: capitalize; }
.time-selection-screen .date-nav-buttons { display: flex; gap: 5px; flex: 0 0 auto; }
.time-selection-screen .calendar-arrow { width: 44px; height: 44px; min-height: 44px; padding: 10px; border: 1px solid #e2e7ef; border-radius: 10px; background: #f8f9fc; color: #516b91; }
.time-selection-screen .calendar-arrow > .icon { width: 19px; height: 19px; }
.time-selection-screen [data-action="dates-prev"] > .icon { transform: rotate(180deg); }
.time-selection-screen .calendar-arrow:disabled { opacity: .3; }
.time-selection-screen .date-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-flow: row; grid-auto-columns: auto; gap: 7px; margin: 0; padding: 0; overflow: visible; scroll-snap-type: none; }
.time-selection-screen .date-card { min-width: 0; gap: 8px; min-height: 76px; padding: 12px 2px; border: 1px solid transparent; border-radius: 11px; background: #f4f6f9; color: var(--time-ink); }
.time-selection-screen .date-weekday { font-size: 13px; font-weight: 450; line-height: 1.1; color: var(--time-muted); text-transform: capitalize; }
.time-selection-screen .date-number { font-size: 24px; font-weight: 650; line-height: 1.05; letter-spacing: -.5px; }
.time-selection-screen .date-card.selected { background: var(--time-blue); border-color: var(--time-blue); color: #fff; box-shadow: 0 3px 7px #536b9120; }
.time-selection-screen .date-card.selected .date-weekday { color: #f0f3f8; }
.time-selection-screen .slots-section { margin-top: 22px; padding-top: 20px; border-top: 1px solid #e9edf3; }
.time-selection-screen .slots-section .section-top { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; margin: 0 0 14px; }
.time-selection-screen .slots-section .section-heading { margin: 0; font-size: 17px; font-weight: 650; line-height: 1.3; letter-spacing: -.2px; color: var(--time-ink); }
.time-active-date { font-size: 13px; line-height: 1.4; color: var(--time-muted); }
.time-selection-screen .slot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.time-selection-screen .time-slot { display: flex; align-items: center; justify-content: space-between; min-width: 0; min-height: 54px; padding: 12px 14px; gap: 8px; border: 1px solid #dce3ed; border-radius: 11px; background: #fff; color: #354b68; font-size: 16px; font-weight: 550; line-height: 1.2; font-variant-numeric: tabular-nums; }
.time-selection-screen .slot-label { white-space: nowrap; }
.time-selection-screen .slot-check { display: grid; place-items: center; width: 19px; height: 19px; flex: 0 0 19px; margin: 0; border: 1px solid #c8d2df; border-radius: 50%; background: #fff; }
.time-selection-screen .time-slot.selected { color: #334e75; border-color: #6a81a1; background: #edf2f8; box-shadow: inset 0 0 0 1px #6a81a1; }
.time-selection-screen .time-slot.selected .slot-check { background: var(--time-blue); border-color: var(--time-blue); }
.time-selection-screen .slot-check > .icon { width: 13px; height: 13px; color: #fff; }
.time-arrival-note { display: flex; align-items: flex-start; gap: 7px; margin: 15px 0 0; color: var(--time-muted); font-size: 13px; line-height: 1.5; }
.time-arrival-note > .icon { width: 16px; height: 16px; flex: 0 0 16px; margin-top: 2px; color: #7d8da4; }
.time-selection-screen .calendar-selection { gap: 9px; margin-top: 12px; padding: 12px 14px; border: 1px solid #d9e2ed; border-radius: 12px; background: #eaf0f7; color: #526580; font-size: 14px; }
.time-selection-screen .calendar-selection > .icon { color: var(--time-blue); flex-shrink: 0; }
.time-selection-screen .calendar-selection strong { color: #334e75; font-weight: 600; }
.time-selection-screen .calendar-selection .text-link { color: #49658c; }
@media (min-width: 720px) {
 .time-selection-screen .slot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
 .time-selection-screen .slots-section .section-top { flex-direction: row; align-items: baseline; justify-content: space-between; gap: 12px; }
}
@media (max-width: 640px) {
 .time-selection-screen .app-flow-heading { margin-bottom: 14px; }
 .time-selection-screen .page-heading { font-size: 27px; }
 .time-booking-card { padding: 15px; border-radius: 16px; }
 .time-selection-screen .date-navigation { margin-bottom: 11px; }
 .time-selection-screen .date-navigation .calendar-month { font-size: 17px; }
 .time-selection-screen .date-grid { gap: 5px; }
 .time-selection-screen .date-card { min-height: 68px; gap: 7px; padding: 10px 1px; border-radius: 9px; }
 .time-selection-screen .date-number { font-size: 22px; }
 .time-selection-screen .slots-section { margin-top: 18px; padding-top: 16px; }
 .time-selection-screen .slot-grid { gap: 8px; }
 .time-selection-screen .time-slot { min-height: 52px; padding: 11px 10px; font-size: 15px; gap: 6px; }
}
@media (max-width: 374px) {
 .time-booking-card { padding: 12px; }
 .time-selection-screen .date-grid { gap: 4px; }
 .time-selection-screen .date-weekday { font-size: 12px; }
 .time-selection-screen .time-slot { padding-inline: 8px; font-size: 14px; gap: 5px; }
 .time-selection-screen .slot-check { width: 16px; height: 16px; flex-basis: 16px; }
 .time-selection-screen .calendar-selection { flex-wrap: nowrap; }
 .time-selection-screen .calendar-selection > span { flex-basis: auto; }
 .time-selection-screen .calendar-selection [data-action="selected-date"] { margin-left: 0; }
}