/* book.css — /book native Enrol & pay. Uses site.css tokens; card / filter / form styles come from classes.css. */
.bk-sec{padding-top:24px}
@media (min-width:768px){.bk-sec{padding-top:36px}}
.bk-h{font-size:clamp(20px,2.6vw,26px);margin:28px 0 8px}
.bk-h3{font-size:18px;margin:0 0 6px}
.bk-note{font-size:15px;margin:0 0 12px;max-width:60em;color:var(--ink3)}
.bk-app{scroll-margin-top:calc(var(--hdr-h) + 12px)}
.bk-app [tabindex="-1"]:focus{outline:none}

/* trial-first strip */
.bk-first{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;background:var(--white);border-left:5px solid var(--ink);padding:12px 16px;margin:0 0 16px}
.bk-first p{margin:0;flex:1 1 260px;font-size:15px}

/* status panels */
.bk-demo{display:grid;gap:2px;background:#fff3c4;border-left:4px solid var(--gold);padding:10px 14px;margin:0 0 14px;font-size:14px}
.bk-demo b{font-size:15px}
.bk-paused{background:var(--white);border-top:6px solid var(--stage);padding:20px;margin:0 0 18px;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.bk-paused h2{font-size:clamp(20px,2.6vw,24px);margin-bottom:6px}
.bk-paused .row{margin:12px 0 0}
.bk-paused .btn{min-height:46px}
.bk-err p{margin:0 0 8px}
.bk-loading{padding:32px 0;color:var(--mute)}

/* filters (reuse .tt-filters from classes.css) */
.bk-filters{margin-top:0}
.bk-resbar{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin:4px 0 10px}
.bk-resbar .bk-h{margin:0}

/* class cards (reuse .cls) */
.bk-list{gap:10px}
.bk-c.on{outline:3px solid var(--ink);outline-offset:-3px}
.bk-price{margin:2px 0 6px;font-size:14.5px;font-weight:700;font-variant-numeric:tabular-nums}
.bk-price .muted{font-weight:600;font-size:13.5px}
.bk-add{min-width:108px;min-height:44px!important}
.bk-add svg{flex:none}
.bk-nb{margin:0;font-size:13.5px;color:var(--ink3);max-width:22em}
@media (min-width:900px){.bk-nb{text-align:right}}
.bk-more{margin:14px 0 0}
.bk-invite{margin-top:28px;padding-top:16px;border-top:1px solid var(--line)}
.bk-invite .muted{margin:0 0 4px;font-size:14px}
.bk-invite .tt-list{margin-top:8px}

/* holiday days */
.bk-hol{margin-top:28px}
.bk-holc{display:grid;gap:4px}
.bk-days{border:0;padding:0;margin:6px 0 0;min-width:0}

/* "your selection" box (deep link) and the summary on the details screen */
.bk-selbox{background:var(--white);border-top:6px solid var(--ink);padding:16px 16px 14px;margin:0 0 18px}
.bk-sel{list-style:none;margin:0;padding:0}
.bk-sel li{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line2)}
.bk-sel li:last-child{border-bottom:0}
.bk-sel b{display:block;line-height:1.35;overflow-wrap:anywhere}
.bk-sel small{display:block;color:var(--mute);font-size:13px;margin-top:2px}
.bk-x{flex:none;background:none;border:0;font:inherit;font-size:14px;font-weight:700;color:var(--stage-dk);text-decoration:underline;cursor:pointer;min-height:44px;padding:0 4px}
.bk-selgo{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:10px}
.bk-selgo .muted{font-size:13.5px}

/* selection tray: fixed above the phone action bar, at the bottom of the window on desktop; body gets room for it */
.bk-tray{position:fixed;left:0;right:0;bottom:calc(var(--mbar-h) + env(safe-area-inset-bottom));z-index:47;background:var(--ink);color:#fff;box-shadow:0 -6px 18px rgba(17,17,17,.18)}
@media (min-width:1024px){.bk-tray{bottom:0}}
.bk-tray-in{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:var(--wrap);margin:0 auto;padding:10px var(--gut)}
.bk-tray p{margin:0;min-width:0}
.bk-tray b{display:block;font-size:16px;font-variant-numeric:tabular-nums}
.bk-tray small{display:block;font-size:12.5px;color:#d9d4cb;line-height:1.35}
.bk-tray .btn{flex:none}
@media (max-width:639px){.bk-tray-g{display:none}}
body.bk-tray-on{padding-bottom:calc(var(--mbar-h) + 68px + env(safe-area-inset-bottom))}
@media (min-width:1024px){body.bk-tray-on{padding-bottom:72px}}

.bk-foot{margin-top:26px;padding-top:14px;border-top:1px solid var(--line);font-size:14.5px}
.bk-foot p{margin:0 0 6px}

/* details screen */
.bk-back{margin:0}
.bk-back .tt-clear{font-weight:700}
.bk-sum{background:var(--white);padding:4px 16px;margin:0 0 8px}
.bk-grade{font-size:14px;margin:0 0 20px}
.bk-form{max-width:760px}
.bk-pay{display:grid;gap:8px}
@media (min-width:640px){.bk-pay{grid-template-columns:1fr 1fr}}
.bk-radio{display:flex;gap:10px;align-items:flex-start;min-height:52px;padding:12px 14px;background:var(--white);border:1.5px solid var(--line);cursor:pointer;font-weight:700;font-size:15px;line-height:1.4}
.bk-radio input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:var(--stage)}
.bk-radio:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.bk-quote{background:var(--white);border-left:4px solid var(--ink);padding:12px 16px;margin-top:12px}
.bk-q0{margin:0;color:var(--mute);font-weight:600}
.bk-qrow{display:flex;justify-content:space-between;gap:14px;padding:6px 0;font-size:15px}
.bk-qrow b{white-space:nowrap;font-variant-numeric:tabular-nums}
.bk-qrow small{display:block;color:var(--mute);font-size:13px}
.bk-qtot{border-top:1px solid var(--line);margin-top:4px;padding-top:10px;font-size:17px;font-weight:800}
.bk-qn{margin:8px 0 0;font-size:13.5px;color:var(--ink3)}
.bk-warn{color:var(--stage-dk);font-weight:700}
.bk-hint{color:#7a5a17;font-size:13.5px;font-weight:600}
.bk-form .field input{font-size:16px}
.tr-send .tt-clear{justify-self:start}

/* bank result */
.bk-kv{display:grid;grid-template-columns:1fr;gap:2px 16px;margin:12px 0 16px}
@media (min-width:560px){.bk-kv{grid-template-columns:11em 1fr}}
.bk-kv dt{color:var(--mute);font-size:14px;font-weight:700}
.bk-kv dd{margin:0 0 10px;font-size:18px;font-weight:800;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.bk-copy{min-height:40px;font-size:13px}
.bk-bsum{background:var(--paper);padding:12px 16px;margin:0 0 14px}
.bk-bsum p{margin:0 0 4px}
.bk-bsum ul{margin:4px 0 6px;padding-left:20px}

/* static (no-JS / AI) list */
.bk-static h3.bk-sd{font-size:15px;letter-spacing:.06em;text-transform:uppercase;margin:18px 0 6px;color:var(--mute)}
.bk-sl{margin:0;padding:0;list-style:none;background:var(--white)}
.bk-sl li{padding:10px 14px;border-bottom:1px solid var(--line2);font-size:15px}
.bk-sl a{display:inline-block;padding:4px 0}

.bk-info .bk-how h2{font-size:18px}
.bk-addr{margin:18px 0 0;font-size:14.5px}
/* long pay labels ("Reserve & pay $207.00 by bank transfer") wrap instead of widening the page */
.bk-form .tr-send .btn,.tr-done .btn-lg{white-space:normal;text-align:center;max-width:100%}
@media (max-width:639px){.bk-form .tr-send .btn,.tr-done .btn-lg{width:100%}}

/* ---- review fixes 2026-11-06 ---- */
/* the /book list is flat (not under day headings): show the weekday on every card */
.bk-c .cls-day{display:block;font-size:12.5px;color:var(--ink)}
/* a date and its weekday never split across lines */
.bk-d{white-space:nowrap}
/* tap targets ≥ 44px */
.bk-filters .chip,.bk-copy,.bk-first .btn,.bk-chose .btn{min-height:44px}
.bk-terms{display:inline-flex;align-items:center;min-height:44px;margin:4px 0 0 30px;font-size:14px}
/* phones: Age stays open, Style / Days / Experience behind one toggle */
.bk-fmore-btn{display:none;min-height:44px;font-weight:700;text-align:left}
@media (max-width:639px){
  .bk-fmore-btn{display:block;margin:-2px 0 6px}
  .bk-fmore:not(.open){display:none}
}
/* the class the visitor came for, inside the paused panel */
.bk-chose{background:var(--paper);padding:10px 14px 4px;margin:8px 0 12px}
.bk-chose .bk-sel li{padding:8px 0}
.bk-chose .row{margin:8px 0 6px}
/* in the booking flow the site action bar is hidden (Continue / Pay are the only red buttons); the tray drops to the bottom */
@media (max-width:1023px){
  body.bk-flow .mbar{display:none}
  body.bk-flow{padding-bottom:env(safe-area-inset-bottom)}
  body.bk-flow .bk-tray{bottom:env(safe-area-inset-bottom)}
  body.bk-flow.bk-tray-on{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
}
