/* ── export-cover-dokumen/document.css ── */
/* Combined document styles: Cover + Pengesahan + CP + TP */

/* ── RESET & BASE ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Times New Roman', Times, serif;
  font-size: 12pt;
  background: #e0e0e0;
  color: #000;
}

/* ── PAGE WRAPPER (simulasi kertas F4/Legal 215x330) ── */
.page {
  width: 215mm;
  min-height: 330mm;
  margin: 20px auto;
  background: #fff;
  padding: 20mm 20mm 20mm 25mm;
  box-shadow: 0 2px 12px rgba(0,0,0,0.18);
}

/* ── PAGE BREAK ── */
.page-break {
  page-break-before: always;
}

/* ============================================================
   COVER PAGE — Varian Geometric Modern
   ============================================================ */
.cover-page {
  position: relative;
  width: 215mm;
  min-height: 330mm;
  margin: 20px auto;
  background: #ffffff;
  box-shadow: 0 2px 12px rgba(0,0,0,0.18);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  page-break-after: always;
  --accent: #1a4fa0;
  --accent-light: #eef3fb;
  --accent-gold: #c47f17;
}

.cover-page::before {
  content: '';
  position: absolute;
  inset: 0;
  border: 0.4mm solid var(--accent);
  opacity: 0.3;
  pointer-events: none;
  z-index: 0;
}

.cover-page::after {
  content: '';
  position: absolute;
  inset: 3mm;
  border: 0.4mm solid var(--accent);
  opacity: 0.15;
  pointer-events: none;
  z-index: 0;
}

.cover-geo-tr {
  position: absolute;
  top: 0;
  right: 0;
  width: 90mm;
  height: 90mm;
  pointer-events: none;
  z-index: 0;
}

.cover-geo-bl {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 65mm;
  height: 65mm;
  pointer-events: none;
  z-index: 0;
}

.cover-header {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16mm 20mm 0 20mm;
  gap: 5mm;
}

