/* The printed record.
 *
 * Scoped entirely to `.pd` and to @media print, so it cannot touch the screen
 * app. On screen the container is hidden; on paper it is the only thing shown.
 *
 * Set in pt, on A4, for an Australian site. Assumes a black-and-white printer:
 * failures carry a symbol, bold weight and a margin rule, never colour alone.
 */

#printDoc { display: none; }

@media print {
  @page {
    size: A4;
    /* Room at the foot for the running identifier line. */
    margin: 14mm 13mm 16mm;
  }

  /* The app disappears; the document takes the page - but ONLY for a real
     record print. print.css is loaded by the shell on every section now, so
     without the body.printing gate a Ctrl-P from the operator screen would
     hide the whole app and print a blank sheet. printRecord() arms the class
     just before window.print() and clears it afterwards. */
  body.printing > *:not(#printDoc) { display: none !important; }
  body.printing #printDoc { display: block; }

  html, body {
    background: #fff;
    color: #000;
  }

  .pd {
    font-family: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    font-size: 9.5pt;
    line-height: 1.38;
    color: #000;
    /* Times and readings line up in their columns. */
    font-variant-numeric: tabular-nums;
  }

  /* --- masthead ----------------------------------------------------------- */
  .pd-title {
    border-bottom: 1.6pt solid #000;
    padding-bottom: 5pt;
    margin-bottom: 9pt;
  }
  .pd-code {
    font-size: 8pt;
    letter-spacing: .09em;
    text-transform: uppercase;
    margin-bottom: 2pt;
  }
  .pd-sep { padding: 0 4pt; }
  .pd-h1 {
    font-size: 17pt;
    font-weight: 700;
    letter-spacing: -.01em;
    margin: 0;
  }

  /* An unapproved record must never read as an approved one. */
  .pd-stamp {
    border: 1.4pt solid #000;
    padding: 5pt 8pt;
    margin-bottom: 9pt;
    text-align: center;
  }
  .pd-stamp-word {
    font-size: 10pt;
    font-weight: 700;
    letter-spacing: .12em;
  }
  .pd-stamp-draft, .pd-stamp-voided { border-style: double; border-width: 3pt; }

  /* --- record context ----------------------------------------------------- */
  .pd-metablock { margin-bottom: 12pt; }
  .pd-meta {
    display: grid;
    grid-template-columns: max-content 1fr max-content 1fr;
    column-gap: 10pt;
    row-gap: 2.5pt;
    margin: 0;
  }
  .pd-meta dt {
    font-size: 8pt;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #444;
    white-space: nowrap;
  }
  .pd-meta dd { margin: 0; font-weight: 600; }

  .pd-verdict {
    margin-top: 7pt;
    padding: 4pt 7pt;
    border-left: 2.5pt solid #000;
    background: #f2f2f2;
    font-size: 9pt;
    font-weight: 600;
  }

  /* --- sections ----------------------------------------------------------- */
  .pd-section { margin-top: 13pt; break-inside: auto; }
  .pd-break { break-before: page; }

  .pd-sechead {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10pt;
    border-bottom: .8pt solid #000;
    padding-bottom: 2.5pt;
    margin-bottom: 5pt;
    /* A heading stranded at the foot of a page is a wasted line. */
    break-after: avoid;
    break-inside: avoid;
  }
  .pd-h2 {
    font-size: 11pt;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0;
  }
  .pd-h3 { font-size: 9.5pt; font-weight: 700; margin: 8pt 0 3pt; break-after: avoid; }
  .pd-seccount { font-size: 8pt; color: #444; white-space: nowrap; }
  .pd-secnote { font-size: 8.5pt; color: #333; margin: 0 0 5pt; }
  .pd-run { font-size: 9pt; font-weight: 700; margin: 7pt 0 3pt; break-after: avoid; }

  /* --- the list shape ----------------------------------------------------- */
  .pd-list { margin: 0; padding: 0; list-style: none; counter-reset: none; }
  .pd-item {
    display: grid;
    grid-template-columns: 16pt 1fr auto;
    gap: 6pt;
    padding: 2.2pt 0 2.2pt 5pt;
    border-bottom: .4pt dotted #bbb;
    break-inside: avoid;
  }
  .pd-itemno { color: #555; text-align: right; font-size: 8.5pt; }
  .pd-itemlabel { min-width: 0; }
  .pd-itemval { text-align: right; font-weight: 600; white-space: nowrap; }
  .pd-target { color: #444; font-size: 8.5pt; }

  .pd-item-fail {
    /* The margin rule is what a reader's eye catches when flicking pages. */
    border-left: 2.5pt solid #000;
    padding-left: 5pt;
    background: #f0f0f0;
  }

  .pd-subwrap { grid-column: 2 / -1; margin: 1.5pt 0 2pt; }
  .pd-sub { font-size: 8.5pt; color: #222; }
  .pd-subkey { color: #555; }
  .pd-warnline { font-size: 8.5pt; font-weight: 600; margin-top: 1.5pt; }

  /* --- the table shape ---------------------------------------------------- */
  .pd-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8.8pt;
  }
  .pd-table th {
    text-align: left;
    font-size: 7.6pt;
    text-transform: uppercase;
    letter-spacing: .05em;
    border-bottom: .8pt solid #000;
    padding: 2.5pt 4pt;
    white-space: nowrap;
  }
  .pd-table td {
    padding: 2.8pt 4pt;
    border-bottom: .4pt solid #ccc;
    vertical-align: top;
  }
  /* Rows must not split across a page - half a cleaning record is unreadable. */
  .pd-table tr { break-inside: avoid; }
  /* Chrome does not repeat thead reliably, but ask for it anyway. */
  .pd-table thead { display: table-header-group; }
  .pd-table tbody { break-inside: auto; }

  .pd-col-name { width: 42%; }
  .pd-col-res { width: 9%; font-weight: 600; white-space: nowrap; }
  .pd-num { white-space: nowrap; }

  .pd-row-fail td {
    background: #f0f0f0;
    font-weight: 600;
  }
  .pd-row-fail td:first-child { box-shadow: inset 2.5pt 0 0 0 #000; }
  .pd-row-extra td {
    border-bottom: .4pt solid #ccc;
    padding-top: 0;
    padding-left: 14pt;
    font-size: 8.4pt;
  }
  .pd-table-tight td, .pd-table-tight th { padding: 2pt 3pt; font-size: 8pt; }

  /* --- failure marks ------------------------------------------------------ */
  .pd-fail { font-weight: 700; }
  .pd-warn { font-weight: 600; }
  .pd-mark { font-family: "Segoe UI Symbol", system-ui, sans-serif; }

  /* --- evidence ----------------------------------------------------------- */
  .pd-plates { display: flex; flex-wrap: wrap; gap: 6pt; margin-top: 4pt; }
  .pd-plate { margin: 0; break-inside: avoid; }
  .pd-plate img {
    display: block;
    width: 46mm;
    height: auto;
    border: .4pt solid #999;
  }
  .pd-plate figcaption { font-size: 7.5pt; color: #444; margin-top: 1.5pt; }

  /* --- corrective actions & approval -------------------------------------- */
  .pd-capa {
    border: .8pt solid #000;
    padding: 6pt 8pt;
    margin-bottom: 7pt;
    break-inside: avoid;
  }
  .pd-capa-meta { grid-template-columns: max-content 1fr; }
  .pd-h3 + .pd-capa-meta { margin-top: 3pt; }

  .pd-approval {
    border-top: 1.6pt solid #000;
    padding-top: 7pt;
    break-inside: avoid;
  }
  .pd-hash { margin-top: 6pt; font-size: 8pt; }
  .pd-hashval {
    font-family: "Cascadia Mono", Consolas, "SF Mono", Menlo, monospace;
    font-size: 7.6pt;
    word-break: break-all;
  }

  /* --- the running identifier --------------------------------------------- */
  /* Fixed position repeats on every printed page in Chrome, so a page that gets
     separated from the set is still traceable. If a browser does not repeat it,
     it simply appears once, which is harmless. */
  .pd-runner {
    position: fixed;
    bottom: 4mm;
    left: 0;
    right: 0;
    font-size: 7.5pt;
    color: #444;
    border-top: .4pt solid #bbb;
    padding-top: 2pt;
  }

  /* Links print as their text - a URL in brackets is noise on a record. */
  a, a:visited { color: #000; text-decoration: none; }
}