/* ==========================================================================
   RSN Education - Official High-Fidelity Printing Stylesheet
   Standardized Iraqi K-12 Educational Print Templates:
   1. Cash Receipt Voucher (Duplicate A4 Slip: School Copy + Parent Copy)
   2. Official Report Card & Transcript (Ministry of Education Format)
   3. Standard PVC Student ID Badge (85.6mm x 54mm)
   4. Weekly Timetable Matrix (A4 Landscape)
   5. Student Financial Statement & Clearance Voucher (A4 Portrait)
   6. Exam Seating Desk Cards & Hall Attendance Roster
   ========================================================================== */

@page {
  size: A4 portrait;
  margin: 10mm 15mm 12mm 15mm;
}

@page landscape-sheet {
  size: A4 landscape;
  margin: 10mm 15mm 12mm 15mm;
}

@media screen {
  .print-only-sheet {
    display: none !important;
  }
}

/* ========================================================================
   SCREEN PRINT PREVIEW MODAL STYLES (Realistic A4 simulation)
   ======================================================================== */
.print-preview-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(10, 15, 30, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  z-index: 100000;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  overflow-y: auto;
  padding: 16px 10px 60px;
}

.print-preview-toolbar {
  position: sticky;
  top: 10px;
  z-index: 100;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 950px;
  padding: 10px 18px;
  background: rgba(15, 23, 42, 0.96);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 12px;
  margin-bottom: 20px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
  flex-wrap: wrap;
  gap: 12px;
}

.print-preview-toolbar .preview-meta {
  display: flex;
  align-items: center;
  gap: 10px;
}

.print-preview-toolbar h4 {
  margin: 0;
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 700;
}

.print-preview-toolbar .preview-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.print-preview-sheet-wrapper {
  display: flex;
  justify-content: center;
  width: 100%;
  transform: scale(var(--preview-zoom, 1));
  transform-origin: top center;
  transition: transform 0.2s ease;
}

.print-preview-sheet {
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.15);
  border-radius: 4px;
  box-sizing: border-box;
  font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif;
  margin: 0 auto;
}

.print-preview-sheet.portrait {
  width: 210mm;
  min-height: 297mm;
  padding: 10mm 15mm 12mm 15mm;
  box-sizing: border-box;
}

.print-preview-sheet.landscape {
  width: 297mm;
  min-height: 210mm;
  padding: 10mm 15mm 12mm 15mm;
  box-sizing: border-box;
}

/* ========================================================================
   UNIVERSAL OFFICIAL A4 LETTERHEAD (Iraqi K-12 MoE Standard)
   ======================================================================== */
.official-a4-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 2px solid #8b1016;
  padding-bottom: 3.5mm;
  margin-bottom: 4mm;
  position: relative;
}

.official-a4-header::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 0;
  height: 1px;
  background: #f59e0b;
}

.official-a4-header .hdr-right {
  text-align: right;
  flex: 1.2;
}

.official-a4-header .hdr-right h3 {
  margin: 0;
  font-size: 11pt;
  font-weight: 800;
  color: #0f172a;
}

.official-a4-header .hdr-right p {
  margin: 1mm 0 0;
  font-size: 8.5pt;
  color: #475569;
}

.official-a4-header .hdr-right .school-title {
  margin: 1.5mm 0 0;
  font-size: 13pt;
  font-weight: 900;
  color: #8b1016;
}

