/* TFAdmin — the printed flight folder.
 *
 * Loaded always, but everything here is inside @media print except the one rule
 * that keeps #print-root off the screen. The document is built by
 * printFolder() in iff-native.js rather than being the screen re-styled: on
 * paper every leg is present and in order, the corrections are a table rather
 * than a trail under a row, and nothing is behind a tab.
 */

/* The print document exists in the DOM only while printing, and must never be
   visible on screen -- it is a second copy of the folder.
 *
 * OFF-SCREEN, NOT display:none. The AFM sheets are drawn into it before the
 * print fires, and the chart renderer sizes each sheet from svg.getBBox() --
 * which inside a display:none subtree returns an EMPTY rect rather than
 * throwing, so every chart came out with a viewBox 16 units across and the
 * export printed a Performance charts heading with four blank spaces under it.
 * visibility:hidden still lays the element out, so the boxes measure; position
 * is fixed so a page 10000px wide is not created to hold it. */
#print-root {
  position: fixed; left: -10000px; top: 0; width: 190mm;
  visibility: hidden; pointer-events: none;
}

@media print {
  /* The app disappears; the document takes the page. */
  body.is-printing > *:not(#print-root) { display: none !important; }
  /* Back into the page for the print itself. */
  #print-root {
    position: static; left: auto; top: auto; width: auto;
    visibility: visible; display: block;
  }

  @page { size: A4 portrait; margin: 14mm 12mm 16mm; }

  html, body {
    background: #fff !important;
    color: #000;
    font-size: 9.5pt;
    /* Print in the light palette whatever the screen is set to: a folder
       printed from dark mode came out as pale text on white. */
    color-scheme: light;
  }
  #print-root, #print-root * {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
  }

  /* ---------------------------------------------------------- letterhead */
  .pr-head {
    display: flex; align-items: center; gap: 10mm;
    border-bottom: 1.2pt solid #000; padding-bottom: 3mm; margin-bottom: 4mm;
  }
  .pr-logo { height: 13mm; width: auto; }
  .pr-org { flex: 1 1 auto; }
  .pr-org-name { margin: 0; font-size: 12pt; font-weight: 700; letter-spacing: .01em; }
  .pr-org-ato { margin: 0; font-size: 8.5pt; letter-spacing: .06em; text-transform: uppercase; }
  .pr-doc { text-align: right; }
  .pr-doc-t { margin: 0; font-size: 10.5pt; font-weight: 700; }
  .pr-doc-s { margin: 0; font-size: 8.5pt; }

  /* ------------------------------------------------------ identity block */
  .pr-ident {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 2mm 6mm; margin-bottom: 3mm;
  }
  .pr-field { display: flex; flex-direction: column; gap: .5mm; }
  .pr-field span {
    font-size: 7.5pt; letter-spacing: .06em; text-transform: uppercase;
  }
  .pr-field strong { font-size: 10pt; font-weight: 700; }

  .pr-status {
    border: 1pt solid #000; padding: 2mm 3mm; margin-bottom: 5mm; font-size: 9.5pt;
  }
  /* No colour fill: a folder is photocopied and faxed, and "approved" has to
     survive both. The border weight carries it. */
  .pr-status.is-open { border-width: 2pt; }

  /* ------------------------------------------------------------ the legs */
  .pr-leg { break-inside: auto; margin-bottom: 9mm; }
  /* A LEG CONTAINS ITS SECTIONS, SO IT HAS TO OUTRANK THEM. At 10.5pt this sat
     BELOW the 12pt section headings inside it -- the leg read as a caption over
     a run of larger parts, which is the hierarchy upside down. Raised past them
     rather than shrinking the sections, because the leg heading is the one line
     that says which flight the next two pages are about. */
  .pr-leg-h {
    font-size: 15pt; font-weight: 700; margin: 0 0 2mm;
    border-bottom: .6pt solid #000; padding-bottom: 1mm;
    break-after: avoid;
  }
  /* A HEADING GOES WHERE ITS CONTENT GOES, THROUGH WHATEVER IS BETWEEN THEM.
     `break-after: avoid` on the heading glues it to the NEXT element and no
     further, so where something small sits in between -- a legend, a hint, the
     line saying no weather was recorded -- the heading and that small thing
     stayed behind together and the table or the chart went overleaf. Which is
     the defect, one element further along than the rule that was meant to stop
     it. Reproduced in headless Chromium, both ways: heading and legend on page
     one with the chart on page two, and all three on page two with these.

     Two halves. The element after a heading may not START a page, and the
     small connectors may not be the last thing on one either. */
  #print-root h2.section + *, #print-root .pr-leg-h + * { break-before: avoid; }
  #print-root .cg-legend, #print-root p.hint, #print-root .wx-placeholder,
  #print-root .pr-pick-h { break-after: avoid; }

  /* A section heading at the foot of a page with its table overleaf is the
     classic printed-form defect. */
  /* A section heading, not a caption. At 9.5pt uppercase it was the same size
     as the table header row underneath it, so the sections had no visible top
     -- the same thing that was wrong with them on screen. */
  /* SPACE ABOVE, NOT BELOW. A heading belongs to what follows it, so the gap
     that separates two sections goes on top of the second one and the heading
     stays tight to its own table. 5mm was not enough to read as a separation:
     the table above ends on 2mm, margins collapse to the larger of the two, and
     5mm between 8.5pt rows and a 12pt heading is about one blank line -- the
     same distance as a gap inside a table, so the sections ran together. */
  #print-root h2.section {
    font-size: 13.5pt; font-weight: 700; margin: 12mm 0 2mm;
    text-transform: none; letter-spacing: normal;
    break-after: avoid;
  }
  /* Except the first one in a leg, which is not separating itself from another
     section -- it is the first thing under "Leg 1 — LIMF to LIMS" and belongs
     with it. Given the full 9mm it read as a section floating loose of the leg
     heading that introduces it. */
  #print-root .pr-leg-h + h2.section { margin-top: 4mm; }

  /* THE SAME ON PAPER, AND ON PURPOSE. A printed folder is a record, so the
     report carries no verdict on its own age -- see paintWxAges. It reads as
     neutral here today only because .iff-native's rules do not reach the print
     root, which is an accident rather than a decision; these two lines make it
     the decision, and stop any age class that was saved into the stored html
     from colouring a filed sheet. */
  #print-root .wx-block {
    border-left: .75pt solid #000; padding-left: 2.5mm; margin-bottom: 2mm;
  }
  #print-root .wx-block.wx-fresh, #print-root .wx-block.wx-ageing,
  #print-root .wx-block.wx-old,   #print-root .wx-block.wx-blocked {
    border-left-color: #000;
  }

  /* ---------------------------------------------------------- the tables */
  #print-root table {
    width: 100%; border-collapse: collapse; table-layout: fixed;
    font-size: 8.5pt; margin-bottom: 2mm;
  }
  /* 0.75pt, not 0.5pt, because 0.5pt is not a width a renderer can honour: it
     rounds up to one device pixel anyway, and WHICH way it rounds depends on
     where the line falls, so the same table came out with some rules heavier
     than others. Stated as the width it was always going to be. */
  #print-root th, #print-root td {
    border: 0.75pt solid #000; padding: 1mm 1.5mm;
    vertical-align: top; word-break: break-word;
  }
  #print-root table { border: 0.75pt solid #000; }
  #print-root th {
    font-size: 7.5pt; text-transform: uppercase; letter-spacing: .04em;
    font-weight: 700; text-align: left;
  }
  #print-root td.num, #print-root th[style*="center"] { text-align: center; }
  #print-root table td.num:first-child { text-align: left; }
  /* The runway under each aerodrome. A px size set for the screen would print
     larger than the header it sits under. */
  #print-root .perf-head-rwy { display: block; font-size: 6.5pt; font-weight: 400; }
  #print-root tr { break-inside: avoid; }
  /* A TABLE IS ONE THING. Split across a page boundary it reads as two tables,
     the second of them missing its heading -- a mass and balance sheet whose
     last four stations are overleaf is worse than a page with a gap at the
     bottom. The whole table moves to the next page instead.
     A table taller than the page still has to break somewhere, and a browser
     ignores this rather than looping forever, so the rule costs nothing in the
     one case it cannot honour. The thead repeat above covers that case. */
  #print-root .tbl-scroll, #print-root table:not(.pr-sheet) { break-inside: avoid; }
  #print-root thead { display: table-header-group; }   /* repeat on every page */

  /* The screen wraps every table in a horizontal scroller. On paper there is
     nothing to scroll and the overflow would clip the right-hand columns.
     It is also a rounded, filled card on screen, which printed as a white box
     with curved corners sitting behind a square-ruled table -- two frames for
     one table, one of them invisible except at the corners. */
  #print-root .tbl-scroll {
    overflow: visible !important;
    border: none !important; border-radius: 0 !important;
    background: none !important; box-shadow: none !important;
  }

  /* CENTRED, EXCEPT THE COLUMN THAT NAMES THE ROW. Everything on these tables
     is a figure under a centred heading, and left-aligned figures under a
     centred heading read as two different tables. The first column is the
     label and stays where the eye starts. */
  #print-root table td, #print-root table th { text-align: center; }
  #print-root table td:first-child, #print-root table th:first-child {
    text-align: left;
  }

  /* The control that opens the chart dialog. On paper it opens nothing. */
  #print-root .perf-calc-btn { display: none !important; }

  /* The AUGUR working. The verdict per aerodrome is in the table above it and
     that is what the folder is signed against; the mask, the RNP level and the
     prediction issue time are the evidence behind it, which belongs on screen
     where it can be expanded, not on every printed copy. */
  #print-root details.raim-why, #print-root .raim-prov { display: none !important; }
  /* The note under weather the page fetched because the folder had none. On
     screen it tells a reviewer which reports are which; on paper the export
     carries its own generated-at stamp in the footer and the sentence was one
     more line of explanation on a document that is meant to be read. */
  #print-root .wx-fill-note { display: none !important; }

  /* The CG chart is the one graphic worth the ink — it is the evidence that
     the aeroplane was inside its envelope. */
  #print-root .graph-wrap {
    break-inside: avoid; max-width: 165mm; margin: 3mm auto 4mm; width: 100%;
    border: none !important; border-radius: 0 !important;
    background: none !important; box-shadow: none !important; padding: 0 !important;
  }
  #print-root .graph-wrap svg { width: 100%; height: auto; display: block; }
  /* Chart lettering in black, EXCEPT the three points the C.G. chart is for.
     TOM, LDM and ZFM are colour-coded to their own dots and that coding is the
     whole point of the labels; blacking them out left three identical words
     beside three different colours. Everything else here fills from a token,
     which on a page printed out of dark mode would be pale grey on white, so
     the blanket rule still earns its place for those. */
  #print-root svg text:not(.cg-pt) { fill: #000 !important; }
  /* The halo behind each point is the page colour, and the page is white here
     whatever the screen was set to. */
  #print-root svg .cg-pt { stroke: #fff !important; }

  /* ------------------------------------------------- the AFM sheets
     One per reading, each with the student's line on it and the review's where
     the two disagree. Never split across a page: half a graph is not evidence
     of anything. Two to a page at this height, which keeps a full appendix on a
     two-leg folder down to three sheets of paper rather than six.

     The colours are inline styles on the ink, so `#print-root * { color: #000 }`
     above leaves them alone -- the orange line and the green one survive the
     trip to paper, and on a mono printer they are still two distinguishable
     greys. */
  #print-root .pr-chart-fig {
    break-inside: avoid; margin: 0 0 4mm; page-break-inside: avoid;
  }
  /* EQUALLY TALL, EACH ITS OWN SHAPE. Sized from the HEIGHT, with the width
     following from the aspect ratio the renderer stamps on every sheet -- so a
     three-panel take-off chart and a squarer landing one come out the same
     height and neither is stretched. Sizing from the width did the opposite:
     every sheet the page width, and their heights all over the place.
     Centred, because they no longer all reach the right margin. */
  #print-root .pr-chart-fig svg {
    display: block; height: 72mm; width: auto; max-width: 100%;
    margin: 0 auto;
  }
  #print-root .pr-chart-fig figcaption {
    font-size: 7.5pt; margin-top: 1mm; font-style: italic;
  }

  /* Screen-only furniture that has no meaning on paper. */
  #print-root .override-btn, #print-root .btn, #print-root .leg-tabs,
  #print-root .wx-decision, #print-root .val-box, #print-root .ovr-trail,
  #print-root .tol { display: none !important; }

  /* Badges become plain words — a pill with no fill reads as an empty box. */
  #print-root .badge {
    border: none !important; padding: 0 !important; font-size: 8.5pt;
    font-weight: 700; text-transform: none;
  }

  /* --------------------------------------------------- the corrections */
  .pr-ovr td { font-size: 8pt; }
  .pr-none { font-size: 9pt; font-style: italic; }

  /* ---------------------------------------------------------- the footer
     A fixed footer repeats on every page in Chrome but reserves NO space, so
     the last lines of each page print underneath it. The document is wrapped in
     a table whose tfoot holds an empty spacer instead: a table footer group
     repeats on every page AND its height is subtracted from the text area, so
     nothing can run under it. */
  .pr-sheet { width: 100%; border-collapse: collapse; }
  .pr-sheet > tfoot { display: table-footer-group; }
  /* The wrapper is scaffolding, not a table: none of the table styling above
     applies to it or to the two cells it is made of. */
  .pr-sheet, .pr-sheet > tbody > tr > td, .pr-sheet > tfoot > tr > td {
    border: none !important; padding: 0 !important; font-size: inherit;
  }
  /* AND IT MUST BE ALLOWED TO BREAK. `#print-root tr { break-inside: avoid }`
     above is for data rows -- a mass row split across two pages is unreadable
     -- but this wrapper's single row holds the WHOLE FOLDER, and the rule
     applied to it just the same. Chrome cannot keep a five-page row on one
     page, so it does the next thing: it starts the row on a fresh one. That is
     the empty page after the letterhead. The scaffolding row and its cell now
     break wherever the content inside them says to. */
  #print-root .pr-sheet > tbody > tr, #print-root .pr-sheet > tbody > tr > td,
  #print-root .pr-sheet > tfoot > tr, #print-root .pr-sheet > tfoot > tr > td {
    break-inside: auto;
  }
  /* TWO COPIES, ONE VISIBLE. See the comment on the markup in printFolderHtml.
     The tfoot copy repeats on every page and RESERVES the band, so nothing in
     the flow ever reaches the bottom strip -- position:fixed cannot do that,
     which is why it was rejected on its own and the last lines would have
     printed underneath. But a table footer group sits where the table ENDS,
     and on the last page that is immediately under the final row: the footer
     came out stranded in the middle of the sheet, which is the whole defect.
     So the tfoot copy keeps its height and paints nothing, and a fixed copy --
     which Chromium repeats on every printed page, the last one included --
     does the painting, at the page bottom every time.

     visibility:hidden, not display:none: the band has to keep occupying its
     height. display:none would give the space straight back and put the
     content under the footer again. */
  .pr-foot {
    display: flex; justify-content: space-between; gap: 6mm;
    border-top: .5pt solid #000; padding-top: 1.5mm; margin-top: 4mm;
    font-size: 7.5pt;
  }
  #print-root .pr-sheet > tfoot .pr-foot { visibility: hidden; }
  #print-root .pr-foot-fixed {
    position: fixed; left: 0; right: 0; bottom: 0; margin-top: 0;
  }

  /* A NOTE ABOUT THE TABLE ABOVE, NOT A LINE CRUSHED INTO IT. "Local flight —
     planned time airborne 60 min." is the only statement of how long a local
     leg was meant to be, so it is on the record; it arrived with a screen
     nudge that pulled it up into the fuel table's bottom border, and with no
     styling of its own, because .iff-native's rules do not reach the print
     root. Given the space to sit below the table and the italic that says it
     is a remark about one rather than a row of it. */
  #print-root p.hint {
    margin: 2.5mm 0 0; font-size: 8.5pt; font-style: italic;
  }
}

