/*
 * Platform-wide print stylesheet.
 *
 * Sneat's layout shell (.layout-wrapper / .layout-container /
 * .layout-page / .content-wrapper) uses `display: flex`,
 * `min-height: 100vh`, and `overflow: hidden` to give the sidebar
 * its SPA-like behavior. The browser print engine respects those
 * during printing, which clips every page in eva to one viewport.
 *
 * Strategy:
 *   1. Hide UI chrome (navbar, sidebar, footer, breadcrumbs,
 *      buttons, modals).
 *   2. Reset ONLY the Sneat layout shell (4 specific class names)
 *      to plain block flow, no min-height, no overflow clip.
 *      Do NOT touch Bootstrap's .container, .row, or .col-* —
 *      those rely on flex+breakpoint math that print media
 *      doesn't satisfy, so resetting their padding or display
 *      collapses columns and wraps text one char per line.
 *   3. Encourage clean page breaks: cards stay whole, headings
 *      stick with their first paragraph, table headers repeat.
 *   4. Force browsers to print background colors so badges and
 *      pills don't render as white rectangles.
 *
 * Use plain `display: block` (not `display: contents`) — print
 * engines in Chrome/Webkit have known edge cases where
 * `display: contents` still allows the original box's
 * `overflow: hidden` and `min-height: 100vh` to participate
 * in print layout calculation.
 *
 * media="print" on the link tag means this CSS is only fetched
 * and parsed when printing; zero cost on normal page loads.
 */

