/* Print-specific styles */

@media print {
  * {
    background-color: transparent !important;
    color: var(--color-print-text) !important;
    box-shadow: none !important;
  }

  body {
    background-color: var(--color-print-bg);
    color: var(--color-print-text);
    padding: 0;
    margin: 0;
    font-size: 11pt;
    line-height: 1.5;
  }

  main {
    width: 100%;
    max-width: 100%;
  }

  article.recipe {
    background-color: transparent;
    border-radius: 0;
    padding: 0;
    margin: 0;
    page-break-after: avoid;
  }

  /* Header */
  .recipe-header {
    border-bottom: 1px solid var(--color-print-text);
    margin-bottom: 12pt;
    padding-bottom: 12pt;
    page-break-inside: avoid;
  }

  .recipe-header h1 {
    font-size: 18pt;
    margin: 0 0 6pt 0;
    page-break-after: avoid;
  }

  .recipe-description {
    font-size: 10pt;
    margin: 0 0 6pt 0;
    line-height: 1.4;
  }

  .recipe-yield-label {
    display: inline;
    margin: 0;
    font-weight: bold;
  }

  .recipe-yield-display {
    display: inline;
    color: var(--color-print-text);
    font-weight: normal;
  }

  /* Sections */
  .recipe-section {
    margin-bottom: 12pt;
    page-break-inside: avoid;
  }

  .recipe-section h2 {
    font-size: 12pt;
    margin: 12pt 0 6pt 0;
    padding-bottom: 3pt;
    border-bottom: 1px solid var(--color-print-text);
    page-break-after: avoid;
  }

  /* The screen-only accent rule renders transparent under print's forced
     background-color: transparent, leaving blank space above the heading
     for nothing. The print heading already has its own border-bottom. */
  .recipe-section h2::before {
    display: none;
  }

  .recipe-section h3 {
    font-size: 11pt;
    margin: 6pt 0 3pt 0;
    page-break-after: avoid;
  }

  /* Ingredients */
  .ingredients-list {
    page-break-inside: avoid;
  }

  .ingredient-item {
    display: block;
    margin-bottom: 6pt;
    padding: 3pt 0;
    border: none;
    background-color: transparent;
    border-radius: 0;
    page-break-inside: avoid;
  }

  .ingredient-item:last-child {
    margin-bottom: 0;
  }

  .ingredient-quantity {
    display: inline;
    min-width: auto;
    margin-right: 6pt;
    font-weight: bold;
  }

  .ingredient-name {
    display: inline;
  }

  .ingredient-note {
    display: block;
    margin-top: 2pt;
    margin-left: 0;
    font-size: 9pt;
  }

  /* Instructions */
  .recipe-section:has(.instructions-list) {
    counter-reset: step-counter;
  }

  .instructions-list {
    margin: 0;
    padding-left: 18pt;
  }

  .instruction-item {
    margin-bottom: 6pt;
    line-height: 1.4;
    page-break-inside: avoid;
    padding-left: 0;
    position: static;
  }

  .instruction-item::before {
    content: counter(step-counter) ". ";
    counter-increment: step-counter;
    position: static;
  }

  .instruction-text {
    margin-bottom: 0;
  }

  .instruction-note {
    display: block;
    font-size: 9pt;
    margin-top: 2pt;
  }

  .instruction-phase {
    margin-bottom: 9pt;
    padding-bottom: 6pt;
    border-bottom: none;
  }

  .instruction-phase:last-of-type {
    margin-bottom: 0;
    padding-bottom: 0;
  }

  .instruction-phase h3 {
    display: none;
  }

  .critical-callout {
    background-color: transparent;
    border-left: 2px solid var(--color-print-text);
    padding: 6pt 12pt;
    margin: 9pt 0;
    page-break-inside: avoid;
  }

  .critical-callout h3 {
    font-size: 11pt;
    margin: 0 0 6pt 0;
  }

  .critical-callout p {
    margin: 0 0 6pt 0;
    font-size: 10pt;
  }

  /* Nutrition */
  .nutrition-summary {
    background-color: transparent;
    border-left: 2px solid var(--color-print-text);
    padding: 6pt 12pt;
    margin-bottom: 12pt;
    page-break-inside: avoid;
  }

  .nutrition-summary h3 {
    margin: 0 0 6pt 0;
    font-size: 11pt;
  }

  .nutrition-grid {
    display: block;
    margin-bottom: 6pt;
  }

  .nutrition-item {
    display: inline-block;
    margin-right: 18pt;
    margin-bottom: 3pt;
    text-align: left;
  }

  .nutrition-value {
    font-size: 11pt;
    display: inline;
    margin-right: 3pt;
  }

  .nutrition-label {
    display: inline;
    font-size: 9pt;
    text-transform: uppercase;
  }

  .nutrition-disclaimer {
    font-size: 9pt;
    line-height: 1.3;
    margin-top: 6pt;
    padding-top: 6pt;
    border-top: 1px solid var(--color-print-text);
  }

  /* The site shell is navigation, not recipe content: it never prints. This
     is the one place it is hidden, for every page that loads print.css. */
  .site-header,
  .site-footer {
    display: none !important;
  }

  /* Hide screen-only elements */
  [data-print-hide],
  button,
  [role="button"],
  .controls,
  .actions {
    display: none !important;
  }

  /* Links */
  a {
    color: var(--color-print-text);
    border-bottom: none;
    text-decoration: underline;
  }

  a[href]::after {
    content: "";
  }

  /* Typography */
  p {
    margin: 0 0 6pt 0;
  }

  ul, ol {
    margin: 0;
    padding-left: 18pt;
  }

  li {
    margin-bottom: 3pt;
  }

  dl {
    margin: 0;
  }

  dt {
    font-weight: bold;
    margin-top: 6pt;
    margin-bottom: 0;
  }

  dd {
    margin: 0 0 6pt 0;
  }

  /* Page breaks */
  h1 {
    page-break-after: avoid;
    page-break-before: avoid;
  }

  h2 {
    page-break-after: avoid;
    page-break-before: avoid;
  }

  ul, ol {
    page-break-inside: avoid;
  }

  /* Orphan/widow control */
  p {
    orphans: 3;
    widows: 3;
  }
}

