/* print.css - Print stylesheet for ASK Official Diagnostic Certificate & Report */
@page {
  size: A4 portrait;
  margin: 6mm 8mm 6mm 8mm;
}

@media print {
  *, *::before, *::after {
    box-shadow: none !important;
  }

  html,
  body,
  body.is-student-logged-in,
  body.sidebar-collapsed {
    background: #FFFFFF !important;
    color: #000000 !important;
    font-family: 'Outfit', 'Plus Jakarta Sans', -apple-system, sans-serif !important;
    font-size: 8.5pt !important;
    line-height: 1.3 !important;
    background-image: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    min-width: 100% !important;
    box-sizing: border-box !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Sembunyikan SEMUA elemen navigasi web, sidebar, tombol '= Menu', header web, dan floating action bar */
  #btnFloatingMobileSidebar,
  .student-mobile-fab-toggle,
  .sidebar-toggle-btn,
  #btnToggleSidebar,
  #btnHeaderSidebarToggle,
  .ask-student-sidebar,
  #studentSidebar,
  aside,
  .sidebar-mobile-backdrop,
  #sidebarMobileBackdrop,
  .app-header,
  header.app-header,
  header,
  .ask-headbar-nav,
  #headbarQuickNav,
  .header-status,
  #headerStatusGroup,
  .report-stepper-header,
  .report-scope-nav-bar,
  .report-screen-action-bar,
  .mobile-bottom-bar,
  .modal-overlay,
  .modal-backdrop,
  .btn,
  .demo-box,
  .no-print,
  #reportEmptyState,
  #reportTierBanner,
  #reportPartialBanner,
  #screenWelcome,
  #screenTest,
  #screenDashboard,
  #screenStudentDashboard,
  #screenProbeSelector,
  #screenWorksheet,
  .probe-screen,
  .dashboard-screen,
  .worksheet-screen {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    overflow: hidden !important;
  }

  .main-content,
  #mainContent,
  .app-layout,
  .container,
  #screenReport,
  .report-screen,
  .report-container {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Halaman Dokumen Rapor: Bersih, Margin Atas Dimulai Tepat pada Kop Surat */
  .report-page-single {
    page-break-after: auto !important;
    break-after: auto !important;
    page-break-inside: auto !important;
    break-inside: auto !important;
    min-height: auto !important;
    max-height: none !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    display: block !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  .report-header-compact {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }

  /* Halaman Cetak Presisi 4 Halaman A4: Fit sempurna tanpa terpotong */
  .report-page {
    page-break-after: always !important;
    break-after: page !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    min-height: auto !important;
    max-height: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 2mm 0 3mm 0 !important;
    border: none !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  .report-page:last-child,
  #repPage4,
  #repSinglePage {
    page-break-after: avoid !important;
    break-after: avoid !important;
  }

  /* Kop Surat Resmi Lembaga */
  .kop-surat-header {
    display: flex !important;
    align-items: center !important;
    gap: 12pt !important;
    margin-bottom: 5pt !important;
  }

  .kop-logo-img {
    height: 38pt !important;
    max-height: 40pt !important;
    width: auto !important;
  }

  .kop-instansi-name {
    font-size: 13pt !important;
    font-weight: 900 !important;
    color: #000000 !important;
  }

  .kop-instansi-sub {
    font-size: 8.5pt !important;
    font-weight: 800 !important;
    color: #000000 !important;
  }

  .kop-instansi-address {
    font-size: 7.5pt !important;
    color: #333333 !important;
  }

  .kop-line-double {
    height: 3pt !important;
    border-top: 1.5pt solid #000000 !important;
    border-bottom: 0.75pt solid #000000 !important;
    margin-bottom: 8pt !important;
  }

  /* Certificate Block */
  .cert-title-block {
    text-align: center !important;
    margin-bottom: 6pt !important;
  }

  .cert-main-title {
    font-size: 12pt !important;
    font-weight: 900 !important;
    color: #000000 !important;
  }

  .cert-sub-title {
    font-size: 9pt !important;
    font-weight: 700 !important;
    color: #000000 !important;
  }

  .cert-doc-number {
    font-size: 8pt !important;
    font-weight: 700 !important;
    color: #000000 !important;
  }

  .cert-statement-box {
    background: #F4F4F4 !important;
    border: 1pt solid #000000 !important;
    padding: 5pt 8pt !important;
    font-size: 8pt !important;
    color: #000000 !important;
    margin-bottom: 8pt !important;
    text-align: justify !important;
    line-height: 1.25 !important;
  }

  .report-meta-table-wrap {
    border: 1pt solid #000000 !important;
    background: #FFFFFF !important;
    padding: 4pt 6pt !important;
    margin-bottom: 8pt !important;
  }

  .meta-table-clean {
    font-size: 8pt !important;
  }

  .meta-table-clean td {
    padding: 2pt 4pt !important;
    border-bottom: 0.5pt solid #CCCCCC !important;
  }

  .score-overview-grid {
    display: flex !important;
    gap: 8pt !important;
    margin-bottom: 8pt !important;
  }

  .score-card {
    flex: 1 !important;
    border: 1pt solid #000000 !important;
    padding: 6pt !important;
    box-shadow: none !important;
    background: #FFFFFF !important;
  }

  .score-card.main-score {
    background: #FFFF00 !important;
    border: 1.5pt solid #000000 !important;
  }

  .score-num {
    font-size: 18pt !important;
    color: #000000 !important;
  }

  .charts-section {
    display: flex !important;
    gap: 8pt !important;
    page-break-inside: avoid !important;
    margin-bottom: 6pt !important;
  }

  .chart-box {
    flex: 1 !important;
    border: 1pt solid #000000 !important;
    padding: 5pt !important;
    background: #FFFFFF !important;
  }

  .radar-svg {
    max-width: 125px !important;
    max-height: 125px !important;
    margin: 0 auto !important;
    display: block !important;
  }

  /* Single-page PDF Header: Skor Indeks, Status Mastery & Peta Radar Sejajar */
  .score-summary-band {
    display: grid !important;
    grid-template-columns: 140pt 1fr 130pt !important;
    gap: 6pt !important;
    border: 1pt solid #000000 !important;
    padding: 4pt 6pt !important;
    margin-bottom: 4pt !important;
    align-items: center !important;
  }

  .header-radar-box {
    border-left: 0.5pt solid #888888 !important;
    padding-left: 4pt !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .header-radar-title {
    font-size: 7pt !important;
    font-weight: 800 !important;
    margin-bottom: 2pt !important;
  }

  .radar-wrapper-header svg {
    max-width: 95pt !important;
    max-height: 80pt !important;
    margin: 0 auto !important;
    display: block !important;
  }

  .radar-legend-header {
    font-size: 6pt !important;
    display: flex !important;
    gap: 6pt !important;
    justify-content: center !important;
  }

  /* Single-page PDF Part B: Matriks Kompetensi Lengkap (Full Width 100%, 2 Kolom Seimbang) */
  .section-part-b {
    display: block !important;
    width: 100% !important;
    margin-bottom: 4pt !important;
  }

  .matrix-full-card {
    border: 1pt solid #000000 !important;
    padding: 4pt 6pt !important;
    background: #FFFFFF !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .competency-matrix-2col {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6pt !important;
    width: 100% !important;
  }

  .matrix-domain-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 2pt !important;
  }

  .matrix-domain-header {
    font-size: 7pt !important;
    font-weight: 900 !important;
    padding: 2pt 4pt !important;
    border-bottom: 1pt solid #000000 !important;
    margin-bottom: 2pt !important;
  }

  .matrix-domain-header.header-num {
    border-left: 2pt solid #2563EB !important;
  }

  .matrix-domain-header.header-lit {
    border-left: 2pt solid #059669 !important;
  }

  .matrix-cards-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 2pt !important;
  }

  .comp-matrix-card {
    border: 0.5pt solid #888888 !important;
    padding: 2.5pt 4pt !important;
    font-size: 6.5pt !important;
    background: #FFFFFF !important;
  }

  .comp-matrix-card.is-mastered {
    border-left: 2.5pt solid #16A34A !important;
  }

  .comp-matrix-card.is-focus {
    border-left: 2.5pt solid #EA580C !important;
    background: #FFFBF5 !important;
  }

  .comp-card-title {
    font-size: 7pt !important;
    font-weight: 800 !important;
  }

  .badge-chip {
    font-size: 6pt !important;
    padding: 1pt 3pt !important;
  }

  .badge-chip-mastered {
    border: 0.5pt solid #16A34A !important;
    color: #16A34A !important;
    background: #DCFCE7 !important;
  }

  .badge-chip-focus {
    border: 0.5pt solid #EA580C !important;
    color: #EA580C !important;
    background: #FFEDD5 !important;
  }

  .comp-weakness-item {
    font-size: 6pt !important;
    line-height: 1.15 !important;
    color: #9A3412 !important;
  }

  /* ==========================================================================
     Single-page PDF Part C: Panduan Aktivitas Pendampingan Materi (Semua Materi Fokus Latihan)
     Mendukung kelanjutan rapi ke Halaman 2 jika daftar aktivitas panjang
     ========================================================================== */
  .section-part-c {
    display: block !important;
    width: 100% !important;
    margin-top: 5pt !important;
    page-break-inside: auto !important;
    break-inside: auto !important;
  }

  .action-plan-header {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    margin-bottom: 3pt !important;
  }

  .action-plan-title {
    font-size: 7.5pt !important;
    font-weight: 900 !important;
  }

  .action-plan-subtitle {
    font-size: 6pt !important;
  }

  .action-checklist-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4.5pt !important;
    width: 100% !important;
    page-break-inside: auto !important;
    break-inside: auto !important;
  }

  .focus-activity-card {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    border: 0.75pt solid #CBD5E1 !important;
    border-radius: 4pt !important;
    padding: 3.5pt 5pt !important;
    background: #FFFFFF !important;
    font-size: 6.5pt !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1.5pt !important;
    box-sizing: border-box !important;
  }

  .focus-activity-card.domain-num {
    border-left: 2.5pt solid #2563EB !important;
  }

  .focus-activity-card.domain-lit {
    border-left: 2.5pt solid #059669 !important;
  }

  .focus-card-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  .focus-badge {
    font-size: 5.5pt !important;
    font-weight: 900 !important;
    padding: 0.5pt 3pt !important;
    border-radius: 2pt !important;
  }

  .focus-accuracy-pill {
    font-size: 5.5pt !important;
    font-weight: 800 !important;
    color: #C2410C !important;
    background: #FFEDD5 !important;
    border: 0.5pt solid #FDBA74 !important;
    padding: 0.5pt 3pt !important;
    border-radius: 999pt !important;
  }

  .checklist-name {
    font-size: 7pt !important;
    font-weight: 800 !important;
    color: #000000 !important;
  }

  .focus-props-tag {
    font-size: 6pt !important;
    background: #F1F5F9 !important;
    padding: 1.5pt 3pt !important;
    border-radius: 2pt !important;
    line-height: 1.2 !important;
  }

  .checklist-desc {
    font-size: 6.5pt !important;
    color: #222222 !important;
    line-height: 1.25 !important;
  }

  /* Banner Hardsell Elegan pada Dokumen PDF (Prompt 3) */
  .ask-hardsell-banner {
    margin: 5pt 0 !important;
    background: #F0F9FF !important;
    border: 1pt solid #93C5FD !important;
    border-left: 3.5pt solid #2563EB !important;
    border-radius: 4pt !important;
    padding: 4.5pt 8pt !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    display: flex !important;
    align-items: center !important;
    gap: 6pt !important;
  }

  .hardsell-icon {
    font-size: 13pt !important;
  }

  .hardsell-title {
    font-size: 7pt !important;
    font-weight: 800 !important;
    color: #1E3A8A !important;
    line-height: 1.25 !important;
  }

  .hardsell-subtitle {
    font-size: 5.8pt !important;
    font-weight: 600 !important;
    color: #475569 !important;
  }

  .signatures-compact-row {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    margin-top: 5pt !important;
    padding-top: 4pt !important;
    border-top: 1pt solid #000000 !important;
  }

  /* Sembunyikan tabel legacy di halaman 3 saat cetak agar tabel 4-level mastery pas 1 lembar A4 */
  .report-page-3 .matrix-table,
  .report-page-3 .table-responsive:has(.matrix-table) {
    display: none !important;
  }

  /* ==========================================================================
     PETA STATUS PENGUASAAN KOGNITIF (4 STATUS MASTERY x L1-L4) PRINT RULES
     Guarantees that the entire table fits A4 width and the STATUS column is never cut off
     ========================================================================== */
  .table-responsive,
  .mastery-table-responsive {
    overflow: visible !important;
    overflow-x: visible !important;
    width: 100% !important;
    margin-bottom: 8pt !important;
  }

  .report-page-3 .mastery-matrix-table,
  .mastery-matrix-table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    font-size: 7.5pt !important;
    border: 1pt solid #000000 !important;
    margin-bottom: 0 !important;
    box-shadow: none !important;
  }

  .mastery-matrix-table tr {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }

  .mastery-matrix-table th {
    background: #000000 !important;
    color: #FFFFFF !important;
    padding: 3pt 2pt !important;
    font-size: 7pt !important;
    font-weight: 800 !important;
    text-align: center !important;
    border: 0.75pt solid #000000 !important;
    letter-spacing: 0 !important;
  }

  .mastery-matrix-table td {
    padding: 2.5pt 3pt !important;
    font-size: 7.5pt !important;
    border: 0.75pt solid #333333 !important;
    vertical-align: middle !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    line-height: 1.15 !important;
  }

  /* Fixed proportional widths totaling exactly 100% */
  .mastery-matrix-table th.th-no { width: 4.5% !important; }
  .mastery-matrix-table th.th-materi { width: 29.5% !important; text-align: left !important; }
  .mastery-matrix-table th.th-domain { width: 11% !important; }
  .mastery-matrix-table th.th-l1 { width: 11% !important; }
  .mastery-matrix-table th.th-l2 { width: 11% !important; }
  .mastery-matrix-table th.th-l3 { width: 11% !important; }
  .mastery-matrix-table th.th-l4 { width: 11% !important; }
  .mastery-matrix-table th.th-status { width: 11% !important; }

  .mastery-matrix-table td div {
    font-size: 7.5pt !important;
    line-height: 1.15 !important;
  }

  .mastery-matrix-table .legend-badge,
  .mastery-matrix-table .tag-badge {
    box-sizing: border-box !important;
    padding: 1.5pt 2.5pt !important;
    font-size: 6pt !important;
    font-weight: 800 !important;
    border-radius: 3px !important;
    display: inline-block !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1 !important;
    border: 0.5pt solid #000000 !important;
  }

  .mastery-legend-row {
    margin-bottom: 6pt !important;
    gap: 6pt !important;
  }

  .mastery-legend-row .legend-badge {
    padding: 2pt 5pt !important;
    font-size: 7pt !important;
  }

  .matrix-table {
    font-size: 8pt !important;
    page-break-inside: auto;
    border: 1.5pt solid #000000 !important;
  }

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

  .matrix-table th {
    background-color: #000000 !important;
    color: #FFFFFF !important;
    padding: 4pt 6pt !important;
    border: 1pt solid #000000 !important;
  }

  .matrix-table td {
    padding: 3.5pt 5pt !important;
    border: 1pt solid #000000 !important;
  }

  .status-tag {
    border: 1pt solid #000000 !important;
  }

  .status-mastered {
    background: #FFFF00 !important;
    color: #000000 !important;
  }

  /* Preskripsi & Intervensi (Halaman 2 Print) */
  .intervention-detail-block {
    border: 1pt solid #000000 !important;
    padding: 5pt 7pt !important;
    margin-bottom: 5pt !important;
    page-break-inside: avoid !important;
    background: #FFFFFF !important;
  }

  .intervention-block-header {
    margin-bottom: 4pt !important;
  }

  .diagnostic-pillars-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4pt !important;
    margin-bottom: 4pt !important;
  }

  .pillar-box {
    border: 0.75pt solid #555555 !important;
    padding: 3pt 5pt !important;
    font-size: 7.5pt !important;
    line-height: 1.2 !important;
  }

  .pillar-title {
    font-size: 7pt !important;
    font-weight: 800 !important;
    margin-bottom: 2pt !important;
  }

  .pillar-content {
    font-size: 7.5pt !important;
    line-height: 1.2 !important;
  }

  .stage-step-row {
    font-size: 7.5pt !important;
    margin-bottom: 2pt !important;
    line-height: 1.2 !important;
    display: flex !important;
    gap: 4pt !important;
  }

  .stage-step-num {
    font-weight: 800 !important;
    font-size: 7pt !important;
  }

  .prescription-card {
    page-break-inside: avoid;
    border: 1.5pt solid #000000 !important;
    padding: 6pt 8pt !important;
    margin-top: 8pt !important;
  }

  .prescription-item {
    border-left: 2pt solid #000000 !important;
    background: #F4F4F4 !important;
    padding: 4pt 6pt !important;
    margin-bottom: 4pt !important;
  }

  /* Ruang Tanda Tangan & Footer Halaman 4 */
  .signature-area {
    display: flex !important;
    justify-content: space-between !important;
    margin-top: 8pt !important;
    page-break-inside: avoid !important;
    border-top: 1pt solid #000000 !important;
    padding-top: 6pt !important;
  }

  .sig-block {
    text-align: center !important;
    width: 150pt !important;
    position: relative !important;
  }

  .sig-role {
    margin-bottom: 28pt !important;
    font-size: 8pt !important;
  }

  .sig-stamp-placeholder {
    position: absolute !important;
    top: 14pt !important;
    left: 50% !important;
    transform: translateX(-50%) rotate(-6deg) !important;
    width: 80pt !important;
    height: 30pt !important;
    border: 1pt dashed #000000 !important;
    background: rgba(255, 255, 0, 0.25) !important;
  }

  .stamp-text {
    font-size: 6pt !important;
    font-weight: 900 !important;
    color: #000000 !important;
  }

  .sig-line {
    border-top: 1pt solid #000000 !important;
  }

  .consultant-notes-box {
    border: 1pt solid #000000 !important;
    padding: 4pt 6pt !important;
    margin-bottom: 6pt !important;
    font-size: 7.5pt !important;
  }

  .roadmap-timeline-grid {
    gap: 4pt !important;
    margin-bottom: 6pt !important;
  }

  .roadmap-card {
    padding: 4pt 6pt !important;
    font-size: 7.5pt !important;
    border: 1pt solid #000000 !important;
  }

  .page-footer-print {
    margin-top: auto !important;
    padding-top: 3pt !important;
    border-top: 0.5pt solid #000000 !important;
    font-size: 6.5pt !important;
    display: flex !important;
    justify-content: space-between !important;
  }

  /* Log Audit Pasca-Intervensi Resmi (Page 4 Print) */
  .mastery-audit-card {
    page-break-inside: avoid !important;
    border: 1.5pt solid #000000 !important;
    padding: 6pt 8pt !important;
    margin-top: 8pt !important;
    margin-bottom: 8pt !important;
    background: #FFFFFF !important;
  }

  .mastery-audit-table th {
    background: #000000 !important;
    color: #FFFFFF !important;
    padding: 3pt 5pt !important;
    font-size: 7.5pt !important;
    border: 1pt solid #000000 !important;
  }

  .mastery-audit-table td {
    padding: 3pt 5pt !important;
    font-size: 7.5pt !important;
    border: 1pt solid #000000 !important;
  }

  /* Worksheet Print Layout & Separation */
  body.print-mode-worksheet #screenReport,
  body.print-mode-worksheet #screenDashboard,
  body.print-mode-worksheet #screenWelcome,
  body.print-mode-worksheet #screenTest {
    display: none !important;
  }

  body.print-mode-worksheet #screenWorksheet {
    display: block !important;
  }

  body:not(.print-mode-worksheet) #screenWorksheet {
    display: none !important;
  }

  .ws-page {
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    page-break-after: always !important;
    break-after: page !important;
  }

  .ws-answer-key-page {
    page-break-before: always !important;
    break-before: page !important;
    page-break-after: avoid !important;
    break-after: avoid !important;
  }

  .ws-question-item {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    margin-bottom: 8pt !important;
    padding: 6pt 8pt !important;
  }

  .ws-booster-card {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }

  .ws-working-space {
    min-height: 25mm !important;
    border: 1pt dashed #666666 !important;
  }
}