/* ============================================================
   SMU Student Portal — Document & Print stylesheet
   Loaded ONLY by the standalone document pages in /documents/.
   Provides:
     1. On-screen presentation of an A4 "sheet" (.doc-sheet) with
        toolbar, bilingual header, official-form layout primitives.
     2. An @media print block that strips chrome, forces black-on-
        white, sets A4 page + margins, and handles the 2-up admit card.
   Tokens-only on screen; print intentionally forces #fff / #000 so a
   dark-theme screen still prints a clean white official document.
   ============================================================ */

/* ---------- Page background for document pages ---------- */
.doc-page { background:var(--surface-2); min-height:100vh; padding:var(--s5) var(--s4) var(--s8); }

/* ---------- Toolbar (hidden on print) ---------- */
.doc-toolbar {
  position:sticky; top:0; z-index:30;
  display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap;
  max-width:820px; margin:0 auto var(--s5); padding:.55rem .7rem;
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r); box-shadow:var(--shadow-sm);
}
.doc-toolbar .spacer { flex:1; }
.doc-toolbar .doc-toolbar__title { font-weight:700; font-size:.92rem; letter-spacing:-.01em; }
.doc-toolbar .doc-toolbar__title small { display:block; font-weight:500; font-size:.7rem; color:var(--text-muted); letter-spacing:0; }

/* ---------- The sheet (A4-proportioned card) ---------- */
.doc-sheet {
  max-width:820px;            /* ~ A4 width at screen scale */
  margin:0 auto;
  background:#fff;            /* official paper is always white */
  color:#111;
  padding:18mm 16mm;
  box-shadow:var(--shadow-lg);
  border-radius:2px;
  position:relative;
  font-size:13px;
  line-height:1.5;
}
/* Force English/Latin parts in the sheet to a print-friendly serif-ish stack
   while Bengali still uses Noto Serif Bengali via [lang]/.bn */
