/**
 * Print stylesheet — kitchen-friendly recipe output.
 *
 * Audience: 45+ home charcuterie makers printing recipes for the kitchen.
 * Goals:
 *   - Maximum legibility at arm's length
 *   - Minimum ink (black on white, no backgrounds)
 *   - Preserve ingredient table, steps, recipe meta, food-safety disclaimer
 *   - Hide all chrome, CTAs, navigation, sidebars
 *   - Keep semantic groups together across page breaks
 */

@media print {
  /* ------------------------------------------------------------------
   * 1. Force black-on-white, kill all backgrounds + shadows.
   *    Saves ink and maximises contrast on paper.
   * ------------------------------------------------------------------ */
  *,
  *::before,
  *::after {
    background: transparent !important;
    background-image: none !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
  }

  html,
  body {
    background: #fff !important;
    color: #000 !important;
    font-size: 14pt;
    line-height: 1.45;
  }

  @page {
    margin: 18mm 16mm 18mm 16mm;
  }

  /* ------------------------------------------------------------------
   * 2. Hide all non-content chrome.
   * ------------------------------------------------------------------ */
  .site-header,
  .site-footer,
  .toc,
  .ez-toc-v2_0_74,
  .ez-toc-container,
  #ez-toc-container,
  .sidebar,
  aside.sidebar,
  .comments,
  #comments,
  .comment-respond,
  .related,
  .related-recipes,
  .related-posts,
  .breadcrumbs,
  nav.breadcrumbs,
  .breadcrumb,
  .social-share,
  .share-buttons,
  .post-navigation,
  .nav-links,
  .pagination,
  .skip-link,
  .wp-block-search,
  .search-form,
  .mobile-menu,
  .mobile-drawer,
  .newsletter,
  .newsletter-signup,
  [class*="cta-"],
  [class^="cta-"],
  .cta,
  .no-print {
    display: none !important;
  }

  /* Author bio: hide the block, keep only the inline byline. */
  .author-bio,
  .author-bio-card {
    display: none !important;
  }

  /* ------------------------------------------------------------------
   * 3. Headings — proportional, not blown up.
   * ------------------------------------------------------------------ */
  h1, .h1 {
    font-size: 24pt;
    line-height: 1.15;
    margin: 0 0 8pt 0;
  }

  h2, .h2 {
    font-size: 18pt;
    line-height: 1.2;
    margin: 14pt 0 6pt 0;
    page-break-after: avoid;
    break-after: avoid;
  }

  h3, .h3 {
    font-size: 15pt;
    line-height: 1.25;
    margin: 10pt 0 4pt 0;
    page-break-after: avoid;
    break-after: avoid;
  }

  h4 {
    font-size: 13pt;
    margin: 8pt 0 3pt 0;
    page-break-after: avoid;
    break-after: avoid;
  }

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

  /* ------------------------------------------------------------------
   * 4. Recipe content — keep semantic groups together.
   * ------------------------------------------------------------------ */
  .recipe-section,
  .recipe-requirements,
  .recipe-steps,
  .recipe-meta,
  .recipe-ingredients-structured {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .step-item,
  .step,
  .faq-item,
  .ingredient-row,
  .ingredient-table,
  figure {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .recipe-section,
  section.recipe-section {
    break-before: auto;
  }

  /* Long step content may need to break; allow on the body only. */
  .step-content p {
    page-break-inside: auto;
    break-inside: auto;
  }

  /* ------------------------------------------------------------------
   * 5. Ingredient table — make it scannable on paper.
   * ------------------------------------------------------------------ */
  .ingredient-table {
    border-top: 1pt solid #000;
    border-bottom: 1pt solid #000;
    margin: 6pt 0 10pt 0;
  }

  .ingredient-row {
    display: flex;
    justify-content: space-between;
    padding: 3pt 0;
    border-bottom: 0.5pt dotted #000;
  }

  .ingredient-row:last-child {
    border-bottom: none;
  }

  .ingredient-name {
    font-weight: 600;
  }

  .ingredient-amount {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }

  /* Hide just the cart icon in print — the ingredient name still reads
     as plain text, but the icon is interactive noise on paper. */
  .ingredient-shop-link .shop-icon,
  .shop-icon {
    display: none !important;
  }
  .ingredient-shop-link {
    color: inherit !important;
    text-decoration: none !important;
  }

  /* ------------------------------------------------------------------
   * 6. Calculator + print button — not needed on paper.
   * ------------------------------------------------------------------ */
  .calculator,
  .scaler-controls,
  .scaler-btn,
  .scaler-input,
  .scaler-unit,
  .print-btn,
  .recipe-ingredients-structured .bg-paper-dim,
  .recipe-ingredients-structured > div:first-child {
    display: none !important;
  }

  /* Show the static base amounts; hide Alpine-scaled spans that may be empty. */
  .amount-value[x-text] {
    /* Keep visible — Alpine fills them; static fallback remains if Alpine didn't run. */
  }

  /* ------------------------------------------------------------------
   * 7. Steps — numbered + readable.
   * ------------------------------------------------------------------ */
  .step-item {
    display: block;
    margin: 0 0 10pt 0;
    padding: 0;
    border: none;
  }

  .step-number {
    display: inline-block;
    font-weight: 700;
    font-size: 14pt;
    margin-right: 4pt;
  }

  .step-heading {
    display: inline;
    font-size: 14pt;
    margin: 0;
  }

  .step-content {
    display: block;
    margin-top: 4pt;
  }

  /* ------------------------------------------------------------------
   * 8. FAQ — flatten accordion, show all answers on paper.
   * ------------------------------------------------------------------ */
  details.faq-item,
  .faq-item {
    display: block !important;
  }

  details.faq-item > summary,
  .faq-question {
    list-style: none;
    font-weight: 600;
    margin: 6pt 0 2pt 0;
  }

  .faq-chevron {
    display: none !important;
  }

  details.faq-item .faq-answer,
  .faq-answer {
    display: block !important;
  }

  /* ------------------------------------------------------------------
   * 9. Food safety disclaimer — preserved and emphasised.
   * ------------------------------------------------------------------ */
  .food-safety-disclaimer,
  .food-safety,
  [class*="food-safety"] {
    border: 1pt solid #000;
    padding: 6pt 8pt;
    margin: 10pt 0;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* ------------------------------------------------------------------
   * 10. Author byline — keep the inline version, flatten any stamp rotation.
   * ------------------------------------------------------------------ */
  .author-byline,
  .author-byline-inline,
  .byline {
    display: block !important;
    font-size: 11pt;
    margin: 4pt 0 12pt 0;
  }

  .pruefstempel,
  .stamp,
  [class*="stamp"],
  .geprueft-stamp {
    transform: none !important;
    -webkit-transform: none !important;
    rotate: 0deg !important;
  }

  /* ------------------------------------------------------------------
   * 11. Images — keep recipe photos, size for ink efficiency.
   * ------------------------------------------------------------------ */
  img {
    max-width: 100% !important;
    height: auto !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  figure {
    margin: 6pt 0;
  }

  figcaption {
    font-size: 10pt;
    font-style: italic;
    margin-top: 2pt;
  }

  /* ------------------------------------------------------------------
   * 12. Link policy — show URLs for external links, suppress for internal nav.
   * ------------------------------------------------------------------ */
  a,
  a:link,
  a:visited {
    color: #000 !important;
    text-decoration: underline;
  }

  /* External links: print URL in parens after the anchor text. */
  a[href^="http"]::after,
  a[href^="https"]::after {
    content: " (" attr(href) ")";
    font-size: 10pt;
    font-weight: normal;
    word-break: break-all;
  }

  /* Suppress URL output for same-origin internal navigation. */
  a[href^="#"]::after,
  a[href^="/"]::after,
  a[href^="./"]::after,
  a[href^="../"]::after,
  a[href*="wurstcircle.com"]::after {
    content: "" !important;
  }

  /* Images-wrapped links: no URL suffix. */
  a:has(> img)::after,
  a:has(> figure)::after {
    content: "" !important;
  }

  /* ------------------------------------------------------------------
   * 13. Misc — layout reset for print.
   * ------------------------------------------------------------------ */
  .prose,
  article,
  main {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .container,
  .wrap,
  .site-content {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}
