/* ── Training picker: choose school + day, then show the times ── */
.picker-intro { margin-bottom:8px; }
.picker-intro h1 { margin:0 0 14px; font-size:clamp(34px, 4.4vw, 48px); font-weight:600; letter-spacing:-1.6px; line-height:1.08; }
.picker-lead { max-width:520px; margin:0; font-size:16px; line-height:1.7; color:var(--muted); }

.picker-box { background:var(--panel); border:1px solid var(--line-strong); border-radius:16px; box-shadow:var(--shadow-lg); overflow:hidden; margin:28px 0 36px; }
.picker-step { padding:28px 32px 30px; border-bottom:1px solid var(--line); }
.picker-legend { display:flex; align-items:center; gap:12px; margin:0 0 18px; font-size:18px; font-weight:600; letter-spacing:-.2px; line-height:1.3; color:var(--ink); }
.picker-num { flex-shrink:0; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:var(--ink); color:var(--bg); font:600 13px/1 var(--mono); }
.picker-options { display:grid; gap:10px; }
.picker-schools { grid-template-columns:repeat(3, minmax(0, 1fr)); }
.picker-days { grid-template-columns:repeat(5, minmax(0, 1fr)); }

/* Native radio inputs stay in the DOM (keyboard + screen reader support) but are visually replaced by the label text */
.picker-option { position:relative; display:block; cursor:pointer; }
.picker-option input { position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; border:0; opacity:0; cursor:pointer; }
.picker-option span { display:flex; align-items:center; justify-content:center; min-height:54px; padding:10px 14px; text-align:center; font-size:15px; font-weight:500; line-height:1.3; color:var(--ink); background:var(--bg); border:1px solid var(--line-strong); border-radius:10px; transition:background-color .15s, border-color .15s, color .15s; }
.picker-option:hover span { border-color:var(--accent); }
.picker-option input:checked + span { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); font-weight:600; }
.picker-option input:focus-visible + span { outline:3px solid var(--accent-light); outline-offset:2px; }

.picker-result { padding:28px 32px 32px; background:var(--panel-2); min-height:200px; }
.picker-placeholder { display:flex; align-items:center; gap:18px; min-height:140px; }
.picker-glyph { font:56px/1 Georgia, 'Times New Roman', serif; color:var(--line-strong); }
.picker-placeholder strong { display:block; margin-bottom:4px; font-size:20px; font-weight:600; color:var(--ink); }
.picker-placeholder p { margin:0; font-size:14px; color:var(--muted); }

.result-head { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 18px; margin-bottom:18px; }
.result-head h2 { margin:0; font-size:24px; font-weight:600; letter-spacing:-.6px; color:var(--ink); }
.result-head p { margin:0; font-size:14px; color:var(--muted); }
.result-list { list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.result-item { display:flex; flex-wrap:wrap; align-items:center; gap:8px 22px; padding:18px 22px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
.result-time { font:600 26px/1 var(--mono); letter-spacing:-1.2px; color:var(--ink); white-space:nowrap; }
.result-note { font-size:15px; color:var(--ink-soft); }
.result-badge { margin-left:auto; padding:4px 10px; font:500 11px/1.4 var(--mono); letter-spacing:.6px; text-transform:uppercase; color:var(--muted); border:1px solid var(--line-strong); border-radius:6px; }
.result-notice { margin:0 0 14px; padding:14px 18px; font-size:14px; line-height:1.6; color:var(--ink); background:var(--panel); border:1px solid var(--line-strong); border-left:4px solid var(--accent); border-radius:8px; }
.result-notice a { color:var(--accent); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.result-empty-title { margin:0 0 16px; font-size:17px; font-weight:600; color:var(--ink); }
.result-empty-sub { margin:0 0 10px; font-size:14px; color:var(--muted); }
.result-chips { display:flex; flex-wrap:wrap; gap:10px; }
.result-chip { min-height:44px; padding:8px 18px; font-size:14px; font-weight:600; color:var(--ink); background:var(--panel); border:1px solid var(--line-strong); border-radius:999px; cursor:pointer; transition:background-color .15s, border-color .15s, color .15s; }
.result-chip:hover { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }

@media (max-width:900px) {
  .picker-schools { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .picker-schools > :last-child:nth-child(odd) { grid-column:1 / -1; }
}
@media (max-width:640px) {
  .picker-step, .picker-result { padding:22px 20px; }
  .picker-days { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .picker-days > :last-child:nth-child(odd) { grid-column:1 / -1; }
  .picker-option span { min-height:50px; font-size:14px; }
  .result-head h2 { font-size:21px; }
  .result-time { font-size:22px; }
}