/* quote-document.css: the document's own look (CRM v2 P15), shared by the print page and the customer
   page. Every rule but the page box is scoped under .qd so it styles neither host page. The @page rule
   cannot be scoped: any page of a host that loads this file prints on A4 with 14 mm margins, and the
   admin SPA loads it on every route; that is accepted. A document is PAPER: its colours are fixed
   rather than the app's theme tokens, so a printed quote never comes out in dark mode. */
.qd { box-sizing: border-box; width: 210mm; max-width: 100%; margin: 0 auto; padding: 16mm 18mm; background: #fff;
  color: #1f2a1a; font: 10.5pt/1.45 system-ui, sans-serif; }
.qd-header { display: flex; justify-content: space-between; gap: 24px; padding-bottom: 16px; border-bottom: 1px solid #d9dfd3; }
.qd-from { min-width: 0; overflow-wrap: anywhere; }
.qd-sender { font-size: 15pt; font-weight: 600; }
/* The sender's logo (CRM v2 S4b-e): never taller than a line of the heading block, never wider than the sender column,
   the same on screen and on paper. No logo, no rule applies and no space is held (S4b-f). */
.qd-logo { display: block; max-height: 64px; max-width: 240px; margin-bottom: 8px; }
.qd-meta { text-align: right; }
.qd-kicker { margin: 0; font-size: 8pt; letter-spacing: 0.12em; text-transform: uppercase; color: #6b7466; }
.qd-number { font-size: 18pt; font-weight: 600; }
.qd-muted { color: #5b6456; font-size: 9pt; }
.qd-to { margin-top: 20px; }
.qd-recipient { margin-top: 4px; font-weight: 600; }
.qd-title { margin: 24px 0 6px; font-size: 15pt; }
.qd-text { margin: 4px 0 0; white-space: pre-line; }
.qd-lines { width: 100%; margin-top: 16px; border-collapse: collapse; font-size: 9.5pt; }
.qd-lines th { padding: 6px 4px; border-bottom: 2px solid #1f2a1a; text-align: left; font-size: 7.5pt;
  letter-spacing: 0.1em; text-transform: uppercase; color: #5b6456; }
.qd-lines td { padding: 6px 4px; border-bottom: 1px solid #d9dfd3; vertical-align: top; }
.qd-lines tr { break-inside: avoid; }
.qd-num { text-align: right; font-variant-numeric: tabular-nums; }
.qd-item { font-weight: 500; }
.qd-totals { width: 80mm; max-width: 100%; margin: 12px 0 0 auto; break-inside: avoid; }
.qd-total { display: flex; justify-content: space-between; padding: 5px 0; border-bottom: 1px solid #d9dfd3; }
.qd-grand { border-bottom: none; font-size: 11pt; font-weight: 600; }
.qd-note { text-align: right; font-size: 8pt; color: #6b7466; }
.qd-block { margin-top: 20px; break-inside: avoid; }
.qd-term { display: flex; gap: 16px; padding: 2px 0; }
.qd-term > :first-child { min-width: 40mm; }
@media print {
  @page { size: A4; margin: 14mm; }
  .qd { width: auto; padding: 0; }
}
@media (max-width: 640px) {
  .qd { padding: 24px 16px; }
  .qd-header { flex-direction: column; }
  .qd-meta { text-align: left; }
}
/* The customer's page is read on phones, and a page that scrolls sideways zooms out: on a narrow screen the lines
   scroll inside the sheet instead. Screen only: paper cannot scroll, so a print keeps the lines a real table. */
@media screen and (max-width: 640px) {
  .qd-lines { display: block; overflow-x: auto; }
}