/* ==========================================================================
   My Kitchen — Recipe Print / Standalone Stylesheet

   These rules have NO @media print wrapper.
   They are loaded two ways:
     1. Via <link media="print"> on recipe pages (PHP enqueue) — applies only
        when the browser prints the main page directly.
     2. Via <link> (no media restriction) in the isolated print window opened
        by the Print button — applies immediately so the window looks correct
        before and during the browser's print dialog.
   ========================================================================== */

/* ── Reset body/html for clean print output ───────────────────────────── */
html,
body {
  background: #fff !important;
  color: #000 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ── Hide recipe UI that is not useful on paper ──────────────────────── */
.mk-recipe-toolbar,
.mk-recipe-rating-section,
.mk-recipe-post-content,
.mk-gallery,
.mk-recipe-video,
.mk-recipe-breadcrumb,
.mk-recipe-header-image,
#wpadminbar,
#header-main-fixed,
#navmain,
#footer-main,
#footer-bottom-area,
.scrollup,
#sidebar,
#sidebar-shop {
  display: none !important;
}

/* ── Recipe container ─────────────────────────────────────────────────── */
.mk-single-recipe {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: Georgia, serif !important;
  font-size: 11pt !important;
  color: #000 !important;
  background: #fff !important;
}

/* ── Header ──────────────────────────────────────────────────────────── */
.mk-recipe-header {
  background: #fff !important;
  border: none !important;
  border-bottom: 2px solid #000 !important;
  border-radius: 0 !important;
  padding: 0 0 .75rem !important;
  margin-bottom: 1rem !important;
}

.mk-recipe-title {
  font-size: 22pt !important;
  color: #000 !important;
  margin: 0 0 .25rem !important;
}

.mk-recipe-byline {
  font-size: 10pt !important;
  color: #444 !important;
}

.mk-servings-pill {
  background: none !important;
  color: #000 !important;
  padding: 0 !important;
  border: none !important;
  font-weight: bold !important;
}

/* ── Two-column body ─────────────────────────────────────────────────── */
.mk-recipe-body {
  display: grid !important;
  grid-template-columns: 45% 55% !important;
  gap: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

.mk-ingredients-card {
  position: static !important;
  border: 1px solid #ccc !important;
  border-radius: 0 !important;
  padding: 1rem !important;
  background: #fafafa !important;
  page-break-inside: avoid;
  break-inside: avoid;
}

.mk-ingredients-card h2 {
  font-size: 13pt !important;
  color: #000 !important;
  border-bottom: 1px solid #ccc !important;
  padding-bottom: .3rem !important;
  margin-bottom: .75rem !important;
}

.mk-ingredient-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.mk-ingredient-list li {
  padding: .3rem 0 !important;
  border-bottom: 1px dotted #ddd !important;
  font-size: 10pt !important;
}

.mk-recipe-nutrition-col .mk-nutrition-label {
  max-width: 100% !important;
}

/* ── Instructions ────────────────────────────────────────────────────── */
.mk-recipe-instructions {
  border: none !important;
  border-top: 1px solid #ccc !important;
  border-radius: 0 !important;
  padding: 1rem 0 !important;
  background: #fff !important;
  page-break-before: auto;
  page-break-inside: auto;
  break-inside: auto;
  overflow: visible !important;
}

.mk-recipe-instructions h2 {
  font-size: 13pt !important;
  color: #000 !important;
  border-bottom: 1px solid #ccc !important;
  padding-bottom: .3rem !important;
  margin-bottom: .75rem !important;
  page-break-after: avoid;
  break-after: avoid;
}

.mk-instructions-body {
  font-size: 10.5pt !important;
  line-height: 1.6 !important;
  color: #000 !important;
  overflow: visible !important;
}

.mk-instructions-body ol,
.mk-instructions-body ul {
  padding-left: 1.25rem !important;
}

.mk-instructions-body li {
  margin-bottom: .4rem !important;
  page-break-inside: avoid;
  break-inside: avoid;
}

.mk-instructions-body p {
  page-break-inside: avoid;
  break-inside: avoid;
}

/* ── Nutrition ───────────────────────────────────────────────────────── */
.mk-nutrition-section h2 {
  font-size: 13pt !important;
  color: #000 !important;
  border-bottom: 1px solid #ccc !important;
  padding-bottom: .3rem !important;
  margin-bottom: .75rem !important;
}

.mk-nutrition-section {
  page-break-inside: avoid;
  break-inside: avoid;
}

.mk-nutrition-label {
  border: 2px solid #000 !important;
  border-radius: 0 !important;
  max-width: 280pt !important;
}

.mk-nutrition-header {
  background: #000 !important;
  color: #fff !important;
  font-size: 14pt !important;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.mk-nutrition-row {
  font-size: 10pt !important;
}

/* ── Notes ───────────────────────────────────────────────────────────── */
.mk-recipe-notes {
  border-left: 3px solid #000 !important;
  border-radius: 0 !important;
  background: #fafafa !important;
  page-break-inside: avoid;
  break-inside: avoid;
}

.mk-recipe-notes h2 {
  font-size: 13pt !important;
  color: #000 !important;
  border-bottom: 1px solid #ccc !important;
  padding-bottom: .3rem !important;
  margin-bottom: .75rem !important;
}

.mk-notes-body {
  font-size: 10pt !important;
  color: #000 !important;
}

/* ── Suppress link URL decoration ─────────────────────────────────────── */
a[href]::after { content: none !important; }

/* ── Footer permalink ─────────────────────────────────────────────────── */
.mk-single-recipe::after {
  content: attr(data-permalink);
  display: block;
  margin-top: 1.5rem;
  padding-top: .5rem;
  border-top: 1px solid #ccc;
  font-size: 9pt;
  color: #666;
}
