.time-picker-box{display:none}.time-picker-box.show{display:grid;grid-template-columns:repeat(4,1fr);row-gap:4px;padding:1rem;max-height:250px;overflow-y:auto;background:#fff;border:1px solid #ddd;box-shadow:0 4px 6px #0000001a;overflow-x:hidden}@media screen and (min-width: 576px){.time-picker-box.show{grid-template-columns:repeat(5,1fr)}}.time-slot{position:relative;padding:8px 0;font-size:1rem;font-weight:400;text-align:center;cursor:pointer;border:1px solid transparent;background:#f3f4f6;transition:background .2s,border-color .2s}.time-slot:hover{border-color:#6b82ff;color:#6b82ff}.time-slot.selected{border-color:#d5dbff;background:#d5dbff;color:#333}.time-slot.in-selected{background:#6b82ff;color:#fff}.time-slot.start-selected,.time-slot.end-selected{border-color:#6b82ff;background:#6b82ff;color:#fff}.time-slot.start-selected:after,.time-slot.start-selected:hover:after{border:8px solid transparent;border-left:8px solid #6b82ff;content:"";pointer-events:none;position:absolute;right:-14px;top:50%;transform:translateY(-50%);z-index:20}.time-slot.end-selected:after,.time-slot.end-selected:hover:after{border:8px solid transparent;border-right:8px solid #6b82ff;content:"";pointer-events:none;position:absolute;left:-14px;top:50%;transform:translateY(-50%);z-index:20}.time-slot.start-selected.end-selected:after,.time-slot.start-selected.end-selected:hover:after{content:none;border:none}.time-slot.disabled{background:#515357;color:#f3f4f6;cursor:not-allowed}