/* a4.css — หน้ากระดาษ A4 และรูปแบบหนังสือราชการ (ใช้ทั้งพรีวิวบนจอและการพิมพ์)
   ค่าตรงกับ skill thai-govdoc-letter หัวข้อ ๔: ขอบซ้าย ๓ ซม. ขวา ๒ ซม. ล่าง ๒ ซม. · ฟอนต์ ๑๖ pt · ย่อหน้า ๒.๕ ซม. */
:root {
  --doc-font: 'GovDoc Sarabun New', 'TH Sarabun New', 'THSarabunNew', 'TH SarabunPSK', serif;
  --doc-line: 1.301;           /* บรรทัด Single ของ TH Sarabun New ใน Word */
  --ph-bg: #fff176;
}

.a4-page {
  position: relative;
  width: 21cm; height: 29.7cm;
  background: #fff; color: #000;
  overflow: hidden;
  box-sizing: border-box;
}
.a4-body {
  position: absolute; left: 3cm; right: 2cm; bottom: 2cm;
  overflow: hidden;
}
.doc {
  font-family: var(--doc-font);
  font-size: 16pt; line-height: var(--doc-line);
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
}
.doc * { box-sizing: border-box; }
.doc .p { margin: 0; }
.doc .b6 { margin-top: 6pt; }
.doc .b12 { margin-top: 12pt; }
.doc .page-first { margin-top: 0 !important; }

