From 583e54fabcc47ddf2b9f60610e4874c3f302c55c Mon Sep 17 00:00:00 2001
From: Sharang Parnerkar <30073382+mighty840@users.noreply.github.com>
Date: Tue, 12 May 2026 18:55:35 +0200
Subject: [PATCH] fix(print): use CSS named pages + break-before for reliable
 Firefox pagination
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

page: slide-page on each block wrapper forces Firefox to allocate a new
physical page per slide — the spec-correct approach. break-before: page
is belt-and-suspenders. Switched from break-after to break-before via
adjacent sibling selector to avoid a blank trailing page.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 pitch-deck/app/pitch-print/print.css | 33 +++++++++++++++++++---------
 1 file changed, 23 insertions(+), 10 deletions(-)

diff --git a/pitch-deck/app/pitch-print/print.css b/pitch-deck/app/pitch-print/print.css
index 94a2d64..a303826 100644
--- a/pitch-deck/app/pitch-print/print.css
+++ b/pitch-deck/app/pitch-print/print.css
@@ -1,3 +1,9 @@
+/* Named page rule — must be outside @media print */
+@page slide-page {
+  size: A4 landscape;
+  margin: 0;
+}
+
 @media screen {
   body { background: #d1d5db; }
 }
@@ -31,23 +37,30 @@
     display: block !important;
   }
 
-  /* Block wrapper handles page breaks — flex containers break unreliably in Chrome */
-  .print-page-break {
+  /*
+   * Block wrapper owns the page break.
+   * - `page: slide-page` assigns each wrapper its own named page type,
+   *   which forces Firefox/Chrome to start a new physical page per element.
+   * - break-before/page-break-before are belt-and-suspenders for older engines.
+   * - We use break-before (not break-after) to avoid a blank trailing page.
+   */
+  .print-page-break + .print-page-break {
+    page: slide-page;
     display: block !important;
-    page-break-after: always !important;
-    break-after: page !important;
-    page-break-inside: avoid !important;
-    break-inside: avoid !important;
+    break-before: page !important;
+    page-break-before: always !important;
     margin: 0 !important;
     padding: 0 !important;
   }
 
-  .print-page-break:last-child {
-    page-break-after: auto !important;
-    break-after: auto !important;
+  .print-page-break:first-child {
+    page: slide-page;
+    display: block !important;
+    margin: 0 !important;
+    padding: 0 !important;
   }
 
-  /* Flex container for internal layout only — no break properties here */
+  /* Flex layout inside each slide — no break properties here */
   .print-page {
     width: 297mm !important;
     height: 210mm !important;