/* X09 Docs — the printed document (shared by the app preview, PDF and client page) */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Caveat:wght@500&display=swap");

.paper {
  --accent: #111;
  position: relative; width: 100%; max-width: 820px; margin: 0 auto; padding: 56px 60px 44px;
  background: #fff; color: #1b1b1b; font: 13.5px/1.55 "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  border-top: 6px solid var(--accent); overflow: hidden; text-align: left; letter-spacing: 0;
}
.paper * { box-sizing: border-box; }
.pp-head { display: flex; justify-content: space-between; gap: 28px; padding-bottom: 26px; border-bottom: 1px solid #e6e6e6; }
.pp-from { min-width: 0; }
.pp-logo { display: block; max-width: 160px; max-height: 64px; object-fit: contain; margin-bottom: 12px; }
.pp-biz { font-size: 17px; font-weight: 600; color: #111; margin-bottom: 4px; }
.pp-sm { color: #666; font-size: 12.5px; overflow-wrap: anywhere; }
.pp-meta { text-align: right; flex-shrink: 0; }
.pp-type { font-size: 30px; font-weight: 700; letter-spacing: -.02em; color: var(--accent); text-transform: uppercase; line-height: 1; margin-bottom: 14px; }
.pp-kv { margin-left: auto; border-collapse: collapse; font-size: 12.5px; }
.pp-kv th { text-align: right; font-weight: 500; color: #888; padding: 2px 12px 2px 0; white-space: nowrap; }
.pp-kv td { text-align: right; color: #111; padding: 2px 0; white-space: nowrap; }
.pp-parties { display: flex; justify-content: space-between; gap: 24px; padding: 24px 0 8px; }
.pp-label { font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #999; margin-bottom: 6px; }
.pp-client { font-size: 15px; font-weight: 600; color: #111; }
.pp-due { text-align: right; flex-shrink: 0; }
.pp-big { font-size: 26px; font-weight: 700; color: #111; letter-spacing: -.01em; }
.pp-title { font-size: 20px; font-weight: 600; color: #111; margin: 18px 0 6px; letter-spacing: -.01em; }
.pp-section { margin-top: 18px; break-inside: avoid-page; }
.pp-section h2 { font-size: 14px; font-weight: 600; color: var(--accent); margin: 0 0 6px; }
.pp-rich p { margin: 0 0 8px; }
.pp-rich ul, .pp-rich ol { margin: 0 0 8px; padding-left: 20px; }
.pp-rich li { margin: 2px 0; }
.pp-items { width: 100%; border-collapse: collapse; margin-top: 22px; }
.pp-items th { font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: var(--accent); padding: 9px 10px; text-align: left; }
.pp-items td { padding: 10px; border-bottom: 1px solid #eee; vertical-align: top; }
.pp-items .n { text-align: right; white-space: nowrap; width: 1%; }
.pp-items tr { break-inside: avoid; }
.pp-empty { color: #aaa; text-align: center; font-style: italic; }
.pp-totals { margin: 12px 0 0 auto; border-collapse: collapse; min-width: 260px; }
.pp-totals th { text-align: left; font-weight: 500; color: #666; padding: 5px 24px 5px 0; }
.pp-totals td { text-align: right; padding: 5px 0; white-space: nowrap; color: #111; }
.pp-totals .pp-grand th, .pp-totals .pp-grand td { font-size: 15px; font-weight: 700; color: #111; border-top: 2px solid #111; padding-top: 9px; }
.pp-block { margin-top: 22px; break-inside: avoid-page; color: #333; }
.pp-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 44px; break-inside: avoid; }
.pp-sig-line { height: 46px; border-bottom: 1px solid #333; display: flex; align-items: flex-end; padding-bottom: 2px; }
.pp-script { font: 500 30px/1 "Caveat", "Brush Script MT", cursive; color: #10245a; }
.pp-sig .pp-sm { margin-top: 6px; }
.pp-foot { margin-top: 40px; padding-top: 14px; border-top: 1px solid #eee; font-size: 11px; color: #aaa; text-align: center; letter-spacing: .06em; }
.pp-stamp {
  display: inline-block; margin-top: 12px; padding: 4px 12px; border: 2px solid #111; border-radius: 4px; transform: rotate(-4deg);
  font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: #111;
}
.pp-stamp-paid, .pp-stamp-accepted { color: #137a3e; border-color: #137a3e; }
.pp-stamp-declined, .pp-stamp-void { color: #9b1c1c; border-color: #9b1c1c; }

@media (max-width: 640px) {
  .paper { padding: 30px 20px 26px; font-size: 12.5px; }
  .pp-head, .pp-parties { flex-direction: column; gap: 16px; }
  .pp-meta, .pp-due { text-align: left; }
  .pp-kv { margin-left: 0; }
  .pp-kv th { text-align: left; }
  .pp-kv td { text-align: left; }
  .pp-type { font-size: 24px; }
  .pp-items th:nth-child(3), .pp-items td:nth-child(3) { display: none; }
  .pp-totals { min-width: 0; width: 100%; }
  .pp-sign { grid-template-columns: 1fr; gap: 26px; }
}

/* ---------- Print / Save as PDF ---------- */
.print-root { display: none; }
@page { size: auto; margin: 12mm; }
@media print {
  html, body { background: #fff !important; height: auto !important; overflow: visible !important; }
  body > :not(.print-root) { display: none !important; }
  .print-root { display: block !important; }
  .paper { max-width: none; padding: 0 0 10px; border-top: 0; box-shadow: none !important; font-size: 12px; }
  .pp-items th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  #starfield { display: none !important; }
}