/* Status colours for the hand-off tracker. Pending is yellow, complete is blue.
   These are not the apprenticeship fit-score colours. */
.pill.st{white-space:normal;text-align:left;line-height:1.35}
.pill.st.pending{background:#fff6d6;color:#7a5a00;border:1px solid #d9a800}
.pill.st.complete{background:#e7f6ff;color:#0c4a6e;border:1px solid #00aeef}
.hero.slim p.sub{margin:.55rem 0 0;font-size:1rem;color:#e8f1f6}
.card.form{max-width:720px}
button.danger{background:#fff;color:var(--err);border:1px solid var(--err)}
button.danger:hover{background:#fbe9ec}
.sumnote{min-height:72px}
.confirm{font-weight:600}
.confirm input{width:22px;height:22px;min-height:0;margin-right:8px;accent-color:var(--err)}
.board{display:grid;gap:12px;grid-template-columns:1fr;align-items:start}
.boardcol{background:#fff;border:1px solid var(--n6);border-top:4px solid var(--navy-1);border-radius:12px;padding:12px 14px 16px}
.boardcol.pending{border-top-color:#d9a800}
.boardcol.complete{border-top-color:#00aeef}
.boardcol h2{font-size:1.15rem}
.kcard{background:var(--n7);border-radius:10px;padding:12px;margin:10px 0}
.kcard h3{margin:0 0 4px;font-size:1.05rem}
.kcard p{margin:4px 0}
.kcard button{width:auto;min-width:0;margin:8px 0 0;padding:8px 14px;min-height:40px}
@media (min-width:760px){
 .hero.slim p.sub{max-width:640px}
 .board.two{grid-template-columns:1fr 1fr}
}
/* 2026-10-22: four statuses, multi-status filter, sort links */
.pill.st.offer{background:#e8f7ec;color:#14532d;border:1px solid #22a55a}
.pill.st.dnp{background:#f3f4f6;color:#4b5563;border:1px solid #9ca3af}
.boardcol.offer{border-top-color:#22a55a}
.boardcol.dnp{border-top-color:#9ca3af}
.stbox{border:1px solid var(--n6);border-radius:10px;padding:8px 12px;margin:0;grid-column:1/-1}
.stbox legend{font-weight:600;padding:0 4px}
.chk{display:inline-flex;align-items:center;gap:6px;margin:4px 16px 4px 0;font-weight:500}
.chk input{width:20px;height:20px;min-height:0}
.sortlink{color:inherit;text-decoration:none}
.sortlink:hover{text-decoration:underline}
.sr{position:absolute;left:-9999px}
.kcard select{width:auto;margin-top:8px}
@media (min-width:1100px){.board.four{grid-template-columns:repeat(4,1fr)}}
@media (min-width:760px) and (max-width:1099px){.board.four{grid-template-columns:1fr 1fr}}