/* ไฮไลต์ช่องที่ต้องเติม [[…]] */
.doc mark.ph { background: var(--ph-bg); color: inherit; padding: 0 1px; border-radius: 2px;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* ย่อหน้าเนื้อความ — จัดชิดสองข้าง (แบบไทย) */
.doc .para { text-align: justify; text-justify: inter-character; text-indent: 2.5cm; word-break: normal; overflow-wrap: anywhere; }
.doc .para.sub { text-indent: 3.5cm; }
.doc .para.flush { text-indent: 0; }
.doc .para.heading { text-indent: 2.5cm; }
.doc .para.cont { text-indent: 0; }
.doc .para.split-first { text-align-last: justify; }
/* กระจายแบบไทย (Thai Distributed) — render.js แบ่งบรรทัดเป็น .jl แล้วกำหนด letter-spacing ให้เต็มบรรทัด */
.doc .para.dist { text-indent: 0; text-align: left; text-align-last: left; }
.doc .para.dist .jl { display: block; white-space: pre; text-indent: 0; }
.doc .tabbed { display: flex; align-items: baseline; padding-left: 2.5cm; }
.doc .tabbed .c1 { flex: 0 0 5.5cm; padding-right: .2cm; }
.doc .tabbed .c2 { flex: 1 1 auto; padding-right: .2cm; }
.doc .tabbed .c3 { flex: 0 0 auto; text-align: right; }

/* หัวข้อเยื้องแขวน: เรื่อง / เรียน / อ้างถึง / สิ่งที่ส่งมาด้วย / ถึง */
.doc .headline { display: flex; align-items: baseline; }
.doc .headline .lbl { flex: 0 0 auto; padding-right: .35cm; white-space: nowrap; }
.doc .headline .txt { flex: 1 1 auto; min-width: 0; }
.doc .headline .qty { flex: 0 0 auto; padding-left: .5cm; white-space: nowrap; }

/* หัวหนังสือภายนอก / ประทับตรา */
.doc .hdr { position: relative; display: flow-root; }   /* flow-root กัน margin ซ้อน (ครุฑต้องอยู่ที่ขอบบนจริง) */
.doc .hdr-row { display: flex; align-items: flex-start; }
.doc .no-cell { flex: 0 0 auto; width: 9.7cm; padding-right: .2cm; }
.doc .owner-cell { flex: 1 1 auto; min-width: 0; white-space: nowrap; }
.doc .date-line { white-space: pre-wrap; }
.doc .no-line { white-space: pre-wrap; }

/* บันทึกข้อความ */
.doc .memo-title { text-align: center; font-size: 29pt; font-weight: 700; }
.doc .mfield { display: flex; align-items: baseline; }
.doc .mfield.two .mcell { display: flex; align-items: baseline; flex: 0 0 8cm; min-width: 0; }
.doc .mfield.two .mcell.grow { flex: 1 1 auto; }
.doc .mlbl { flex: 0 0 auto; font-size: 20pt; font-weight: 700; line-height: 26pt; }
.doc .mval {
  flex: 1 1 auto; min-width: 0; min-height: calc(16pt * var(--doc-line));
  padding-left: .2cm; white-space: pre-wrap;
  /* เส้นประใต้ข้อความทุกบรรทัด จนถึงขอบขวา */
  background-image: radial-gradient(circle, #000 0 .55px, transparent .75px);
  background-size: 3.4px calc(16pt * var(--doc-line));
  background-position: 0 5.4pt;
  background-repeat: repeat;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}

/* ปิดท้าย */
.doc .sign { text-align: center; }
/* ลายเซ็น PNG ของผู้ใช้: วางลอยบนหน้า ลากย้าย/ปรับขนาดได้บนหน้าจอ (ตัวควบคุมไม่ออกตอนพิมพ์) */
.a4-page .sigfloat { position: absolute; z-index: 6; cursor: move; touch-action: none; user-select: none; -webkit-user-select: none;
  outline: 1px dashed transparent; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.a4-page .sigfloat img { width: 100%; height: 100%; display: block; pointer-events: none; }
.a4-page .sigfloat:hover, .a4-page .sigfloat.sel { outline-color: #2f6fe0; background: rgba(47,111,224,.06); }
.a4-page .sig-handle, .a4-page .sig-del { display: none; position: absolute; }
.a4-page .sigfloat:hover .sig-handle, .a4-page .sigfloat.sel .sig-handle { display: block; right: -6px; bottom: -6px; width: 12px; height: 12px;
  background: #2f6fe0; border: 2px solid #fff; border-radius: 3px; cursor: nwse-resize; }
.a4-page .sigfloat:hover .sig-del, .a4-page .sigfloat.sel .sig-del { display: block; right: -9px; top: -9px; width: 20px; height: 20px; padding: 0; line-height: 16px;
  font-size: 11px; background: #d33; color: #fff; border: 2px solid #fff; border-radius: 50%; cursor: pointer; }
@media print { .a4-page .sigfloat { outline: none !important; background: none !important; }
  .a4-page .sig-handle, .a4-page .sig-del { display: none !important; } }
/* เลขที่หนังสือแบบลายมือ (เฉพาะเลขท้ายหลัง "/"): Mali ตัวปกติ สีน้ำเงิน เหมือนเติมด้วยปากกาหมึกน้ำเงิน
   ขนาด ๑๑.๕ pt ให้ตัวเลขสูงเท่าตัวพิมพ์ TH Sarabun ๑๖ pt (Mali ตัวใหญ่กว่า ~๔๐%) · line-height 0 กันฟอนต์สูงดันบรรทัด */
.doc .hand { font-family: 'GovDoc Mali', 'Mali', 'TH Sarabun New', cursive; font-weight: 400; color: #1a3fa8;
  font-size: 11.5pt; line-height: 0; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.doc .sline, .doc .center, .doc .headline .txt, .doc .owner-cell { white-space: pre-wrap; }
.doc .closing { white-space: nowrap; }
.doc .stamp-issuer { display: inline-block; text-align: center; white-space: pre-wrap; }
.doc .approval { width: 8cm; text-align: center; }
.doc .approval .opts { display: flex; justify-content: center; gap: .8cm; }

/* QR Code สิ่งที่ส่งมาด้วย */
.doc .qr-block { display: inline-block; text-align: center; }
.doc .qr-img { display: block; image-rendering: pixelated; }
.doc .qr-cap { font-size: 14pt; line-height: 1.25; }

/* คำสั่ง / ประกาศ */
.doc .center { text-align: center; }
.doc .center-img { text-align: center; line-height: 0; }
.doc .rule { width: 6cm; margin: 0 auto; height: 10pt; border-bottom: 1px solid #000; }

/* องค์ประกอบของหน้า */
.a4-page .pageno { position: absolute; top: 1cm; left: 3cm; right: 2cm; text-align: center;
  font-family: var(--doc-font); font-size: 16pt; line-height: var(--doc-line); }
.a4-page .contword { position: absolute; right: 2cm; top: calc(29.7cm - 2cm); text-align: right;
  font-family: var(--doc-font); font-size: 16pt; line-height: var(--doc-line); }
.a4-page .secret { position: absolute; left: 3cm; right: 2cm; text-align: center; color: #e00000; font-weight: 700;
  font-family: var(--doc-font); font-size: 32pt; line-height: var(--doc-line); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.a4-page .secret.top { top: 1cm; }
.a4-page .secret.bottom { bottom: 1cm; }
.a4-page .slogan { position: absolute; left: 3cm; right: 2cm; bottom: .8cm; text-align: center;
  font-family: var(--doc-font); font-size: 16pt; line-height: var(--doc-line); }
.doc .measure { font-family: var(--doc-font); }

/* โหมดแก้ไขบนกระดาษ */
.edit-mode .a4-body { outline: 1px dashed #c9a227; }
.edit-mode .a4-body:focus { outline: 2px solid #c9a227; }

/* ---------- การพิมพ์ ---------- */
@page { size: A4 portrait; margin: 0; }
@media print {
  html, body { background: #fff !important; margin: 0 !important; padding: 0 !important; }
  .a4-page { box-shadow: none !important; margin: 0 !important; break-after: page; page-break-after: always; }
  .a4-page:last-child { break-after: auto; page-break-after: auto; }
  .edit-mode .a4-body { outline: none !important; }
}