/* Student life module: admissions, promotion, behaviour, health, documents, certificates & ID cards */

/* ---------- public application form (bare layout) */
.bare-main:has(.sl-apply) { max-width: 880px; padding-top: 2rem; }
.sl-apply { background: var(--bg, #f4f6f9); color: var(--text); border-radius: 12px; padding: 1.5rem 1.6rem; box-shadow: var(--shadow-lg); }
.sl-apply h2 { margin: 1.4rem 0 .6rem; }
@media (max-width: 600px) { .sl-apply { padding: 1rem .8rem; } }
.sl-apply-head { display: flex; align-items: center; gap: 1rem; padding-bottom: 1rem; border-bottom: 3px solid var(--accent); }
.sl-apply-head h1 { font-size: 1.5rem; }
.sl-apply .card { box-shadow: none; }
.sl-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sl-ref { font-size: 2rem; font-weight: 700; letter-spacing: .06em; color: var(--accent); margin: .2rem 0 .8rem; }
.sl-logo-mark { display: inline-grid; place-items: center; border-radius: 12px; background: var(--accent); color: #fff; font-weight: 700; font-size: 1.3rem; flex: none; }

/* ---------- admissions board */
.sl-capacity { display: flex; flex-wrap: wrap; gap: .6rem; }
.sl-cap { display: flex; flex-direction: column; gap: .1rem; padding: .55rem .8rem; border: 1px solid var(--border); border-left: 4px solid var(--green, #178a55); border-radius: var(--radius-sm); background: var(--surface); font-size: .88rem; min-width: 170px; }
.sl-cap.tight { border-left-color: var(--amber, #b86e00); }
.sl-cap.over { border-left-color: var(--red, #cf3f3f); }
.sl-board { display: grid; grid-template-columns: repeat(7, minmax(180px, 1fr)); gap: .7rem; overflow-x: auto; padding-bottom: .5rem; }
.sl-col { background: var(--surface-2, #eef1f5); border-radius: var(--radius); padding: .55rem; min-height: 140px; }
.sl-col-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .5rem; }
.sl-card { background: var(--surface, #fff); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .55rem .6rem; margin-bottom: .5rem; box-shadow: var(--shadow); font-size: .9rem; }
.sl-card .sl-move { margin-top: .35rem; }
.sl-card .sl-move select { width: 100%; font-size: .8rem; padding: .15rem .3rem; }
.sl-empty-col { text-align: center; padding: 1rem 0; }
.timeline li.sl-act-stage::before { background: var(--accent); }
.timeline li.sl-act-email::before { background: var(--purple, #6b4fc8); }
.timeline li.sl-act-note::before { background: var(--amber, #b86e00); }
.sl-mini-pipe { display: grid; grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: .4rem; margin-bottom: .6rem; }
.sl-mini-pipe a { display: flex; flex-direction: column; align-items: center; padding: .45rem .3rem; border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--text); text-decoration: none; }
.sl-mini-pipe a:hover { border-color: var(--accent); }
.sl-mini-pipe strong { font-size: 1.3rem; }
.sl-mini-pipe span { font-size: .75rem; color: var(--muted); text-align: center; }

/* ---------- promotion wizard */
.sl-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.sl-steps li { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: .85rem 1rem; }
.sl-steps li.current { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.sl-steps li.done { border-left: 4px solid var(--green, #178a55); }
tr.sl-done td { color: var(--muted); background: var(--surface-2, #f6f8fa); }
@media (max-width: 800px) { .sl-steps { grid-template-columns: 1fr; } }

/* ---------- behaviour & pickers */
.sl-clip { max-width: 380px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sl-student-picks { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .25rem .8rem; max-height: 480px; overflow: auto; }
.timeline li.sl-tl-merit::before { background: var(--green, #178a55); }
.timeline li.sl-tl-incident::before { background: var(--red, #cf3f3f); }
.sl-merit-big strong { font-size: 2rem; color: var(--green, #178a55); }
.sl-picker { position: relative; }
.sl-picker input[type=search] { width: 100%; }
.sl-picker-list { position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 2px); background: var(--surface, #fff); border: 1px solid var(--border); border-radius: var(--radius-sm); box-shadow: var(--shadow-lg); max-height: 280px; overflow: auto; }
.sl-picker-list button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: .45rem .6rem; font: inherit; cursor: pointer; }
.sl-picker-list button:hover, .sl-picker-list button:focus { background: var(--accent-soft); }
.sl-picker-list .muted { font-size: .82rem; }
.sl-preview { background: var(--surface-2, #f6f8fa); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .7rem .9rem; margin-top: .4rem; }
tr.sl-void td { text-decoration: line-through; color: var(--muted); }
tr.sl-void td:last-child { text-decoration: none; }

/* ---------- printed letters and certificates */
.sl-a4 { max-width: 210mm; margin: 0 auto 1.5rem; font-size: 11pt; line-height: 1.55; }
.sl-letterhead { display: flex; gap: 1rem; align-items: center; border-bottom: 3px double #243447; padding-bottom: .8rem; margin-bottom: 1.2rem; }
.sl-lh-name { font-size: 1.45rem; font-weight: 700; letter-spacing: .02em; }
.sl-lh-motto { font-style: italic; color: var(--muted); }
.sl-letter-body { margin: 1rem 0 1.5rem; text-align: justify; }
.sl-signature { margin-top: 2.5rem; }
.sl-sign-line { width: 220px; border-bottom: 1px solid #000; height: 2.2rem; margin-bottom: .3rem; }
.sl-sign-two { display: flex; justify-content: space-between; align-items: flex-end; }
.sl-stamp { width: 120px; height: 120px; border: 1px dashed #9aa5b1; border-radius: 50%; display: grid; place-items: center; color: #9aa5b1; font-size: .8rem; }
.sl-cut { margin: 2rem 0 1rem; color: #9aa5b1; overflow: hidden; white-space: nowrap; }
.sl-cert-title { text-align: center; letter-spacing: .12em; margin: 1.4rem 0 1rem; font-size: 1.35rem; }
.sl-cert { border: 6px double #243447; padding: 2rem 2.2rem; }
.sl-cert-void::after { content: "CANCELLED"; position: absolute; top: 40%; left: 10%; right: 10%; text-align: center; transform: rotate(-20deg); font-size: 5rem; font-weight: 800; color: rgba(207, 63, 63, .22); pointer-events: none; }
.sl-cert-facts { width: 100%; border-collapse: collapse; margin: .6rem 0 1rem; font-size: 10pt; }
.sl-cert-facts th, .sl-cert-facts td { border: 1px solid #cfd7e2; padding: .3rem .5rem; text-align: left; vertical-align: top; }
.sl-cert-facts th { background: #f4f6f9; width: 18%; font-weight: 600; }
.sl-cert-foot { margin-top: 2rem; border-top: 1px solid var(--border); padding-top: .5rem; }
.sl-cert-tools { max-width: 210mm; margin: 0 auto 1rem; display: flex; gap: .6rem; align-items: center; justify-content: space-between; }
.sl-med-table td, .sl-med-table th { font-size: 9.5pt; vertical-align: top; }

/* ---------- student ID cards: CR80, 85.6 × 54 mm */
.sl-cards { display: grid; grid-template-columns: repeat(2, 85.6mm); gap: 4mm 6mm; justify-content: center; }
.sl-idcard { width: 85.6mm; height: 54mm; box-sizing: border-box; border: 0.2mm solid #b8c2cc; border-radius: 3mm; overflow: hidden; background: #fff; display: flex; flex-direction: column; font-family: Arial, Helvetica, sans-serif; color: #111; page-break-inside: avoid; break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.sl-id-head { background: var(--sl-card, #0e7cb8); color: #fff; display: flex; align-items: center; gap: 2mm; padding: 1.6mm 2.5mm; height: 11mm; box-sizing: border-box; }
.sl-id-head img { height: 8mm; width: 8mm; object-fit: contain; background: #fff; border-radius: 1mm; }
.sl-id-school { font-weight: 700; font-size: 8.5pt; line-height: 1.1; }
.sl-id-sub { font-size: 6.5pt; opacity: .9; text-transform: uppercase; letter-spacing: .06em; }
.sl-id-body { display: flex; gap: 2.5mm; padding: 1.8mm 2.5mm 0; flex: 1; min-height: 0; }
.sl-id-photo { width: 19mm; height: 24mm; flex: none; border: 0.2mm solid #cfd7e2; border-radius: 1mm; overflow: hidden; background: #eef1f5; display: grid; place-items: center; }
.sl-id-photo img { width: 100%; height: 100%; object-fit: cover; }
.sl-id-photo span { font-size: 14pt; font-weight: 700; color: #677485; }
.sl-id-info { font-size: 7pt; line-height: 1.35; min-width: 0; }
.sl-id-info span { color: #677485; display: inline-block; min-width: 13mm; }
.sl-id-name { font-size: 10pt; font-weight: 700; line-height: 1.15; margin-bottom: .8mm; }
.sl-id-em { font-size: 6.3pt; }
.sl-id-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 2mm; padding: 0 2.5mm 1.6mm; height: 11mm; box-sizing: border-box; }
.sl-id-code { flex: 1; height: 9mm; }
.sl-barcode { width: 100%; height: 100%; display: block; }
.sl-id-valid { font-size: 6pt; text-align: right; line-height: 1.2; color: #444; }
.sl-idback { padding: 4mm; justify-content: center; text-align: center; font-size: 7.5pt; gap: 1.5mm; border-top: 3mm solid var(--sl-card, #0e7cb8); }
.sl-idback p { margin: 0; }
.sl-id-sign { margin-top: 3mm; font-size: 6.5pt; color: #444; }
.sl-backs { margin-top: 8mm; }
@media print {
    .sl-cards { gap: 3mm 5mm; }
    .sl-backs { page-break-before: always; margin-top: 0; }
    .sl-a4 { max-width: none; margin: 0; }
    .sl-cert { border: 6px double #243447 !important; padding: 12mm 14mm !important; }
    @page { size: A4; margin: 12mm; }
}