/* biome-ignore-all lint/complexity/noImportantStyles: print CSS must override Tailwind utility classes; !important is the documented escape hatch */ /* Print-only CSS overrides — loaded by the partner view when ?print=1 is set. Toggled via data-print="true" on , set by a tiny script in root.tsx so the styles apply before paint. PAGE-BREAK STRATEGY ------------------- Each dashboard section (`
`) starts on a fresh PDF page. Within a section, break naturally (long tables span pages) — only individual tiles, cards, and table rows are kept together. The Playwright `headerTemplate` injects a navy MIINTO running header on every page, so the in-content navy strip is hidden in print and the per-page margin-top is small. */ html[data-print="true"] { background: #ffffff !important; } html[data-print="true"] body { background: #ffffff !important; } /* Print convention: pure white background, no Miinto-paper ivory tint. Printed paper IS already off-white; layering another beige reads dingy under printer / on-screen PDF viewers. Override the dashboard's `.bg-background` (#F4F2EE) and `.bg-ivory` (#FAF8F5) tokens — even the table-header bands switch to white so the report reads clean. */ html[data-print="true"] .bg-background { background-color: #ffffff !important; } html[data-print="true"] .bg-ivory { background-color: #ffffff !important; } /* Card surfaces stay white but pick up a slightly darker border in print so they still read as cards on white-on-white. */ html[data-print="true"] .border-border { border-color: #d8d2c7 !important; } html[data-print="true"] * { animation: none !important; transition: none !important; } /* Kill the in-content navy strip — Playwright's headerTemplate puts an equivalent strip on every page via PDF chrome, so duplicating it inside page 1's body wastes vertical space. */ html[data-print="true"] header[data-partner-banner] { display: none !important; } /* Kill min-h-dvh on the partner-view root so we don't get a forced viewport-tall first page leaving 80% empty space. */ html[data-print="true"] .min-h-dvh { min-height: 0 !important; } /* JumpNav is interactive UI — nothing to click in a PDF and the labels duplicate the section eyebrows below. Hide entirely. */ html[data-print="true"] [data-jump-nav], html[data-print="true"] nav[aria-label="section-jump"], html[data-print="true"] .shadow-jump { display: none !important; } html[data-print="true"] .sticky { position: static !important; } html[data-print="true"] [role="tooltip"], html[data-print="true"] .print\:hidden { display: none !important; } /* ── Page-break discipline ──────────────────────────────────────────── */ /* Every top-level dashboard section starts on a fresh PDF page. `data-section` is set by the shared
component. */ html[data-print="true"] section[data-section] { break-before: page; page-break-before: always; } /* The first section (General Performance) inherits the page-1 break naturally from the document start — no need to force another break above it. */ html[data-print="true"] section[data-section="headline"] { break-before: auto; page-break-before: avoid; } /* Allow long sections (brand table, best-sellers grid, returns brand ranking) to span pages naturally. The whole-section `break-inside: avoid` we had before forced 80% empty pages whenever a section didn't fit. */ html[data-print="true"] section[data-section] { break-inside: auto; page-break-inside: auto; } /* But KEEP these small units intact across pages: KPI tiles, product cards, table rows, the headline gradient card. */ html[data-print="true"] [data-keep-together], html[data-print="true"] article, html[data-print="true"] tr { break-inside: avoid; page-break-inside: avoid; } /* Tighten section spacing so we don't waste paper at the top of every page. */ html[data-print="true"] .gap-14 { gap: 1.25rem !important; } html[data-print="true"] .pb-20 { padding-bottom: 0 !important; } html[data-print="true"] .pt-6 { padding-top: 0.25rem !important; } html[data-print="true"] section[data-section] { padding-top: 0.5rem; padding-bottom: 0.5rem; } /* Keep the section title with its first content block — avoid orphan section headers stranded at the bottom of a page. */ html[data-print="true"] section[data-section] > div:first-child { break-after: avoid; page-break-after: avoid; } /* Best Sellers grid: print at 3 columns instead of screen's 4. An 8-card snapshot (pre-split-query analyses) renders as 3+3+2 = three visible rows; a fresh 12-card snapshot renders as 3+3+3 (sliced to 9) so the section still occupies exactly three rows on a single page. Also shrink card image from screen's aspect-[3/4] (portrait) to a landscape-ish aspect for print so all three rows fit on one A4 page instead of breaking onto two. */ html[data-print="true"] [data-best-sellers-grid] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 12px !important; } html[data-print="true"] [data-best-sellers-grid] > *:nth-child(n + 10) { display: none !important; } /* Card image: override aspect-[3/4] → aspect-[4/3] (landscape) so each card is ~360px tall instead of ~640px. */ html[data-print="true"] [data-best-sellers-grid] > article > div:first-child { aspect-ratio: 4 / 3 !important; } /* Tighten card body padding in print so the text block doesn't add extra height beyond what's needed for the value + footer triplet. */ html[data-print="true"] [data-best-sellers-grid] > article { break-inside: avoid; page-break-inside: avoid; }