.cover-logo-wrap {
  width: 28mm;
  height: 28mm;
  border-radius: 50%;
  border: 0.8mm solid var(--accent);
  background: var(--accent-light);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.cover-logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cover-logo-placeholder {
  width: 100%;
  height: 100%;
  background: var(--accent-light);
}

.cover-instansi {
  text-align: center;
}

.cover-provinsi {
  font-size: 8pt;
  color: #555;
  letter-spacing: 0.04em;
  margin-bottom: 1mm;
}

.cover-dinas {
  font-size: 9pt;
  font-weight: 600;
  color: #333;
  margin-bottom: 1.5mm;
}

.cover-sekolah {
  font-size: 14pt;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 1.5mm;
  line-height: 1.25;
}

.cover-alamat {
  font-size: 8pt;
  color: #777;
  font-style: italic;
}

.cover-header-rule {
  width: 18mm;
  height: 1mm;
  background: var(--accent);
  border-radius: 0.5mm;
  margin-top: 3mm;
}

.cover-body {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 20mm;
  text-align: center;
  gap: 3mm;
}

.cover-judul-tag {
  font-size: 8pt;
  color: var(--accent);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 500;
}

.cover-judul {
  font-size: 20pt;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1.3;
  text-transform: uppercase;
}

.cover-tahun {
  font-size: 9pt;
  color: #888;
  margin-top: 1mm;
}

.cover-footer {
  position: relative;
  z-index: 1;
  background: var(--accent);
  padding: 6mm 20mm;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cover-footer-inner {
  display: flex;
  flex-direction: column;
  gap: 0.8mm;
}

.cover-penyusun-label {
  font-size: 7pt;
  color: rgba(255, 255, 255, 0.65);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.cover-nama-guru {
  font-size: 11pt;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.3;
}

.cover-nip {
  font-size: 8pt;
  color: rgba(255, 255, 255, 0.75);
}

.cover-footer-badge {
  font-size: 7pt;
  font-weight: 600;
  color: var(--accent);
  background: #ffffff;
  padding: 2mm 5mm;
  border-radius: 1mm;
  white-space: nowrap;
  letter-spacing: 0.03em;
}

/* ══════════════════════════════════════════════
   LEMBAR PENGESAHAN
   ══════════════════════════════════════════════ */
.pengesahan-page {
  width: 215mm;
  min-height: 330mm;
  margin: 20px auto;
  background: #fff;
  padding: 20mm 20mm 20mm 25mm;
  box-shadow: 0 2px 12px rgba(0,0,0,0.18);
  page-break-after: always;
}

.pengesahan-judul {
  text-align: center;
  font-size: 16pt;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 24px;
}

.pengesahan-intro {
  font-size: 12pt;
  line-height: 1.8;
  text-align: justify;
  margin-bottom: 20px;
}

.pengesahan-tabel {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 24px;
  font-size: 12pt;
}

.pengesahan-tabel td {
  padding: 6px 10px;
  border: none;
  vertical-align: top;
  line-height: 1.6;
}

.pengesahan-tabel td:first-child {
  font-weight: bold;
  white-space: nowrap;
  width: 35%;
}

.pengesahan-tabel td:nth-child(2) {
  width: 5%;
  text-align: center;
}

.pengesahan-konfirmasi {
  font-size: 12pt;
  line-height: 1.8;
  text-align: justify;
  margin: 20px 0 32px 0;
}

.pengesahan-ttd-area {
  display: flex;
  justify-content: flex-end;
  margin-top: 32px;
}

.pengesahan-ttd {
  text-align: center;
  min-width: 240px;
  font-size: 12pt;
}

.pengesahan-ttd .ttd-kota-tanggal {
  margin-bottom: 4px;
}

.pengesahan-ttd .ttd-jabatan {
  font-weight: bold;
  margin-bottom: 64px;
}

.pengesahan-ttd .ttd-nama {
  font-weight: bold;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pengesahan-ttd .ttd-nip {
  font-size: 11pt;
  color: #333;
  margin-top: 3px;
}

/* ══════════════════════════════════════════════
   HEADER DOKUMEN (KOP SURAT) — SHARED CP + TP
   ══════════════════════════════════════════════ */
.doc-header {
  display: grid;
  grid-template-columns: 60px 1fr 60px;
  align-items: center;
  gap: 10px;
  border-bottom: 3px solid #000;
  padding: 8px 0;
  margin-bottom: 16px;
}

.logo-box {
  width: 56px;
  height: 56px;
  border: 1.5px dashed #555;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 7pt;
  color: #555;
  text-align: center;
  line-height: 1.3;
}

.logo-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.logo-box.has-logo {
  border: none;
}

.doc-title-center {
  text-align: center;
  line-height: 1.25;
}

.kop-pemda {
  font-size: 8pt;
  font-weight: normal;
  letter-spacing: 0.04em;
  margin-bottom: 1px;
}

.kop-dinas {
  font-size: 9pt;
  font-weight: bold;
  letter-spacing: 0.03em;
  margin-bottom: 1px;
}

.kop-sekolah {
  font-size: 12pt;
  font-weight: bold;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}

.kop-alamat {
  font-size: 7.5pt;
  font-weight: normal;
  font-style: italic;
  letter-spacing: 0.01em;
}

/* ── JUDUL AREA ── */
.doc-judul-area {
  text-align: center;
  margin-bottom: 12px;
}

.doc-judul-area .judul-utama {
  font-size: 14pt;
  font-weight: bold;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin: 4px 0 2px 0;
}

.doc-judul-area .subjudul {
  font-size: 10pt;
  color: #444;
}

/* ── IDENTITAS DOKUMEN ── */
.identitas {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 14px;
  font-size: 11pt;
}

.identitas td {
  padding: 4px 8px;
  border: 1px solid #000;
  vertical-align: middle;
}

.identitas td:first-child {
  font-weight: bold;
  white-space: nowrap;
  width: 38%;
}

/* ── SECTION TITLE ── */
.page .section-title {
  font-size: 11pt;
  font-weight: bold;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-left: 4px solid #000;
  padding: 3px 8px;
  margin: 14px 0 8px 0;
  background: #f5f5f5;
}

/* ══════════════════════════════════════════════
   TABEL STYLES — CP
   ══════════════════════════════════════════════ */
table.main {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 10.5pt;
  margin-bottom: 14px;
}

table.main th {
  background: #1a365d;
  color: #fff;
  padding: 6px 8px;
  text-align: center;
  font-size: 10pt;
  font-weight: bold;
  border: 1px solid #000;
  vertical-align: middle;
}

table.main td {
  padding: 6px 8px;
  border: 1px solid #000;
  vertical-align: middle;
  line-height: 1.5;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

table.main tr:nth-child(even) td { background: #fafafa; }
table.main td.no { text-align: center; width: 28px; font-weight: bold; }
table.main td.elemen { font-weight: bold; width: 14%; font-size: 9pt; }
table.main td.kko { width: 28%; }
table.main td.keterangan { width: 42%; }

/* TABEL FASE (CP) */
table.fase {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 10pt;
  margin-bottom: 14px;
}

table.fase th {
  background: #2c5aa0;
  color: #fff;
  padding: 5px 8px;
  text-align: center;
  border: 1px solid #000;
}

table.fase td {
  padding: 5px 8px;
  border: 1px solid #000;
  vertical-align: top;
  line-height: 1.5;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

table.fase td.fase-label {
  font-weight: bold;
  text-align: center;
  background: #eee;
  width: 10%;
}

/* TABEL PPP (CP) */
table.ppp {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 10pt;
  margin-bottom: 14px;
}

table.ppp th {
  background: #2c5aa0;
  color: #fff;
  padding: 5px 8px;
  border: 1px solid #000;
  text-align: center;
}

table.ppp td {
  padding: 5px 8px;
  border: 1px solid #000;
  vertical-align: middle;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

table.ppp td.centang { text-align: center; font-size: 13pt; }

/* ══════════════════════════════════════════════
   TABEL STYLES — TP
   ══════════════════════════════════════════════ */
table.main td.kode {
  text-align: center;
  font-weight: bold;
  font-family: 'Courier New', monospace;
  font-size: 7.5pt;
  width: 80px;
  word-break: break-all;
  line-height: 1.4;
}

table.main td.center { text-align: center; }

.badge {
  font-size: 10pt;
  font-weight: normal;
}

.kode-box {
  border: 1px solid #000;
  padding: 8px 12px;
  font-size: 9.5pt;
  margin-bottom: 14px;
  background: #fafafa;
}

.kode-box strong { display: block; margin-bottom: 4px; }

.kode-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px 16px;
}

/* ── CATATAN ── */
.catatan-box {
  border: 1px solid #000;
  padding: 8px 10px;
  font-size: 10pt;
  margin-bottom: 14px;
}

.catatan-box .catatan-label {
  font-weight: bold;
  margin-bottom: 4px;
}

/* ── TANDA TANGAN ── */
.ttd-area {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 24px;
  page-break-inside: avoid;
}

.ttd-wrapper {
  margin-top: 20px;
  page-break-inside: avoid;
}

.ttd-box {
  text-align: center;
  font-size: 10pt;
  padding: 8px 12px;
}

.ttd-box .ttd-jabatan {
  font-weight: bold;
  color: #1a365d;
  font-size: 9.5pt;
  margin-bottom: 4px;
}

.ttd-box .ttd-tanggal {
  font-size: 9.5pt;
  margin-bottom: 44px;
}

.ttd-box .ttd-nama {
  font-weight: bold;
  font-size: 10pt;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ttd-box .ttd-nip {
  font-size: 9pt;
  color: #333;
  margin-top: 3px;
}

.ttd-area.ttd-hidden {
  display: none;
}

/* ── FOOTER ── */
.doc-footer {
  border-top: 2px solid #000;
  margin-top: 16px;
  padding-top: 5px;
  display: flex;
  justify-content: space-between;
  font-size: 8.5pt;
  color: #333;
}

.nomor-dok {
  font-size: 8.5pt;
  color: #444;
  text-align: right;
  margin-bottom: 4px;
}

/* ══════════════════════════════════════════════
   TP — Tujuan Pembelajaran (Section C merged column)
   ══════════════════════════════════════════════ */

/* Kode TP identifier (bold, blue) */
.tp-kode {
  font-weight: bold;
  font-size: 10pt;
  color: #1a365d;
  margin-bottom: 4px;
}

/* Rumusan TP (main text) */
.tp-rumusan {
  font-size: 10pt;
  line-height: 1.5;
  margin-bottom: 6px;
}

/* Kompetensi sub-detail (italic, smaller) */
.tp-competency {
  font-size: 8.5pt;
  font-style: italic;
  color: #444;
  border-top: 1px solid #e0e0e0;
  padding-top: 4px;
  margin-top: 2px;
}

/* Alokasi JP (small, muted) */
.tp-alokasi {
  font-size: 8pt;
  color: #666;
  margin-top: 3px;
}

/* ══════════════════════════════════════════════
   ATP — Alur Tujuan Pembelajaran
   ══════════════════════════════════════════════ */

/* 4-column identitas (ATP — label-value-label-value grid) */
.identitas-4col .lbl {
  font-weight: bold;
  white-space: nowrap;
}

.identitas-4col td:not(.lbl) {
  white-space: nowrap;
}

/* Alur diagram */
.alur-diagram {
  border: 1px solid #1a365d;
  padding: 12px 16px;
  margin-bottom: 14px;
  border-radius: 4px;
}

.alur-diagram .alur-label {
  font-weight: bold;
  margin-bottom: 8px;
  font-size: 10pt;
  color: #1a365d;
}

.alur-flow {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
}

.alur-node {
  border: 1px solid #1a365d;
  padding: 4px 8px;
  font-size: 8.5pt;
  border-radius: 4px;
  background: #fff;
  text-align: center;
  max-width: 180px;
}

.alur-node.aktif {
  background: #000;
  color: #fff;
}

.alur-arrow {
  font-size: 12pt;
  font-weight: bold;
  padding: 0 2px;
  color: #1a365d;
}

/* Elemen header row in ATP table */
table.main td.elemen-header {
  background: #2c5aa0 !important;
  color: #ffffff !important;
  font-weight: bold;
  text-align: left;
  padding: 6px 10px;
  font-size: 10pt;
  border: 1px solid #1a365d;
}

/* Vertical middle align for table cells */
table.main td.v-middle {
  vertical-align: middle;
}

/* Sub-detail: Elemen CP under Kode TP (italic, small) */
table.main .sub-detail-elemen {
  font-size: 7.5pt;
  font-style: italic;
  color: #555;
  margin-top: 3px;
  line-height: 1.3;
  font-weight: normal;
}

/* Sub-detail row: Dimensi Profil Lulusan below each TP */
table.main tr.sub-detail-row td {
  font-size: 8pt;
  font-style: italic;
  color: #444;
  padding: 2px 10px 6px 38px;
  border-top: none;
  background: #f9f9f9;
  line-height: 1.4;
}

table.main .sub-detail-label {
  font-weight: bold;
  font-style: normal;
  color: #333;
  font-size: 7.5pt;
}

/* Rekapitulasi table (ATP) */
table.rekap {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  margin-bottom: 14px;
}

table.rekap th {
  background: #1a365d !important;
  color: #fff !important;
  padding: 5px 8px;
  font-size: 9.5pt;
  text-align: center;
  border: 1px solid #1a365d;
}

table.rekap td {
  padding: 5px 8px;
  border: 1px solid #1a365d;
  vertical-align: middle;
  font-size: 9.5pt;
}

table.rekap td.center {
  text-align: center;
}

table.rekap tr.total,
table.rekap tr.total td {
  font-weight: bold;
  background: #1a365d !important;
  color: #fff !important;
  border-color: #1a365d;
}

/* ══════════════════════════════════════════════
   PROTA — Program Tahunan
   ══════════════════════════════════════════════ */

/* Distribusi Minggu Efektif table */
table.minggu {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 9pt;
  margin-bottom: 6px;
}

table.minggu th {
  background: #2c5aa0;
  color: #fff;
  padding: 5px 7px;
  border: 1px solid #1a365d;
  text-align: center;
}

table.minggu td {
  padding: 4px 7px;
  border: 1px solid #1a365d;
  line-height: 1.4;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

table.minggu td.center { text-align: center; }
table.minggu tr.sem-row td { background: #eee; font-weight: bold; font-size: 9.5pt; }
table.minggu tr.subtotal-row td { background: #ccc; font-weight: bold; text-align: center; }
table.minggu tr.total-row td { background: #1a365d; color: #fff; font-weight: bold; text-align: center; }

/* Catatan umum */
.catatan {
  font-size: 8.5pt;
  color: #333;
  margin-bottom: 14px;
  padding: 6px 10px;
  border-left: 3px solid #555;
  line-height: 1.7;
  background: #fafafa;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

/* Program Tahunan table headers */
table.main td.sem-header {
  background: #1a365d !important;
  color: #fff !important;
  font-weight: bold;
  font-size: 10.5pt;
  text-align: left;
  padding: 6px 10px;
  letter-spacing: 0.04em;
}

table.main td.sub-header {
  background: #2c5aa0 !important;
  color: #fff !important;
  font-weight: bold;
  font-size: 9.5pt;
  padding: 4px 8px;
  font-style: italic;
}

table.main tr.subtotal td {
  background: #e6f2ff;
  font-weight: bold;
  color: #1a365d;
}

table.main tr.subtotal td.label { text-align: right; }

table.main tr.grandtotal td {
  background: #1a365d !important;
  color: #fff !important;
  font-weight: bold;
}

table.main tr.grandtotal td.label { text-align: right; }

/* ══════════════════════════════════════════════
   PROSEM — Program Semester
   ══════════════════════════════════════════════ */

/* Tabel Prosem Utama — Portrait F4 terkompresi */
table.prosem {
  width: 100%;
  border-collapse: collapse;
  font-size: 6.5pt;
  margin-bottom: 10px;
}
table.prosem th {
  background: #1a365d;
  color: #fff;
  padding: 2px 1px;
  text-align: center;
  border: 1px solid #000;
  vertical-align: middle;
  line-height: 1.3;
  font-size: 6pt;
}
table.prosem th.bulan {
  background: #2c5aa0;
}
table.prosem td {
  padding: 2px 1px;
  border: 1px solid #000;
  vertical-align: middle;
  line-height: 1.4;
}
table.prosem td.no { text-align: center; font-weight: bold; width: 14px; }
table.prosem td.kode {
  font-family: 'Courier New', monospace;
  font-size: 6pt;
  font-weight: bold;
  text-align: center;
  white-space: nowrap;
}
table.prosem td.jp { text-align: center; font-weight: bold; }
table.prosem td.ket { font-size: 6pt; }

/* Minggu cell types */
table.prosem td.minggu-aktif {
  background: #4a90e2;
  color: #fff;
  text-align: center;
  font-weight: bold;
  font-size: 6pt;
}
table.prosem td.minggu-kosong {
  background: #fff;
  text-align: center;
}
table.prosem td.minggu-libur {
  background: #e6f2ff;
  text-align: center;
  font-size: 5.5pt;
  color: #1a365d;
}
table.prosem td.minggu-pts {
  background: #4a90e2;
  color: #fff;
  text-align: center;
  font-size: 5.5pt;
}
table.prosem td.minggu-pas {
  background: #2c5aa0;
  color: #fff;
  text-align: center;
  font-size: 5.5pt;
}
table.prosem td.minggu-terpotong {
  background-color: #fff8e1;
  color: #5d4037;
  font-weight: 600;
  text-align: center;
}

/* Row types */
table.prosem tr.elemen-header td {
  background: #edf5ff;
  color: #1a365d;
  font-weight: bold;
  font-size: 7pt;
  padding: 2px 4px;
  border-bottom: 2px solid #1a365d;
}
table.prosem tr.subtotal td {
  background: #e6f2ff;
  color: #1a365d;
  font-weight: bold;
  text-align: center;
  font-size: 6.5pt;
}
table.prosem tr.subtotal td.label {
  text-align: right;
  padding-right: 8px;
}

/* LEGENDA */
.legenda {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 8pt;
  margin-bottom: 10px;
  padding: 5px 8px;
  border: 1px solid #ccc;
  background: #fafafa;
}
.legenda-item { display: flex; align-items: center; gap: 5px; }
.legenda-box {
  width: 16px; height: 12px; border: 1px solid #000; display: inline-block; flex-shrink: 0;
}
.lb-aktif { background: #4a90e2; }
.lb-libur { background: #e6f2ff; }
.lb-pts   { background: #4a90e2; }
.lb-pas   { background: #2c5aa0; }
.lb-kosong { background: #fff; }

.catatan { font-size: 8pt; color: #1a365d; margin-bottom: 10px; padding: 5px 8px; border-left: 3px solid #1a365d; line-height: 1.7; background: #edf5ff; }

.catatan-kaki {
  margin-top: 12px;
  padding: 8px 12px;
  border-top: 1px solid #ccc;
  font-size: 11px;
  color: #333;
}
.catatan-kaki ul {
  margin: 4px 0 0 16px;
  padding: 0;
}
.catatan-kaki li {
  margin-bottom: 2px;
}
.catatan-kaki span.ck-bulan {
  font-weight: bold;
}
.catatan-kaki span.ck-info {
  font-style: italic;
  color: #666;
}

/* ── PROSEM PORTRAIT F4 WRAPPER ── */
.page.page-prosem {
  width: 215mm;
  min-height: 330mm;
  padding: 12mm 10mm;
  margin: 20px auto;
}

/* PROSEM identitas lebih kompak di portrait */
.page-prosem .identitas {
  font-size: 8pt;
  margin-bottom: 8px;
}
.page-prosem .identitas td {
  padding: 2px 4px;
}

/* PROSEM section title lebih kecil */
.page-prosem .section-title {
  font-size: 9pt;
  padding: 2px 6px;
  margin: 8px 0 6px 0;
}

/* PROSEM doc judul lebih kecil */
.page-prosem .doc-judul-area .judul-utama {
  font-size: 12pt;
}
.page-prosem .doc-judul-area .subjudul {
  font-size: 8.5pt;
}

/* ══════════════════════════════════════════════
   KKTP — Kriteria Ketercapaian Tujuan Pembelajaran
   ══════════════════════════════════════════════ */

/* Section A: Level Description Table */
table.level {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 9pt;
  margin-bottom: 10px;
}

table.level th {
  background: #1a365d;
  color: #ffffff;
  padding: 5px 7px;
  border: 1px solid #1a365d;
  text-align: center;
  vertical-align: middle;
  border-bottom: 2px solid #1a365d;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

table.level td {
  padding: 4px 7px;
  border: 1px solid #1a365d;
  vertical-align: top;
  line-height: 1.5;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

table.level td.level-label {
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  width: 13%;
}

table.level td.level-angka {
  text-align: center;
  font-weight: bold;
  vertical-align: middle;
  width: 6%;
  font-size: 11pt;
}

table.level tr:nth-child(even) td { background: #fafafa; }

/* Section B: Rubrik KKTP — Vertical Card Layout (portrait-friendly) */
.rubrik-block {
    width: 100%;
    border: 1px solid #1a365d;
    border-radius: 4px;
    margin-bottom: 8px;
    overflow: hidden;
    page-break-inside: avoid;
    break-inside: avoid;
}

/* Block header: No + Kode TP on dark bar */
.rubrik-header {
    background: #1a365d;
    color: #fff;
    padding: 4px 8px;
    font-size: 8pt;
    font-weight: bold;
    display: flex;
    gap: 10px;
    align-items: center;
}
.rubrik-no { min-width: 18px; text-align: center; }
.rubrik-kode { font-family: 'Courier New', monospace; font-size: 7.5pt; }

/* TP + IKTP detail rows */
table.rubrik-detail {
    width: 100%;
    border-collapse: collapse;
    font-size: 8.5pt;
    table-layout: fixed;
}
table.rubrik-detail td {
    padding: 4px 7px;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: top;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.4;
}
td.rubrik-label {
    font-weight: 600;
    color: #1a365d;
    width: 28%;
    white-space: nowrap;
}
td.rubrik-val { width: 72%; }

/* Level descriptors — 4 stacked rows with colored labels */
table.rubrik-level {
    width: 100%;
    border-collapse: collapse;
    font-size: 8pt;
}
table.rubrik-level td {
    padding: 3px 7px;
    border-top: 1px solid #d0d0d0;
    vertical-align: top;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.4;
}
td.level-cell {
    font-weight: 600;
    white-space: nowrap;
    width: 28%;
}
td.level-mb    { background: #f0f4ff; color: #1a365d; }
td.level-layak { background: #e8f5e9; color: #2e7d32; }
td.level-cakap { background: #fff8e1; color: #f57f17; }
td.level-mahir { background: #fce4ec; color: #c62828; }
td.level-desc { width: 72%; }

/* Elemen divider between card blocks */
.elemen-divider {
    background: #edf5ff;
    color: #1a365d;
    font-weight: bold;
    font-size: 8.5pt;
    padding: 4px 8px;
    border: 1px solid #b3d4fc;
    border-radius: 3px;
    margin: 12px 0 6px 0;
    letter-spacing: 0.03em;
    page-break-after: avoid;
    break-after: avoid;
}

/* ══════════════════════════════════════════════
   MODUL AJAR
   ══════════════════════════════════════════════ */
.modul-ajar-page .identitas td.label {
  font-weight: bold;
  white-space: nowrap;
  width: 35%;
  background: #e6f2ff;
  color: #1a365d;
}

.sub-section {
  font-size: 10pt;
  font-weight: bold;
  border-bottom: 1.5px solid #1a365d;
  padding: 2px 0 3px 0;
  margin: 10px 0 6px 0;
  letter-spacing: 0.02em;
  color: #1a365d;
}

.konten-box {
  border: 1px solid #1a365d;
  padding: 8px 12px;
  margin-bottom: 12px;
  font-size: 10pt;
  line-height: 1.6;
  background: #fefefe;
}

.konten-box .box-label {
  font-weight: bold;
  font-size: 9.5pt;
  border-bottom: 1px solid #2c5aa0;
  padding-bottom: 4px;
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #1a365d;
}

.pertemuan-header {
  background: #1a365d;
  color: #fff;
  font-weight: bold;
  font-size: 10.5pt;
  padding: 6px 10px;
  margin: 14px 0 0 0;
  letter-spacing: 0.04em;
}

.pertemuan-meta {
  border: 1px solid #1a365d;
  border-top: none;
  padding: 5px 10px;
  font-size: 9.5pt;
  margin-bottom: 8px;
  background: #e6f2ff;
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.pertemuan-meta span { font-size: 9.5pt; }
.pertemuan-meta b { font-weight: bold; color: #1a365d; }

.fase-box,
.sintak-box,
.asesmen-box,
.lampiran-box,
.soal-box,
.refleksi-card,
.diff-card {
  border: 1px solid #1a365d;
  margin-bottom: 8px;
  page-break-inside: avoid;
  break-inside: avoid;
}

.fase-box .fase-header,
.asesmen-box .asesmen-header,
.lampiran-box .lampiran-header,
.soal-box .soal-header,
.refleksi-card .refleksi-header,
.diff-card .diff-header {
  background: #2c5aa0 !important;
  color: #fff !important;
  font-weight: bold;
  font-size: 9.5pt;
  padding: 5px 10px;
}

.sintak-box .sintak-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  background: #1a365d !important;
  color: #fff !important;
  padding: 4px 10px;
  gap: 10px;
}

.sintak-no {
  font-size: 9pt;
  font-weight: bold;
  border: 1px solid #fff;
  padding: 1px 6px;
  white-space: nowrap;
}

.sintak-nama { font-weight: bold; font-size: 9.5pt; letter-spacing: 0.03em; }
.sintak-waktu { font-size: 8.5pt; white-space: nowrap; opacity: 0.85; }

.fase-content,
.sintak-content,
.asesmen-content,
.lampiran-content,
.soal-content,
.refleksi-content,
.diff-content {
  padding: 7px 10px;
  font-size: 9.5pt;
  line-height: 1.6;
}

.deep-learning-label {
  font-size: 8.5pt;
  font-style: italic;
  color: #1a365d;
  background: #e8f0fa;
  border-bottom: 1px solid #b0c4e8;
  padding: 3px 10px;
}

table.aktivitas-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 9pt;
  margin: 0;
}

table.aktivitas-table th {
  padding: 4px 6px;
  text-align: center;
  border: 1px solid #1a365d;
  font-size: 8.5pt;
}

table.aktivitas-table th.th-guru { background: #1a365d !important; color: #fff !important; }
table.aktivitas-table th.th-siswa { background: #2e7d32 !important; color: #fff !important; }

table.aktivitas-table td {
  padding: 4px 6px;
  border: 1px solid #c8dff5;
  vertical-align: top;
  line-height: 1.5;
}

table.aktivitas-table .col-no {
  width: 22px;
  text-align: center;
  font-weight: bold;
  background: #f0f5ff;
  color: #1a365d;
}

table.aktivitas-table .col-no-siswa {
  width: 22px;
  text-align: center;
  font-weight: bold;
  background: #f0fff0;
  color: #2e7d32;
}

.tujuan-pertemuan-box {
  border: 1px solid #1a365d;
  border-top: none;
  padding: 6px 10px;
  margin-bottom: 8px;
  font-size: 9pt;
  background: #f8faff;
  page-break-inside: avoid;
  break-inside: avoid;
}

.tujuan-pertemuan-box .tujuan-label {
  font-weight: bold;
  font-size: 8.5pt;
  color: #1a365d;
  margin-bottom: 3px;
}

.tujuan-pertemuan-box ol,
.soal-content ol,
.refleksi-content ol,
.diff-content ul {
  margin: 0;
  padding-left: 18px;
}

.soal-tipe {
  display: inline-block;
  font-size: 7.5pt;
  background: #e6f2ff;
  color: #1a365d;
  border: 1px solid #b0c4e8;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 4px;
  font-style: italic;
}

.diff-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 5px;
  margin-bottom: 12px;
}

.refleksi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}

table.lintas-disiplin {
  width: 100%;
  border-collapse: collapse;
  font-size: 10pt;
  margin-bottom: 10px;
}

table.lintas-disiplin th {
  background: #1a365d !important;
  color: #fff !important;
  padding: 5px 8px;
  border: 1px solid #1a365d;
  text-align: left;
}

table.lintas-disiplin td {
  padding: 5px 8px;
  border: 1px solid #1a365d;
  vertical-align: top;
  line-height: 1.5;
}

table.lintas-disiplin td.mapel {
  font-weight: bold;
  width: 28%;
  background: #e6f2ff;
  color: #1a365d;
}

/* ── TABEL DI DALAM ASESMEN, SINTAK, FASE BOX ── */
.asesmen-box .asesmen-content table {
  width: 100%;
  border-collapse: collapse;
}
.asesmen-box .asesmen-content table th,
.asesmen-box .asesmen-content table td {
  border: 1px solid #1a365d;
  padding: 4px 7px;
}
.asesmen-box .asesmen-content table th {
  background: #1a365d !important;
  color: #fff !important;
}

.fase-box .fase-content table {
  width: 100%;
  border-collapse: collapse;
}
.fase-box .fase-content table td {
  padding: 3px 6px;
  border: 1px solid #2c5aa0;
  vertical-align: top;
  line-height: 1.5;
}

.sintak-box .sintak-content table {
  width: 100%;
  border-collapse: collapse;
}
.sintak-box .sintak-content table td {
  padding: 4px 7px;
  border: 1px solid #2c5aa0;
  vertical-align: top;
  line-height: 1.5;
}

table.main td.valign-middle,
table.aktivitas-table td.valign-middle,
.asesmen-box table td.valign-middle {
  vertical-align: middle !important;
}

/* ══════════════════════════════════════════════
   RUBRIK PENILAIAN
   ══════════════════════════════════════════════ */

/* Rubrik pertemuan header */
.rubrik-header-area {
  margin-bottom: 14px;
  border-bottom: 2px solid #1a365d;
  padding-bottom: 8px;
}

.rubrik-header-area .rubrik-judul-utama {
  font-size: 14pt;
  font-weight: bold;
  color: #1a365d;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}

.rubrik-header-area .rubrik-judul-sub {
  font-size: 10pt;
  font-style: italic;
  color: #333;
  margin-bottom: 6px;
}

.rubrik-header-area .rubrik-meta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 8.5pt;
  color: #444;
}

.rubrik-header-area .rubrik-meta span + span::before {
  content: "|";
  margin-right: 14px;
  color: #999;
}

.rubrik-header-area .rubrik-border-bawah {
  display: none;
}

.rubrik-pertemuan-header {
  background: #1a365d;
  color: #fff;
  font-weight: bold;
  font-size: 10pt;
  padding: 5px 10px;
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rubrik-sintak-label {
  font-size: 8.5pt;
  font-weight: normal;
  opacity: 0.85;
}

/* Sub-label for A/B sections */
.sub-label {
  font-size: 9.5pt;
  font-weight: bold;
  color: #1a365d;
  border-bottom: 1px solid #1a365d;
  padding: 2px 0;
  margin: 8px 0 6px 0;
}

/* Tabel Rubrik utama — 6 kolom (No, Kriteria, 4 level SB/BSH/MB/PB) */
table.tabel-rubrik {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 9pt;
  margin-bottom: 8px;
}

table.tabel-rubrik th {
  background: #1a365d !important;
  color: #fff !important;
  padding: 4px 6px;
  border: 1px solid #1a365d;
  text-align: center;
  vertical-align: middle;
  font-size: 8pt;
}

table.tabel-rubrik td {
  padding: 4px 6px;
  border: 1px solid #1a365d;
  vertical-align: top;
  word-wrap: break-word;
  overflow-wrap: break-word;
  line-height: 1.5;
  font-size: 8.5pt;
}

table.tabel-rubrik td.no { text-align: center; width: 28px; font-weight: bold; vertical-align: middle; }
table.tabel-rubrik td.kriteria-nama { font-weight: 600; width: 22%; }
table.tabel-rubrik td.center { text-align: center; }
table.tabel-rubrik tr:nth-child(even) td { background: #fafafa; }

/* Badge skor (SB=4 biru, BSH=3 hijau, MB=2 kuning, PB=1 merah) */
.badge-skor {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  text-align: center;
  line-height: 20px;
  font-weight: bold;
  font-size: 10pt;
  color: #fff;
  margin-bottom: 2px;
}
.badge-4 { background: #2c5aa0; }
.badge-3 { background: #2e7d32; }
.badge-2 { background: #f57f17; }
.badge-1 { background: #c62828; }

/* Keterangan skor box */
.keterangan-skor {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 8pt;
  margin: 6px 0 12px 0;
  padding: 5px 8px;
  border: 1px solid #ccc;
  background: #fafafa;
}

.keterangan-skor .item {
  display: flex;
  align-items: center;
  gap: 5px;
}

/* Model badge — Sumatif */
.model-badge {
  font-size: 10pt;
  font-weight: bold;
  color: #1a365d;
  padding: 4px 8px;
  margin-bottom: 8px;
  border-left: 4px solid #1a365d;
  background: #e6f2ff;
}

/* Soal item — Sumatif Esai */
.soal-item {
  border: 1px solid #1a365d;
  margin-bottom: 8px;
  page-break-inside: avoid;
  break-inside: avoid;
}

.soal-item .soal-header {
  background: #2c5aa0 !important;
  color: #fff !important;
  font-weight: bold;
  font-size: 9pt;
  padding: 4px 8px;
  display: flex;
  justify-content: space-between;
}

.soal-item .soal-skor {
  font-weight: normal;
  font-size: 8pt;
  opacity: 0.85;
}

.soal-item .soal-teks {
  padding: 6px 10px;
  font-size: 9pt;
  line-height: 1.5;
  border-bottom: 1px solid #2c5aa0;
}

/* Tabel Esai */
table.tabel-esai {
  width: 100%;
  border-collapse: collapse;
  font-size: 8.5pt;
}

table.tabel-esai th {
  background: #1a365d !important;
  color: #fff !important;
  padding: 4px 7px;
  border: 1px solid #1a365d;
  text-align: center;
}

table.tabel-esai td {
  padding: 4px 7px;
  border: 1px solid #1a365d;
  vertical-align: top;
  line-height: 1.5;
}

table.tabel-esai td.center { text-align: center; }
table.tabel-esai tr:nth-child(even) td { background: #fafafa; }

/* Total skor box */
.total-skor-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 12px;
  margin: 8px 0;
  border: 1px solid #1a365d;
  background: #e6f2ff;
  font-size: 9pt;
  font-weight: bold;
  color: #1a365d;
}

.total-skor-box .nilai {
  font-size: 10pt;
}

/* Pertemuan section wrapper — avoid page-break inside */
.pertemuan-section {
  page-break-inside: avoid;
  break-inside: avoid;
}

/* Pertemuan label inside header */
.pertemuan-label {
  font-weight: bold;
}

/* Tabel rubrik — column header classes */
table.tabel-rubrik th.col-no { width: 28px; }
table.tabel-rubrik th.col-kriteria { width: 22%; }
table.tabel-rubrik th.col-bobot { width: 8%; }
table.tabel-rubrik td.bobot { text-align: center; font-weight: bold; }

/* Komponen box — Sumatif Portofolio/Proyek */
.komponen-box {
  border: 1px solid #1a365d;
  padding: 8px 12px;
  margin-bottom: 10px;
  background: #fefefe;
}

.komponen-box .komponen-label {
  font-weight: bold;
  font-size: 9.5pt;
  color: #1a365d;
  border-bottom: 1px solid #2c5aa0;
  padding-bottom: 4px;
  margin-bottom: 6px;
}

.komponen-box .komponen-item {
  display: flex;
  justify-content: space-between;
  padding: 3px 0;
  font-size: 9pt;
}

.komponen-box .komponen-bobot {
  font-weight: bold;
  color: #1a365d;
}

/* Pemisah — hr separator antar soal esai */
hr.pemisah {
  border: none;
  border-top: 1px solid #ccc;
  margin: 10px 0;
}

/* Soal label & skor (esai) */
.soal-item .soal-label {
  font-weight: bold;
}

.soal-item .soal-skor-maks {
  font-weight: normal;
  font-size: 8pt;
  opacity: 0.85;
}

/* Tabel esai — rentang column */
table.tabel-esai th.col-rentang { width: 22%; }

/* Font adaptation — prevents table overflow when many kriteria */
.page.kriteria-sedang { font-size: 9pt; }
.page.kriteria-sedang table.tabel-rubrik { font-size: 8.5pt; }
.page.kriteria-sedang table.tabel-rubrik td { font-size: 8pt; }

.page.kriteria-banyak { font-size: 8.5pt; }
.page.kriteria-banyak table.tabel-rubrik { font-size: 8pt; }
.page.kriteria-banyak table.tabel-rubrik td { font-size: 7.5pt; }

/* ══════════════════════════════════════════════
   KEMENAG / KBC SPECIFIC STYLES
   ══════════════════════════════════════════════ */

/* Section F: Panca Cinta text (CP) */
.panca-cinta-text {
    font-size: 9.5pt;
    color: #2e7d32;
}

/* Section F: Nilai PPRA text (CP) */
.nilai-ppra-text {
    font-size: 9.5pt;
    color: #1565c0;
}

/* ATP: KBC sub-detail row */
.sub-detail-kbc {
    font-size: 7.5pt;
    color: #555;
    font-style: italic;
}

tr.sub-detail-kbc-row td {
    padding: 2px 6px 4px;
    background: #f9fdf9;
    font-size: 7.5pt;
    border-bottom: 1px solid #e8e8e8;
}

/* ══════════════════════════════════════════════
   MODUL AJAR — KBC BADGES
   ══════════════════════════════════════════════ */
.kbc-box {
    background: #f9fdf9;
    border: 1px solid #c8e6c9;
    border-radius: 4px;
    padding: 8px 10px;
    margin: 6px 0 10px;
}

.kbc-row {
    margin-bottom: 4px;
    font-size: 9.5pt;
    line-height: 1.4;
}

.kbc-row:last-child { margin-bottom: 0; }

.kbc-row-label {
    font-weight: bold;
    color: #333;
    margin-right: 4px;
}

.kbc-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 8.5pt;
    font-weight: 600;
    margin: 1px 2px;
}

.kbc-badge.kbc-pc {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #a5d6a7;
}

.kbc-badge.kbc-ppra {
    background: #e3f2fd;
    color: #1565c0;
    border: 1px solid #90caf9;
}

.kbc-label {
    margin: 4px 0 6px;
    padding: 3px 6px;
    background: #f5f5f5;
    border-radius: 3px;
    font-size: 8pt;
}

/* TP: Integrasi Nilai (KBC & PPRA) column */
.tp-integrasi {
    font-size: 0.85em;
    line-height: 1.3;
    vertical-align: top;
}

.integrasi-panca-cinta {
    margin-bottom: 3px;
    color: #2e7d32;
}

.integrasi-panca-cinta strong {
    font-size: 0.85em;
}

.integrasi-ppra {
    border-top: 1px solid #e0e0e0;
    padding-top: 3px;
    color: #1565c0;
}

.integrasi-ppra strong {
    font-size: 0.85em;
}

/* ══════════════════════════════════════════════
   PRINT STYLES
   ══════════════════════════════════════════════ */
@media print {
  @page {
    margin: 0;
  }

  body { background: #fff; }

  .page,
  .cover-page,
  .pengesahan-page,
  .page-prosem {
    margin: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    width: 215mm !important;
  }

  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .cover-page {
    min-height: 330mm !important;
    height: 330mm !important;
    page-break-after: always;
    overflow: hidden;
  }

  .cover-page::before,
  .cover-page::after {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .cover-geo-tr,
  .cover-geo-bl {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .cover-footer {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}
