/* ═══ GLOBAL PRINT FIX (2026-07-27) ══════════════════════════════════════════════════════════════
   Fixes two app-wide printing bugs. Print media only — screens are untouched.

   1) THE SHRINK: Bootstrap 4 ships, inside bootstrap(.min).css,
          @media print { @page { size: a3 }  body, .container { min-width: 992px !important } }
      Portrait paper offers only ~718 CSS px, so Chrome laid EVERY page out 992px wide (on an A3
      canvas!) and scaled the whole sheet down to ~72% to fit. Result on every printout: small text,
      content squeezed to the left, right side of the paper blank. Killing the floors lets each page
      lay out at the true paper width and print at 100% scale.
      (.container also gets width:auto/max-width:100%, otherwise Bootstrap's own responsive
      max-width — 540px at paper width — would squeeze content into a narrow centred column.)

   2) THE COLOURED BOTTOM: the appearance theme paints html/body with the theme colour, and pages
      force  * { print-color-adjust: exact }  — so wherever the white content div ends, the theme
      colour printed on the rest of the sheet. The PAPER itself must be white; content elements
      keep their own colours.

   Loaded in mobile.app AFTER all global CSS and BEFORE @stack('css'), so per-page print blocks
   can still override anything here. */

@media print {
    @page { size: auto; }

    html, body, .container { min-width: 0 !important; }
    .container { max-width: 100% !important; width: auto !important; }

    html, body {
        background: #fff !important;
        background-color: #fff !important;
        background-image: none !important;
    }

    /* 3) On-screen action bars (PRINT / Edit buttons — .topButtonGroup, used on ~56 finance screens)
          are meaningless on paper, and some carry fixed widths (e.g. .pdfWidth = 1000px) that force the
          sheet wider than the paper — triggering the same shrink as (1) even when they LOOK invisible. */
    .topButtonGroup { display: none !important; }

    /* 3b) App CHROME never prints. The slide-out side menu (its dark full-screen backdrop + themed
           panel) and the page loader are position:fixed overlays hidden only by SCREEN rules/JS state —
           in print media they can surface and stamp themselves over page 1 (the "full coloured first
           page"). The top bars and the bottom 4-tab bar are navigation, not document content. */
    .sideMenuDiv, .se-pre-con, .topHeader, .topSubHeader, .bottomButtonDiv { display: none !important; }

    /* 4) The shared document-canvas classes (used by the printable finance documents — payment
          vouchers, invoices, credit/debit notes, claim forms) were designed on a fixed ~1000px canvas.
          Fit them to the paper so the document prints at 100% scale. */
    .pdfWidth, .pdfBodyDiv, .pdfDivMain, .container-1030 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    /* The document canvas must be IN-FLOW to paginate. On the PV/invoice family .pdfDivMain is
       position:absolute (an overlay ~1400px tall over a ~360px in-flow page) — Chrome cannot page-break
       absolutely-positioned content, producing a BLANK first sheet and sliced/shifted pages. It only
       looked fine before because the old ~72% shrink squeezed the whole overlay onto one sheet. Static +
       natural height = normal flow = normal page breaks. (The claim form page already does this in its
       own print block — same cure, now for every document page.) */
    .pdfDivMain {
        position: static !important;
        height: auto !important;
        min-height: 0 !important;
    }
    .pdfBodyDiv {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
    }
    /* The signature block (.pdfFooter, "Received By") is position:absolute; bottom:50px — anchored to
       the bottom of the old full-height canvas. With the canvas at natural height it lands ON TOP of the
       table. Flow it after the content instead, with signing room, and never split it across pages. */
    .pdfFooter {
        position: static !important;
        margin-top: 70px !important;
        page-break-inside: avoid !important; break-inside: avoid !important;
    }
    /* Documents print on pure WHITE. Several doc blades paint the canvas light grey in their own print
       blocks (.pdfBodyDiv { background:#f9f9f9 }) — on paper that's a grey slab behind the whole
       document (owner: "why is there still background colour?"). Canvas only — the navy table headers
       and other content colours are untouched. */
    .pdfBodyDiv, .pdfDivMain, .pdfWidth {
        background: #fff !important; background-color: #fff !important; background-image: none !important;
    }
    /* .topHeaderLine is an empty decorative navy bar (<div class="topHeaderLine"><span></span></div>)
       at the top of the document — designed to underline the letterhead. With no letterhead it prints
       as an orphan line above the title (owner: "why is there a line above?"). Not content — drop it. */
    .topHeaderLine { display: none !important; }
    /* ...and nothing inside a document may force the sheet wider (fixed-width signature lines,
       wide tables); long cell text wraps instead of stretching the table off the paper. */
    .pdfDivMain img, .pdfDivMain table, .pdfDivMain span, .pdfDivMain p, .pdfDivMain div {
        max-width: 100% !important;
    }
    .pdfDivMain table { width: 100% !important; }
    /* (no word-break here: break-word split NUMBERS mid-digit — "3,333.42" printed as "3,333.4|2".
       The white-space rule below is enough: long text wraps at SPACES, numbers stay whole.) */

    /* 5) Never CLIP content on paper. Screens wrap tables in overflow:auto scroll boxes; on a printout
          a scroll box cuts the right-hand columns off (e.g. a voucher's "Payable Amount"), and Chrome
          cannot page-break inside overflow:auto — an unbreakable 3000px box gets shoved to a fresh
          sheet (blank page 1 on the case lists) and then sliced. Visible + auto height shows everything
          and paginates normally. `html body` prefix: page stylesheets load AFTER this file and some set
          `.customResponsiveTableScroll{overflow:auto !important}` — equal specificity would lose by
          order, higher specificity wins regardless. */
    html body .customTable.table-responsive,
    html body .table-responsive,
    html body .customResponsiveTableScroll {
        overflow: visible !important; overflow-x: visible !important; overflow-y: visible !important;
        height: auto !important; max-height: none !important;
    }
    /* ...and long table text (e.g. "T1 - Agent - Commission - No 1.1: ...") wraps on paper instead of
       forcing its column — and therefore the table — wider than the sheet. */
    .pdfDivMain table td, .pdfDivMain table th,
    .pdfDivMain table td p, .pdfDivMain table th p { white-space: normal !important; }
}
