/*
 * Print stylesheet for sage.is
 *
 * Loaded via <link rel="stylesheet" href="/assets/css/print.css" media="print">
 * so browsers only fetch it when the print dialog opens.
 *
 * Targets the `about` layout pages (/privacy/, /about/, /about/accessibility/)
 * but applies site-wide because the rules are scoped to generic chrome and
 * content elements. Designed to be copied verbatim to sage.education when
 * its policy/about pages need the same treatment.
 */

@media print {

  /* ─── Page setup ───────────────────────────────────────────────────── */

  @page {
    margin: 2cm;
  }

  /* ─── Strip noise ──────────────────────────────────────────────────── */

  .nav,
  #nav-active,
  #nav-underlay,
  label[for="nav-active"],
  .footer,
  .modal,
  dialog,
  noscript,
  [data-tracking-target],
  .skip-link,
  .wow,
  .animate__animated {
    display: none !important;
  }

  /* ─── Background and zoom reset ────────────────────────────────────── */

  body {
    background: white !important;
    color: black;
  }

  .main {
    zoom: 1 !important;
  }

  /* ─── Typography ───────────────────────────────────────────────────── */

  body {
    font-family: Georgia, "Source Serif 4", "Times New Roman", serif;
    font-size: 11pt;
    line-height: 1.5;
  }

  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
    break-after: avoid;
    color: black;
  }

  p, li {
    orphans: 3;
    widows: 3;
  }

  /* ─── Link URLs visible inline (except mailto / #anchor) ───────────── */

  a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-size: 0.85em;
    color: #555;
    word-break: break-all;
  }

  a[href^="mailto:"]:after,
  a[href^="#"]:after {
    content: "";
  }

  /* ─── Keep content together across page breaks ─────────────────────── */

  p, li, blockquote, table, tr, td, th, section {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  thead { display: table-header-group; }
  tbody { display: table-row-group; }

  table {
    border-collapse: collapse;
    width: 100%;
  }

  tr, td, th {
    border: 1px solid #999;
    padding: 0.4em;
  }

  /* ─── Letter container reset (about layout) ────────────────────────── */

  .letter,
  .letter__container,
  .letter__article {
    background: white !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
  }

  /* ─── Statement section (page title) ───────────────────────────────── */

  .statement.statement--align-center {
    margin: 0 0 1cm 0;
  }

  .statement section header h1 {
    margin: 0 0 0.5em 0;
    text-align: left;
  }

}