/* v13.0.0: GCSE Masterclass, the staff pages (runs list, run editor, timetable builder).
   Track colours come in as --tbg (background) and --tink (text) on each chip, so a
   new colour needs no new CSS. Built to fit a phone with no sideways scroll. */
.mc-runs-table td{ vertical-align:top; }
.mc-bad{ color:var(--red); }
.mc-hint{ margin:-8px 0 12px; }
.mc-tabs{ display:flex; flex-wrap:wrap; gap:6px; }
.mc-tab{ min-height:40px; padding:6px 14px; border:1px solid #DCDDEB; background:#fff; border-radius:999px; font:inherit; font-weight:600; font-size:.88rem; cursor:pointer; color:inherit; }
.mc-tab.is-on{ background:var(--violet); border-color:var(--violet); color:#fff; }
.mc-tab:disabled{ opacity:.45; cursor:not-allowed; }
#mc-body{ margin-top:14px; }
.mc-details textarea{ width:100%; }
.mc-details .check, .mc-copy-days .check, #mc-copy-form .check{ display:flex; gap:8px; align-items:center; margin:6px 0; min-height:36px; }

/* tracks */
.mc-track{ border:1px solid #E3E4EF; border-left:8px solid var(--tbg); border-radius:12px; padding:12px; margin-bottom:12px; }
.mc-track-top{ display:flex; gap:8px; align-items:center; margin-bottom:8px; }
.mc-track-top input{ flex:1; min-width:0; font-weight:700; font-size:1rem; padding:8px 10px; border:1px solid #DCDDEB; border-radius:10px; }
.mc-track-dot{ width:18px; height:18px; border-radius:50%; background:var(--tbg); border:2px solid var(--tink); flex:none; }
.mc-track-move{ display:flex; gap:4px; }
.mc-sws{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.mc-sw{ width:34px; height:34px; border-radius:50%; background:var(--sw); border:2px solid #fff; box-shadow:0 0 0 1px #C9CADB; cursor:pointer; }
.mc-sw.is-on{ box-shadow:0 0 0 3px var(--swink); }
.mc-track-acts{ display:flex; gap:8px; margin:0; }
.mc-track-add{ display:flex; gap:8px; align-items:flex-end; flex-wrap:wrap; }
.mc-track-add .field{ flex:1; min-width:200px; margin:0; }

/* timetable */
.mc-tt-top{ display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:center; }
.mc-ok{ margin:0 0 10px; }
.mc-checks{ border:1px solid #F3D9A6; background:#FFF8E8; border-radius:12px; padding:8px 12px; margin-bottom:12px; }
.mc-checks summary{ cursor:pointer; min-height:32px; display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.mc-checks ul{ margin:6px 0 2px; padding-left:18px; }
.mc-checks li{ margin:3px 0; }
.mc-checks li.is-err .linky{ color:var(--red); }
.mc-checks li.is-warn .linky{ color:#8A5A00; }
.mc-checks .linky{ background:none; border:0; padding:2px 0; font:inherit; text-align:left; cursor:pointer; text-decoration:underline dotted; }
.mc-legend{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.mc-legend span{ background:var(--tbg); color:var(--tink); border-radius:999px; padding:3px 10px; font-size:.8rem; font-weight:700; }
.mc-days{ display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:12px; }
.mc-day{ border:1px solid #E3E4EF; border-radius:14px; padding:10px; background:#FAFAFD; min-width:0; }
.mc-day.is-bad{ border-color:var(--red); }
.mc-day-h{ display:flex; justify-content:space-between; align-items:center; gap:6px; flex-wrap:wrap; margin-bottom:6px; }
.mc-hours{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:8px; font-size:.86rem; }
.mc-hours input{ padding:6px; border:1px solid #DCDDEB; border-radius:8px; min-height:36px; font:inherit; }
.mc-slot{ border:1px dashed #D2D3E3; border-radius:12px; padding:8px; margin-bottom:8px; background:#fff; }
.mc-slot.is-bad{ border-color:var(--red); border-style:solid; }
.mc-slot.is-over{ background:#EEF0FF; border-color:var(--violet); }
.mc-slot-h{ display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; font-size:.88rem; }
.btn-xs{ padding:2px 8px; font-size:.8rem; min-width:32px; min-height:32px; }
.mc-sess{ display:block; width:100%; text-align:left; background:var(--tbg); color:var(--tink); border:2px solid transparent; border-radius:10px;
  padding:7px 9px; margin-bottom:6px; cursor:pointer; font:inherit; min-height:44px; }
.mc-sess[draggable="true"]{ cursor:grab; }
.mc-sess.is-bad{ border-color:var(--red); }
.mc-sess:focus-visible{ outline:3px solid var(--violet); }
.mc-sess-t{ display:block; font-weight:800; font-size:.86rem; }
.mc-sess-lv{ display:block; font-size:.72rem; font-weight:600; opacity:.85; }
.mc-sess-x{ display:block; font-size:.84rem; margin-top:2px; overflow-wrap:anywhere; }
.mc-sess-m{ display:block; font-size:.74rem; opacity:.85; margin-top:2px; }
.mc-add-sess{ width:100%; min-height:40px; border:1px dashed #C9CADB; background:none; border-radius:10px; cursor:pointer; font:inherit; font-size:.84rem; color:var(--muted); }
.mc-addslot{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:.86rem; }
.mc-addslot input{ padding:6px; border:1px solid #DCDDEB; border-radius:8px; min-height:36px; font:inherit; }
.mc-flash{ animation:mcflash 1.6s ease; }
@keyframes mcflash{ 0%,60%{ box-shadow:0 0 0 4px #FFC94D; } 100%{ box-shadow:none; } }

/* topics */
.mc-subj{ border:1px solid #E3E4EF; border-radius:12px; padding:8px 12px; margin-bottom:10px; }
.mc-subj summary{ cursor:pointer; min-height:36px; display:flex; gap:8px; align-items:center; }
.mc-in{ width:100%; min-width:120px; padding:6px 8px; border:1px solid #DCDDEB; border-radius:8px; font:inherit; font-size:.86rem; }
.mc-topic-add{ display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.mc-topic-add input{ flex:1; min-width:180px; padding:8px 10px; border:1px solid #DCDDEB; border-radius:10px; font:inherit; }

@media (max-width:600px){
  .mc-days{ grid-template-columns:1fr; }
  .mc-tab{ flex:1 1 auto; }
}
.form-row.mc-row3{ grid-template-columns:1.3fr 1fr 1fr; }
#mc-sess-form .form-row.mc-row3{ grid-template-columns:1.4fr 1.4fr 110px; }
@media (max-width:700px){ .form-row.mc-row3, #mc-sess-form .form-row.mc-row3{ grid-template-columns:1fr; } }

/* v13.1.0: Pricing, Quick picks, Preview, Review and confirm */
.mc-sub{ margin:16px 0 8px; font-size:1rem; }
.mc-models{ border:0; padding:0; margin:0 0 12px; display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:8px; }
.mc-models legend{ font-weight:700; font-size:.88rem; margin-bottom:6px; }
.mc-model{ display:flex; gap:8px; align-items:flex-start; border:1px solid #DCDDEB; border-radius:12px; padding:10px; cursor:pointer; min-height:44px; }
.mc-model.is-on{ border-color:var(--violet); background:#F4F1FF; }
.mc-single{ max-width:260px; }
.mc-bands{ display:flex; flex-direction:column; gap:6px; margin-bottom:8px; }
.mc-band{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; border:1px solid #E3E4EF; border-radius:10px; padding:6px 8px; font-size:.88rem; }
.mc-band input, .mc-band select, .mc-bundle input, .mc-route select, .mc-route-top input{ padding:6px 8px; border:1px solid #DCDDEB; border-radius:8px; font:inherit; min-height:36px; }
.mc-band input[type=number]{ width:72px; }
.mc-band-p input{ width:90px; }
.mc-bundles{ display:flex; flex-direction:column; gap:6px; }
.mc-bundle{ display:flex; gap:10px; align-items:center; border:1px solid #E3E4EF; border-left:8px solid var(--tbg); border-radius:10px; padding:6px 10px; }
.mc-bundle-n{ flex:1; min-width:0; }
.mc-bundle input{ width:90px; }
.mc-pc{ border-radius:12px; padding:8px 12px; margin:12px 0 8px; font-size:.9rem; }
.mc-pc ul{ margin:4px 0 0; padding-left:18px; }
.mc-pc-err{ background:#FDECEC; border:1px solid #F3B4B4; }
.mc-pc-warn{ background:#FFF8E8; border:1px solid #F3D9A6; }
.mc-ptable tr.is-bad td{ background:#FDECEC; }
.mc-actions{ display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 0; }
.mc-route{ border:1px solid #E3E4EF; border-radius:12px; padding:10px; margin-bottom:10px; }
.mc-route-top{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:8px; }
.mc-route-top input{ flex:1; min-width:180px; font-weight:700; }
.mc-route-picks{ display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:8px; }
.mc-route-picks label{ display:flex; flex-direction:column; gap:3px; font-size:.84rem; font-weight:700; }
.mc-servercheck{ display:inline-block; margin-left:6px; }
.mc-ready{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.mc-ready li{ display:flex; gap:10px; align-items:flex-start; border-radius:10px; padding:8px 10px; }
.mc-ready li.is-ok{ background:#EEFBF4; }
.mc-ready li.is-no{ background:#FDECEC; }
.mc-review{ background:#FFF8E8; border:1px solid #F3D9A6; border-radius:10px; padding:8px 12px; }
.mc-groups{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.mc-groups li{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.mc-versions-card{ margin-top:14px; }
.mc-vview{ max-height:50vh; overflow:auto; display:flex; flex-direction:column; gap:8px; border-top:1px solid #E3E4EF; padding-top:8px; }
.mc-vslot{ margin-left:12px; }
.mc-head .linky{ border:0; background:none; padding:0; font:inherit; color:var(--violet); text-decoration:underline; cursor:pointer; }

/* v13.2.0: the pay page and the family's dashboard card */
.mcpay-list{ list-style:none; margin:0 0 12px; padding:0; font-size:.92rem; }
.mcpay-list li{ padding:2px 0; }
.mcpay-list .mcpay-day{ font-weight:800; margin-top:8px; }
.mcpay-sum{ display:grid; grid-template-columns:auto auto; justify-content:start; gap:4px 18px; align-items:baseline; margin:10px 0; }
.mcpay-due{ font-size:1.8rem; }
.mcpay-ways{ display:flex; flex-direction:column; gap:8px; max-width:420px; }
.mcpay-done{ background:#EEFBF4; border-radius:12px; padding:10px 14px; font-weight:700; }
.mcpay-warn, .mcf-warn{ background:#FFF8E8; border:1px solid #F3D9A6; border-radius:12px; padding:8px 12px; display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.mcpay-bankbox{ margin-top:14px; border:1px solid #E3E4EF; border-radius:12px; padding:12px 14px; }
.mcf-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.mcf-list li{ display:grid; grid-template-columns:120px 1fr auto; gap:10px; align-items:center; border:1px solid #E3E4EF; border-radius:12px; padding:8px 10px; font-size:.9rem; }
.mcf-list li.is-live{ border-color:var(--violet); background:#F4F1FF; }
@media (max-width:600px){ .mcf-list li{ grid-template-columns:1fr; } }
.mc-bbar{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:8px 0 10px; }
.mc-bbar select, .mc-bbar input{ padding:7px 10px; border:1px solid #DCDDEB; border-radius:10px; font:inherit; font-size:.88rem; min-height:40px; }
.mc-bbar input{ flex:1; min-width:180px; max-width:320px; }
.mc-seg{ display:flex; gap:4px; }
.mc-bsess{ margin:6px 0 0; padding-left:16px; }
.mc-bstats{ margin:4px 0 0; }
.mcf-wait{ opacity:.6; cursor:default; font-size:.78rem; }   /* v13.3.0 */
/* v13.4.0: import, page wording, session buttons */
.mc-pagewords{ margin-top:14px; }
.mc-import-here{ border:1px dashed #C9CADB; border-radius:12px; padding:10px 14px; margin-top:6px; }
.mc-imp-sum{ display:grid; grid-template-columns:110px 1fr; gap:4px 12px; font-size:.9rem; margin:10px 0; }
.mc-imp-sum dt{ color:var(--muted); font-weight:700; }
.mc-imp-sum dd{ margin:0; }
.mc-sess-acts{ display:flex; gap:6px; justify-content:center; margin-top:6px; }
.mc-sess-btn{ border:1px solid rgba(34,34,60,.18); background:#fff; color:#2A2E50; border-radius:999px; padding:3px 10px; font:inherit; font-size:.75rem; font-weight:700; cursor:pointer; min-height:28px; }
.mc-sess-btn:hover{ border-color:var(--violet); color:var(--violet); }
.mc-sess-btn.is-del:hover{ border-color:var(--red); color:var(--red); }