/* ===== DRUCK-STYLESHEET ===== */

/* Dokumentseiten: Grundlagen */
@page {
    margin: 2cm;
}

@media print {
    /* Navigation, Filter, UI-Elemente verbergen */
    .seitenleiste,
    .menue-ausloeser,
    .menue-schleier,
    .suchleiste,
    .filter,
    .aktionsgruppe,
    .kurzmeldungen,
    .knopf--sekundaer,
    .knopf--leise,
    .knopf--symbol:not([type="submit"]),
    .dialogfenster__kopf,
    .detailfenster__kopf,
    .seitenkopf__aktion,
    .verkaufsblatt__steuerung,
    .ueberzeile,
    .filterleiste,
    .ansicht,
    .diagramm__tabelle {
        display: none !important;
    }

    /* Inhalt volle Breite */
    /* Am Bildschirm scrollt nur der Inhaltsbereich in einem Raster mit Seitenleiste; gedruckt würde er sonst
       nach rechts versetzt und nach der ersten Seite abgeschnitten. */
    .anwendung {
        display: block;
        height: auto;
    }

    .inhalt {
        overflow: visible;
        padding: 0;
        margin: 0;
        width: 100%;
        max-width: 100%;
    }

    /* Tabellen */
    table {
        width: 100%;
        border-collapse: collapse;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr {
        page-break-inside: avoid;
    }

    th, td {
        padding: 0.5rem;
        text-align: left;
        border-bottom: 1px solid #000;
    }

    th {
        font-weight: bold;
        background: #f0f0f0;
    }

    /* Karten: nicht unterbrechen */
    .karte,
    .fahrzeugkarte,
    .bildkachel {
        page-break-inside: avoid;
    }

    /* Verkaufsblatt-spezifische Stile */
    .verkaufsblatt {
        width: 100%;
    }

    .verkaufsblatt__kopf {
        display: flex;
        gap: 1.5rem;
        margin-bottom: 1.5rem;
        page-break-inside: avoid;
    }

    .verkaufsblatt__bild {
        max-width: 40%;
        max-height: 250px;
        object-fit: cover;
        aspect-ratio: 16 / 9;
    }

    /* Farben und Hintergründe entfernen */
    * {
        background: white !important;
        color: black !important;
        border-color: black !important;
    }

    a {
        color: black !important;
        text-decoration: underline;
    }

    /* Diagrammfarben für Druck: Schwarz-Weiß-Palette */
    .diagramm__balken--reihe-1 {
        fill: black !important;
    }

    .diagramm__balken--reihe-2 {
        fill: #808080 !important;
    }

    .diagramm__balken--reihe-3 {
        fill: white !important;
        stroke: black !important;
        stroke-width: 1px !important;
    }

    .diagramm__farbe--reihe-1 {
        background: black !important;
    }

    .diagramm__farbe--reihe-2 {
        background: #808080 !important;
    }

    .diagramm__farbe--reihe-3 {
        background: white !important;
        border: 1px solid black !important;
    }

    /* Überschriften */
    h1, h2, h3, h4, h5, h6 {
        page-break-after: avoid;
        page-break-inside: avoid;
    }

    /* Text bleibt lesbar */
    body {
        font-size: 11pt;
        line-height: 1.5;
    }

    p, li {
        page-break-inside: avoid;
        orphans: 2;
        widows: 2;
    }

    /* Listen kompakt */
    ul, ol {
        margin: 0.5rem 0;
        padding-left: 1.5rem;
    }

    li {
        margin-bottom: 0.25rem;
    }
}

/* Enthält die Seite eine .druckfassung, wird beim Drucken nur sie ausgegeben; Navigation, Hülle und Bildschirmfassung entfallen. */
@media print {
    body:has(.druckfassung) *:not(:has(.druckfassung), .druckfassung, .druckfassung *) {
        display: none !important;
    }

    body:has(.druckfassung) :has(.druckfassung) {
        display: block !important;
        position: static !important;
        overflow: visible !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    .druckfassung {
        display: block !important;
        font-size: 10pt;
        line-height: 1.45;
    }

    .druckfassung__kopf {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        gap: 8mm;
        padding-bottom: 4mm;
        margin-bottom: 6mm;
        border-bottom: .6mm solid black !important;
    }

    .druckfassung__art {
        margin: 0;
        font-size: 8pt;
        font-weight: 600;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .druckfassung__titel {
        margin: 1mm 0 0;
        font-size: 20pt;
        line-height: 1.15;
    }

    .druckfassung__unter,
    .druckfassung__stand {
        margin: 1mm 0 0;
        font-size: 10pt;
    }

    .druckfassung__bild {
        display: block;
        width: 100%;
        max-height: 85mm;
        object-fit: cover;
        margin-bottom: 6mm;
        border-radius: 2mm;
    }

    .druckfassung__daten {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 3mm 6mm;
        margin: 0 0 8mm;
        break-inside: avoid;
    }

    .druckfassung__daten dt {
        font-size: 7.5pt;
        font-weight: 600;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    .druckfassung__daten dd {
        margin: .5mm 0 0;
        font-size: 11pt;
    }

    .druckfassung__abschnitt {
        margin: 0 0 3mm;
        font-size: 12pt;
    }

    /* Die allgemeine Regel hält Tabellen zusammen; eine lange Historie soll aber direkt unter ihrer Überschrift beginnen. */
    .druckfassung__tabelle {
        break-inside: auto !important;
        page-break-inside: auto !important;
        width: 100%;
        border-collapse: collapse;
        font-size: 9pt;
    }

    .druckfassung__tabelle th {
        text-align: left;
        font-size: 7.5pt;
        text-transform: uppercase;
        letter-spacing: .06em;
        padding: 2mm;
        border-bottom: .4mm solid black !important;
    }

    .druckfassung__tabelle td {
        vertical-align: top;
        padding: 2mm;
        border-bottom: .2mm solid #999 !important;
    }

    .druckfassung__zahl {
        text-align: right !important;
        white-space: nowrap;
    }

    .druckfassung__beschreibung {
        display: block;
        font-size: 8.5pt;
    }

    .druckfassung__tabelle + .druckfassung__abschnitt,
    .druckfassung__tabelle + .druckfassung__abschnitt + .druckfassung__liste {
        margin-top: 6mm;
    }

    .druckfassung__liste {
        margin: 0;
        padding-left: 5mm;
    }

    .druckfassung__fuss {
        margin-top: 6mm;
        font-size: 8pt;
    }

    /* Rezeptblatt */
    .rezeptblatt {
        width: 100%;
        page-break-after: always;
    }

    .rezeptblatt__kopf {
        display: flex;
        gap: 1.5rem;
        margin-bottom: 1.5rem;
        page-break-inside: avoid;
    }

    .rezeptblatt__bild {
        max-width: 40%;
        max-height: 250px;
        object-fit: cover;
        aspect-ratio: 16 / 9;
    }

    /* Nur einzelne Zeilen zusammenhalten: Eine ganze lange Schrittliste passt oft nicht auf den Rest einer Seite. */
    .zutaten__zeile,
    .schritte__schritt {
        page-break-inside: avoid;
    }

    .zutaten__zeile,
    .schritte__schritt {
        padding: 1mm 0;
    }

    /* Auf Papier: kleines Bild neben dem Kopf, Zutaten und Zubereitung nebeneinander, damit ein Rezept auf eine Seite passt. */
    .rezeptkopf--mit-bild {
        grid-template-columns: 55mm minmax(0, 1fr);
        gap: 6mm;
        align-items: start;
        margin-bottom: 6mm;
    }

    .rezeptkopf__bild {
        aspect-ratio: 4 / 3;
        box-shadow: none;
    }

    .rezeptinhalt {
        grid-template-columns: 62mm minmax(0, 1fr);
        gap: 8mm;
    }

    .rezeptinhalt__zutaten {
        position: static;
        padding: 0;
        border: none;
    }

    .schritte__schritt::before {
        background: none;
        border: 1px solid currentColor;
    }

    .mengenzaehler {
        padding: 0;
        border: none;
    }

    /* Was nur zum Bedienen am Bildschirm dient, gehört nicht aufs Papier. */
    .rezeptkopf__aktionen,
    .kopfzeile__werkzeuge,
    [data-wachhalten],
    #gekocht-stand,
    .mengenzaehler__knopf,
    .rezeptblatt .abschnittskopf__text p {
        display: none !important;
    }

    /* Einkaufszettel: eine Zeile je Artikel mit leerem Kästchen zum Abhaken mit dem Stift */
    .schnelleingabe,
    .schnelleingabe__hilfe,
    .kuechenleiste,
    .einkaufszettel__erledigt,
    .einkaufszettel .knopf,
    .einkaufszettel form {
        display: none !important;
    }

    .einkaufszettel {
        border: none;
    }

    .einkaufszettel .abhakliste__eintrag {
        border-bottom: 0.2mm solid #999;
        page-break-inside: avoid;
    }

    .einkaufszettel .abhakliste__eintrag label {
        min-height: 7mm;
        padding: 1mm 0;
    }

    .einkaufszettel input[type="checkbox"] {
        width: 4.5mm;
        height: 4.5mm;
    }

    .einkaufszettel__blockkopf,
    .abhakliste__abschnitt {
        padding-left: 0;
        page-break-after: avoid;
    }
}