/* ==========================================================================
   Printing, shared by the RWSC and Complaints streams.

   Everything here is scoped to #printArea, the off-screen block each page
   builds just before it calls the browser's print. The rules deliberately live
   OUTSIDE @media print so the block can be laid out and MEASURED first — the
   type size of a long list is chosen from that measurement.

   The @page rule itself is written at print time by DashPrint.usePage(): a wide
   abstract wants the sheet turned, a tall list reads down a portrait page.
   ========================================================================== */
#printArea{display:none;font-family:"Segoe UI",Arial,sans-serif;color:#000;background:#fff}
#printArea.measuring{display:block;position:absolute;left:-30000px;top:0;z-index:-1}
#printScale{transform-origin:top left}

/* ---- the identity block every printout carries ---- */
#printArea .phd{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
  border-bottom:2px solid #000;padding-bottom:6px;margin-bottom:8px}
#printArea .phd h1{font-size:15.5px;margin:0 0 3px;color:#000;letter-spacing:.2px}
#printArea .phd .l2{font-size:9.5px;color:#333;line-height:1.55}
#printArea .phd .l2 b{color:#000}
#printArea .phd .rt{text-align:right;font-size:9px;color:#444;white-space:nowrap;line-height:1.55}
#printArea .phd .rt .org{font-size:11px;font-weight:700;color:#000}
/* the printed foot: what the sheet is and where it came from */
#printArea .pft{margin-top:6px;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;
  font-size:8.5px;color:#444;border-top:.5pt solid #999;padding-top:4px;line-height:1.4}
#printArea .pft>div{min-width:0}
#printArea .pft>div:first-child{flex:1}
#printArea .pft>div:last-child{text-align:right;white-space:nowrap}
/* a caption above a table when several are stacked on one sheet. It must never be
   the last thing on a page — a heading alone at the foot of a sheet with its table
   overleaf reads as a mistake. */
#printArea .pcap{font-size:10.5px;font-weight:700;color:#000;margin:9px 0 3px;
  border-bottom:.5pt solid #999;padding-bottom:2px;
  page-break-after:avoid;break-after:avoid}
#printArea .pcap:first-child{margin-top:0}
#printArea .pcap small{float:right;font-weight:400;color:#555;font-size:8.5px}
/* the screen's card is a raised white panel; on paper it is just the table, and
   its rounded border draws a second box around one that already has rules */
#printArea .card{background:none!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;padding:0!important;margin:0!important}
#printArea .card-h{margin:0 0 3px;display:block}
#printArea .card-h h3{font-size:10.5px;color:#000;margin:0}
#printArea .card-h small{font-size:8.5px;color:#555}
#printArea .hint{font-size:8px;color:#555;margin:2px 0 0}
#printArea .grid-2{display:block}

/* ---- tables ----
   auto layout, so every column is at least as wide as the longest WORD of its
   heading — a heading may wrap between words but a word is never broken. */
#printArea table{width:100%;table-layout:auto;border-collapse:collapse;font-size:12px;margin-bottom:4px}
/* the app's body ink is a near-black navy; on paper it is plain black */
/* Horizontal rules only. A box around every cell turns a report into a
   spreadsheet dump — the eye has to cross a line to get to each figure and the
   sheet reads as a grid rather than as rows. Columns are held apart by their
   spacing; the rows are what the reader is following. */
#printArea th,#printArea td{color:#000;border:0;border-bottom:.3pt solid #b9b9b9;
  padding:3px 6px 3px 2px;white-space:normal;
  overflow-wrap:normal;word-break:normal;hyphens:none;
  -webkit-print-color-adjust:exact;print-color-adjust:exact;
  /* app.css carries a bare td{font-size:13px} for the screen, and a rule that names
     the element beats a size inherited from the table. Without this the print sizes
     below never reach a single cell: everything comes out at the screen's 13px and
     fitList, which sets the size on the table, can do nothing at all. */
  font-size:inherit}
/* Nothing on the sheet is filled — not the heading band, not the total row, not the
   alternate rows. A table on paper is its rules and its figures; a tint is a grey wash
   that the office copier either flattens into the ink or drops altogether, and either
   way it costs more than it says. The heading and the total are told by their weight
   and by the heavier rule that closes them off. */
