/* ============================================================
   print.css — จัดหน้าใบส่งสินค้า / ใบกำกับภาษี ให้ปริ้น A4
   ============================================================ */

/* ---- บนจอ: แสดงเอกสารเป็นการ์ดพื้นขาวให้เห็นก่อนปริ้น ---- */
.doc{background:#fff;color:#111;border-radius:10px;padding:20px;
  font-size:13px;line-height:1.45;max-width:780px;margin:0 auto}
.doc .dhead{display:flex;gap:16px;align-items:flex-start;
  border-bottom:2px solid #111;padding-bottom:11px;margin-bottom:13px}
 /* ★ โลโก้เป็นทรงเกือบจัตุรัส ไม่ใช่แถบยาวเหมือนอันเก่า
      ถ้าคุมด้วยความกว้างอย่างเดียว มันจะสูงเกินจนดันหัวใบบานทั้งแถบ
      เลยคุมที่ "ความสูง" แทน แล้วปล่อยความกว้างวิ่งตามสัดส่วน */
.doc .dlogo{height:82px;width:auto;flex:0 0 auto}
/* โลโก้อยู่ซ้าย ข้อมูลบริษัทต่อทางขวา เป็นก้อนเดียวกันฝั่งซ้ายของหัวใบ
   ★ กันไม่ให้ก้อนซ้ายกว้างเกิน ไม่งั้นที่อยู่ยาวๆ จะดันตารางเลขที่ใบตกบรรทัด */
.doc .dfrom{display:flex;flex-direction:row;align-items:center;gap:13px;
  min-width:0;max-width:66%}
.doc .dfromtxt{font-size:11.5px;line-height:1.45;color:#333;min-width:0}
.doc .dfromtxt b{font-size:13.5px;color:#111;display:block;margin-bottom:2px}
.doc .dmeta{margin-left:auto;text-align:right;flex:0 0 auto}
.doc .dtitle{font-size:19px;font-weight:800;margin-bottom:5px}
.doc table.dm{margin-left:auto;font-size:12.5px;border-collapse:collapse}
.doc table.dm td{padding:1px 0 1px 10px;text-align:right;white-space:nowrap}
.doc table.dm td:first-child{color:#666;padding-left:0;text-align:left}

.doc .dparties{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:13px}
.doc .dlabel{font-size:11px;color:#666;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px}
/* กำหนดส่งในบล็อกจัดส่ง — เว้นให้ห่างจากที่อยู่นิดนึงจะได้ไม่อ่านติดกันเป็นพืด */
/* บรรทัดผู้ติดต่อใต้ที่อยู่ลูกค้า — เบากว่าที่อยู่นิดนึง จะได้ไม่แย่งสายตาชื่อบริษัท */
.doc .dcontact{margin-top:3px;font-size:12px;color:#444}
.doc .dship-when{margin-top:4px}
.doc .dship-in{margin-top:5px}
.doc .dship-in label{display:block;font-size:11px;color:#888;margin-bottom:1px}

.doc table.ditems{width:100%;border-collapse:collapse;margin-bottom:11px}
.doc table.ditems th,.doc table.ditems td{border:1px solid #bbb;padding:6px 8px;text-align:left}
.doc table.ditems thead th{background:#f2f2f2;font-size:11.5px}
.doc table.ditems .num{text-align:right;font-variant-numeric:tabular-nums}
.doc table.ditems .sm{font-size:11px;color:#555}
/* ชื่ออังกฤษต่อท้ายในบรรทัดเดียวกัน ไม่ขึ้นบรรทัดใหม่ */
.doc table.ditems .en{font-size:11px;color:#666;margin-left:6px}
.doc .vt{font-size:9.5px;background:#111;color:#fff;padding:1px 4px;border-radius:3px;vertical-align:middle}

.doc table.dtot{margin-left:auto;border-collapse:collapse;font-size:13px;min-width:250px}
.doc table.dtot td{padding:3px 0 3px 14px;text-align:right}
.doc table.dtot td:first-child{text-align:left;color:#555;padding-left:0}
.doc table.dtot tr.g td{font-weight:800;font-size:15px;border-top:2px solid #111;padding-top:6px}

.doc .dsign{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:38px;
  text-align:center;font-size:12px;color:#444}
.doc .sline{border-bottom:1px solid #666;margin-bottom:5px;height:34px}
/* บรรทัดวันที่ใต้ช่องเซ็นลูกค้า — ห้ามตกบรรทัด ไม่งั้นขีดจะกระจายคนละแถว */
.doc .sdate{white-space:nowrap;margin-top:3px;letter-spacing:.02em}

/* ---- ตอนปริ้นจริง ---- */
@media print{
  @page{ size:A4 portrait; margin:12mm; }
  html,body{background:#fff !important;color:#111 !important}
  /* ซ่อนทุกอย่างที่ไม่ใช่เอกสาร */
  header,nav,.noprint,#toast,button{display:none !important}
  main{padding:0 !important;max-width:none !important}
  .doc{border-radius:0;padding:0;max-width:none;font-size:12px}
  .doc .dlogo{height:74px}
  /* ★ เบราว์เซอร์ไม่พิมพ์สีพื้นหลังโดยปริยาย
     ป้าย VAT ของเดิมเป็นตัวอักษรขาวบนพื้นดำ พอพิมพ์ออกมาพื้นหายไป
     เหลือตัวอักษรขาวบนกระดาษขาว = มองไม่เห็นว่ารายการไหนเสียภาษี
     ตอนพิมพ์เลยเปลี่ยนเป็นตัวอักษรดำมีกรอบแทน ไม่ต้องพึ่งพื้นหลัง */
  .doc .vt{background:transparent !important;color:#111 !important;
    border:1px solid #111;padding:0 3px}
  .doc .dfromtxt{font-size:10.5px}
  /* หัวตารางซ้ำทุกหน้า ถ้ารายการยาวเกิน 1 หน้า */
  .doc table.ditems thead{display:table-header-group}
  .doc table.ditems tr{page-break-inside:avoid}
  .doc .dsign{page-break-inside:avoid}
  a{text-decoration:none;color:#111}
}

/* ---------- ตารางเงื่อนไขท้ายใบเสนอราคา ----------
   ใช้โครง .dm เดิม แต่ .dm ถูกออกแบบมาให้ชิดขวา (ใช้เป็นกล่องเลขที่/วันที่หัวใบ)
   ตัวนี้เป็นบล็อกเงื่อนไขท้ายใบ ต้องชิดซ้ายและตัดบรรทัดได้ เลยต้องเขียนทับ */
.doc table.dm.dterms{margin-left:0; margin-bottom:9px; font-size:12px}
.doc table.dm.dterms td{text-align:left; padding:2px 0 2px 12px; white-space:normal}
.doc table.dm.dterms td:first-child{width:148px; padding-left:0; color:#666}

/* ---------- หัวใบตัวอย่าง บนหน้าสร้าง/แก้ใบเสนอราคา ----------
   ★ ใช้โครง .doc เดิมทั้งหมด ไม่ได้เขียนหน้าตาใหม่
     แก้หน้าตาใบจริงเมื่อไหร่ ตัวอย่างเปลี่ยนตามเอง ไม่มีทางหลุดกัน
   ★ .noprint อยู่แล้วในคลาส ตอนสั่งปริ้นจะไม่ติดออกมา */
.docpreview{margin:0 0 14px; padding-bottom:12px; position:relative}
.docpreview .pvhint{margin-top:10px; padding-top:9px; border-top:1px dashed #ccc;
  font-size:11.5px; color:#777}
@media (max-width:640px){
  .docpreview{padding:14px}
  .docpreview .dlogo{height:62px}
  .doc .dfrom{max-width:none}
  .doc .dhead{flex-direction:column}
  .doc .dmeta{margin-left:0;text-align:left}
  .doc table.dm{margin-left:0}
  .doc table.dm td{text-align:left}
}

/* ============================================================
   .docedit — ใบเสนอราคาที่ "แก้ตรงบนใบ" ได้เลย (หน้าสร้าง/แก้ใบ)
   ★ ช่องกรอกต้องดูกลมกลืนไปกับกระดาษ ไม่ใช่กล่องฟอร์มลอยอยู่บนใบ
     คนจะได้รู้สึกว่ากำลังเขียนลงบนใบจริง ไม่ใช่กรอกฟอร์มแล้วค่อยไปเป็นใบ
   ★ แต่ต้องยังดูออกว่า "ตรงไหนแก้ได้" — ใช้เส้นใต้ประ + พื้นจางตอนชี้
     ถ้ากลมกลืนจนไม่รู้ว่าแก้ได้ ก็แย่พอกับที่มันดูเป็นฟอร์ม
   ============================================================ */
.docedit{position:relative}

.docedit .inp-doc{
  font:inherit; font-size:12.5px; color:#111;
  background:transparent; border:0; border-bottom:1px dashed #aaa;
  padding:2px 3px; border-radius:0; outline:none; min-width:0;
}
.docedit .inp-doc:hover{background:#f4f7f5}
.docedit .inp-doc:focus{border-bottom-color:#2a6f6a; background:#eef5f2}
.docedit .inp-doc::placeholder{color:#aaa; font-style:italic}
.docedit .inp-doc.line{display:block; width:100%}
.docedit .sel-doc{font-size:14px; font-weight:800; max-width:100%}
.docedit .dm .inp-doc{text-align:right}
.docedit label{cursor:pointer}

.docedit .dcust{margin-top:3px; color:#333}
.docedit .dnote{font-size:11px; color:#999; margin-top:2px}

/* ที่ว่างแทนตารางสินค้า — ตารางจริงอยู่ข้างล่าง (มีค้นหา/กรอง ใส่ในใบไม่ไหว) */
.docedit .ditems-slot{border:1px dashed #c8c8c8; border-radius:6px;
  padding:10px 12px; margin:14px 0 12px; background:#fafafa}
.docedit .slot-head{font-size:11px; color:#888; margin-bottom:4px}
.docedit .slot-body{font-size:13px; color:#111}

.docedit .dfoot-edit{display:grid; gap:9px; margin-top:6px}
.docedit .dfoot-edit label{display:block; font-size:11px; color:#888; margin-bottom:1px}
.docedit .dterm-fixed{font-size:12px; color:#333; padding-top:8px;
  border-top:1px dashed #ccc; margin-top:3px}

/* ---------- รายการสินค้าที่โชว์บนใบตอนกำลังทำ ---------- */
.docedit .ditems-slot{padding:10px 12px 12px}
.docedit .slot-empty{font-size:12.5px; color:#888; padding:6px 0}
.docedit .slot-pre{font-size:11.5px; color:#7a5200; background:#fdf2d5;
  border-radius:5px; padding:5px 8px; margin:4px 0 8px}
.docedit .slot-pre:empty{display:none}
.docedit .slot-pre .mini{margin-left:6px}
.docedit .ditems{margin-bottom:8px}
.docedit .ditems th,.docedit .ditems td{padding:4px 7px; font-size:12px}
/* แถวที่ยังไม่ใส่ราคา — ต้องสะดุดตาตั้งแต่ตอนทำ ไม่ใช่ไปเจอตอนกดบันทึกแล้วโดนปฏิเสธ */
.docedit .ditems tr.noprice td{background:#fdf2d5}
.docedit .needprice{color:#7a5200; font-style:italic; font-size:11px}

/* ---------- หน้ารับ PO ที่ใช้โครงเอกสารเดียวกัน ---------- */
.docedit .dlabel2{display:block; font-size:11px; color:#888; margin-bottom:1px}
.docedit .req{color:#c9251c}
.docedit .ditems td .mini{padding:1px 6px; font-size:11px}
.docedit .ditems .center{text-align:center}
.docedit .ditems .dim{color:#999}