/*
 * Print styles
 *
 * @page margin is 0 so the browser prints no default header/footer (date,
 * URL, page number). We draw our own margins via body padding and a branded
 * fixed running header & footer. Because fixed elements overlay flowing
 * content at page tops, sections are packed in page groups: the FIRST section
 * on each page carries top padding to clear the header, and shorter sections
 * pack beneath it (mid-page, so never occluded).
 */
@page {
  size: A4 landscape;
  margin: 0;
}

@media print {
  /* Hide screen-only chrome — target site header via .sticky, not all <header> elements */
  header.sticky, footer, nav, .print\:hidden, [data-ad-slot] {
    display: none !important;
  }

  body {
    font-size: 9pt;
    color: #000;
    background: #fff;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    /* Our own page margins (replaces @page margin: 0). Top is 0 because the
       first in-flow element on each page carries its own padding-top to clear
       the fixed running header. */
    margin: 0;
    padding: 0 2.2cm 2.4cm 2.2cm;
  }

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

  .sticky {
    position: static !important;
  }

  .fixed {
    display: none !important;
  }

  /* ── Running header (logo + date — repeats every page) ── */
  .print-running-header {
    display: block !important;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 0.7cm 2.2cm 6pt 2.2cm;
    border-bottom: 1.5pt solid #111827;
    background: #fff;
  }

  .print-running-header img {
    filter: none !important;
    -webkit-filter: none !important;
    height: 15pt !important;
    width: auto !important;
  }

  /* ── Running footer ("Powered by Morningstar" + disclaimer — repeats every page) ── */
  .print-running-footer {
    display: block !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 2.2cm 1cm 2.2cm;
    background: #fff;
  }

  /* Keep the Morningstar mark in its brand red and at a controlled size. */
  .print-running-footer .print-ms-logo,
  .print-running-footer img {
    filter: none !important;
    -webkit-filter: none !important;
    height: 13pt !important;
    width: auto !important;
  }

  /* ── Title block (once, first page) ── */
  .print-title-block {
    display: block !important;
    padding-top: 1.9cm; /* clear the fixed running header */
  }

  /* ── ETF product page sections ── */
  .etf-section {
    page-break-inside: avoid;
    break-inside: avoid;
    margin-bottom: 10pt;
    border: 1pt solid #d1d5db !important;
    border-radius: 0 !important;
  }

  /* Page groups. Page 1 is the title block + price chart (the hero). Each
     "leader" below starts a fresh page with top padding to clear the fixed
     running header; the shorter sections that follow it in the DOM pack
     beneath it on the same page (mid-page, so never occluded). This packs
     2–3 sections per page instead of one, cutting whitespace.

     Tall sections (yearly returns, holdings) are their own leaders so a group
     never overflows and pushes a follower under the header on the next page.
     Followers — key-stats, performance, distributions, info — deliberately
     omitted so they pack under the preceding leader. */
  #about,
  #risk,
  #yearly-returns,
  #holdings,
  #fees,
  #distributions,
  #classification {
    page-break-before: always;
    break-before: page;
    padding-top: 1.9cm; /* clear the fixed running header at each page top */
  }

  .etf-section h3 {
    font-size: 11pt !important;
    font-weight: 700 !important;
    border-bottom: 1pt solid #d1d5db !important;
    padding-bottom: 4pt !important;
    margin-bottom: 6pt !important;
  }

  /* ── Compare table sections ── */
  .compare-section {
    page-break-inside: avoid;
    break-inside: avoid;
    margin-bottom: 10pt;
    border: 1pt solid #d1d5db !important;
    border-radius: 0 !important;
  }

  .compare-section h3 {
    background: #e5e7eb !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    font-size: 11pt !important;
    font-weight: 700 !important;
    padding: 5pt 10pt !important;
    letter-spacing: 0.02em;
    border-bottom: 1pt solid #d1d5db !important;
  }

  .compare-section table {
    font-size: 8pt;
  }

  .compare-section table th {
    font-size: 7.5pt;
    padding: 4pt 8pt;
    border-bottom: 1pt solid #d1d5db;
  }

  .compare-section table td {
    padding: 3pt 8pt;
  }

  .compare-section table tr {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Preserve zebra striping */
  .compare-section table tr:nth-child(even) td {
    background: #f3f4f6 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .overflow-x-auto {
    overflow: visible !important;
  }

  /* Clean up links for print */
  a {
    text-decoration: none !important;
    color: inherit !important;
  }

  /* Ensure font-mono prints properly. */
  .font-mono {
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, Consolas, monospace;
  }
}