#printArea thead th{background:#fff!important;font-size:10px;letter-spacing:0;line-height:1.22;position:static;
  text-transform:none;text-align:center;vertical-align:middle;padding:3px 1px;color:#000;font-weight:700}
#printArea thead tr:last-child th{border-bottom:.8pt solid #222}
/* A group heading that spans columns has to show WHAT it spans. With the cell
   grid gone the only thing separating one group from the next is the rule down
   its left edge, so .sep — which the page puts on the first column of every
   group — is the one vertical line the sheet keeps. Without it "Total pending"
   reads as the last column of "Pending with consumer". */
#printArea thead th[colspan]{border-bottom:.4pt solid #666}
#printArea th.sep,#printArea td.sep{border-left:.6pt solid #666}
#printArea thead th[colspan].sep{border-left:.6pt solid #666}
#printArea td{text-align:center;font-variant-numeric:tabular-nums;padding:2px}
#printArea tfoot td{background:#fff!important;font-weight:800;position:static;
  border-top:.8pt solid #222;border-bottom:0}
/* screen affordances that mean nothing on paper: the coloured pill, the cell
   button, the ageing badge all print as plain figures */
#printArea .pill,#printArea .cell,#printArea .badge,#printArea .cellbtn{
  background:none!important;color:#000!important;padding:0;font-weight:600;border-radius:0}
#printArea .cell.z,#printArea .cellbtn.zero{color:#666!important;font-weight:400}
#printArea .dot{display:none}
#printArea a{color:#000;text-decoration:none}
/* a block that must never be split across sheets */
#printArea table:not(.list),#printArea table:not(.list) thead,
#printArea table:not(.list) tbody,#printArea table:not(.list) tr{page-break-inside:avoid}

/* ---- the depot-wise abstract, ruled as a full grid ----
   The default sheet uses horizontal rules only, but the depot report is a dense
   block of figures the office wants boxed like a register — every cell walled on
   all four sides. .pgrid (set on the report clone) opts this one table into a
   complete grid without changing how any other printout reads. */
#printArea .pgrid table{border:.6pt solid #333}
#printArea .pgrid th,#printArea .pgrid td{border:.4pt solid #666!important}
#printArea .pgrid thead th{border:.5pt solid #333!important}
#printArea .pgrid thead tr:last-child th{border-bottom:.8pt solid #222!important}
#printArea .pgrid tfoot td{border-top:.8pt solid #222!important;border-bottom:.4pt solid #666!important}
#printArea .pgrid th.sep,#printArea .pgrid td.sep{border-left:1pt solid #333!important}

/* ---- long lists ----
   These DO run over pages: the body has to be allowed to break, or the whole
   table is pushed to the next sheet and the first page comes out blank. Only a
   single row is kept together, and the header repeats on every page. */
#printArea table.list{table-layout:auto;font-size:9px;page-break-inside:auto;width:100%}
#printArea table.list thead{display:table-header-group}
#printArea table.list tbody{page-break-inside:auto}
#printArea table.list tr{page-break-inside:avoid}
#printArea table.list tbody tr:nth-child(even) td{background:#fff!important}
#printArea table.list th,#printArea table.list td{padding:2px 3px}
/* The column headings must shrink with the body, or a heading fixed at 10px sets the
   width of a column whose figures are 8px and fitList can never win the space back.
   min-width:0 undoes the screen's "thead tr:nth-child(2) th{min-width:64px}", which is
   meant for an abstract's second heading row — the running-header band below makes
   THIS row the second one too, and a 64px floor under ten columns is 200px of air the
   address column never gets back. */
#printArea table.list thead th{font-size:1em;min-width:0}
/* Most columns hold one atomic value — a reference number, a date, a count — and
   breaking one over two lines is never right: it doubles the height of the row and
   reads as two figures. "width:1% + nowrap" collapses such a column onto its widest
   cell, and the free-text columns share out what is left. */
#printArea table.list .nw{white-space:nowrap;width:1%}
/* the serial column is one atomic figure and never earns more than its digits */
#printArea .sl{white-space:nowrap;width:1%;text-align:right;color:#444}
/* nothing fits even at the smallest readable size: let them wrap again rather than
   push the right-hand columns off the edge of the paper */
#printArea table.list.crammed .nw{white-space:normal;width:auto}
/* the screen's 200px floor on the free-text columns would push the sheet wider than
   the paper and lose the right-hand columns; on paper they take only the slack */
