/* Print stylesheet — replaces jspdf + jspdf-autotable + html2canvas.
 *
 * The React app generated PDFs in the browser by rasterising the DOM, which cost
 * ~600 KB of bundle (jspdf 400 KB + html2canvas 200 KB) to produce a screenshot
 * of a table. Print-to-PDF gives selectable text, real page breaks and correct
 * fonts for nothing, and every browser and phone can already do it.
 *
 * Reports also offer a genuine CSV/Excel download from export.php; this covers the
 * "give me a PDF of what I'm looking at" case.
 */

@page {
  size: A4 landscape;
  margin: 12mm 10mm;
}

/* Chrome only prints backgrounds when asked, and dark mode would otherwise waste
   an entire toner cartridge. Force the light palette for print. */
:root {
  --print-ink: #111827;
}

* {
  background: transparent !important;
  color: var(--print-ink) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Chrome/room furniture that means nothing on paper. */
.sidebar,
.topbar,
.nav,
.filters-bar,
.page-actions,
.report-actions,
.report-cards,
.toolbar,
.form-actions,
.calls-actions,
.wpu-actions,
.row-actions,
.calls-row-actions,
.modal-backdrop,
.theme-toggle,
button,
.btn,
input,
select,
textarea {
  display: none !important;
}

/* The shell is a CSS grid on screen; on paper it is a single column. */
.app-shell,
.main,
.content,
.page {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  max-width: none !important;
}

.card,
.panel,
section.card {
  border: 1px solid #d1d5db !important;
  border-radius: 0 !important;
  padding: 6mm !important;
  margin: 0 0 5mm 0 !important;
  /* Keep a panel and its heading together rather than orphaning the title. */
  break-inside: avoid;
}

h1 { font-size: 16pt !important; margin: 0 0 2mm !important; }
h2 { font-size: 13pt !important; }
h3 { font-size: 11pt !important; }
body { font-size: 9pt !important; }

/* Tables are the point of most of these reports. */
.table-scroll { overflow: visible !important; }

table.table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 8pt !important;
}

table.table th,
table.table td {
  border: 1px solid #d1d5db !important;
  padding: 1.5mm 2mm !important;
  text-align: left !important;
}

table.table th {
  background: #f3f4f6 !important;
  font-weight: 700 !important;
}

/* Repeat the header on every page of a long table. */
table.table thead { display: table-header-group; }
table.table tr { break-inside: avoid; }

/* Gains and losses still need to be distinguishable in greyscale. */
.pos::before { content: '▲ '; }
.danger::before { content: '▼ '; }

/* Charts are canvases; they print as-is but must not span a page break. */
.chart-box { break-inside: avoid; page-break-inside: avoid; }
.chart-grid { display: block !important; }

/* KPI tiles reflow into a simple wrapped row. */
.glass-kpi-grid,
.perf-kpi-grid,
.wp-summary {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 3mm !important;
}

.glass-kpi,
.perf-kpi,
.wp-chip {
  border: 1px solid #d1d5db !important;
  padding: 3mm !important;
  min-width: 40mm;
  break-inside: avoid;
}

/* A printed page has no clickable links, so the raw URL is noise. */
a[href]::after { content: none !important; }
a { text-decoration: none !important; }

/* Stamped by the report pages so the printout says what it is. */
.print-only { display: block !important; }
