/* =====================================================================
 * Selinka SWM Rechner — Print stylesheet
 *
 * Loaded via <link rel="stylesheet" media="print">, so none of these
 * rules apply on screen. Strategy: keep the app's colour palette
 * (it prints well on colour printers and is what the reader knows
 * from screen) — just flatten the dark dashboard backdrop to white,
 * drop interactive chrome, and switch the detail table to the
 * compact aggregated-columns mode.
 *
 * B&W printers will dither the colours themselves; a truly B&W-tuned
 * view would need bespoke chart redraws and is out of scope.
 * ===================================================================== */

@page {
  size: A4;
  margin: 14mm 10mm;
}

@media print {
  /* ---- Page surface: white background, keep text readable -------- */
  html, body {
    background: #ffffff !important;
    background-image: none !important;
    color: #1a1a1a;
    font-size: 10pt;
    line-height: 1.4;
    min-height: 0;
  }

  /* Tell browsers to honour the colours we set — otherwise they
     strip the accent tones in their "economy" mode.
     background-color: transparent wipes every dark panel the screen
     theme paints (surface / surface-2 / gradient overlays etc.) so
     the body's white shows through by default. We use
     background-color (not the shorthand background) so canvas
     chart pixels and data-URI images survive. */
  *, *::before, *::after {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    background-color: transparent !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  /* ---- Hide purely-interactive / noise elements ------------------ */
  /* Keep the input bar visible — it documents the inputs the numbers
     are based on. Only strip placeholders and the logout button. */
  .logout-form,
  .mobile-hint,
  .swm-toast,
  .year-toggle .chevron,
  .field-error,
  .input-field .hint,
  .error[role="alert"] {
    display: none !important;
  }

  /* Inputs/selects flattened to readable static-looking values. */
  .input-bar input,
  .input-bar select {
    border: 0.5pt solid #888888 !important;
    background: #ffffff !important;
    color: #1a1a1a !important;
    padding: 1pt 3pt !important;
    -webkit-appearance: none;
            appearance: none;
  }
  .input-bar label { font-weight: 600; color: #1a1a1a; }

  /* ---- Un-stick layout for linear print flow --------------------- */
  .dashboard-header,
  .dashboard-main,
  .input-bar {
    position: static !important;
    top: auto !important;
  }
  .dashboard-main {
    display: block !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* ---- Grid layouts: match screen where it makes sense ----------- */
  .kpi-row {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6pt !important;
  }
  .summary-grid,
  .params-grid,
  .charts-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8pt !important;
  }
  .chart-card.full-width { grid-column: 1 / -1 !important; }

  /* ---- Cards: white background, thin border ---------------------- */
  .metal-card,
  .kpi-card,
  .summary-card,
  .chart-card,
  .detail-section,
  .input-bar {
    background: #ffffff !important;
    border: 0.5pt solid #666666 !important;
    border-radius: 4pt !important;
    padding: 6pt 8pt !important;
    margin-bottom: 6pt !important;
    page-break-inside: avoid;
  }
  /* Kill the gradient-border decorations on cards. */
  .metal-card::before,
  .metal-card::after,
  .kpi-card::before,
  .kpi-card::after,
  .summary-card::before,
  .summary-card::after,
  .chart-card::before,
  .chart-card::after {
    display: none !important;
    content: none !important;
  }

  /* Readable dark text where the dashboard used muted grey or accent
     gold — pale yellow on white paper is illegible. */
  .dashboard-header h1,
  h1, h2, h3 { color: #1a1a1a !important; }
  .kpi-label, .kpi-sub,
  .summary-card h3, .chart-card h3, .chart-card .chart-sub,
  .summary-table td, .summary-table th,
  .detail-table td, .detail-table th,
  .detail-table .year-row td,
  .detail-table .year-toggle,
  .detail-table .year-row .chevron,
  .detail-table .month-label,
  .detail-legend,
  .footer-disclaimer, .footer-disclaimer small {
    color: #1a1a1a !important;
  }

  /* Keep the pos/neg cues — on colour printers this is the whole
     point; on B&W printers the driver dithers them to distinct greys.
     Selectors match or exceed the specificity of .detail-table .year-row td
     so the dark-text override above doesn't swallow the tint. */
  .pos, td.pos, .plus,
  .summary-table .plus,
  .detail-table td.pos,
  .detail-table .year-row td.pos { color: #2e7d32 !important; }
  .neg, td.neg, .minus,
  .summary-table .minus,
  .detail-table td.neg,
  .detail-table .year-row td.neg { color: #c62828 !important; }

  /* ---- Typography ------------------------------------------------- */
  h1 { font-size: 15pt; margin: 0 0 5pt; }
  h2 { font-size: 12pt; margin: 0 0 4pt; }
  h3 { font-size: 10.5pt; margin: 0 0 3pt; }

  .kpi-label { font-size: 8pt; }
  .kpi-value { font-size: 13pt; font-weight: 600; }
  .kpi-sub   { font-size: 7.5pt; }

  /* ---- Detail table: swap to compact aggregate columns ----------- */
  .detail-table .col-detail  { display: none !important; }
  .detail-table .col-compact { display: table-cell !important; }
  /* Month-level rows would explode page count; keep them collapsed. */
  .detail-table .month-row { display: none !important; }

  /* ---- Tables ----------------------------------------------------- */
  table { width: 100%; border-collapse: collapse; font-size: 9pt; }
  th, td {
    border-bottom: 0.4pt solid #b0b0b0 !important;
    padding: 2pt 4pt !important;
    text-align: left;
  }
  tr.highlight td,
  tr.highlight-pos td,
  tr.highlight-neg td,
  tr.highlight-final td {
    border-top: 0.6pt solid #1a1a1a !important;
    font-weight: 700;
  }
  /* Repeat table headers if a (rare) long table spans pages. */
  thead { display: table-header-group; }
  tr, td, th { page-break-inside: avoid; }

  /* ---- Charts ----------------------------------------------------- */
  /* Chart.js draws colour onto a canvas; print-color-adjust: exact
     above keeps those colours. Give the card a white box and avoid
     page breaks inside each chart. */
  .chart-card { page-break-inside: avoid; }
  .chart-card canvas {
    max-width: 100% !important;
    height: auto !important;
  }

  /* ---- Footer ----------------------------------------------------- */
  .footer-disclaimer {
    border-top: 0.4pt solid #999999 !important;
    margin-top: 8pt !important;
    padding-top: 4pt !important;
    font-size: 7.5pt;
  }
}