.doc-sheet { font-family:var(--font-en); }
.doc-sheet .bn { font-family:var(--font-bn); }
.doc-sheet a { color:#111; text-decoration:none; }
.doc-sheet h1,.doc-sheet h2,.doc-sheet h3,.doc-sheet h4 { color:#111; }

/* Stack two sheets (admit card) with breathing room on screen */
.doc-sheet + .doc-sheet { margin-top:var(--s5); }

/* ---------- Official bilingual header ---------- */
.doc-head { display:flex; align-items:center; gap:14px; text-align:center; }
.doc-head__logo { width:76px; height:76px; flex:none; }
.doc-head__logo img { width:100%; height:100%; object-fit:contain; }
.doc-head__titles { flex:1; }
.doc-head__titles .uni-bn { font-family:var(--font-bn); font-size:1.5rem; font-weight:700; line-height:1.2; color:#0C3A5B; }
.doc-head__titles .uni-en { font-size:1.35rem; font-weight:700; letter-spacing:.01em; color:#0C3A5B; }
.doc-head__titles .uni-sub { font-size:.82rem; color:#333; margin-top:2px; }
.doc-head__photo { width:96px; flex:none; border:1px solid #111; min-height:118px; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:.7rem; color:#444; text-align:center; padding:4px; }
.doc-head__photo small { display:block; font-size:.62rem; color:#666; margin-top:2px; }
/* Blank "no image" avatar placeholder for document photo boxes */
.ph-avatar { display:block; width:42px; height:42px; margin:0 auto; }
.ph-avatar svg { width:100%; height:100%; display:block; }
.ph-cap { display:block; font-size:.58rem; color:#777; line-height:1.25; text-align:center; margin-top:3px; }

.doc-title {
  text-align:center; margin:10px auto 4px;
}
.doc-title .t-bn { font-family:var(--font-bn); font-size:1.05rem; font-weight:700; color:#111; }
.doc-title .t-en { font-size:1.02rem; font-weight:700; color:#111; letter-spacing:.01em; }
/* boxed sub-title like "Registration Card" / "Admit Card" in the scans */
.doc-title .t-box { display:inline-block; border:1.5px solid #2a2150; color:#2a2150; padding:2px 16px; border-radius:3px; font-weight:700; margin-top:4px; }
.doc-instruction { text-align:center; font-size:.74rem; font-style:italic; color:#333; margin:4px auto 10px; }
.doc-rule { border:0; border-top:1.5px solid #111; margin:10px 0; }
.doc-rule--thin { border-top:1px solid #555; }

/* ---------- Form line fields (dotted leader) ---------- */
.fline { display:flex; align-items:flex-end; gap:6px; margin:6px 0; font-size:.86rem; }
.fline > .fl-label { white-space:nowrap; color:#111; }
.fline > .fl-no { font-weight:700; white-space:nowrap; }
.fline > .fl-fill {
  flex:1; min-width:40px;
  border-bottom:1px dotted #555;
  padding:0 4px 1px; min-height:1.15em;
  font-weight:600; color:#111;
}
.fline > .fl-fill--solid { border-bottom:1px solid #111; }
.fl-inline { display:inline-flex; align-items:flex-end; gap:6px; flex:1; }

/* numbered label column for the 01..15 list */
.doc-fields { margin:8px 0; }
.doc-fields .fline .fl-no { display:inline-block; min-width:1.6em; }
.fl-en { font-size:.7rem; color:#555; font-style:italic; }

/* ---------- Boxed character grid (Reg No / English name) ---------- */
.boxrow { display:inline-flex; gap:0; vertical-align:bottom; }
.boxrow .cell {
  width:20px; height:24px;
  border:1px solid #222; border-left:0;
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:.85rem; color:#111;
  font-family:var(--font-en);
}
.boxrow .cell:first-child { border-left:1px solid #222; }
.boxrow--bn .cell { font-family:var(--font-bn); }
.boxrow--sm .cell { width:16px; height:20px; font-size:.74rem; }

/* ---------- Money / receiving boxes (Bengali doc top stubs) ---------- */
.doc-stubs { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:10px 0 14px; }
.doc-stub { border:1px solid #111; padding:8px 10px; font-size:.78rem; }
.doc-stub .fline { margin:5px 0; font-size:.78rem; }
.doc-stub__title { text-align:center; font-weight:700; font-family:var(--font-bn); border-bottom:1px solid #111; padding-bottom:4px; margin:-8px -10px 8px; }

/* ---------- Generic bordered form table (subjects, exam history) ---------- */
.doc-table { width:100%; border-collapse:collapse; font-size:.82rem; margin:8px 0; }
.doc-table th,.doc-table td { border:1px solid #222; padding:5px 8px; color:#111; vertical-align:top; }
.doc-table th { background:#ececec; font-weight:700; text-align:left; }
.doc-table caption { caption-side:top; text-align:center; font-weight:700; background:#f3d9c9; border:1px solid #222; border-bottom:0; padding:5px; font-size:.84rem; }
.doc-table .num { text-align:right; font-variant-numeric:tabular-nums; }
.doc-table .ctr { text-align:center; }
.doc-table tfoot td,.doc-table tfoot td { font-weight:700; }

/* admit-card subject table: two columns of "n. ____" */
.subject-grid td { height:26px; }

/* ---------- Wide tabulation table ---------- */
.tab-table { width:100%; border-collapse:collapse; font-size:.72rem; }
.tab-table th,.tab-table td { border:1px solid #333; padding:3px 5px; color:#111; }
.tab-table th { background:#e8e8e8; text-align:center; font-weight:700; }
.tab-table .num { text-align:right; font-variant-numeric:tabular-nums; }
.tab-table .ctr { text-align:center; }
.tab-table tbody tr:nth-child(even) td { background:#fafafa; }

/* ---------- Signature & seal blocks ---------- */
.sign-row { display:flex; justify-content:space-between; gap:18px; margin-top:36px; flex-wrap:wrap; }
.sign-box { flex:1; min-width:150px; text-align:center; }
.sign-box .sign-line { border-top:1px solid #111; padding-top:4px; font-size:.8rem; color:#111; }
.sign-box .sign-line small { display:block; font-size:.68rem; color:#444; }
.seal {
  width:92px; height:92px; border:1.5px dashed #888; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  color:#888; font-size:.64rem; text-align:center; line-height:1.25; padding:6px;
}

/* ---------- QR block ---------- */
.doc-qr { text-align:center; }
.doc-qr .qr { border:1px solid #ccc; }
.doc-qr .qr-code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.72rem; font-weight:700; color:#111; margin-top:4px; letter-spacing:.02em; }
.doc-qr .qr-cap { font-size:.62rem; color:#555; }
/* corner placement helper */
.doc-qr--corner { position:absolute; top:16mm; right:14mm; }

/* ---------- PAID / status stamp ---------- */
.stamp {
  display:inline-block; transform:rotate(-12deg);
  border:3px solid #1a7f4b; color:#1a7f4b;
  font-weight:800; letter-spacing:.12em; font-size:1.4rem;
  padding:4px 18px; border-radius:6px; opacity:.85;
  text-transform:uppercase;
}
.stamp--void { border-color:#b42318; color:#b42318; }

/* ---------- Statistics block (tabulation) ---------- */
.stat-table { width:100%; border-collapse:collapse; font-size:.76rem; }
.stat-table th,.stat-table td { border:1px solid #333; padding:4px 8px; color:#111; }
.stat-table th { background:#e8e8e8; }
.stat-table .num { text-align:right; font-variant-numeric:tabular-nums; }

/* ---------- Receipt specifics ---------- */
.receipt-meta { display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; font-size:.84rem; margin:10px 0; }
.receipt-meta .r-k { color:#555; }
.receipt-meta .r-v { font-weight:700; color:#111; text-align:right; }
.receipt-amount { border-top:1px solid #111; border-bottom:1px solid #111; padding:10px 0; margin:12px 0; display:flex; align-items:center; justify-content:space-between; }
.receipt-amount .ra-label { font-weight:700; }
.receipt-amount .ra-value { font-size:1.5rem; font-weight:800; color:#111; }

/* small helpers limited to sheets */
.doc-sheet .muted2 { color:#555; }
.doc-sheet .note-list { font-size:.72rem; color:#333; margin-top:14px; }
.doc-sheet .note-list ol { margin:0; padding-left:1.3em; }
.doc-sheet .note-list li { margin:2px 0; }
.doc-spacer-sm { height:8px; }
.doc-spacer { height:18px; }

/* =====================================================================
   SCREEN responsiveness — keep the sheet usable on small screens
   ===================================================================== */
@media (max-width:680px){
  .doc-sheet { padding:14px 12px; font-size:12px; }
  .doc-head { gap:8px; }
  .doc-head__logo { width:46px; height:46px; }
  .doc-head__titles .uni-bn { font-size:1.15rem; }
  .doc-head__titles .uni-en { font-size:1.05rem; }
  .doc-head__photo { width:72px; min-height:92px; }
  .doc-stubs,.receipt-meta { grid-template-columns:1fr; }
  .doc-qr--corner { position:static; display:block; margin:10px auto 0; }
}

/* =====================================================================
   PRINT
   ===================================================================== */
@media print {
  @page { size:A4; margin:12mm; }

  /* hide all app chrome regardless of where it appears */
  .doc-toolbar, .topbar, #topbar, .sidebar, #sidebar, .pub-bar,
  .app-wrap > #sidebar, .toast-host, .pay-overlay { display:none !important; }

  html, body, .doc-page {
    background:#fff !important;
    color:#000 !important;
    padding:0 !important;
    margin:0 !important;
  }

  /* the sheet fills the printable area; no shadow / no rounding */
  .doc-sheet {
    box-shadow:none !important;
    margin:0 !important;
    width:100% !important;
    max-width:none !important;
    padding:0 !important;
    border-radius:0 !important;
    background:#fff !important;
    color:#000 !important;
    font-size:11.5pt;
  }

  /* keep tables/rows from splitting awkwardly */
  .doc-table, .tab-table, .stat-table, .sign-row, .doc-stub, .boxrow { page-break-inside:avoid; }
  tr, .fline { page-break-inside:avoid; }

  /* preserve official fills (table headers, stamps) when printing */
  * { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }

  /* QR & seal stay crisp */
  .doc-qr .qr { border-color:#bbb !important; }

  /* ---- Admit card: one copy per page (University Copy -> p1, Examinee Copy -> p2) ---- */
  .admit-2up .doc-sheet {
    box-sizing:border-box;
    page-break-after:always;          /* each copy starts a fresh page */
    break-after:page;
    page-break-inside:avoid;
  }
  .admit-2up .doc-sheet:last-child { page-break-after:auto; break-after:auto; }

  /* Registration Card stub prints on its own page */
  .reg-stub { page-break-before:always; break-before:page; }
}