@media print {

  /* 1. Hide chrome. */
  .layout-navbar,
  .layout-menu,
  #layout-menu,
  .menu,
  .menu-inner,
  .content-footer,
  .footer,
  .content-backdrop,
  .breadcrumb,
  nav[aria-label="breadcrumb"],
  .swal2-container,
  .toast-container,
  .modal-backdrop,
  .layout-overlay,
  .template-customizer,
  .btn,
  button,
  input[type="button"],
  input[type="submit"],
  .dropdown-menu,
  /* Transient system alerts are chrome, not record. A dismissible banner
   * saying a routine failed is not part of the usage figures someone is
   * filing, and three of them print as solid colour blocks across the top of
   * the page. Toasts were already hidden here; a banner is the same class of
   * thing. The quota and endpoint banners are deliberately NOT hidden — those
   * state a billing condition that belongs on a billing record. */
  .bullhorn-notice {
    display: none !important;
  }

  /* 2. Reset the Sneat layout shell — and only the shell.
   *    Plain block flow, no inherited flex constraints, no
   *    min-height capping, no overflow clipping, no fixed
   *    positioning. Padding and margin to 0 so the print
   *    page uses its margins, not the screen layout's. */
  .layout-wrapper,
  .layout-container,
  .layout-page,
  .content-wrapper {
    display: block !important;
    position: static !important;
    flex: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* 3. Body itself. */
  html,
  body {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    background: #fff !important;
    color: #000 !important;
    font-size: 11pt;
    line-height: 1.4;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 3b. Force light-mode for printing — even when the user's
   *     active theme is dark. Sneat implements dark mode by
   *     re-defining `--bs-*` CSS custom properties on
   *     [data-bs-theme="dark"]. Overriding those variables here
   *     cascades through every Sneat component (cards, tables,
   *     accordions, list-groups, navs, dropdowns, inputs).
   *     Brand colors like --bs-success/--bs-danger are kept as
   *     theme defaults so badges, status pills, and check/X
   *     glyphs stay colored on white paper. */
  :root,
  html,
  html[data-bs-theme],
  html[data-bs-theme="dark"],
  html[data-bs-theme="light"],
  body,
  body[data-bs-theme] {
    color-scheme: light !important;
    --bs-body-bg: #ffffff !important;
    --bs-body-bg-rgb: 255, 255, 255 !important;
    --bs-body-color: #000000 !important;
    --bs-body-color-rgb: 0, 0, 0 !important;
    --bs-emphasis-color: #000000 !important;
    --bs-emphasis-color-rgb: 0, 0, 0 !important;
    --bs-secondary-color: #444444 !important;
    --bs-tertiary-color: #666666 !important;
    --bs-secondary-bg: #ffffff !important;
    --bs-secondary-bg-rgb: 255, 255, 255 !important;
    --bs-tertiary-bg: #f5f5f5 !important;
    --bs-tertiary-bg-rgb: 245, 245, 245 !important;
    --bs-card-bg: #ffffff !important;
    --bs-card-color: #000000 !important;
    --bs-card-cap-bg: #ffffff !important;
    --bs-card-border-color: #cccccc !important;
    --bs-border-color: #cccccc !important;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.15) !important;
    --bs-table-bg: #ffffff !important;
    --bs-table-color: #000000 !important;
    --bs-table-border-color: #cccccc !important;
    --bs-table-striped-bg: #f9f9f9 !important;
    --bs-table-striped-color: #000000 !important;
    --bs-heading-color: #000000 !important;
    --bs-link-color: #000000 !important;
    --bs-link-hover-color: #000000 !important;
  }

  /* 3c. Belt-and-suspenders: any Sneat rule that sets a
   *     background-color directly (rather than via a var)
   *     gets overridden here. Targets only structural
   *     containers — colored badges/pills/dots are not in
   *     this list and keep their colors. */
  html, body,
  .card, .card-body, .card-header, .card-footer,
  .container, .container-xxl, .container-fluid, .container-p-y,
  .row,
  table, thead, tbody, tfoot, tr, th, td,
  .table, .table > :not(caption) > * > *,
  .accordion, .accordion-item, .accordion-button, .accordion-body,
  .list-group, .list-group-item,
  .nav, .nav-tabs, .tab-content, .tab-pane,
  pre, code, .text-muted, .text-secondary {
    background-color: #fff !important;
    color: #000 !important;
  }

  /* 3d. Muted text should still be a touch lighter than pure
   *     black so it reads as muted on paper. Override after
   *     the blanket black above. */
  .text-muted,
  .text-secondary,
  small,
  .small {
    color: #555 !important;
  }

  /* 4. Cards: keep each panel whole where possible. */
  .card {
    break-inside: avoid;
    page-break-inside: avoid;
    box-shadow: none !important;
    border: 1px solid #ccc !important;
    margin-bottom: 12pt !important;
    background: #fff !important;
  }

  /* 5. Anti-orphan headings. */
  h1, h2, h3, h4, h5, h6 {
    break-after: avoid;
    page-break-after: avoid;
  }

  /* 6. Tables: header repeats; rows don't split mid-row. */
  thead {
    display: table-header-group;
  }
  tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* 7. DataTables / Grid.js: hide the search/length/pagination
   *    chrome — meaningless on paper. The table itself stays. */
  .dataTables_wrapper .dataTables_length,
  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_info,
  .dataTables_wrapper .dataTables_paginate,
  .dt-buttons,
  .gridjs-search,
  .gridjs-pagination,
  .gridjs-footer {
    display: none !important;
  }

  /* 8. Honor background colors so badges and verdict pills
   *    don't print as white rectangles. */
  *, *::before, *::after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* 9. Links readable, no underline noise. */
  a {
    color: inherit !important;
    text-decoration: none !important;
  }
}

/*
 * 10. PRINT IN LIGHT, whatever the screen theme is.
 *
 * Sections 3c and 4 above already force #fff/#000 on the main surfaces — and
 * in dark mode they lose. The GUI palette emits
 *     html.dark-style .card { background-color: #363636 !important; }
 * which is specificity (0,2,0) against the print sheet's `.card` at (0,1,0);
 * `!important` does not break that tie, the more specific rule simply wins. So
 * a dark-mode print came out with dark cards, dark tables and light text on
 * paper, and section 8's print-color-adjust:exact guaranteed the printer
 * honoured it faithfully.
 *
 * Everything here is scoped to html.dark-style ON PURPOSE. Light-mode printing
 * already worked; widening these rules would risk changing it for no reason.
 * Selectors are also element-qualified (div.card, table.table) so they win on
 * specificity rather than on document order — print.css happens to be linked
 * after the palette <style> today, and a plan that depends on that stays
 * correct only until someone moves an include.
 *
 * Anyone printing these pages is keeping a record. The paper has to be
 * readable in a filing cabinet, not a screenshot of a dark UI.
 */
@media print {

  /* 10a. Variables first: everything var-driven follows without being named. */
  html.dark-style,
  html.dark-style body {
    --bs-body-bg: #fff !important;
    --bs-body-color: #000 !important;
    --bs-emphasis-color: #000 !important;
    --bs-secondary-color: #555 !important;
    --bs-secondary-bg: #f5f5f5 !important;
    --bs-tertiary-bg: #fafafa !important;
    --bs-border-color: #ccc !important;
    --bs-card-bg: #fff !important;
    --bs-table-bg: #fff !important;
    --bs-table-color: #000 !important;
    --bs-table-striped-bg: #f7f7f7 !important;
    --bs-table-striped-color: #000 !important;
    --bs-heading-color: #000 !important;
    --bs-link-color: #000 !important;
  }

  /* 10b. The surfaces the palette hardcodes, matched at equal-or-greater
   *      specificity. */
  html.dark-style body,
  html.dark-style .layout-page,
  html.dark-style .content-wrapper,
  html.dark-style div.card,
  html.dark-style .card-header,
  html.dark-style .card-body,
  html.dark-style .card-footer,
  html.dark-style table.table,
  html.dark-style .table > :not(caption) > * > *,
  html.dark-style thead, html.dark-style tbody, html.dark-style tfoot,
  html.dark-style tr, html.dark-style th, html.dark-style td,
  html.dark-style .table-responsive,
  html.dark-style .list-group,
  html.dark-style .list-group-item,
  html.dark-style .accordion,
  html.dark-style .accordion-item,
  html.dark-style .accordion-body,
  html.dark-style .accordion-button,
  html.dark-style .nav-tabs,
  html.dark-style .tab-content,
  html.dark-style .modal-content,
  html.dark-style .offcanvas,
  html.dark-style pre,
  html.dark-style code,
  html.dark-style kbd {
    background-color: #fff !important;
    background-image: none !important;
    color: #000 !important;
    border-color: #ccc !important;
  }

  /* 10b-ii. Table CELLS specifically.
   *
   * The table element itself went white from 10b and the cells did NOT: they
   * resolve their background through Bootstrap's
   *     .table > :not(caption) > * > * { background-color: var(--bs-table-bg) }
   * chain, which outranks a bare `td` selector, so the dark surface showed
   * through as black-on-charcoal — worse than the original problem, because
   * 10b had already turned the text black. Named at the same shape Bootstrap
   * uses, plus the row/cell paths, and the variable is pinned as well so
   * nothing downstream can reintroduce it.
   */
  html.dark-style .table,
  html.dark-style .table-sm {
    --bs-table-bg: #fff !important;
    --bs-table-color: #000 !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-striped-bg: #f7f7f7 !important;
    --bs-table-striped-color: #000 !important;
    --bs-table-hover-bg: #fff !important;
    --bs-table-hover-color: #000 !important;
    --bs-table-border-color: #ccc !important;
  }
  html.dark-style .table > :not(caption) > * > *,
  html.dark-style .table tbody tr td,
  html.dark-style .table tbody tr th,
  html.dark-style .table thead tr th,
  html.dark-style table tbody td,
  html.dark-style table thead th {
    background-color: #fff !important;
    background-image: none !important;
    color: #000 !important;
    box-shadow: none !important;
    border-color: #ccc !important;
  }

  /* 10c. Form controls — the range and org pickers on the usage page, and
   *      every filter elsewhere. A select prints as a box showing its chosen
   *      value, which on a record IS the information: it says which window and
   *      which organization the figures below cover. Dark-on-dark made that
   *      unreadable. */
  html.dark-style select.form-select,
  html.dark-style input.form-control,
  html.dark-style textarea.form-control,
  html.dark-style .input-group-text,
  html.dark-style .form-check-input:not(:checked) {
    background-color: #fff !important;
    background-image: none !important;
    color: #000 !important;
    border: 1px solid #999 !important;
    -webkit-appearance: none;
    appearance: none;
  }

  /* 10c-ii. Module CSS that paints a control from a theme variable.
   *
   * harness.css has
   *     .harness-page .harness-page-size {
   *       background-color: var(--bs-body-bg, transparent) !important; }
   * and 10c's `select.form-select` did not beat it on this element, so the page
   * size picker printed as a black box while the Org picker beside it printed
   * white — the kind of inconsistency that makes a printed page look broken
   * rather than dark. Named with enough classes to win outright, and kept
   * generic (`[class*="page-size"]`, the grid footers) so the sibling grids on
   * harness, personas, cadre and studio are covered by the same rule instead
   * of each needing its own discovery. */
  html.dark-style .harness-page select.form-select,
  html.dark-style select[class*="page-size"],
  html.dark-style .gridjs-wrapper,
  html.dark-style .gridjs-table,
  html.dark-style .gridjs-td,
  html.dark-style .gridjs-th,
  html.dark-style td.gridjs-td,
  html.dark-style th.gridjs-th {
    background-color: #fff !important;
    background-image: none !important;
    color: #000 !important;
    border-color: #ccc !important;
  }

  /* 10d. Label chips. In light mode these are pale tints with coloured text
   *      and print fine, which is why section 8 keeps backgrounds. In dark
   *      mode they invert to a dark tint with pale text — a black box with
   *      white writing on paper. Neutralised to a light chip with a dark
   *      border so the DISTINCTION survives even though the hue does not. */
  html.dark-style .badge,
  html.dark-style [class*="bg-label-"] {
    background-color: #f0f0f0 !important;
    color: #000 !important;
    border: 1px solid #999 !important;
  }

  /* 10e. Charts. ApexCharts draws its axis and legend text with the theme's
   *      light label colour, which disappears on white — the chart would print
   *      as bars with no scale, which is worse than no chart. Series colours
   *      are brand hues and print fine, so they are left alone. */
  html.dark-style .apexcharts-text,
  html.dark-style .apexcharts-text tspan,
  html.dark-style .apexcharts-xaxis-label,
  html.dark-style .apexcharts-yaxis-label,
  html.dark-style .apexcharts-title-text,
  html.dark-style .apexcharts-datalabel {
    fill: #000 !important;
  }
  html.dark-style .apexcharts-legend-text {
    color: #000 !important;
  }
  html.dark-style .apexcharts-gridline,
  html.dark-style .apexcharts-xaxis line,
  html.dark-style .apexcharts-yaxis line {
    stroke: #ddd !important;
  }
  html.dark-style .apexcharts-canvas,
  html.dark-style .apexcharts-inner {
    background: #fff !important;
  }

  /* 10f. Muted text stays muted, not black — same intent as 3d, restated at
   *      the specificity this section needs. */
  html.dark-style .text-muted,
  html.dark-style .text-secondary,
  html.dark-style small,
  html.dark-style .small {
    color: #555 !important;
  }
}