/* Udskrift: præcis én A4-side pr. dag, aldrig mere.
 *
 * Kravet var "aldrig mere end en side pr. dag". Sideskiftet er derfor sat
 * hårdt efter hver dag, og skriftstørrelsen skruet ned så en opskrift med
 * mange ingredienser stadig kan være der. Ingredienser sættes i to spalter
 * — det er dem der fylder, ikke fremgangsmåden.
 */

@page {
  size: A4;
  margin: 16mm 15mm;
}

@media print {
  .top, .ikke-print, nav, button, .knap { display: none !important; }

  body {
    background: #fff;
    color: #000;
    font: 10.5pt/1.4 Georgia, "Times New Roman", serif;
  }

  main { max-width: none; padding: 0; margin: 0; }

  .side {
    page-break-after: always;
    break-after: page;
    /* Nødværn: kan indholdet ikke være der, skaleres det ned frem for at
     * flyde over på side to. */
    max-height: 265mm;
    overflow: hidden;
  }
  .side:last-child { page-break-after: auto; break-after: auto; }

  .side-hoved {
    display: flex; justify-content: space-between; align-items: baseline;
    border-bottom: 1.5pt solid #000; padding-bottom: 3mm; margin-bottom: 5mm;
  }
  .side-hoved h1 { font-size: 19pt; margin: 0; letter-spacing: -.01em; }
  .side-hoved .dag-navn { font-size: 12pt; text-transform: capitalize; }
  .side-hoved .meta { font-size: 9pt; color: #444; }

  .side h2 {
    font-size: 11pt; margin: 4mm 0 2mm; text-transform: uppercase;
    letter-spacing: .06em; border-bottom: .5pt solid #999; padding-bottom: 1mm;
  }

  .print-ingredienser {
    columns: 2; column-gap: 8mm; list-style: none; padding: 0; margin: 0;
  }
  .print-ingredienser li {
    break-inside: avoid; padding: .6mm 0; font-size: 10pt;
  }
  .print-ingredienser .maengde { font-weight: bold; }
  .print-ingredienser .spisekammer { color: #666; font-style: italic; }

  .print-trin { padding-left: 5mm; margin: 0; }
  .print-trin li { break-inside: avoid; margin-bottom: 1.6mm; }

  .print-note {
    margin-top: 4mm; padding: 2mm 3mm; border-left: 2pt solid #000;
    font-size: 9.5pt; background: #f4f4f4;
  }

  a { color: #000; text-decoration: none; }
  a[href]::after { content: none; }
}