/* The invoice document itself - styled to match the sample PDFs.
   Used for both the on-screen preview and the generated PDF. */

.inv {
  background: #fff;
  color: #111;
  width: 794px;            /* ~A4 width at 96dpi */
  min-height: 1010px;
  padding: 56px 60px;
  margin: 0 auto;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.5;
  box-shadow: 0 1px 4px rgba(0,0,0,.12);
}

/* Header: from-business (left) + Invoice title (right) */
.inv-head { display: flex; justify-content: space-between; align-items: flex-start; }
.inv-from-name { font-weight: 700; margin-bottom: 4px; }
.inv-from-addr { white-space: normal; }
.inv-title { text-align: right; }
.inv-title-word { font-size: 38px; font-weight: 700; line-height: 1; }
.inv-number { margin-top: 6px; font-size: 14px; }

/* Bill-to + dates row */
.inv-meta { display: flex; justify-content: space-between; align-items: flex-start; margin-top: 34px; }
.inv-billto { max-width: 60%; }
.inv-label { color: #111; margin-bottom: 14px; }
.inv-cust-name, .inv-cust-addr, .inv-cust-email { line-height: 1.5; }
.inv-cust-email { margin-top: 2px; }
.inv-dates { text-align: right; min-width: 230px; }
.inv-dates .d-row { margin-bottom: 4px; }
.inv-dates .d-row .lbl { color: #111; margin-right: 10px; }
.inv-dates .d-row b { font-weight: 600; }

/* Line items table */
.inv-table { width: 100%; border-collapse: collapse; margin-top: 40px; }
.inv-table thead th {
  background: #000; color: #fff; font-weight: 700; font-size: 12.5px;
  padding: 7px 10px; text-align: right; border: 1px solid #000;
}
.inv-table thead th.c-desc { text-align: left; }
.inv-table tbody td {
  border: 1px solid #cfcfcf; padding: 8px 10px; text-align: right; vertical-align: top;
}
.inv-table tbody td.c-desc { text-align: left; }
.inv-table .c-qty { width: 120px; }
.inv-table .c-rate { width: 130px; }
.inv-table .c-amt { width: 130px; }

/* Totals */
.inv-totals { margin-top: 18px; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.inv-total-row { display: flex; gap: 40px; min-width: 300px; justify-content: flex-end; }
.inv-total-row .lbl { color: #333; }
.inv-total-row .val { font-weight: 700; min-width: 110px; text-align: right; }
.inv-grand .lbl, .inv-grand .val { font-size: 14px; }

/* Notes */
.inv-notes { margin-top: 60px; }
.inv-notes .inv-label { margin-bottom: 8px; }

/* Bank / payment block */
.inv-bank { margin-top: 34px; font-weight: 700; }
.inv-bank-line { margin-bottom: 10px; }

/* On-screen preview: scale the full-size (794px) invoice down to fit the form column.
   PDF export renders the invoice off-screen at full size, so it is unaffected. */
.preview-col { overflow-x: auto; }
.preview-col #preview { zoom: 0.66; }
@media (max-width: 1100px) { .preview-col #preview { zoom: 0.85; } }

/* Print: render just the invoice, full page */
@media print {
  body * { visibility: hidden; }
  .inv, .inv * { visibility: visible; }
  .inv { position: absolute; left: 0; top: 0; box-shadow: none; width: 100%; padding: 40px; }
  .sidebar, .toolbar, .page-head { display: none !important; }
}