/* nq-print.css - how the nQuadrant profile prints and saves as a PDF.
   Natasya, 10 November 2026.

   HOW IT IS LOADED
   dashboard.html links this with  media="print", so it does NOTHING on
   screen. _print-preview.html loads the SAME file with media="all", so what
   you see there is exactly what comes out. One file, so the two can never
   drift apart.

   WHY THE !important
   The three parts are opened and closed by setting display straight on the
   section, and an inline style can only be beaten by !important. */

/* ---- a tidy page ---- */
@page{margin:12mm}

/* ---- keep every colour and background ----
   Without this, Chrome drops the navy bands and the pink bands to faint
   grey text. This also overrides the browser's own "Background graphics"
   tick box, so it is right whether or not that is on. */
*,*::before,*::after{
  -webkit-print-color-adjust:exact !important;
  print-color-adjust:exact !important;
}
body{background:#fff !important}

/* ---- all THREE parts print, whatever is open on screen ---- */
.nq-part{display:block !important}

/* ---- each part starts on a new page ---- */
.nq-part[data-part="1"],
.nq-part[data-part="2"]{break-before:page;page-break-before:always}

/* ---- things that only make sense on a screen ---- */
#nq-steps,
.nq-steps,
.tsize,
.nq-pnext,
.nq-topen,
#d-in,
.psavestrip,
#d-hint,
/* the saved line carries an email address, so it stays off a shared PDF */
#d-savedto,
/* the included panel is a screen thing: the same words are in the box above */
.nq-bottom{display:none !important}

/* ---- the Made for you row scrolls sideways on screen, so on paper it
        has to wrap or the tiles past the edge are simply lost ---- */
.nq-mix{overflow:visible !important;flex-wrap:wrap}

/* ---- nothing should be cut in half by a page break ---- */
.nq-sec,.nq-cd,.nq-tc,.nq-ci,.nq-mi,.nq-fitbox,.nq-tile,.nq-cols{
  break-inside:avoid;page-break-inside:avoid}