.official-a4-header .hdr-center {
  text-align: center;
  flex: 1.1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.official-a4-header .hdr-center .school-logo {
  height: 18mm;
  max-width: 48mm;
  object-fit: contain;
  margin-bottom: 1.5mm;
}

.official-a4-header .hdr-center .doc-title-pill {
  border: 1.5px solid #8b1016;
  background: #fff8f8;
  color: #8b1016;
  font-weight: 900;
  font-size: 10.5pt;
  padding: 1.5mm 4mm;
  border-radius: 4px;
  display: inline-block;
  white-space: nowrap;
}

.official-a4-header .hdr-center .doc-sub-motto {
  font-size: 7.5pt;
  color: #64748b;
  margin-top: 1mm;
}

.official-a4-header .hdr-left {
  text-align: left;
  flex: 1;
  font-size: 8.5pt;
  color: #334155;
  line-height: 1.6;
}

/* Compact header for dense student rosters and registers */
.official-a4-header.compact {
  padding-bottom: 2mm;
  margin-bottom: 2.5mm;
  border-bottom-width: 1.5px;
  width: 100%;
  box-sizing: border-box;
}

.official-a4-header.compact .hdr-right {
  padding-right: 2mm;
  box-sizing: border-box;
}

.official-a4-header.compact .hdr-right h3 {
  font-size: 8pt;
}

.official-a4-header.compact .hdr-right p {
  font-size: 6.8pt;
  margin: 0.5mm 0 0;
}

.official-a4-header.compact .hdr-right .school-title {
  font-size: 10.5pt;
  margin: 0.5mm 0 0;
}

.official-a4-header.compact .hdr-center .school-logo {
  height: 12mm;
  max-width: 32mm;
  margin-bottom: 1mm;
}

.official-a4-header.compact .hdr-center .doc-title-pill {
  font-size: 8.5pt;
  padding: 1mm 3mm;
}

.official-a4-header.compact .hdr-center .doc-sub-motto {
  font-size: 6.5pt;
  margin-top: 0.5mm;
}

.official-a4-header.compact .hdr-left {
  font-size: 7.2pt;
  line-height: 1.35;
  padding-left: 2mm;
  box-sizing: border-box;
}

@media print {
  /* 1. Global Reset for Clean Paper Output */
  *, *::before, *::after {
    box-shadow: none !important;
    text-shadow: none !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  html, body {
    background: #ffffff !important;
    color: #0f172a !important;
    font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important;
    font-size: 10pt;
    line-height: 1.4;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    overflow: visible !important;
  }

  /* Hide all screen elements and containers */
  .app-container,
  .app-sidebar,
  .main-wrapper,
  .top-bar,
  .top-bar-actions,
  .filter-toolbar,
  .sub-tabs,
  .btn,
  .modal-close,
  .controls-bar,
  .ambient-glow,
  .toast-container,
  .print-preview-modal-overlay,
  .print-preview-toolbar,
  .modal-overlay,
  .slide-deck {
    display: none !important;
  }

  /* When printing a dedicated template, strictly hide all other body children */
  body[class*="printing-"] > *:not(.print-only-sheet):not(.print-only-container) {
    display: none !important;
  }

  /* Hide print containers by default */
  .print-only-sheet,
  .print-only-container {
    display: none !important;
  }

  /* Display ONLY the active print container */
  body.printing-receipt #print-receipt-sheet,
  body.printing-report-card #print-report-card-sheet,
  body.printing-id-card #print-id-card-sheet,
  body.printing-timetable #print-timetable-sheet,
  body.printing-statement #print-statement-sheet,
  body.printing-grades #print-grades-sheet,
  body.printing-registry #print-registry-sheet,
  body.printing-general #print-general-sheet,
  body.printing-desk-cards #printable-desk-cards,
  body.printing-hall-roster #printable-hall-roster {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Avoid page breaks inside sections */
  .avoid-break {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }
}

  /* ========================================================================
     TEMPLATE 1: OFFICIAL CASH RECEIPT VOUCHER (DUPLICATE A4 SLIP)
     ======================================================================== */
  .receipt-sheet-wrapper {
    width: 100%;
    max-width: 190mm;
    margin: 0 auto;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 3mm;
  }

  .receipt-slip {
    border: 1.5px solid #0f172a;
    border-radius: 4px;
    padding: 3mm 4mm;
    background: #ffffff;
    box-sizing: border-box;
    position: relative;
  }

  .receipt-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #0f172a;
    padding-bottom: 4mm;
    margin-bottom: 4mm;
  }

  .receipt-header-right {
    text-align: right;
  }

  .receipt-header-right h3 {
    margin: 0;
    font-size: 11pt;
    font-weight: 800;
    color: #0f172a;
  }

  .receipt-header-right p {
    margin: 1mm 0 0;
    font-size: 8.5pt;
    color: #475569;
  }

  .receipt-header-center {
    text-align: center;
  }

  .receipt-logo {
    height: 14mm;
    margin-bottom: 1mm;
  }

  .receipt-title-box {
    display: inline-block;
    border: 1.5px solid #0f172a;
    padding: 1mm 4mm;
    font-size: 10pt;
    font-weight: 800;
    background: #f8fafc;
    border-radius: 4px;
    color: #0f172a;
  }

  .receipt-header-left {
    text-align: left;
    font-size: 8.5pt;
    color: #334155;
  }

  .receipt-header-left strong {
    color: #b91c1c;
    font-size: 10.5pt;
    font-family: monospace;
  }

  .receipt-details-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 3.5mm;
    font-size: 9pt;
  }

  .receipt-details-table td {
    padding: 2mm 3mm;
    border: 1px solid #cbd5e1;
  }

  .receipt-details-table .lbl {
    background: #f1f5f9;
    font-weight: 700;
    width: 18%;
    color: #334155;
  }

  .receipt-details-table .val {
    width: 32%;
    color: #0f172a;
  }

  .receipt-amount-highlight {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f0fdf4;
    border: 1.5px solid #16a34a;
    border-radius: 4px;
    padding: 2.5mm 4mm;
    margin-bottom: 3.5mm;
  }

  .receipt-amount-num {
    font-size: 12.5pt;
    font-weight: 900;
    color: #15803d;
  }

  .receipt-amount-words {
    font-size: 9pt;
    font-weight: 700;
    color: #166534;
  }

  .receipt-financial-summary {
    display: flex;
    justify-content: space-between;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 2mm 4mm;
    font-size: 8.5pt;
    margin-bottom: 4mm;
  }

  .receipt-signatures {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    text-align: center;
    font-size: 8.5pt;
    margin-top: 3mm;
  }

  .receipt-sig-box {
    padding: 1mm;
  }

  .receipt-stamp-circle {
    display: inline-block;
    width: 24mm;
    height: 14mm;
    border: 1px dashed #94a3b8;
    border-radius: 50%;
    margin-top: 1.5mm;
    line-height: 14mm;
    color: #94a3b8;
    font-size: 7.5pt;
  }

  .receipt-cut-separator {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 5mm 0;
    color: #64748b;
    font-size: 8pt;
    border-top: 1.5px dashed #64748b;
    padding-top: 2mm;
  }

  /* ========================================================================
     TEMPLATE 2: OFFICIAL IRAQI K-12 REPORT CARD & TRANSCRIPT
     ======================================================================== */
  .report-card-sheet {
    border: 1.5px solid #0f172a;
    border-radius: 4px;
    padding: 3.5mm 5mm;
    background: #ffffff;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .rc-official-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #0f172a;
    padding-bottom: 2.5mm;
    margin-bottom: 3mm;
  }

  .rc-header-title {
    font-size: 12.5pt;
    font-weight: 900;
    color: #0f172a;
    margin: 0 0 1mm 0;
  }

  .rc-header-sub {
    font-size: 8.5pt;
    color: #475569;
    margin: 0;
  }

  .rc-student-meta-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5mm;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 2mm 3mm;
    margin-bottom: 3mm;
    font-size: 8pt;
  }

  .rc-grades-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 3mm;
    font-size: 8pt;
    text-align: center;
  }

  .rc-grades-table th {
    background: #0f172a !important;
    color: #ffffff !important;
    border: 1px solid #0f172a;
    padding: 1.5mm 1mm;
    font-weight: 800;
  }

  .rc-grades-table td {
    border: 1px solid #cbd5e1;
    padding: 1.2mm 1mm;
    color: #0f172a;
  }

  .rc-grades-table tr:nth-child(even) td {
    background: #f8fafc;
  }

  .rc-annual-summary-card {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr 1.5fr 1.5fr;
    background: #f1f5f9;
    border: 1.5px solid #94a3b8;
    border-radius: 4px;
    padding: 3mm;
    font-size: 9pt;
    text-align: center;
    margin-bottom: 6mm;
  }

  .rc-annual-summary-card strong {
    display: block;
    font-size: 11pt;
    color: #0f172a;
    margin-top: 1mm;
  }

  .rc-official-signatures {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    text-align: center;
    font-size: 8.5pt;
    border-top: 1.5px dashed #94a3b8;
    padding-top: 4mm;
  }

  /* ========================================================================
     TEMPLATE 3: PVC STUDENT ID BADGE (STANDARD 85.6mm x 54mm)
     ======================================================================== */
  .id-card-print-sheet {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 260mm;
    gap: 15mm;
  }

  .pvc-badge-container {
    display: flex;
    gap: 12mm;
    justify-content: center;
  }

  .pvc-badge-side {
    width: 85.6mm;
    height: 53.98mm;
    border: 1.5px dashed #475569;
    border-radius: 3.18mm;
    box-sizing: border-box;
    padding: 3.5mm 4.5mm;
    position: relative;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
  }

  /* Badge Front */
  .pvc-front {
    border-top: 3.5mm solid #b91c1c;
  }

  .pvc-front-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 1.5mm;
  }

  .pvc-front-head h4 {
    margin: 0;
    font-size: 8pt;
    font-weight: 800;
    color: #0f172a;
  }

  .pvc-front-body {
    display: flex;
    gap: 3mm;
    align-items: center;
    margin: 2mm 0;
  }

  .pvc-photo-placeholder {
    width: 20mm;
    height: 25mm;
    border: 1px solid #cbd5e1;
    border-radius: 2mm;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 7pt;
    color: #94a3b8;
  }

  .pvc-info {
    flex: 1;
    font-size: 7.5pt;
    line-height: 1.5;
  }

  .pvc-info strong {
    font-size: 8.5pt;
    color: #0f172a;
    display: block;
  }

  .pvc-front-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e2e8f0;
    padding-top: 1mm;
    font-size: 6.5pt;
    color: #64748b;
  }

  /* Badge Back */
  .pvc-back {
    border-top: 3.5mm solid #0f172a;
    font-size: 6.8pt;
    color: #334155;
    line-height: 1.45;
  }

  .pvc-back-title {
    font-weight: 800;
    color: #0f172a;
    font-size: 7.5pt;
    margin-bottom: 1.5mm;
    text-align: center;
  }

  .pvc-back-terms {
    margin: 0 0 2mm 0;
    padding-right: 3mm;
  }

  .pvc-back-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e2e8f0;
    padding-top: 1.5mm;
  }

  /* ========================================================================
     TEMPLATE 4: OFFICIAL TIMETABLE SHEET (A4 LANDSCAPE)
     ======================================================================== */
  .timetable-landscape-sheet {
    page: landscape-sheet;
    width: 100%;
    box-sizing: border-box;
    padding: 5mm;
  }

  .tt-sheet-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #0f172a;
    padding-bottom: 3mm;
    margin-bottom: 4mm;
  }

  .tt-sheet-head h3 {
    margin: 0;
    font-size: 13pt;
    font-weight: 900;
    color: #0f172a;
  }

  .tt-sheet-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8.5pt;
    text-align: center;
  }

  .tt-sheet-table th {
    background: #0f172a !important;
    color: #ffffff !important;
    border: 1px solid #0f172a;
    padding: 2.5mm 1mm;
    font-weight: 800;
  }

  .tt-sheet-table td {
    border: 1px solid #cbd5e1;
    padding: 2.5mm 1.5mm;
    vertical-align: middle;
  }

  .tt-cell-subject {
    font-weight: 800;
    color: #0f172a;
    font-size: 9pt;
    display: block;
  }

  .tt-cell-teacher {
    font-size: 7.5pt;
    color: #475569;
    display: block;
    margin-top: 1mm;
  }

  .tt-sheet-foot {
    display: flex;
    justify-content: space-between;
    margin-top: 5mm;
    border-top: 1.5px dashed #94a3b8;
    padding-top: 3mm;
    font-size: 8.5pt;
    color: #334155;
  }

  /* ========================================================================
     TEMPLATE 5: FINANCIAL STATEMENT & CLEARANCE VOUCHER
     ======================================================================== */
  .statement-sheet {
    border: 1.5px solid #0f172a;
    border-radius: 4px;
    padding: 3.5mm 5mm;
    background: #ffffff;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .statement-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #0f172a;
    padding-bottom: 2.5mm;
    margin-bottom: 3mm;
  }

  .statement-clearance-box {
    border: 1.5px dashed #16a34a;
    background: #f0fdf4;
    border-radius: 4px;
    padding: 2mm 4mm;
    margin: 2.5mm 0;
    text-align: center;
    color: #166534;
  }

  .statement-debt-box {
    border: 1.5px dashed #dc2626;
    background: #fef2f2;
    border-radius: 4px;
    padding: 2mm 4mm;
    margin: 2.5mm 0;
    text-align: center;
    color: #991b1b;
  }

  .statement-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8pt;
    margin-bottom: 2.5mm;
  }

  .statement-table th {
    background: #1e293b !important;
    color: #ffffff !important;
    padding: 1.2mm 2mm;
    font-weight: 700;
    font-size: 8pt;
    border: 1px solid #1e293b;
  }

  .statement-table td {
    padding: 1mm 1.5mm;
    border: 1px solid #cbd5e1;
    font-size: 7.8pt;
  }

