/* DEV V21: one column for single times; two visible times in the same lane.
   The original buttons, dates, slot attributes and checkout handlers stay intact. */
#no-slots-guide{--slot-chip:68px;--slot-gap:8px;--slot-date:44px;--slot-lane:calc(var(--slot-chip)*2 + var(--slot-gap) + 4px)}
#no-slots-guide .recovery-card:has([data-recovery-date]){grid-template-columns:var(--slot-date) minmax(0,1fr) var(--slot-lane);grid-template-rows:auto auto;column-gap:8px;row-gap:2px;align-items:center}
#no-slots-guide .recovery-card .recovery-date{grid-column:1;grid-row:1/3;align-self:center;height:48px;min-height:44px}
#no-slots-guide .recovery-card h3{grid-column:2;grid-row:1;align-self:end;margin:0;line-height:1.3}
#no-slots-guide .recovery-card .recovery-explain{grid-column:2;grid-row:2;align-self:start}
#no-slots-guide .recovery-band:not(.slot-multiple) h3{grid-row:1/3;align-self:center}
#no-slots-guide .recovery-card .recovery-times{grid-column:3;grid-row:1/3;justify-self:end;align-self:center;box-sizing:content-box;width:calc(var(--slot-chip)*2 + var(--slot-gap));max-width:none;min-width:0;gap:var(--slot-gap);margin:0;padding:2px 2px 5px;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;scroll-snap-type:x mandatory;scroll-padding-inline:2px;scrollbar-width:none;overscroll-behavior-x:contain}
#no-slots-guide .recovery-card .recovery-times.slot-single{width:var(--slot-chip)}
#no-slots-guide .recovery-card .recovery-times .booking-time{width:var(--slot-chip);min-width:var(--slot-chip);max-width:var(--slot-chip);flex:0 0 var(--slot-chip)}
#no-slots-guide .recovery-times::-webkit-scrollbar,#no-slots-guide .other-salon-times::-webkit-scrollbar{display:none}
#no-slots-guide .other-salon-times{scrollbar-width:none;overscroll-behavior-x:contain;padding:2px 2px 5px;scroll-padding-inline:2px}
#no-slots-guide .other-salon-info{position:relative}
#no-slots-guide .slot-scroll-hint{font:650 10.5px/1.25 'DM Sans',Arial,sans-serif;letter-spacing:0;white-space:nowrap;color:#edd593;user-select:none;cursor:default}
#no-slots-guide .recovery-card>.slot-scroll-hint{grid-column:2;grid-row:2;align-self:start;margin:0}
#no-slots-guide .other-salon-info>.slot-scroll-hint{position:absolute;top:3px;right:0;margin:0;color:#42584f}
#no-slots-guide .other-salon-info:has(>.slot-scroll-hint:not([hidden]))>.other-salon-address{padding-right:84px}
/* Small action label + real depth, not just a coloured time badge. */
#booking-flow .booking-time{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:50px;padding:5px 8px;font-variant-numeric:tabular-nums;font-weight:750;line-height:1.2;border:1px solid #52616b;border-bottom-color:#0b151a;border-radius:9px;background:linear-gradient(180deg,#2b3e47,#192b34);color:#fff6e8;box-shadow:inset 0 1px 0 #ffffff24,0 3px 0 #080f14,0 4px 7px #0002;cursor:pointer;transition:background .12s,box-shadow .12s,transform .12s;touch-action:manipulation}
#booking-flow .booking-time::after{content:'Scegli ›';display:block;font:650 10px/1.2 'DM Sans',Arial,sans-serif;letter-spacing:.015em;color:inherit}
#booking-flow #no-slots-guide .recovery-times .booking-time{background:linear-gradient(180deg,#f4d98e,#e4c268);color:#17252c;border-color:#f8df9b;border-bottom-color:#be9c4e;box-shadow:inset 0 1px 0 #ffffff66,0 3px 0 #a48847,0 4px 7px #0003}
@media(hover:hover){#booking-flow .booking-time:hover{filter:brightness(1.09);transform:translateY(-1px)}}
#booking-flow .booking-time:active{transform:translateY(2px);box-shadow:inset 0 1px 3px #0004;filter:none}
#booking-flow .booking-time:focus-visible{outline:2px solid #fff7d2;outline-offset:-3px}
#booking-flow #no-slots-guide .recovery-times .booking-time:focus-visible{outline-color:#263b42}
#booking-flow .booking-time:disabled{cursor:wait;transform:none;filter:none}
#booking-flow .recovery-times:focus-visible,#booking-flow .other-salon-times:focus-visible{outline:2px solid #c6b475;outline-offset:2px}
@media(max-width:360px){
 #no-slots-guide{--slot-chip:60px;--slot-gap:6px;--slot-date:40px}
 #no-slots-guide .recovery-card:has([data-recovery-date]){column-gap:7px}
 #no-slots-guide .recovery-card .recovery-times .booking-time{font-size:16px;padding:4px 6px;min-height:48px}
 #no-slots-guide .slot-scroll-hint{font-size:10px}
}
@media(prefers-reduced-motion:reduce){#booking-flow .booking-time{transition:none;transform:none}}

/* Keep the smallest portrait usable: reclaim decoration, never shrink touch targets. */
@media(max-width:999px){
 body.recovery-short #no-slots-guide .booking-alternatives{padding-top:6px;padding-bottom:5px}
 body.recovery-short #no-slots-guide .recovery-suggestions{padding-top:5px;padding-bottom:5px}
 body.recovery-short #no-slots-guide .walkin-alternative{padding-top:5px;padding-bottom:5px}
 body.recovery-short #no-slots-guide .recovery-times,body.recovery-short #no-slots-guide .other-salon-times{padding-top:1px;padding-bottom:3px}
 body.recovery-short #no-slots-guide .booking-time{min-height:48px}
}