/* Demo call picker (assets/js/booking.js): /book/ and the get-started wizard's last step. */
.bk { text-align: left; }
.bk-head h2, .bk-head h3 { margin: 0 0 6px; color: var(--text); }
.bk-head p { margin: 0; color: var(--muted); line-height: 1.55; }
.bk-tz { margin-top: 6px; font-size: .82rem; color: var(--muted); }
.bk-days { display: flex; gap: 8px; margin: 18px 0 0; padding: 2px 2px 8px; overflow-x: auto; scroll-snap-type: x proximity; }
.bk-day { flex: none; scroll-snap-align: start; min-width: 76px; min-height: 64px; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--border); background: rgba(255,255,255,.025); color: var(--text); font: inherit; cursor: pointer; line-height: 1.25; transition: border-color .2s ease, background-color .2s ease; }
.bk-day small { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.bk-day b { display: block; font-size: 1.05rem; }
.bk-day:hover { border-color: var(--border-hover); }
.bk-day[aria-pressed="true"] { border-color: var(--purple); background: rgba(130,87,255,.14); }
.bk-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; margin-top: 14px; }
.bk-slot { min-height: 44px; padding: 10px; border-radius: 10px; border: 1px solid var(--border); background: transparent; color: var(--text); font: inherit; font-weight: 600; cursor: pointer; font-variant-numeric: tabular-nums; transition: border-color .2s ease, background-color .2s ease; }
.bk-slot:hover { border-color: rgba(169,141,255,.5); }
.bk-slot[aria-pressed="true"] { border-color: var(--purple); background: var(--purple); color: #fff; }
.bk-day:focus-visible, .bk-slot:focus-visible { outline: 2px solid var(--purple-light); outline-offset: 2px; }
.bk-topic { margin-top: 16px; }
.bk-topic label { display: block; margin-bottom: 6px; font-size: .88rem; color: var(--muted); }
.bk-topic input { width: 100%; min-height: 44px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: rgba(255,255,255,.03); color: var(--text); font: inherit; }
.bk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 16px; }
.bk-actions .button[disabled] { opacity: .5; cursor: not-allowed; }
.bk-err { margin: 12px 0 0; color: var(--red); }
.bk-current, .bk-done { margin-top: 16px; padding: 16px 18px; border-radius: 14px; border: 1px solid rgba(62,227,161,.3); background: rgba(62,227,161,.06); color: var(--text); line-height: 1.55; }
.bk-done b, .bk-current b { color: var(--green); }
.bk-empty { margin-top: 16px; color: var(--muted); }
@media (max-width: 600px) { .bk-slots { grid-template-columns: repeat(3, 1fr); } .bk-actions .button { width: 100%; justify-content: center; } }