/* ========================================================================
   TEMPLATE 6: OFFICIAL CLASS GRADES ROSTER SHEET (A4 PORTRAIT)
   ======================================================================== */
.grades-roster-sheet {
  width: 100%;
  max-width: 180mm;
  margin: 0 auto;
  box-sizing: border-box;
  background: #ffffff;
  padding: 0;
}

.grades-roster-table {
  width: 100%;
  max-width: 180mm;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 7.5pt;
  margin: 1.5mm 0;
  page-break-inside: auto;
  box-sizing: border-box;
}

.grades-roster-table thead {
  display: table-header-group;
}

.grades-roster-table th {
  background: #1e293b !important;
  color: #ffffff !important;
  padding: 1mm 1.5mm !important;
  font-weight: 700;
  font-size: 7.5pt;
  border: 1px solid #1e293b;
  text-align: center;
  line-height: 1.2;
}

.grades-roster-table tr {
  page-break-inside: avoid;
  break-inside: avoid;
}

.grades-roster-table td {
  padding: 0.8mm 1.2mm !important;
  border: 1px solid #cbd5e1;
  text-align: center;
  font-size: 7.5pt;
  line-height: 1.2;
}

.grades-roster-footer {
  page-break-inside: avoid;
  break-inside: avoid;
  margin-top: 1.5mm;
  width: 100%;
  box-sizing: border-box;
}

