/* Print stylesheet.
 * Loaded via stylesheet_link_tag :app (Propshaft serves every file in
 * app/assets/stylesheets/). Only takes effect when the browser is producing
 * print output — either the OS print dialog or "Save as PDF".
 *
 * Goal: turn the show page into a paginated report deliverable that an
 * agency can hand a client.
 */

@media print {
  /* Page setup: A4, comfortable margins. */
  @page {
    size: A4;
    margin: 14mm 12mm;
  }

  /* Global: light background, dark text, no shadows that print as gray boxes. */
  html, body {
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 11pt;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Hide anything that isn't part of the report. */
  nav,
  header nav,
  .no-print,
  [data-no-print],
  .fixed,
  .sticky,
  form[method="post"],
  button,
  .shadow, .shadow-sm, .shadow-md, .shadow-lg, .shadow-xl {
    box-shadow: none !important;
  }
  nav,
  .no-print,
  [data-no-print],
  form[action*="refresh"],
  form[action*="video_analyses"] {
    display: none !important;
  }

  /* Tab strip: not useful in a printed report. */
  [aria-label="Tabs"] { display: none !important; }

  /* Cards: don't split across pages. */
  .rounded-lg, .rounded-md {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Dark-mode overrides: reset to light so the print isn't a black blob. */
  .dark\:bg-gray-800, .dark\:bg-gray-900\/50, .dark\:bg-gray-900\/40, .dark\:bg-gray-700\/50 {
    background: #ffffff !important;
  }
  .dark\:text-white, .dark\:text-gray-100, .dark\:text-gray-200, .dark\:text-gray-300 {
    color: #111827 !important;
  }
  .dark\:border-gray-700 { border-color: #e5e7eb !important; }

  /* Report block from Key Takeaways looks premium in print — keep the accent bar. */
  .markeddown {
    font-size: 10.5pt;
    line-height: 1.55;
  }
  .markeddown h1, .markeddown h2 {
    break-after: avoid;
    page-break-after: avoid;
  }

  /* Heatmap: give it its natural width so it doesn't wrap. */
  .overflow-x-auto { overflow: visible !important; }
  .min-w-\[720px\] { min-width: 0 !important; }

  /* URL / footer at the bottom of every page — GitHub-ish. */
  a[href]:after {
    content: "";
  }
}