/* ------------------------------------------------- the navigation log sheet
   The school's paper form (SOP Annex 9): navlogFormHtml() in navlog.ts in
   'print' mode, the same markup the editor fills in. On paper the in-flight
   boxes are plain white, to be written in. */
@media print {
  #print-root.nlp-doc { font-family: Arial, Helvetica, sans-serif; font-size: 8.5pt; }
  #print-root.nlp-doc .nlf { padding: 0; min-width: 0; border-radius: 0; }
  #print-root.nlp-doc .nlf table { border-collapse: collapse; width: 100%; table-layout: fixed; }
  #print-root.nlp-doc .nlf th, #print-root.nlp-doc .nlf td { border: .75pt solid #000; padding: 1.2mm 1.5mm; vertical-align: middle; }
  #print-root.nlp-doc .pr-sheet, #print-root.nlp-doc .pr-sheet > tbody > tr > td,
  #print-root.nlp-doc .pr-sheet > tfoot > tr > td { border: 0; padding: 0; }
  #print-root.nlp-doc .nlf-l { font-style: italic; font-weight: 700; font-size: 7.5pt; margin-right: 1.5mm; }
  #print-root.nlp-doc .nlf-v { font-size: 9pt; }
  .nlf-head { break-inside: avoid; }
  .nlf-head td { height: 7mm; }
  #print-root.nlp-doc .nlf-brand { background: #000 !important; color: #fff !important;
    font-weight: 700; font-size: 10pt; text-align: center; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .nlf-title { font-weight: 700; font-size: 11pt; }
  .nlf-tline { display: flex; align-items: center; justify-content: space-between; gap: 2mm; }
  .nlf-code { font-family: "Courier New", monospace; font-size: 9.5pt; font-weight: 700; white-space: nowrap;
    border: 1pt solid #000; padding: .4mm 1.5mm; letter-spacing: .04em; }
  .nlf-rules { text-align: center; }
  .nlf-rule { display: inline-block; font-weight: 700; padding: .3mm 2mm; margin: 0 1.5mm; border: 1.2pt solid transparent; }
  .nlf-rule.is-on { border-color: #000; border-radius: 2mm; }
  .nlf-note { height: 16mm; vertical-align: top !important; }
  .nlf-pre { margin-top: 1mm; white-space: pre-wrap; }
  #print-root.nlp-doc .nlf-fly, #print-root.nlp-doc .nlf-na { background: #fff !important; }
  #print-root.nlp-doc table.nlf-grid { break-inside: auto; margin-top: -.75pt; }
  .nlf-grid thead { display: table-header-group; }
  .nlf-grid th { font-style: italic; font-size: 7.5pt; text-align: center; }
  .nlf-grid .nlf-ofp { text-align: left; font-size: 8.5pt; letter-spacing: .04em; }
  .nlf-grid tbody.nlf-pt { break-inside: avoid; }
  /* The same height empty or filled: an empty line is room to write a
     diversion in by hand. */
  #print-root.nlp-doc .nlf-grid tbody.nlf-pt td { height: 7mm; padding-top: 0; padding-bottom: 0; }
  .nlf-grid tbody.nlf-pt tr:first-child td { border-top-width: 1.5pt; }
  .nlf-mid { text-align: center; }
  .nlf-tot { margin-top: -.75pt; break-inside: avoid; }
  .nlf-tot td { height: 7mm; }
  .nlf-sign td { height: 14mm; vertical-align: top !important; }
  #print-root.nlp-doc .nlf-page + .nlf-page { margin-top: 0; padding-top: 0; border-top: 0; }
  .nlf-alt { break-before: page; }
}