/**
 * impresion.css — vista de impresión de una receta
 * Se imprime lo que se cocina: título, ingredientes y pasos. Nada más.
 */

@media print {
  @page { margin: 1.6cm; }

  :root {
    --c-fondo: #FFF;
    --c-tinta: #000;
    --c-tinta-media: #222;
    --c-tinta-suave: #444;
    --c-acento: #000;
    --c-linea: #BBB;
  }

  body {
    background: #FFF !important;
    color: #000 !important;
    font-size: 11pt;
    line-height: 1.5;
  }

  /* Fuera todo lo que no es la receta */
  .barra-sup,
  .portada,
  .cenefa,
  .nav-movil,
  .buscador,
  .lateral__acciones,
  .relacionadas,
  .pie,
  .paginacion,
  .separador,
  .receta__pie,
  .saltar-a-contenido,
  .comentarios,
  .migas {
    display: none !important;
  }

  .receta__disposicion {
    display: block !important;
  }
  .receta__principal { max-width: none; }

  .receta__titulo {
    font-size: 22pt;
    margin-bottom: 0.3cm;
  }
  .receta__supra {
    font-size: 9pt;
    color: #555 !important;
    margin-bottom: 0.2cm;
  }
  .receta__meta {
    font-size: 9pt;
    border-bottom: 1px solid #BBB;
    padding-bottom: 0.3cm;
    margin-bottom: 0.5cm;
  }
  .receta__entradilla {
    font-size: 12pt;
    font-style: italic;
    margin-bottom: 0.6cm;
  }

  /* La imagen se imprime pequeña: ahorra tinta y no aporta al cocinar */
  .receta__figura {
    max-width: 8cm;
    margin-bottom: 0.5cm;
  }

  .ingredientes {
    border: 1px solid #999;
    padding: 0.4cm;
    margin-bottom: 0.6cm;
    break-inside: avoid;
  }
  .ingredientes__titulo { font-size: 13pt; margin-bottom: 0.3cm; }
  .ingredientes__nota { display: none; }

  .pasos__item { break-inside: avoid; }
  .pasos__texto { font-size: 11pt; }

  .lateral__caja--datos {
    border: 1px solid #999;
    padding: 0.3cm;
    margin-bottom: 0.5cm;
    break-inside: avoid;
  }

  /* La URL en el pie, para poder volver */
  .contenido a::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #555;
  }
  .contenido a[href^="#"]::after { content: ""; }

  h1, h2, h3 { break-after: avoid; }
  img { max-width: 100% !important; }
}
