/* print.css — loaded with media="print", so it never blocks screen rendering.
 *
 * This site replaces a PDF pipeline (jagga/scripts/screenshots/build-docs.mjs
 * -> the gitignored user-manuals-docs/), so "Save as PDF" has to produce a
 * clean handout. The page geometry below is ported from that script's CSS
 * constant, which was tuned against real output: A4, 18mm/16mm margins, an
 * 11pt body at 1.55, 24/15/12.5pt headings, figures that never split.
 *
 * Two deliberate departures from it:
 *
 * 1. The accent is var(--accent), not the frozen #2f6df6 of the old script.
 *    That hex was the GRAPHITE blue; hardcoding it is exactly the staleness
 *    this project is built to avoid. Print forces the light theme, so the role
 *    resolves to the active pack's accent.
 * 2. Screenshots are height-capped. Uncapped, one full-page capture
 *    (case-manager-pipeline is 15380px tall) eats five sheets on its own.
 *
 * Note: dark mode cannot be undone in CSS -- [data-theme="dark"] has already
 * won the cascade and CSS cannot remove an attribute. js/theme.js suspends it
 * on beforeprint and restores it on afterprint. Printing FROM DARK MODE is
 * therefore a required test, not an optional one.
 */

@page { size: A4; margin: 18mm 16mm; }

html, body {
  background: #fff !important;
  color: #1c2128 !important;
}

body {
  font-size: 11pt;
  line-height: 1.55;
}

/* ---- hide the chrome --------------------------------------------------- */

.site-header,
.site-sidebar,
.site-toc,
.site-footer,
.nav-scrim,
.skip,
.azrail,
.zoom,
dialog,
.doors .go { display: none !important; }

.shell {
  display: block !important;
  max-width: none;
  padding: 0;
  margin: 0;
}
main { max-width: none !important; }

/* ---- a real masthead, because Chrome ignores @page margin boxes -------- */

.print-head { display: none; }
@media print {
  .print-head {
    display: block;
    border-bottom: 2.5pt solid var(--accent);
    padding-bottom: 6pt;
    margin-bottom: 12pt;
    font-size: 9pt;
    color: #55606e;
  }
  .print-head .pname {
    font-weight: 700;
    font-size: 11pt;
    color: #0b1220;
    display: block;
  }
}

/* ---- typography -------------------------------------------------------- */

h1 { font-size: 24pt; margin: 0 0 6pt; }
h2 { font-size: 15pt; margin: 18pt 0 6pt; }
h3 { font-size: 12.5pt; margin: 14pt 0 4pt; }
h4 { font-size: 11pt; margin: 10pt 0 2pt; }
h1, h2, h3, h4 { color: #0b1220; break-after: avoid; }
h1 + .lede { font-size: 11.5pt; color: #44505f; }

p, li { font-size: 11pt; orphans: 3; widows: 3; }
a { color: #1b4fd8; text-decoration: none; }

/* Print the destination of prose links -- a paper handout has no hover.
 * Scoped to prose so captions, breadcrumbs and chips stay clean. */
main p a[href^="http"]::after,
main li a[href^="http"]::after {
  content: " (" attr(href) ")";
  font-size: 8.5pt;
  color: #6b7684;
  word-break: break-all;
}

code {
  background: #f1f3f5 !important;
  border: 0 !important;
  color: #1c2128 !important;
  font-size: 9.5pt;
}
pre {
  background: #f6f8fa !important;
  border: 1px solid #e3e8ee !important;
  break-inside: avoid;
  font-size: 9pt;
}

blockquote {
  background: #f6f8fa !important;
  border-left: 4pt solid #c9d3e0 !important;
  color: #44505f !important;
  break-inside: avoid;
}

/* ---- callouts keep their meaning on paper ------------------------------ */

.note, .tip, .warn, .internal {
  background: #f6f8fa !important;
  border: 1px solid #d7dee7 !important;
  border-left-width: 3pt !important;
  break-inside: avoid;
  font-size: 10pt;
}
.warn     { border-left-color: #b26a00 !important; }
.internal { border-left-color: #b3261e !important; }
.note     { border-left-color: #1b4fd8 !important; }
.tip      { border-left-color: #1c6b3c !important; }

/* The internal band must survive onto paper. A printed internal page that
 * looks like a customer handout is exactly the accident to prevent. */
.internal-band {
  display: block !important;
  background: #b3261e !important;
  color: #fff !important;
  font-size: 9pt;
  padding: 4pt 8pt;
  margin-bottom: 10pt;
  border-radius: 3pt;
}

/* ---- tables ------------------------------------------------------------ */

.table-wrap { overflow: visible !important; }
table { font-size: 9.5pt; break-inside: auto; }
th, td { border: 1px solid #e3e8ee; padding: 4pt 6pt; }
th { background: #f6f8fa !important; color: #1c2128 !important; }
thead { display: table-header-group; }   /* repeat headers across pages */
tr { break-inside: avoid; }
tbody tr:hover { background: none !important; }

/* ---- figures ----------------------------------------------------------- */

figure { break-inside: avoid; margin: 10pt 0 14pt; }

figure.shot img {
  max-height: 150mm;        /* ~60% of the A4 text height */
  width: auto;
  max-width: 100%;
  object-fit: contain;
  border: 1px solid #e3e8ee !important;
  border-radius: 4pt;
}
figure.shot figcaption { font-size: 8.5pt; color: #6b7684; }

/* A clipped capture's fade is a screen affordance; on paper it prints as a
 * grey smear, so drop it and keep the words. */
figure.shot--clipped .frame::after { display: none !important; }

figure.diagram svg { max-height: 140mm; color: #44505f; }

/* ---- rails and chips print as outlines -------------------------------- */

ol.rail > li.gate { background: #fff7e6 !important; break-inside: avoid; }
ol.chain > li, .chip { border: 1px solid #d7dee7 !important; background: #fff !important; color: #1c2128 !important; }
.tier, .boundary, .mock { break-inside: avoid; border-color: #d7dee7 !important; }

/* ---- the sources block prints open ------------------------------------ */

.sources[open] > summary, .sources > summary { color: #44505f; }
.sources > ul { display: block !important; }