#printArea table.list .wrapcell{min-width:0;width:auto}
#printArea table.list td.wrapcell{text-align:left}
#printArea table.list td,#printArea table.list th{vertical-align:top;line-height:1.28}
/* a sheet of pendency is read for its ageing, so a file sitting 84 days cannot
   look the same as one registered yesterday */
#printArea table.list td.age{font-weight:700}
/* ageing is carried by the figure itself, not by a band behind the row: the days
   column is bold everywhere and underlined once the file is over the limit */
#printArea table.list tbody tr.age-b td,
#printArea table.list tbody tr.age-c td{background:#fff!important}
#printArea table.list tbody tr.age-c td.age{color:#000;text-decoration:underline}
/* page two onwards would otherwise carry nothing but bare column headings — no
   title, no date, no depot. This band sits inside the header group, so it repeats. */
#printArea table.list thead tr.runhead th{background:#fff!important;border:0;
  border-bottom:.8pt solid #000;text-align:left;font-size:1.05em;color:#000;
  padding:0 0 3px;font-weight:700}
#printArea table.list thead tr.runhead .r{float:right;font-weight:400;color:#444}

/* ---- RWSC: the depot-wise abstract ----
   The summary on paper is a fixed five-across grid, not the screen's flexible
   cards: a flex row of ten boxes can never be relied on to land inside the
   sheet, and this always does — equal columns, whatever the size of the figures. */
#printArea .psum{width:100%;table-layout:fixed;border-collapse:collapse;margin:0 0 7px}
#printArea .psum td{border:.4pt solid #999;padding:3px 5px;text-align:center;vertical-align:middle}
#printArea .psum .k{display:block;font-size:7.6px;color:#444;line-height:1.25}
#printArea .psum .v{display:block;font-size:12.5px;font-weight:700;color:#000;line-height:1.3;margin-top:1px}
#printArea .psum .v small{font-size:7.6px;font-weight:600;color:#444}
#printArea .tblwrap{overflow:visible;border:none;border-radius:0;box-shadow:none;max-height:none}
#printArea th.depot{width:5%}   /* just the ward number under it — no need for more */
/* The screen tints the headline columns blue and the pending ones amber. On paper
   the sheet is photocopied and filed in black and white, where a tint is either a
   muddy grey band or nothing at all: the column groups are left plain and the rules
   between them (th.sep / td.sep) do the separating. */
#printArea thead th.cMain,#printArea thead th.cPend{background:#fff!important;color:#000}
#printArea td.depot{text-align:left;font-size:11.5px;position:static;background:#fff!important;font-weight:700}
#printArea td.cMain,#printArea td.cPend{background:#fff!important}
#printArea tfoot td.cMain,#printArea tfoot td.cPend{background:#fff!important}
/* the screen's "td.sep,th.sep" loses to the id-qualified border above, so with the
   tints gone nothing marked where one group of columns ended and the next began */
#printArea th.sep,#printArea td.sep{border-left:1pt solid #333}
#printArea th.tot,#printArea td.tot{font-weight:700}
/* the dashboard print runs over pages anyway, so its copy of the depot table is allowed
   to break — otherwise it is pushed whole to the next sheet and leaves a half-empty one */
#printArea table.flow,#printArea table.flow tbody{page-break-inside:auto}
#printArea table.flow thead{display:table-header-group}
#printArea table.flow tr{page-break-inside:avoid}
#printArea .pdash{page-break-inside:avoid;margin-bottom:9px}
#printArea .pdash h2{font-size:11px;color:#000;margin:0 0 5px;border-bottom:.5pt solid #999;padding-bottom:2px}
#printArea .pcharts{display:grid;grid-template-columns:1fr 1fr;gap:9px}
#printArea .pcharts .chcard{border:.5pt solid #999;border-radius:3px;padding:6px 8px;box-shadow:none;
  page-break-inside:avoid;background:#fff}
#printArea .pcharts .chcard h3{font-size:9.5px}
#printArea .pcharts .chcard .ch-sub{font-size:7.5px}
#printArea .pcharts .legend{font-size:7.5px;gap:3px 9px}
#printArea .pcharts .ch-body{overflow:visible}
#printArea .pcharts svg.chart{min-width:0}
#printArea .pcharts svg text{fill:#333}
#printArea .pcharts .wide{grid-column:1/-1}