.grades-roster-signatures {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  text-align: center;
  font-size: 7.2pt;
  border-top: 1px dashed #94a3b8;
  padding-top: 2mm;
  margin-top: 2.5mm;
  width: 100%;
  box-sizing: border-box;
}

/* ========================================================================
   TEMPLATE 7: UNIVERSAL OFFICIAL A4 REPORT TEMPLATE (Registry, Fees, Admin)
   ======================================================================== */
.official-report-sheet {
  width: 100%;
  max-width: 180mm;
  margin: 0 auto;
  box-sizing: border-box;
  background: #ffffff;
  padding: 0;
}

.official-report-table {
  width: 100%;
  max-width: 180mm;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 7.5pt;
  margin: 1.5mm 0;
  box-sizing: border-box;
}

.official-report-table thead {
  display: table-header-group;
}

.official-report-table th {
  background: #1e293b !important;
  color: #ffffff !important;
  padding: 1.2mm 1.5mm !important;
  font-weight: 700;
  font-size: 7.5pt;
  border: 1px solid #1e293b;
  text-align: center;
  line-height: 1.2;
}

.official-report-table tr {
  page-break-inside: avoid;
  break-inside: avoid;
}

.official-report-table td {
  padding: 0.9mm 1.2mm !important;
  border: 1px solid #cbd5e1;
  text-align: center;
  font-size: 7.3pt;
  line-height: 1.2;
}

.official-report-footer {
  page-break-inside: avoid;
  break-inside: avoid;
  margin-top: 2mm;
  width: 100%;
  box-sizing: border-box;
}

.official-report-signatures {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  text-align: center;
  font-size: 7.2pt;
  border-top: 1px dashed #94a3b8;
  padding-top: 2.5mm;
  margin-top: 3mm;
  width: 100%;
  box-sizing: border-box;
}


