.ba-shell { max-width: 1120px; margin: 1.5rem auto 3rem; padding: 0 1rem; }
.ba-shell h1 { margin-bottom: .7rem; }
.ba-shell .ui.segment { margin: 1.2rem 0; }
.ba-shell .ba-grid { max-height: 38rem; overflow-y: auto; margin: 1rem 0; padding: .25rem; }
.ba-shell .ba-day { margin: 0 0 1.3rem; }
.ba-shell .ba-day h3 { font-size: 1rem; margin: 0 0 .45rem; }
.ba-shell .ba-day-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .4rem; }
.ba-shell .ba-slot { border: 1px solid #9da7b2; border-radius: .35rem; cursor: pointer; display: flex; flex-direction: column; gap: .15rem; padding: .45rem; }
.ba-shell .ba-slot input { margin: 0 .3rem 0 0; align-self: flex-start; }
.ba-shell .ba-slot small { opacity: .8; }
.ba-shell .ba-slot.is-selected { border-color: #267850; background: #e4f3e9; color: #153d2a; }
body.dark .ba-shell .ba-slot { border-color: #77818d; }
body.dark .ba-shell .ba-slot.is-selected { background: #23533a; border-color: #70c98d; color: #fff; }
.ba-shell .ba-timezone { font-size: .9rem; }
.ba-shell table { overflow-wrap: anywhere; }
@media (max-width: 650px) {
    .ba-shell { padding: 0 .6rem; }
    .ba-shell .ba-day-slots { grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); }
}
