/* =========================================================================
   QUOTATION DOCUMENT — styles for the letterhead rendered by
   renderDocumentHTML() in quote-doc.js. Uses the colour tokens from
   app.css (load it first).
   ========================================================================= */
.doc{
  width:680px; margin:0 auto; background:#fff; padding:40px 44px 34px; position:relative;
  font-size:12px; color:#22282F; box-shadow:0 2px 10px rgba(0,0,0,.08); border:1px solid #E4E7EA;
}
.doc .stamp{
  flex-shrink:0; margin-right:6px; border:3px solid var(--draft); color:var(--draft);
  padding:5px 14px; font-weight:800; font-size:15px; letter-spacing:.12em; transform:rotate(-8deg);
  border-radius:6px; opacity:.55; font-family:'IBM Plex Mono',monospace;
}
.doc .stamp.sent{ border-color:var(--success); color:var(--success); }
.doc-head{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px; margin-bottom:14px; }
.doc-head .co{ text-align:center; white-space:nowrap; font-weight:800; font-size:31px; line-height:1.1; color:var(--navy); letter-spacing:.01em; text-transform:uppercase; }
.doc-head .tax{ justify-self:end; text-align:right; font-size:10.5px; color:var(--muted); }
.doc-rule{ height:3px; background:linear-gradient(90deg,var(--navy),var(--amber)); border-radius:2px; margin-bottom:16px; }
.doc-meta{ display:grid; grid-template-columns:1fr 1fr; gap:2px 18px; margin-bottom:14px; }
.doc-meta .mrow{ display:flex; font-size:11.5px; padding:2px 0; }
.doc-meta .mrow .k{ width:112px; color:var(--muted); flex-shrink:0; }
.doc-meta .mrow .v{ font-weight:600; }
.doc-meta .mrow.wide{ grid-column:1 / -1; }
.doc-intro{ display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:11.5px; margin:14px 0 8px; color:#3A4149; }
.doc-intro > span{ font-style:italic; }
table.doc-items{ width:100%; border-collapse:collapse; margin-bottom:2px; }
table.doc-items thead th{
  background:var(--navy); color:#fff; font-size:9.5px; text-transform:uppercase; letter-spacing:.04em;
  padding:6px 6px; text-align:left; font-weight:700;
}
table.doc-items thead th.r{ text-align:right; }
table.doc-items thead th.c{ text-align:center; }
table.doc-items thead th .en{ text-transform:none; font-weight:500; opacity:.75; letter-spacing:.02em; }
table.doc-items tbody td{ padding:6px 6px; font-size:11px; border-bottom:1px solid #EEF0F2; vertical-align:top; }
table.doc-items tbody td.r{ text-align:right; font-family:'IBM Plex Mono',monospace; }
table.doc-items tbody td.c{ text-align:center; }
.doc-totals{ display:flex; justify-content:flex-end; margin-top:4px; }
.doc-totals table{ border-collapse:collapse; width:260px; }
.doc-totals td{ padding:4px 4px; font-size:11px; }
.doc-totals td.l{ color:var(--muted); }
.doc-totals td.r{ text-align:right; font-family:'IBM Plex Mono',monospace; font-weight:600; }
.doc-totals tr.grand td{ border-top:1.5px solid var(--ink); font-weight:800; font-size:12.5px; padding-top:7px; color:var(--amber-dark); }
.doc-terms{ margin-top:16px; }
.doc-terms .mrow{ display:flex; font-size:11px; padding:2.5px 0; }
.doc-terms .mrow .k{ width:136px; color:var(--muted); flex-shrink:0; }
.doc-terms .mrow .v{ font-weight:500; white-space:pre-line; }
.doc-foot{ margin-top:24px; text-align:center; border-top:1px solid #EEF0F2; padding-top:12px; }
.doc-foot .name{ font-weight:800; font-size:11.5px; color:var(--navy); }
.doc-foot .addr{ font-size:9.5px; color:var(--muted); margin-top:3px; line-height:1.5; white-space:pre-line; }

/* ---------- Document extras ---------- */
.doc-words{ margin-top:8px; font-size:11px; text-align:right; font-style:italic; color:#3A4149; }
.doc-words .k{ color:var(--muted); }
table.doc-items tbody td.desc{ white-space:pre-wrap; }
table.doc-items tbody tr.note-row td{ font-style:italic; }
table.doc-items tbody td.desc .item-img{ display:block; margin-top:6px; max-width:180px; max-height:130px; object-fit:contain; }
/* bilingual labels (biLabel in quote-doc.js): English line under the Vietnamese one */
.doc .en{ display:block; font-size:.85em; font-style:italic; line-height:1.25; opacity:.8; }
.doc .stamp .en{ font-size:9px; font-style:normal; text-align:center; letter-spacing:.2em; opacity:1; }
.doc-totals td.l .en{ font-size:.8em; }

/* ---------- PDF export (see exportQuotationPDF in quote-doc.js) ---------- */
.pdf-host{ position:fixed; left:-10000px; top:0; }
/* a little narrower than the ~718px A4 content width, or html2pdf crops the right edge */
.doc.doc-pdf{ width:700px; margin:0; padding:0; border:none; box-shadow:none; }