/* ---- Complaints: the ageing matrices ----
   The screen table scrolls inside a fixed-height box and hides its overflow;
   on paper the whole thing has to be there. */
#printArea .mtxwrap{max-height:none!important;overflow:visible!important}
#printArea table.mtx td:first-child,#printArea table.mtx th:first-child{text-align:left;font-weight:600}
/* the row-label column (Category / Sub category / Depot) reads left-aligned like
   any label; only the serial and the figures stay centred */
#printArea table.mtx td:not(.sl):not(.num),
#printArea table.mtx thead th:not(.sl):not(.num){text-align:left}
#printArea table.mtx tbody tr:nth-child(even) td{background:#fff!important}
/* a matrix that runs long (sub-category, depot) repeats its heading like a list */
#printArea table.mtx.long{page-break-inside:auto}
#printArea table.mtx.long thead{display:table-header-group}
#printArea table.mtx.long tr{page-break-inside:avoid}
#printArea .delta{font-weight:700}
#printArea .delta.up,#printArea .delta.down{color:#000!important}
#printArea .delta.flat{color:#555!important}
/* Charts come after the tables. A captured canvas keeps its own proportions —
   the doughnut's is square — so the height is bounded and the width follows:
   stretched to the full width of the sheet, a square chart eats a whole page. */
#printArea .pchart{page-break-inside:avoid;margin:0 0 8px;text-align:center}
#printArea .pchart .t{font-size:8.5px;font-weight:700;color:#000;text-align:left;margin-bottom:2px}
#printArea .pchart img{display:block;margin:0 auto;width:auto;height:auto;
  max-width:100%;max-height:62mm;border:.4pt solid #999}
#printArea .pcharts .pchart.wide img{max-height:52mm}

/* ==========================================================================
   Complaints — the full report (printAll only).
   A plain technical-report look: a ruled masthead, a prose summary, numbered
   section headings and a labelled annexure. Everything is scoped to .rmast and
   the .rep container so no other printout is affected.
   ========================================================================== */
#printArea .rmast{border-bottom:1.6pt solid #000;margin-bottom:11px;padding-bottom:7px}
#printArea .rmast .ey{display:flex;justify-content:space-between;gap:12px;
  font-size:8.5px;letter-spacing:.7px;text-transform:uppercase;color:#666;font-weight:700;margin-bottom:6px}
#printArea .rmast h1{font-size:19px;line-height:1.1;margin:0;color:#000;font-weight:800;letter-spacing:.2px}
#printArea .rmast .meta{font-size:9.5px;color:#333;margin-top:5px;line-height:1.5}
#printArea .rmast .meta b{color:#000}
#printArea .rmast .meta .d{margin:0 5px;color:#bbb}
#printArea .rmast .meta2{font-size:8px;color:#888;margin-top:2px;letter-spacing:.2px}

/* numbered section headings — the spine of the report */
#printArea .rep .psec{display:flex;align-items:baseline;gap:9px;
  font-size:11.5px;font-weight:800;color:#000;margin:15px 0 6px;padding-bottom:3px;
  border-bottom:.9pt solid #000;page-break-after:avoid;break-after:avoid}
#printArea .rep .psec:first-child{margin-top:0}
#printArea .rep .psec .no{flex:none;min-width:15px;text-align:center;color:#000;
  font-variant-numeric:tabular-nums;
  border:.9pt solid #000;border-radius:2px;font-size:9.5px;line-height:1.35;padding:0 2px}
#printArea .rep .psec .sub{margin-left:auto;font-size:8.5px;font-weight:500;
  color:#666;letter-spacing:.3px;align-self:center}

/* the opening prose summary */
#printArea .rep .lead{font-size:10px;line-height:1.6;color:#222;margin:0 0 8px;
  padding:6px 9px;border-left:2.5pt solid #000;background:#fafafa}
#printArea .rep .lead b{color:#000;font-weight:700}

/* the summary figure grid reads sharper walled than open on this sheet */
#printArea .rep .psum{margin:0 0 4px}
#printArea .rep .psum td{border:.5pt solid #999}
#printArea .rep .psum .v{font-size:13.5px}

/* charts, two across, kept off the section rule above them */
#printArea .rep .pcharts{margin-top:3px}

@media print{
  html,body{background:#fff}
  body.printing>*{display:none!important}
  body.printing #printArea{display:block!important}
  .no-print{display:none!important}
}