/* ============================================================================
   Print.

   THIS FILE EXISTS FOR ONE PAGE. A customer who wants to check an ingredient
   against a dermatologist's note, or who has to hand the declaration to
   somebody else, prints the product page. Without a print stylesheet that is
   four sheets of navigation, related products and a cart widget, with the
   ingredient list broken across a page turn.

   Loaded with media="print", so it never blocks a render and a reader who never
   prints never parses it.

   COLOR IN PRINT. The tokens still apply, so a printer that is asked to print
   backgrounds gets the parchment and the amber. Most will not print
   backgrounds, so nothing here relies on one: every block that is distinguished
   on screen by a surface tone is distinguished on paper by a rule as well.
   That is the same rule the application's printed weigh sheet follows: "black on
   white, 11 pt minimum, no color dependence".

   NO LITERAL SIZES IN THIS FILE. The two print sizes are --ob-print-body and
   --ob-print-small in tokens.css, which is the single source of truth for
   everything about type in this theme. This file used to set 11 pt and 9 pt
   directly, and the 9 pt was under the floor the paragraph above declares, which
   is the failure a token file exists to prevent.
   ============================================================================ */

@page {
  /* A margin wide enough to hole-punch, because a declaration that gets filed
     is a declaration that gets filed in a folder. */
  margin: 18mm 16mm;
}

@media print {

  body {
    background: none;
    /* A print size is a physical size, and paper is the one place a physical
       unit is the right answer: a reader's browser text setting is a statement
       about a screen at arm's length. The two figures live in tokens.css with
       the reasoning, because this file held the only literal font sizes in the
       theme and one of them was below the floor this file states. */
    font-size: var(--ob-print-body);
    line-height: var(--ob-leading-body);
  }

  /* Everything that is navigation, commerce or decoration comes off the sheet.
     None of it can be acted on from paper. */
  .ob-banner,
  .ob-contentinfo,
  .ob-skip-link,
  .ob-nav-toggle,
  .ob-breadcrumb,
  .ob-cart-link,
  form.cart,
  .woocommerce-product-gallery__trigger,
  .woocommerce-tabs ul.tabs,
  .related,
  .up-sells,
  .cross-sells,
  .woocommerce-message,
  .woocommerce-info,
  .ob-pagination,
  .ob-postnav,
  .ob-comments,
  #comments {
    display: none;
  }

  .ob-main {
    max-width: none;
    padding: 0;
  }

  /* The gallery reduces to the first image. Six photographs of one bottle is
     five sheets of paper. */
  .woocommerce-product-gallery .flex-control-thumbs {
    display: none;
  }

  .woocommerce-product-gallery {
    max-width: 60mm;
  }

  .ob-product__top {
    display: block;
  }

  /* THE DECLARATION PANEL IS THE POINT OF THE PRINTOUT. It is kept whole rather
     than allowed to break across sheets wherever it happens to fall, and it
     keeps its border so the block is identifiable on a page that has lost every
     background tint. */
  .ob-bottle {
    break-inside: avoid;
    margin: 0;
    padding: 0;
    border: 0;
    border-top: 1pt solid var(--ob-border-strong);
    padding-top: 6mm;
  }

  .ob-bottle__part {
    break-inside: avoid;
  }

  .ob-inci {
    /* An ingredient list is the one block here that may legitimately be long
       enough to run over, so it is allowed to break, and it keeps its outline so
       the reader can see where it starts and stops. */
    break-inside: auto;
    padding: 3mm;
    border: 0.5pt solid var(--ob-border-strong);
    background: none;
  }

  .ob-table,
  .ob-facts {
    break-inside: avoid;
  }

  .ob-table thead th {
    background: none;
    border-bottom: 1pt solid var(--ob-border-strong);
  }

  /* A verdict is a color, a glyph and a word on screen. On a sheet that has not
     printed the background, the glyph and the word carry it, which is exactly
     why the rule that they always travel together is not a preference. */
  .ob-verdict {
    padding: 0;
    background: none;
  }

  /* A link's destination, printed after it. On paper a link is a piece of
     underlined text with no destination, and the URL is the only way to follow
     it. Only for links out of the page: an in-page anchor prints as noise.

     AT THE HOUSE FLOOR, not below it. This was 9 pt, with no comment and no
     justification, on the one page this whole file exists for and against the
     11 pt minimum stated at the top of it. A URL is long, so the temptation to
     shrink it is obvious, and the answer is that it breaks across lines instead:
     an address somebody has to type is the last thing to set in the smallest
     type on the sheet. */
  .ob-prose a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: var(--ob-print-small);
    word-break: break-all;
  }

  /* Nothing that is going to be read on paper is allowed to end a sheet with
     one line of itself on the next. */
  p,
  li,
  blockquote {
    orphans: 3;
    widows: 3;
  }

  h1,
  h2,
  h3 {
    break-after: avoid;
  }
}
