/* ========================================================
   PRINT STYLES
   ========================================================
   The dashboard's "Export PDF" button calls window.print(). Before this
   file, the only print rule in the codebase set a font size — so a printed
   dashboard came out with the navigation sidebar down the left edge, the
   filter controls, any visible toast, and a 260px indent on every page.

   Aims:
     1. Print only the content, on white, in black.
     2. Never split a card, table row or chart across a page break.
     3. Stamp the output with what it is and when it was produced — a
        printed dashboard otherwise gives no clue which period it covers.
   ======================================================== */

@media print {

  /* ---- Page setup ---- */
  @page {
    margin: 14mm 12mm;
  }

  /* ---- Strip the application chrome ---- */
  .sidebar,
  .sidebar-overlay,
  .mobile-header,
  .bottom-nav,
  .toast-container,
  .skip-link,
  .filter-panel,
  .btn,
  .btn-action,
  .btn-primary,
  .btn-secondary,
  .btn-danger,
  .btn-edit,
  .btn-submit,
  .tab-container,
  .dataTables_length,
  .dataTables_filter,
  .dataTables_paginate,
  .dataTables_info,
  .toolbar,
  .modal,
  .skeleton,
  input[type="checkbox"],
  .row-chk,
  .select-all-chk {
    display: none !important;
  }

  /* ---- Reset the layout the sidebar imposed ---- */
  html, body {
    background: #fff !important;
    color: #000 !important;
    font-size: 10.5pt;
    line-height: 1.45;
  }

  body::before { display: none !important; }   /* the fixed gradient layer */

  body { display: block !important; }

  .main-content {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  /* ---- Cards become plain bordered blocks ---- */
  .card, .panel, .kpi-card, .inv-item, .order-card, .machine-target-row {
    background: #fff !important;
    box-shadow: none !important;
    border: 1px solid #bbb !important;
    break-inside: avoid;
    page-break-inside: avoid;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transform: none !important;
  }

  /* Grids collapse to something that fits a portrait page. */
  .grid { display: block !important; }
  .grid > * { margin-bottom: 8mm; }

  .inv-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 4mm !important;
  }

  /* ---- Keep related content together ---- */
  h1, h2, h3, h4 { break-after: avoid; page-break-after: avoid; color: #000 !important; }
  tr, .breakdown-item, .achievement-pill { break-inside: avoid; page-break-inside: avoid; }
  table { break-inside: auto; }
  thead { display: table-header-group; }   /* repeat headers on each page */

  /* ---- Ink-friendly text ---- */
  .text-muted, .kpi-title, .inv-title { color: #444 !important; }

  /* The gradient text trick renders as an invisible block when printed. */
  .text-gradient {
    background: none !important;
    -webkit-background-clip: initial !important;
    -webkit-text-fill-color: #000 !important;
    color: #000 !important;
  }

  /* Charts are canvases — let them print at a sensible size. */
  canvas {
    max-width: 100% !important;
    height: auto !important;
    break-inside: avoid;
  }

  /* Status colours still need to be distinguishable in greyscale, so give
     the stripe a visible border rather than relying on hue alone. */
  .inv-item-status { border-left: 3px solid #000 !important; }
  .inv-item.critical .inv-item-status { border-left-style: solid !important; }
  .inv-item.warning  .inv-item-status { border-left-style: dashed !important; }
  .inv-item.healthy  .inv-item-status { border-left-style: dotted !important; }

  /* Progress bars need a printable outline; a coloured fill alone may not
     render at all with "background graphics" disabled. */
  .progress-bar-bg { border: 1px solid #999 !important; }
  .progress-bar-fill { background: #555 !important; }

  /* Expand links that point somewhere meaningful. Internal app links are
     useless on paper, so only external URLs are shown. */
  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    color: #555;
  }

  /* ---- Print-only header ---- */
  .print-header {
    display: block !important;
    border-bottom: 2px solid #000;
    padding-bottom: 3mm;
    margin-bottom: 6mm;
  }
  .print-header .print-title { font-size: 14pt; font-weight: 700; margin: 0; }
  .print-header .print-meta { font-size: 9pt; color: #444; margin: 1mm 0 0 0; }
}

/* NOTE: the "hidden on screen" half of this rule is NOT here.
   base.html links this file with media="print", so a rule outside the
   @media block above still only applies when printing — which meant
   `.print-header { display: none }` sat here doing nothing and the
   print-only header rendered at the top of the dashboard on screen. The
   rule now lives in layout/main.css, which is in the screen cascade.
   Found while rebuilding the dashboard for v1.17.0. */