/* Print / PDF stylesheet — show only the results area, on a clean page. */

@media print {
  /* Hide all elements visually, then re-show just the results subtree.
     visibility (rather than display) avoids the parent-collapse problem:
     a hidden ancestor can still host a visible descendant. */
  body * {
    visibility: hidden;
  }

  #results,
  #results * {
    visibility: visible;
  }

  /* Lift the results to the top-left of the page so it isn't pushed off
     by hidden-but-present ancestor margins/padding. */
  #results {
    position: absolute !important;
    inset: 0 !important;
    padding: 0.5in !important;
    background: white !important;
    color: #111 !important;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  }

  /* Override the page-frame body background so the print is white. */
  html, body {
    background: white !important;
    color: black !important;
  }

  /* Hide things that are inside #results but not useful on paper. */
  #results button,
  #results .group {
    visibility: hidden !important;
  }

  /* Summary block at the top of the results card — yield headline + small
     metric strip. Shrinks the giant 2xl yield number for paper. */
  #results > div:first-of-type {
    margin-bottom: 14pt !important;
  }
  #results > div:first-of-type > span:first-child {
    font-size: 14pt !important;
    color: #111 !important;
    font-weight: 700 !important;
  }
  #results > div:first-of-type > span:nth-child(2) {
    font-size: 9pt !important;
    color: #444 !important;
    letter-spacing: 0.02em !important;
  }

  /* Each layout block. */
  .layout-card {
    background: #fafafa !important;
    border: 1px solid #ddd !important;
    border-radius: 4pt !important;
    padding: 12pt !important;
    margin-bottom: 14pt !important;
    page-break-inside: avoid !important;
  }

  .layout-card > div:first-child {
    display: flex !important;
    justify-content: space-between !important;
    margin-bottom: 8pt !important;
  }

  .layout-card > div:first-child span {
    font-size: 11pt !important;
    font-weight: 600 !important;
    color: #222 !important;
  }

  /* Bar diagram fills the available width. */
  #results svg {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
  }

  /* Re-map the dark-theme SVG fills to print-friendly tones. */
  #results rect[fill="#0F172A"] {
    fill: #f5f5f5 !important;
    stroke: #888 !important;
  }
  #results rect[fill*="rgba(6,182,212,0.3)"] {
    fill: #cfe8ff !important;
  }
  #results rect[fill="#F59E0B"] {
    fill: #ffd166 !important;
  }
  #results rect[fill*="rgba(16,185,129,0.3)"] {
    fill: #b8e6c1 !important;
  }
  #results rect[fill*="rgba(239,68,68,0.4)"] {
    fill: #f5b5b5 !important;
  }
  #results rect[fill*="rgba(100,116,139,0.4)"] {
    fill: #d8d8d8 !important;
  }
  #results rect[stroke="#06B6D4"] {
    stroke: #555 !important;
  }
  #results line {
    stroke: #777 !important;
  }
  #results text {
    fill: #333 !important;
  }

  /* Legend chips. */
  #results > div:has(> .inline-flex) {
    margin-top: 16pt !important;
    font-size: 9pt !important;
    color: #555 !important;
  }

  /* Hover peer-highlight is a screen-only affordance — strip the cyan glow
     so printed sheets don't get ugly stroke artefacts from whatever was last
     hovered before printing. */
  .bar-segment-peer {
    stroke: #555 !important;
    stroke-width: 0.75 !important;
    filter: none !important;
  }

  /* Loading skeleton rows shouldn't print at all. */
  .skeleton-row {
    display: none !important;
  }
}
