@media print {
  .site-header,
  .site-footer,
  .skip-link,
  .no-print {
    display: none !important;
  }

  html,
  body {
    background: var(--color-page-background) !important;
    color: var(--color-text-body) !important;
  }

  body {
    display: block;
    font-size: 11pt;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .page-main {
    min-height: 0;
  }

  .container {
    max-width: none;
    padding-inline: 0;
  }

  .print-layout,
  .builder-layout {
    display: block;
  }

  #invoice-print-area {
    display: block !important;
    background: var(--color-page-background) !important;
    border-radius: 0;
    padding: 0;
  }

  .invoice {
    width: 100%;
    max-width: none;
    break-inside: auto;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    color: var(--color-text-body) !important;
  }

  .invoice__content,
  .invoice__title,
  .invoice__meta strong,
  .invoice__meta span,
  .invoice__number,
  .invoice table,
  .invoice table th,
  .invoice table td,
  .invoice table td small,
  .totals,
  .totals__row {
    color: var(--color-text-body) !important;
  }

  /*
    The Modern design's header keeps its blue background and white text
    on purpose, on screen and on paper alike. The blanket black-text
    rule above exists for the plain white parts of every design, but it
    would otherwise force black text onto that same blue background,
    which is unreadable. This wins on specificity (two classes) over the
    single-class rule above, so the header stays white-on-blue in print.
  */
  .invoice--modern .invoice__header,
  .invoice--modern .invoice__header * {
    color: var(--color-text-on-dark) !important;
  }

  .invoice__rule {
    border-top-color: var(--color-text-body) !important;
  }

  .invoice table thead {
    display: table-header-group;
  }

  .invoice table tr,
  .totals__row {
    break-inside: avoid;
  }

  .invoice .data-table th,
  .invoice .data-table td {
    border-color: var(--color-print-rule) !important;
  }

  .invoice__note {
    color: var(--color-brand-primary-dark) !important;
  }

  a {
    color: var(--color-text-body) !important;
    text-decoration: none !important;
  }

  @page {
    size: letter;
    margin: 0.6in;
  }
}