/* ---------------------------------------------------------------------------
   Shared recipe UI system in print (M3-S2)

   Print is deliberately much plainer than screen: one column, no tinted
   panels, no presets or toggles, no decorative markers. What survives is the
   title, the selected batch, the scaled ingredients, the method, the critical
   callout, the essential guidance, and troubleshooting.
   --------------------------------------------------------------------------- */

@media print {
  .recipe-hero {
    display: block;
  }

  .recipe-kicker {
    font-size: 9pt;
    margin: 0 0 3pt 0;
    letter-spacing: 0.08em;
  }

  .recipe-hero .recipe-title {
    font-size: 18pt;
    line-height: 1.15;
    margin: 0 0 4pt 0;
  }

  .recipe-title-lead {
    display: inline;
    font-size: inherit;
  }

  .recipe-title-lead::after {
    content: " ";
  }

  .recipe-lede {
    font-size: 10pt;
    line-height: 1.4;
    max-width: none;
    margin: 0 0 6pt 0;
  }

  /* The batch panel prints as a plain line of facts, not a tinted card. */
  .batch-panel {
    background-color: transparent;
    border: none;
    border-top: 1px solid var(--color-print-text);
    border-radius: 0;
    padding: 6pt 0 0 0;
    margin: 0;
  }

  .batch-panel-title {
    font-size: 9pt;
    margin: 0 0 3pt 0;
  }

  .batch-panel .recipe-yield-group {
    display: block;
  }

  .batch-panel .recipe-yield-display {
    display: inline;
    font-size: 12pt;
    font-weight: bold;
  }

  .recipe-yield-secondary {
    display: inline;
    font-size: 10pt;
  }

  .recipe-yield-secondary::before {
    content: " / ";
  }

  .batch-summary {
    display: block;
    border-top: none;
    padding: 3pt 0 0 0;
    margin: 3pt 0 0 0;
  }

  .batch-stat {
    display: inline-block;
    margin: 0 18pt 3pt 0;
    vertical-align: top;
  }

  .batch-stat-label {
    display: inline;
    font-size: 9pt;
  }

  .batch-stat-label::after {
    content: ": ";
  }

  .batch-stat-value {
    display: inline;
    font-size: 10pt;
    font-weight: bold;
  }

  .batch-stat-note {
    display: none;
  }

  /* Ingredients */
  .ingredient-item[data-emphasis] {
    border: none;
    border-left: 2px solid var(--color-print-text);
    padding-left: 6pt;
  }

  .ingredient-item .ingredient-quantity {
    font-size: inherit;
  }

  .quantity-qualifier {
    display: inline;
    font-size: inherit;
    text-transform: none;
    font-weight: bold;
  }

  .ingredient-secondary {
    display: block;
    font-size: 9pt;
    margin-top: 1pt;
  }

  /* Method */
  .recipe-columns {
    display: block;
  }

  .instruction-phase-header {
    display: block;
    margin: 6pt 0 3pt 0;
  }

  .instruction-phase-header h3 {
    display: inline;
    font-size: 11pt;
    text-transform: uppercase;
  }

  .phase-index {
    display: inline;
    font-size: 11pt;
    font-weight: bold;
  }

  .phase-index::after {
    content: " ";
  }

  .critical-callout--major {
    background-color: transparent;
    border: none;
    border-left: 2px solid var(--color-print-text);
    border-radius: 0;
    padding: 6pt 12pt;
  }

  .critical-callout--major h3 {
    font-size: 12pt;
  }

  /* Guided sequence */
  .guide {
    background-color: transparent;
    border: none;
    border-left: 2px solid var(--color-print-text);
    border-radius: 0;
    padding: 6pt 12pt;
    margin: 9pt 0;
    page-break-inside: avoid;
  }

  .guide-steps {
    display: block;
    padding-left: 12pt;
  }

  .guide-step {
    padding-left: 0;
    margin-bottom: 3pt;
    line-height: 1.4;
    position: static;
  }

  .guide-step::before {
    content: "\2013  ";
    position: static;
    width: auto;
    height: auto;
    background-color: transparent;
    border-radius: 0;
  }

  .guide-stop {
    margin-top: 6pt;
    padding-top: 3pt;
    border-top: 1px solid var(--color-print-text);
  }

  /* Checkpoints */
  .checkpoint-grid {
    display: block;
    page-break-inside: avoid;
  }

  .checkpoint {
    background-color: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin-bottom: 6pt;
    page-break-inside: avoid;
  }

  .checkpoint-title {
    font-size: 10pt;
  }

  .checkpoint-list li {
    font-size: 9pt;
    margin-bottom: 1pt;
    padding-left: 10pt;
  }

  /* Troubleshooting */
  .rescue-grid {
    display: block;
  }

  .rescue-card {
    background-color: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin-bottom: 6pt;
    page-break-inside: avoid;
  }

  .rescue-card h3 {
    font-size: 10pt;
    margin: 0 0 1pt 0;
  }

  .rescue-card p {
    font-size: 9pt;
    line-height: 1.35;
  }

  /* Signature rule: never a filled dark block on paper. */
  .signature-rule {
    background-color: transparent;
    color: var(--color-print-text);
    border: 1px solid var(--color-print-text);
    border-radius: 0;
    padding: 6pt 12pt;
    margin: 9pt 0 0 0;
    text-align: left;
    page-break-inside: avoid;
  }

  .signature-rule-kicker {
    font-size: 9pt;
    opacity: 1;
    margin-bottom: 2pt;
  }

  .signature-rule-text {
    font-size: 12pt;
  }

  .signature-rule-note {
    font-size: 9pt;
    margin: 3pt 0 0 0;
    max-width: none;
    opacity: 1;
  }

  /* Screen-only enhancement chrome. */
  .yield-presets,
  .ingredient-measurement-visual {
    display: none !important;
  }
}
