/* ===================================================
   print.css — Clean recipe print layout
   TheMeasuringCup.com
   =================================================== */

@media print {
  /* ── Reset ── */
  *,
  *::before,
  *::after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  html,
  body {
    margin: 0;
    padding: 0;
    font-size: 13pt;
    line-height: 1.55;
    font-family: Georgia, 'Times New Roman', Times, serif;
    color: #000;
    background: #fff;
  }

  /* ── Hide everything outside the recipe article ── */
  header.top,
  .site-footer,
  .search-overlay,
  .site-search,
  .serving-scaler__controls,
  .serving-scaler__notes,
  .recipe-toolbar,
  .cooking-mode-toggle,
  .cooking-mode-bar,
  .breadcrumbs,
  iframe,
  nav,
  .foot-nav,
  .copyright,
  .brand,
  .brandtext,
  .brandlink img,
  .email-popup,
  .related-recipes {
    display: none !important;
  }

  /* ── Show only the recipe article ── */
  body > div,
  #__next,
  main,
  .container,
  article.recipe {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }

  /* ── Article layout ── */
  article.recipe {
    margin: 0 auto !important;
    padding: 0.25in 0 !important;
    max-width: 7.5in !important;
  }

  /* ── Recipe image: show at reduced size ── */
  .recipe-image {
    display: block !important;
    float: right;
    width: 2.5in !important;
    max-height: 1.8in !important;
    margin: 0 0 0.15in 0.2in !important;
    overflow: hidden;
    border-radius: 4pt;
  }
  .recipe-image__img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: cover;
    max-height: 1.8in !important;
  }

  /* ── Headnote / snippet for print ── */
  .recipe-headnote,
  p.muted {
    display: block !important;
    font-size: 10.5pt !important;
    color: #333 !important;
    line-height: 1.5 !important;
    margin: 4pt 0 10pt !important;
    max-width: 4.5in;
  }

  /* ── Title ── */
  h1 {
    font-size: 26pt;
    line-height: 1.15;
    margin: 0 0 4pt;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-weight: 700;
    page-break-after: avoid;
  }

  /* ── Section headings ── */
  h2 {
    font-size: 16pt;
    font-weight: 700;
    margin: 18pt 0 8pt;
    font-family: Georgia, 'Times New Roman', Times, serif;
    page-break-after: avoid;
  }

  /* ── Two-column print layout: ingredients left, steps right ── */
  article.recipe section[aria-labelledby="ingredients"],
  article.recipe section[aria-labelledby="steps"] {
    page-break-inside: avoid;
  }

  @media (min-width: 500px) {
    article.recipe {
      display: grid !important;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto auto auto auto auto;
      grid-template-areas:
        "title   title"
        "meta    meta"
        "headnote headnote"
        "image   image"
        "ingredients steps"
        "footer  footer";
      gap: 0 24pt;
    }

    article.recipe h1 {
      grid-area: title;
    }

    article.recipe .muted {
      grid-area: meta;
    }

    article.recipe .recipe-headnote {
      grid-area: headnote;
    }

    article.recipe .recipe-image {
      grid-area: image;
      float: none !important;
      width: 3in !important;
      margin: 0 auto 10pt !important;
      justify-self: center;
    }

    article.recipe section[aria-labelledby="ingredients"] {
      grid-area: ingredients;
    }

    article.recipe section[aria-labelledby="steps"] {
      grid-area: steps;
    }

    /* Footer hint */
    article.recipe::after {
      grid-area: footer;
      content: 'From TheMeasuringCup.com';
      font-size: 9pt;
      color: #888 !important;
      text-align: center;
      margin-top: 12pt;
    }
  }

  /* ── Ingredients ── */
  ul {
    margin: 0 0 12pt;
    padding-left: 1.4em;
    list-style: disc;
  }
  ul li {
    font-size: 12pt;
    line-height: 1.6;
    margin-bottom: 2pt;
    page-break-inside: avoid;
  }

  /* ── Steps ── */
  ol {
    margin: 0 0 12pt;
    padding-left: 1.6em;
    counter-reset: step-counter;
  }
  ol li {
    font-size: 12pt;
    line-height: 1.65;
    margin-bottom: 6pt;
    padding-left: 4pt;
    page-break-inside: avoid;
    orphans: 3;
    widows: 3;
  }
  ol li::marker {
    font-weight: 700;
    font-size: 0.95em;
  }

  /* ── No page breaks near headings ── */
  h1, h2, h3, h4 {
    page-break-after: avoid;
  }

  /* ── Links: show the URL after the text ── */
  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    color: #555 !important;
    font-weight: normal;
  }
  a[href^="/"]::after {
    content: " (https://themeasuringcup.com" attr(href) ")";
    font-size: 9pt;
    color: #555 !important;
    font-weight: normal;
  }
  a[href^="#"]::after {
    content: none;
  }

  /* ── Force page breaks between sections if content overflows ── */
  section {
    page-break-inside: avoid;
  }

  /* ── Print header with site branding ── */
  @page {
    margin-top: 0.6in;
    margin-bottom: 0.6in;

    @top-left {
      content: 'The Measuring Cup';
      font-family: Georgia, 'Times New Roman', serif;
      font-size: 9pt;
      color: #888;
    }

    @top-right {
      content: string(recipeTitle);
      font-family: Georgia, 'Times New Roman', serif;
      font-size: 9pt;
      color: #888;
    }

    @bottom-center {
      content: 'Page ' counter(page);
      font-size: 8pt;
      color: #aaa;
    }
  }

  article.recipe h1 {
    string-set: recipeTitle content();
  }
}