/*
 * R293 (W9-print/U21) — Global print stylesheet.
 *
 * Loaded LAST in index.html so its `@media print` rules win on equal
 * specificity. Default screen rendering is untouched (every selector lives
 * inside an `@media print` block, except a handful of `.print-only` /
 * `.no-print` classes that apply on-screen too — see "Utility classes"
 * section below).
 *
 * Scope of fixes addressed (see docs/ROADMAP-v2-kit-direct.md §U21):
 *
 *   - U21-P0-1  Audit log printout strips WORM integrity / mid-row breaks
 *   - U21-P0-2  Billing/invoice print strips CNPJ + fiscal context
 *   - U21-P0-3  DSAR / privacy print path (covered in /print/audit-log too)
 *   - U21-P0-4  Incidents chain-of-custody loses status colour
 *   - U21-P1-1  Camera config sheet for installer
 *   - U21-P1-2  Sites/Storage/Servers tables print sidebar + filters
 *   - U21-P2-1  @page size / margin / orientation (A4 portrait default)
 *   - U21-P2-2  URL suffix for hyperlinks
 *   - U21-P2-3  Print font-size escalation (CNJ 12 pt minimum target)
 *   - U21-P2-4  @page margin-box for page-X-of-Y
 *   - U21-P2-5  Cookie consent / toasts / modals suppression
 *   - U21-P2-6  <video> / <canvas> hidden on print
 *
 * Cross-browser notes:
 *   - `@page` size + margin + margin-boxes: supported in Chrome, Edge,
 *     Safari. Firefox honours `size` + `margin` but ignores `@top-left`
 *     and similar margin-box content rules — falls back to the UA default
 *     header. For Firefox users we render a `.print-header` block at the
 *     top of every `/print/*` page (positioned at the document flow's
 *     start), so the org name + timestamp still appear on every page via
 *     the running-header convention.
 *   - `print-color-adjust: exact` (Chrome/Edge/Safari) and
 *     `-webkit-print-color-adjust: exact` (legacy WebKit + Firefox) keep
 *     status pills / badges colourful for the operator who explicitly
 *     wants colour. Default behaviour is still text + border, no fill.
 *   - Tested against Chrome 125, Edge 125, Firefox 126, Safari 17 print
 *     preview. Cross-browser screenshots: see PR body.
 */

/* ===========================================================================
 * Utility classes — apply on screen AND print.
 * `.no-print` hides an element when printing (use sparingly; the @media
 *  print block below suppresses most app chrome already).
 * `.print-only` hides an element on screen and reveals it when printing.
 * ========================================================================== */
.print-only { display: none; }

/* R390 (C27 a11y #6) — visually-hidden but kept in the accessibility tree
   (screen + print). Used for `<caption>` text that names a table for AT /
   accessible-PDF readers while the visible `.print-section-title` stays the
   only on-paper label. Standard clip technique; works inside `<table>`
   (`display:table-caption` would un-hide it, so we don't set it). */
