/* ใบสรุปผลแลบ (one page) — A4/A5, ใช้ทั้ง preview บนจอ, print และ export PDF */
.sheet {
  --s: 1;
  /* อ่านง่าย: ตัวใหญ่ขึ้น น้ำหนัก 500 (Sarabun บางเกินที่ 400) สีเข้มขึ้น */
  /* ฟอนต์ตามแม่แบบ (ค่าเริ่มต้น IBM Plex Sans Thai) · line-height 1.5: สระบน/วรรณยุกต์ซ้อนไม่ชนบรรทัดบน */
  font-family: var(--f-report, var(--f-doc)); color: #111; background: #fff; font-weight: 500;
  width: 210mm; min-height: 296mm; padding: 9mm 10mm; margin: 0 auto;
  font-size: calc(11pt * var(--s)); line-height: 1.5; position: relative;
  page-break-after: always; break-after: page;
}
.sheet:last-child { page-break-after: auto; break-after: auto; }
/* A5 แนวนอน: กว้าง 210 สูง 148 มม. → 3 คอลัมน์ */
.sheet--a5 { --s: .8; width: 210mm; min-height: 147mm; padding: 5mm 7mm; }
.sheet--a5 .sheet__body, .sheet--a5 .sheet__cols, .sheet--a5 .sheet__col { gap: 2mm; }
.sheet--a5 .sheet__who { margin: 2mm 0; padding: 1.5mm 3mm; }
.sheet--a5 .sheet__head { padding-bottom: 1.5mm; }
.sheet * { box-sizing: border-box; }
.sheet__head { display: grid; grid-template-columns: auto 1fr auto; gap: 3mm; align-items: center; border-bottom: 2px solid #0e5b57; padding-bottom: 2.5mm; }
.sheet__logo { width: calc(13mm * var(--s)); height: calc(13mm * var(--s)); border-radius: 3mm; background: #0e5b57; color: #fff; display: grid; place-items: center; font-weight: 700; font-size: calc(9pt * var(--s)); }
.sheet__title h1 { font-size: calc(14.5pt * var(--s)); color: #0e5b57; margin: 0; font-weight: 700; }
.sheet__title p { margin: 0; font-size: calc(10pt * var(--s)); color: #333; }
.sheet__fy { text-align: right; font-size: calc(9.5pt * var(--s)); color: #333; }
.sheet__fy strong { display: block; font-size: calc(15pt * var(--s)); color: #1a1a1a; }

.sheet__who { display: grid; grid-template-columns: 2.2fr 1fr 1fr 1fr; gap: 1.5mm 4mm; margin: 3mm 0; padding: 2.5mm 3mm; background: #f3f1ea; border-radius: 2mm; font-size: calc(10pt * var(--s)); }
.sheet__prev { grid-column: 1 / -1; font-size: calc(9pt * var(--s)); color: #333; border-top: 1px dashed #cfc8b8; padding-top: 1mm; }
.sheet__who .sheet__prev b { display: inline; font-size: inherit; }
.sheet__who b { display: block; font-size: calc(12pt * var(--s)); font-weight: 700; }
.sheet__who > div > span { color: #444; font-size: calc(8.5pt * var(--s)); }

/* เนื้อหา: แถบเต็มหน้า + ชุดคอลัมน์แบบ masonry (จัดใน report-layout.js) — กล่องสูงตามเนื้อหา ไม่มีช่องว่างจากแถวเท่ากัน */
.sheet__body { display: grid; gap: 2.5mm; }
.sheet__cols { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2.5mm; align-items: start; }
.sheet__col { display: grid; gap: 2.5mm; align-content: start; min-width: 0; }
.sec { border: 1px solid #d9d4c7; border-radius: 2mm; padding: 1.6mm 3mm 1.8mm; break-inside: avoid; min-width: 0; }
.sec__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1mm 2mm; margin-bottom: 1.2mm; }
.sec__head h2 { font-size: calc(11.5pt * var(--s)); line-height: 1.35; margin: 0; color: #0e5b57; font-weight: 700; flex: 1 1 auto; min-width: 0; }
.flag { display: inline-block; padding: .3mm 2mm; border-radius: 5mm; font-size: calc(8.5pt * var(--s)); line-height: 1.4; font-weight: 700; white-space: nowrap; }
.flag--ok { background: #dcefe2; color: #1f6b3e; } .flag--warn { background: #f8e9c9; color: #875307; } .flag--bad { background: #f6dcd8; color: #9d2019; } .flag--muted { background: #ece9e1; color: #777; }
/* คอลัมน์ตารางกว้างคงที่: ชื่อรายการยาวตัดบรรทัดในช่องตัวเอง — ไม่ดันค่า/ค่าอ้างอิงไปทับกล่องข้าง ๆ */
.sec table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: calc(10.5pt * var(--s)); }
/* แถวตาราง 1.3: ชื่อรายการ/ค่าเป็นอักษรละตินและตัวเลข (ไม่มีวรรณยุกต์ซ้อน) — ข้อความไทยนอกตารางยังใช้ 1.5 */
.sec td { padding: .45mm 1mm; border-bottom: 1px dotted #d6d0c2; vertical-align: baseline; overflow-wrap: anywhere; line-height: 1.3; }
.sec td:first-child { padding-left: 0; }
.sec td.v { width: calc(17mm * var(--s)); text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; font-size: calc(11pt * var(--s)); }
.sec .u { color: #555; font-size: calc(7.5pt * var(--s)); font-weight: 400; white-space: nowrap; }
/* ผลครั้งก่อน: สีเทาเข้มพออ่านได้ แต่ไม่แย่งความเด่นจากผลปัจจุบัน */
.sec td.p { width: calc(13mm * var(--s)); text-align: right; color: #666; font-variant-numeric: tabular-nums; white-space: nowrap; font-size: calc(10pt * var(--s)); padding-left: 2mm; }
.sec td.ref { width: calc(21mm * var(--s)); color: #444; font-size: calc(8pt * var(--s)); text-align: right; padding-left: 1.5mm; padding-right: 0; line-height: 1.3; }
.sec td.v.hi { color: #b0281f; } .sec td.v.lo { color: #2a5c9e; }
.sec .note { font-size: calc(9pt * var(--s)); color: #333; margin: 1mm 0 0; line-height: 1.45; }
.cv-row { display: flex; align-items: center; gap: 3mm; }
.cv-row .cv-meter { flex: 1; margin: 0; }
.cv-value { font-size: calc(17pt * var(--s)); font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.note--zero { color: #444; }
.cv-meter { height: 2.2mm; border-radius: 2mm; background: linear-gradient(90deg, #2d7a4c 0 25%, #c9a227 25% 50%, #d9731a 50% 75%, #b0281f 75%); position: relative; margin: 2mm 0 1mm; }
.cv-meter i { position: absolute; top: -1.2mm; width: 1mm; height: 4.6mm; background: #1a1a1a; border-radius: 1mm; }
.fu { margin: 0; padding-left: 4mm; font-size: calc(10.5pt * var(--s)); }
.fu li { margin: .6mm 0; }
.sheet__foot { position: absolute; left: 10mm; right: 10mm; bottom: 7mm; display: flex; justify-content: space-between; font-size: calc(8.5pt * var(--s)); color: #555; border-top: 1px solid #e1ddd2; padding-top: 1.5mm; }
.sheet--a5 .sheet__foot { left: 7mm; right: 7mm; bottom: 2.5mm; }
.sheet .sign { display: flex; justify-content: flex-end; gap: 12mm; margin-top: 3mm; font-size: calc(9pt * var(--s)); }
.sheet .sign div { text-align: center; }

/* เอกสารเบิกค่าตอบแทน / ใบแจ้งหนี้ */
.doc { font-family: var(--f-doc); background: #fff; color: #111; font-weight: 500; line-height: 1.45; width: 210mm; min-height: 296mm; margin: 0 auto; padding: 14mm 14mm; font-size: 12.5pt; page-break-after: always; }
.doc:last-child { page-break-after: auto; }
/* หัวเรื่องเอกสาร OT เป็น h2 (ตัวอย่างอยู่ในหน้าที่มี h1 ของหน้าแล้ว) — หน้าตาเท่ากัน */
.doc h1, .doc .doc-title { text-align: center; font-size: 16.5pt; margin: 0 0 1mm; font-weight: 700; }
.doc .sub { text-align: center; margin-bottom: 5mm; }
.doc table { width: 100%; border-collapse: collapse; font-size: 11.5pt; }
.doc th, .doc td { border: 1px solid #555; padding: 1.4mm 2mm; }
.doc th { background: #f0eee8; }
.doc td.n { text-align: right; font-variant-numeric: tabular-nums; }
.doc .sigs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6mm; margin-top: 16mm; text-align: center; font-size: 10.5pt; }
.doc .sigs p { margin: 0 0 1mm; }

.preview-stage { background: var(--c-surface-2); border-radius: var(--r-lg); padding: 20px; overflow: auto; max-height: 78vh; }
.preview-stage .sheet, .preview-stage .doc { box-shadow: var(--sh-2); margin-bottom: 16px; transform-origin: top center; }

@media print {
  #print-root .sheet, #print-root .doc { margin: 0; box-shadow: none; }
  /* ผลครบทุกรายการอาจยาวเกิน 1 หน้า → ให้ไหลต่อหน้าถัดไปแทนการตัดทิ้ง */
  #print-root .sheet { width: auto; height: auto; min-height: calc(297mm - 16mm); padding: 0 0 9mm; }
  #print-root .sheet--a5 { min-height: calc(148mm - 10mm); padding-bottom: 6mm; }
  #print-root .sec { break-inside: avoid; }
  #print-root .doc { width: auto; min-height: 0; padding: 0; }
  #print-root .sheet__foot { left: 0; right: 0; bottom: 0; }
}
/* ใบส่งตรวจ A5 แนวนอน: รายการแลบเรียง 3 คอลัมน์ */
.slip-items { columns: 3; column-gap: 5mm; list-style: none; margin: 0; padding: 0; font-size: calc(11pt * var(--s)); }
.slip-items li { break-inside: avoid; padding: .6mm 0; border-bottom: 1px dotted #d6d0c2; }
.slip-items small { color: #555; font-size: calc(8pt * var(--s)); font-weight: 400; }

/* ลายน้ำเอกสารจากโหมดทดลอง (จอ, พิมพ์, PDF) — ห้ามใช้แทนเอกสารจริง
   เป็นภาพพื้นหลัง (ไม่ใช่กล่องหมุน) เพื่อไม่ให้ขอบที่หมุนยื่นออกนอกหน้าแล้วถูกนับเป็นความสูงเกิน */
body.is-demo .sheet, body.is-demo .doc {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='600'%20height='600'%20viewBox='0%200%20600%20600'%3E%3Ctext%20x='300'%20y='300'%20text-anchor='middle'%20dominant-baseline='middle'%20transform='rotate%28-24%20300%20300%29'%20font-family='sans-serif'%20font-weight='700'%20font-size='30'%20fill='rgba%28176%2C40%2C31%2C0.16%29'%3E%E0%B8%95%E0%B8%B1%E0%B8%A7%E0%B8%AD%E0%B8%A2%E0%B9%88%E0%B8%B2%E0%B8%87%E0%B8%88%E0%B8%B2%E0%B8%81%E0%B9%82%E0%B8%AB%E0%B8%A1%E0%B8%94%E0%B8%97%E0%B8%94%E0%B8%A5%E0%B8%AD%E0%B8%87%20%E2%80%94%20%E0%B9%84%E0%B8%A1%E0%B9%88%E0%B9%83%E0%B8%8A%E0%B9%88%E0%B9%80%E0%B8%AD%E0%B8%81%E0%B8%AA%E0%B8%B2%E0%B8%A3%E0%B8%88%E0%B8%A3%E0%B8%B4%E0%B8%87%3C/text%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: 100% auto;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}

/* ---------- แบบฟอร์มเบิก OT (ตามแบบ รพ.สระบุรี) ---------- */
@page ot-land { size: A4 landscape; margin: 7mm; }
.doc--land { page: ot-land; width: 297mm; min-height: 209mm; padding: 7mm 8mm; font-size: 10pt; }
.ot-head { text-align: center; margin-bottom: 3mm; position: relative; }
.doc .ot-head h1, .doc .ot-head .doc-title { font-size: 13.5pt; margin: 0 0 1mm; }
.ot-sigs { break-inside: avoid; page-break-inside: avoid; break-before: avoid; } /* ลายเซ็นไม่แยกไปหน้าใหม่โดดเดี่ยว */
.ot-head p { margin: 0; font-size: 10pt; }
.ot-form { position: absolute; right: 0; top: 0; font-size: 10pt; font-weight: 700; border: 1px solid #555; padding: .4mm 2.5mm; }
.doc table.ot-grid { table-layout: fixed; width: 100%; font-size: 8.5pt; line-height: 1.25; }
.doc .ot-grid th, .doc .ot-grid td { padding: .8mm .7mm; }
.doc .ot-grid .d { text-align: center; padding: .8mm 0; font-size: 8pt; }
.doc .ot-grid td.amt { font-size: 7pt; letter-spacing: -.03em; }
.doc .ot-grid .off { background: #e9e9e9; }
.ot-grid .nm, .ot-grid .ps { overflow-wrap: anywhere; }
.doc .ot-grid .ps { font-size: 8pt; }
.doc .ot-grid tr.tot th, .doc .ot-grid tr.tot td { background: #f0eee8; font-weight: 700; }
.doc .ot-grid tr.sub-row td { font-size: 7.5pt; color: #333; }
.ot-note { font-size: 9.5pt; margin: 2mm 0 0; }
.ot-sigs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6mm; margin-top: 9mm; text-align: center; font-size: 9.5pt; }
.ot-sigs--one { grid-template-columns: minmax(0, 90mm); justify-content: end; }
.ot-sig p { margin: 0 0 .8mm; }
.ot--log { padding: 10mm 10mm; }
.doc table.ot-log { table-layout: fixed; font-size: 9.5pt; }
.doc .ot-log th, .doc .ot-log td { padding: 1mm 1.2mm; }
.doc .ot-log .dt, .doc .ot-log .ps { font-size: 9pt; }
.doc .ot-log tr.day-start td { border-top: 1.6px solid #222; }
@media print {
  #print-root .doc--land { width: auto; min-height: 0; padding: 0; }
  #print-root .ot-grid tr, #print-root .ot-log tr { break-inside: avoid; }
}