/* ═══════════════════════════════════════════════════════════
   เอกสารพร้อมพิมพ์ A4 — ใบเสนอราคา / ใบส่งของ / ใบวางบิล / ใบเสร็จ
   ═══════════════════════════════════════════════════════════ */

#print-root { display: none; }

/* ───────── หน้าจอ: โหมดดูตัวอย่างก่อนพิมพ์ ───────── */
body.previewing { overflow: hidden; }
body.previewing .app { display: none; }
body.previewing #print-root {
  display: block; position: fixed; inset: 0; z-index: 400;
  background: #5b6b63; overflow: auto; padding: 0 0 60px;
}
.preview-bar {
  position: sticky; top: 0; z-index: 5; display: flex; gap: 10px; align-items: center;
  padding: 11px 18px; background: var(--green-800); color: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.preview-bar .ttl { font-weight: 600; font-size: 15px; }
.preview-bar .sp { flex: 1; }
.preview-bar button {
  border: none; border-radius: 9px; padding: 8px 15px; cursor: pointer;
  font-size: 14px; font-family: inherit; background: rgba(255,255,255,.14); color: #fff;
}
.preview-bar button.go { background: linear-gradient(135deg, var(--gold-500), var(--gold-600)); font-weight: 600; }
.preview-bar button:hover { filter: brightness(1.12); }

.sheet {
  width: 210mm; min-height: 297mm; margin: 22px auto; background: #fff;
  padding: 13mm 11mm 12mm; box-shadow: 0 10px 40px rgba(0,0,0,.35);
  font-family: var(--font-doc); color: #000; font-size: 14.2pt; line-height: 1.25;
  position: relative;
}
.sheet.landscape { width: 297mm; min-height: 210mm; }

/* ───────── หัวเอกสาร ───────── */
.doc-head { display: flex; align-items: flex-start; gap: 10mm; }
.doc-head .co { flex: 1; }
.doc-head .co .nm { font-size: 17pt; font-weight: 700; }
.doc-head .co div { line-height: 1.3; }
.doc-head .head-right { flex: 0 0 48mm; }
.doc-head .logo { width: 40mm; margin: 1mm 0 0 auto; }
.doc-head .logo img { width: 100%; height: auto; }
.doc-meta { text-align: right; font-size: 14pt; white-space: nowrap; }
.doc-meta div { line-height: 1.5; }
.doc-meta .lbl { display: inline-block; min-width: 14mm; }

.doc-title {
  text-align: center; font-size: 20pt; font-weight: 700; margin: 2mm 0 0;
  letter-spacing: .01em;
}
.doc-sub { text-align: center; font-size: 15pt; margin-bottom: 3mm; }
.doc-rule { height: 2px; background: #005035; margin: 2mm 0 3mm; }
.doc-rule.thin { height: 1px; background: #999; }

.party { display: flex; gap: 8mm; margin-bottom: 3mm; font-size: 14pt; }
.party .box { flex: 1; }
.party .box .k { color: #333; }

/* ───────── ตารางรายการ ───────── */
table.doc {
  width: 100%; border-collapse: collapse; font-size: 13.4pt;
}
table.doc th, table.doc td { border: 1px solid #000; padding: 1.1mm 2mm; }
table.doc th {
  background: #e8f0ec; font-weight: 700; text-align: center; font-size: 13pt;
}
table.doc td.c { text-align: center; }
table.doc td.r { text-align: right; font-variant-numeric: tabular-nums; }
table.doc td.nm { text-align: left; }
table.doc tr.cat td {
  background: #005035; color: #fff; font-weight: 700; text-align: left; font-size: 13.4pt;
}
table.doc tr.blank td { height: 6.2mm; }

.col-no   { width: 11mm; }
.col-qty  { width: 17mm; }
.col-unit { width: 23mm; }
.col-vn   { width: 13mm; }
.col-price{ width: 26mm; }
.col-amt  { width: 28mm; }

/* ใบสั่งซื้อมีคอลัมน์เยอะ จึงบีบตัวเลขให้ชื่อสินค้ามีที่พอ */
table.doc.po-tbl { font-size: 12.6pt; }
table.doc.po-tbl th, table.doc.po-tbl td { padding: .9mm 1.4mm; }
table.doc.po-tbl .col-tick  { width: 8mm; }
table.doc.po-tbl .col-no    { width: 9mm; }
table.doc.po-tbl .col-qty   { width: 15mm; }
table.doc.po-tbl .col-unit  { width: 17mm; }
table.doc.po-tbl .col-price { width: 22mm; }
table.doc.po-tbl .col-amt   { width: 24mm; }
table.doc.po-tbl th { font-size: 11.8pt; line-height: 1.15; }

/* ───────── สรุปยอด ───────── */
.sum-tbl { width: 100%; border-collapse: collapse; margin-top: -1px; font-size: 13.6pt; }
.sum-tbl td { border: 1px solid #000; padding: 1.3mm 2mm; }
.sum-tbl td.lbl { text-align: right; }
.sum-tbl td.val { text-align: right; width: 28mm; font-variant-numeric: tabular-nums; }
.sum-tbl tr.grand td { font-weight: 700; background: #f2f7f4; font-size: 14.6pt; }

.baht-text { margin-top: 2mm; font-size: 14pt; }
.baht-text .box {
  border: 1px solid #000; padding: 1.4mm 3mm; display: block; text-align: center;
  background: #fafaf7;
}

.doc-note { margin-top: 2.5mm; font-size: 12.8pt; color: #333; }

/* ───────── ลายเซ็น ───────── */
.signs { display: flex; gap: 10mm; margin-top: 10mm; }
.signs .s { flex: 1; text-align: center; font-size: 13.6pt; }
.signs .s .line { border-bottom: 1px dotted #000; height: 11mm; margin-bottom: 1.5mm; }
.signs .s .dt { margin-top: 1.5mm; }

.page-no { position: absolute; right: 11mm; bottom: 6mm; font-size: 12pt; color: #333; }
.sheet-foot { position: absolute; left: 11mm; bottom: 6mm; font-size: 10.5pt; color: #777; }

.internal-mark {
  position: absolute; top: 6mm; left: 50%; transform: translateX(-50%);
  background: #c0392b; color: #fff; padding: .6mm 5mm; border-radius: 3mm;
  font-size: 11.5pt; font-weight: 700; letter-spacing: .06em;
}
.watermark {
  position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none;
}
.watermark span {
  font-size: 68pt; color: rgba(192,57,43,.09); font-weight: 700;
  transform: rotate(-26deg); letter-spacing: .08em;
}

/* ───────── ใบเสร็จ / วางบิล ───────── */
.kv { display: flex; gap: 4mm; font-size: 13.8pt; line-height: 1.6; }
.kv .k { min-width: 32mm; color: #333; }
.wht-box {
  border: 1.5px solid #c0392b; border-radius: 2mm; padding: 2mm 3mm;
  margin-top: 3mm; font-size: 13.2pt; background: #fdf3f1;
}

/* ───────── ตอนพิมพ์จริง ───────── */
@page { size: A4 portrait; margin: 0; }
@page landscape { size: A4 landscape; }

@media print {
  html, body { background: #fff !important; }
  .app, .toasts, .modal-bg, .preview-bar { display: none !important; }
  #print-root { display: block !important; position: static !important;
                background: #fff !important; padding: 0 !important; }
  .sheet {
    width: 210mm; min-height: 296mm; margin: 0; box-shadow: none;
    padding: 13mm 11mm 12mm; page-break-after: always; break-after: page;
  }
  .sheet:last-child { page-break-after: auto; break-after: auto; }
  table.doc tr { page-break-inside: avoid; break-inside: avoid; }
  thead { display: table-header-group; }
  .signs { page-break-inside: avoid; break-inside: avoid; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}