.print-vh {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media print {

/* =========================================================================
 * @page — A4 portrait, 1.5cm margins, page-X-of-Y footer.
 *
 * Chrome/Edge/Safari render the `@bottom-right` and `@top-right` margin
 * boxes from `@page`. Firefox ignores them but the in-flow header / footer
 * inside `.print-header` and `.print-footer` (rendered by every /print/*
 * page) still surface the same content. The two are intentionally
 * redundant — operators on either browser see the same information.
 * ========================================================================= */
@page {
  size: A4 portrait;
  margin: 1.5cm;
  /* Chrome/Edge/Safari margin-boxes — Firefox no-ops these silently. */
  @bottom-right {
    content: "Página " counter(page) " de " counter(pages);
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    font-size: 9pt;
    color: #444;
  }
  @bottom-left {
    content: "DNUV Cloud · " attr(data-org);
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    font-size: 9pt;
    color: #444;
  }
}

/* R322 (W9-review/P1-15) — Removed two empty `body.print-landscape`
   blocks. The earlier comment-only stubs were aspirational (no rules,
   no @page override), so adding `body.print-landscape` to any page did
   nothing. CSS Paged Media Level 3 supports `@page landscape { size:
   landscape; }` + a page-name selector, but that requires a paired
   `page: landscape` rule on the element — we don't yet have a page
   that needs it. Re-introduce a real implementation only when an
   actual long-table report (Audit / Storage breakdown) needs it. */
@page :first { /* first-page header strip; visual only via in-flow rules */ }

/* =========================================================================
 * Reset — black text, white background, no shadows. Preserve colour for
 * the few elements that benefit from it (status pills, brand mark).
 * ========================================================================= */
*,
*::before,
*::after {
  /* Print engines drop backgrounds by default; this is the universal
     opt-out for the brand mark / status pills below. We intentionally
     scope this to a handful of selectors rather than the universal `*`
     so most content stays plain B&W. */
  box-shadow: none !important;
  text-shadow: none !important;
}

html, body {
  background: #fff !important;
  color: #000 !important;
  font-family: var(--font-sans, "Inter", system-ui, sans-serif);
  font-size: 11pt;
  line-height: 1.45;
  margin: 0;
  padding: 0;
}

/* Print font-size escalation (U21-P2-3): table cells / audit rows / pills
   default to ≥ 9 pt so CNJ res. 105/2010 + US Court Rule 32(a) minimum is
   met. Headings stay legible. */
h1 { font-size: 18pt; font-weight: 700; margin: 0 0 6mm; }
h2 { font-size: 14pt; font-weight: 700; margin: 6mm 0 3mm; }
h3 { font-size: 12pt; font-weight: 700; margin: 4mm 0 2mm; }
h4, h5, h6 { font-size: 11pt; font-weight: 700; margin: 3mm 0 2mm; }
p  { font-size: 11pt; margin: 0 0 3mm; }
table, td, th { font-size: 10pt; }
.pill, .status-badge, .filter-chip { font-size: 9pt; }
code, pre { font-family: 'Courier New', monospace; font-size: 9pt; }

/* =========================================================================
 * App chrome suppression (U21-P0-2 / P1-2 / P2-5).
 * The screen shell prints by default; everything here is forcibly hidden.
 * ========================================================================= */
.sidebar,
.appbar,
.topbar,
.topbar-actions,
.appbar-search,
.appbar-right,
.app-footer,
.help-fab,
.dnuv-fab,
.fab-stack,
.toast-stack,
.modal-backdrop,
.fs-overlay,
.dnuv-consent-overlay,
[data-cookie-consent],
[data-tip],
[data-tooltip],
.tooltip,
.popover,
.dropdown-menu,
.ab-panel,
.ab-icon,
.ab-chip,
.ab-quick,
.ab-collapse,
.ab-user,
.user-card,
.sb-brand,
.ws-switcher,
.ab-bell,
.ab-badge,
.no-print {
  display: none !important;
  visibility: hidden !important;
}

/* Show the active modal (when intentionally opened for print review).
   Suppression rule above hides .modal-backdrop; this opts back in. */
.modal-backdrop.print-keep,
.modal-backdrop.print-keep .modal {
  display: block !important;
  visibility: visible !important;
  position: static !important;
  background: #fff !important;
}

/* Buttons + interactive controls — hidden by default on print. The
   `/print/*` pages don't render them. Screen pages that get Ctrl+P'd
   directly (Audit, Billing, Storage…) still hide their buttons here. */
button:not(.print-keep),
.btn:not(.print-keep),
.row-kebab,
.filter-chip,
.sort-ico,
.data-toolbar,
.data-search,
.data-filters,
.data-actions,
.page-actions,
.page-tabs,
.bulk-actions,
.audit-action-export,
.audit-action-retry,
.billing-action-portal,
input[type="text"],
input[type="search"],
input[type="checkbox"]:not(.print-keep),
input[type="radio"]:not(.print-keep),
select:not(.print-keep),
nav,
.nav,
.breadcrumb {
  display: none !important;
}

/* Layout reset — collapse the grid sidebar/main and let the printed
   document be a flat single-column flow. */
.app,
.app.sidebar-collapsed,
.main,
#screen-app,
#screen-app .screen,
#route-root,
.content,
.page-shell {
  display: block !important;
  grid-template-columns: none !important;
  width: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  min-height: auto !important;
  background: #fff !important;
  box-shadow: none !important;
  border: none !important;
}

/* =========================================================================
 * In-flow print header + footer — rendered by every /print/* page.
 * Logo (single-colour text), title, generation timestamp BR, page URL.
 *
 * U21-P2-4 — provides letterhead even on Firefox where `@page @top-left`
 * margin-boxes are not honoured.
 * ========================================================================= */
.print-only,
.print-header,
.print-footer {
  display: block !important;
  visibility: visible !important;
}

.print-header {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid #000;
  padding: 0 0 4mm;
  margin: 0 0 6mm;
}
.print-header .ph-brand {
  font-family: var(--font-sans, "Inter", sans-serif);
  font-weight: 800;
  font-size: 16pt;
  letter-spacing: 0.04em;
  color: #000;
}
.print-header .ph-brand-sub {
  font-size: 9pt;
  color: #444;
  font-weight: 500;
  margin-top: 1mm;
}
.print-header .ph-title {
  flex: 1;
  text-align: center;
  font-size: 13pt;
  font-weight: 700;
  color: #000;
  padding: 0 6mm;
  /* R390 (C27 a11y #4) — .ph-title is now an <h1>; reset the UA/print
     heading margin so the letterhead stays vertically centred. */
  margin: 0;
}
.print-header .ph-meta {
  text-align: right;
  font-size: 9pt;
  color: #444;
  line-height: 1.4;
}
.print-header .ph-meta b { color: #000; }

.print-footer {
  margin-top: 8mm;
  padding-top: 3mm;
  border-top: 1px solid #888;
  font-size: 8pt;
  color: #444;
  text-align: center;
  page-break-before: avoid;
}

/* Repeat headers across pages — table thead is the natural anchor for
   long lists (audit / invoices / users / storage / incidents / events). */
table {
  width: 100% !important;
  border-collapse: collapse !important;
}
thead { display: table-header-group !important; }
tfoot { display: table-footer-group !important; }

table.print-data {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 6mm;
}
table.print-data th,
table.print-data td {
  border: 1px solid #888;
  padding: 2mm 3mm;
  font-size: 9pt;
  text-align: left;
  vertical-align: top;
}
table.print-data th {
  background: #f0f0f0 !important;
  font-weight: 700;
  color: #000;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
table.print-data tr {
  page-break-inside: avoid !important;
}

/* =========================================================================
 * Page-break / orphans / widows rules (U21 §2).
 * ========================================================================= */
.page-break,
.print-page-break { page-break-after: always !important; }

.page-keep,
.audit-row,
.inc-evidence,
.note-item,
.print-card,
.print-section,
table.data tr,
table.print-data tr {
  page-break-inside: avoid !important;
}

h1, h2, h3, h4, h5, h6,
.print-section-title {
  page-break-after: avoid !important;
  page-break-inside: avoid !important;
}

img, svg {
  page-break-inside: avoid !important;
  max-width: 100% !important;
  height: auto !important;
}

p, li, blockquote, td, th { orphans: 3; widows: 3; }

/* =========================================================================
 * Hyperlinks — show the URL inline so paper recovers the destination.
 * U21-P2-2. Skip pure anchor links and "javascript:" / inline handlers.
 * ========================================================================= */
a:link,
a:visited {
  color: #000 !important;
  text-decoration: underline;
}
a[href]:not([href^="#"]):not([href^="javascript:"]):not(.print-no-url)::after {
  content: " (" attr(href) ")";
  font-size: 8pt;
  color: #555;
  font-weight: 400;
  word-break: break-all;
}

/* =========================================================================
 * Status badges — text + border, no fill by default. Colour preserved on
 * `.print-keep-color` so .pill-ok (paid invoices) still distinguish from
 * .pill-warn (overdue). U21-P0-2.
 * ========================================================================= */
.pill,
.status-pill,
.status-badge,
.status-dot {
  background: #fff !important;
  color: #000 !important;
  border: 1px solid #444 !important;
  padding: 1pt 4pt !important;
  font-weight: 700 !important;
  display: inline-block;
}
.pill.print-keep-color,
.pill-ok,
.pill.tone-ok,
.status-pill.ok,
.status-dot.online {
  border-color: #0a8a4a !important;
  color: #0a5a2c !important;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.pill.print-keep-color.danger,
.pill-danger,
.pill.tone-danger,
.status-pill.danger,
.status-dot.offline,
.status-dot.open {
  border-color: #b21d2b !important;
  color: #8a141d !important;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.pill.print-keep-color.warn,
.pill-warn,
.pill.tone-warn,
.status-dot.investigating {
  border-color: #b87800 !important;
  color: #804f00 !important;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

/* =========================================================================
 * Media — <video> + canvases waste paper. Replace with a marker.
 * U21-P2-6.
 * ========================================================================= */
video,
canvas,
.live-shell,
.live-tile-video,
.sparkline {
  display: none !important;
}
.live-shell::after,
video::after {
  content: "[vídeo ao vivo — consulte o painel online]";
  display: block;
  font-size: 9pt;
  color: #555;
  font-style: italic;
  padding: 4mm 0;
}

/* =========================================================================
 * Cards / lists — clean borders, no shadows, no fills.
 * Used by /print/* pages and any other page rendered via Ctrl+P.
 * ========================================================================= */
.print-card,
.print-section,
.kpi,
.bill-card,
.kpi-card,
.set-card {
  background: #fff !important;
  border: 1px solid #888 !important;
  border-radius: 0 !important;
  padding: 3mm 4mm !important;
  margin: 0 0 4mm !important;
  page-break-inside: avoid !important;
}

.print-section-title {
  font-size: 12pt;
  font-weight: 700;
  margin: 4mm 0 2mm;
  padding-bottom: 1mm;
  border-bottom: 1px solid #444;
}

/* R390 (C27 system #9) — in-card heading: a `.print-section-title`
   repurposed as a card header (no border, flush top, optional inline
   pill on the right). Replaces the inline border-bottom:none overrides. */
.print-card-head {
  border-bottom: none;
  margin-top: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

/* R390 (C27 system #1 + #5, a11y #2) — shared key/value detail table.
   Replaces the hand-rolled `style="width:100%;border-collapse:collapse;
   font-size:11pt"` + per-label `style="padding…;color:#444;width:140px"`
   repeated across the fiscal / incident / storage / roster reports.
   The row label is a `<th scope="row">` so AT binds value↔label. */
.print-kv {
  width: 100%;
  border-collapse: collapse;
  font-size: 11pt;
}
.print-kv td,
.print-kv th {
  padding: 2px 8px 2px 0;
  vertical-align: top;
  text-align: left;
}
.print-kv th[scope="row"] {
  color: #444;
  font-weight: 400;
  white-space: nowrap;
  width: 42mm;
}

/* R390 (C27 critique #4/#10, system #5, a11y #10) — muted secondary text
   + fine-print. Replaces the inline `color:#444` / `font-size:8pt;color:#444`
   literals scattered across the six renderers. Lifts the old 8pt overrides
   to the 9pt CNJ/Court legibility floor print.css already promises. */
.print-muted { color: #444; }
.print-fineprint { font-size: 9pt; color: #444; }

/* R390 (C27 system #3) — the "big amount" cell on the invoice. */
.print-amount { font-size: 14pt; font-weight: 700; }

/* R390 (C27 system #8) — tag chips spacing without per-chip inline margin. */
.print-card .pill + .pill { margin-left: 4px; }

/* TOC at top of report — quick jump for a paper auditor. */
.print-toc {
  border: 1px solid #888;
  padding: 3mm 4mm;
  margin: 0 0 6mm;
  page-break-after: avoid;
}
.print-toc h2 {
  margin: 0 0 2mm;
  font-size: 11pt;
}
.print-toc ul {
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 2;
  column-gap: 8mm;
}
.print-toc li {
  font-size: 9pt;
  padding: 1mm 0;
  break-inside: avoid;
}
.print-toc li b {
  color: #000;
  font-weight: 700;
}

/* Filters summary block — shows the operator-applied filters on the
   printed copy (so a paper trail records which slice of the data was
   exported). */
.print-filters {
  border-left: 3px solid #444;
  padding: 2mm 4mm;
  margin: 0 0 4mm;
  background: #f7f7f7 !important;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  font-size: 9pt;
  page-break-inside: avoid;
}
.print-filters dt {
  font-weight: 700;
  display: inline;
  margin-right: 1mm;
}
.print-filters dt::after { content: ":"; }
.print-filters dd {
  display: inline;
  margin: 0 4mm 0 0;
}

/* Summary KPI strip — used at the top of Incidents / Events reports.
   R390 (C27 system #4) — auto-fit so the grid adapts to any KPI count
   (renderKpiGrid imposes no fixed N); previously hardcoded to 4 columns,
   so a future report passing 3 or 5 KPIs would mis-grid. */
.print-kpi-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(38mm, 1fr));
  gap: 3mm;
  margin: 0 0 6mm;
  page-break-inside: avoid;
}
.print-kpi {
  border: 1px solid #888;
  padding: 2mm 3mm;
  text-align: left;
}
.print-kpi .label {
  font-size: 8pt;
  color: #444;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.print-kpi .value {
  font-size: 14pt;
  font-weight: 700;
  margin-top: 1mm;
  color: #000;
}

/* Signature blocks — bottom of reports that need ink + date. */
.print-signature {
  margin-top: 12mm;
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 14mm;
  page-break-inside: avoid;
}
.print-signature .sig-block {
  border-top: 1px solid #000;
  padding-top: 2mm;
  font-size: 9pt;
}

} /* end @media print */

/*
 * Visibility helpers for the print pages — these need to apply on SCREEN
 * too so the print template is visible in preview / debugging. The
 * `/print/*` routes attach `.print-route` to body so we can constrain
 * styling without leaking into the app shell.
 */
body.print-route {
  background: #fff;
  color: #000;
  font-family: var(--font-sans, "Inter", system-ui, sans-serif);
  font-size: 12pt;
  line-height: 1.5;
  padding: 24px 32px;
  max-width: 900px;
  margin: 0 auto;
}
body.print-route .sidebar,
body.print-route .appbar,
body.print-route .topbar,
body.print-route .help-fab,
body.print-route .dnuv-fab,
body.print-route .toast-stack {
  display: none !important;
}
body.print-route .app {
  display: block;
  grid-template-columns: none;
  min-height: 0;
}
body.print-route #route-root,
body.print-route .content,
body.print-route .page-shell {
  padding: 0;
  margin: 0;
  background: #fff;
}
body.print-route .print-header,
body.print-route .print-footer,
body.print-route .print-only {
  display: block;
}
body.print-route .print-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  border-bottom: 2px solid #000;
  padding: 0 0 12px;
  margin: 0 0 20px;
}
body.print-route .print-header .ph-brand {
  font-weight: 800;
  font-size: 22px;
  letter-spacing: 0.04em;
}
body.print-route .print-header .ph-brand-sub {
  font-size: 11px;
  color: #444;
  font-weight: 500;
}
body.print-route .print-header .ph-title {
  flex: 1;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  padding: 0 16px;
  margin: 0;
}
body.print-route .print-header .ph-meta {
  font-size: 11px;
  text-align: right;
  color: #444;
  line-height: 1.5;
}
body.print-route .print-header .ph-meta b { color: #000; }
body.print-route table.print-data {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 20px;
}
body.print-route table.print-data th,
body.print-route table.print-data td {
  border: 1px solid #888;
  padding: 6px 10px;
  font-size: 12px;
  text-align: left;
  vertical-align: top;
}
body.print-route table.print-data th {
  background: #f0f0f0;
  font-weight: 700;
}
body.print-route .print-section-title {
  font-size: 14px;
  font-weight: 700;
  margin: 20px 0 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid #444;
}
body.print-route .print-card {
  border: 1px solid #888;
  padding: 10px 14px;
  margin: 0 0 16px;
}
body.print-route .print-toc {
  border: 1px solid #888;
  padding: 12px 16px;
  margin: 0 0 24px;
}
body.print-route .print-toc h2 {
  margin: 0 0 8px;
  font-size: 14px;
}
body.print-route .print-toc ul {
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 2;
  column-gap: 30px;
}
body.print-route .print-toc li {
  font-size: 12px;
  padding: 3px 0;
  break-inside: avoid;
}
body.print-route .print-filters {
  border-left: 3px solid #444;
  padding: 8px 12px;
  margin: 0 0 16px;
  background: #f7f7f7;
  font-size: 12px;
}
body.print-route .print-filters dt {
  font-weight: 700;
  display: inline;
  margin-right: 4px;
}
body.print-route .print-filters dt::after { content: ":"; }
body.print-route .print-filters dd {
  display: inline;
  margin: 0 16px 0 0;
}
body.print-route .print-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin: 0 0 20px;
}
body.print-route .print-kpi {
  border: 1px solid #888;
  padding: 8px 10px;
}
body.print-route .print-kpi .label {
  font-size: 10px;
  color: #444;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
body.print-route .print-kpi .value {
  font-size: 18px;
  font-weight: 700;
  margin-top: 4px;
}
body.print-route .print-footer {
  margin-top: 24px;
  padding-top: 8px;
  border-top: 1px solid #888;
  font-size: 11px;
  color: #444;
  text-align: center;
}
body.print-route .print-signature {
  margin-top: 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
}
body.print-route .print-signature .sig-block {
  border-top: 1px solid #000;
  padding-top: 8px;
  font-size: 12px;
}
body.print-route .pill,
body.print-route .status-pill,
body.print-route .status-badge {
  background: #fff;
  color: #000;
  border: 1px solid #444;
  padding: 1px 6px;
  font-weight: 700;
  display: inline-block;
  border-radius: 0;
  font-size: 11px;
}
body.print-route .pill-ok       { border-color: #0a8a4a; color: #0a5a2c; }
body.print-route .pill-danger   { border-color: #b21d2b; color: #8a141d; }
body.print-route .pill-warn     { border-color: #b87800; color: #804f00; }

/* R390 (C27) — screen-preview mirrors of the shared print utilities so the
   on-screen /print/* preview (real DOM, read by AT) matches the paper. */
body.print-route .print-card-head {
  border-bottom: none;
  margin-top: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}
body.print-route .print-kv {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
body.print-route .print-kv td,
body.print-route .print-kv th {
  padding: 3px 10px 3px 0;
  vertical-align: top;
  text-align: left;
}
body.print-route .print-kv th[scope="row"] {
  color: #444;
  font-weight: 400;
  white-space: nowrap;
}
body.print-route .print-muted { color: #444; }
body.print-route .print-fineprint { font-size: 11px; color: #444; }
body.print-route .print-amount { font-size: 18px; font-weight: 700; }
body.print-route .print-card .pill + .pill { margin-left: 4px; }

/* Help text shown on the screen preview only, hidden on actual print. */
body.print-route .print-screen-help {
  background: #fff8e1;
  border: 1px solid #d4a300;
  padding: 8px 12px;
  font-size: 11px;
  color: #5c3700;
  margin: 0 0 16px;
  border-radius: 4px;
}
@media print {
  body.print-route .print-screen-help { display: none !important; }
}