/**
 * Recipe Print Styles - KochCode.de
 * Optimierte Druckansicht für Rezepte
 */

@media print {

    /* === Ausblenden: Navigation, Buttons, Formulare === */
    nav,
    .no-print,
    button,
    form,
    #comments,
    footer,
    [x-cloak],
    [x-data*="showModal"],
    .fixed {
        display: none !important;
    }

    /* === Ausblenden: Cook Snaps Sektion === */
    #cook-snaps,
    [id="cook-snaps"],
    .cook-snaps-section {
        display: none !important;
    }

    /* === Ausblenden: Wusstest du schon / Backstory === */
    [class*="from-purple-50"],
    [class*="bg-gradient-to-br"][class*="purple"] {
        display: none !important;
    }

    /* === Ausblenden: Zutatenbild-Thumbnails === */
    .ingredient-group img,
    li img[src*="zutaten_img"],
    li .relative.group {
        display: none !important;
    }

    /* === Ausblenden: Dekorative Hintergründe === */
    [style*="background: linear-gradient"],
    [style*="background-image"] {
        background: white !important;
        background-image: none !important;
    }

    /* === Ausblenden: Equipment Sektion === */
    [class*="equipment"],
    h4:has(+ [class*="equipment"]) {
        display: none !important;
    }

    /* === Logo behalten (im Header) === */
    img[src*="kochcode_logo"],
    img[alt="KochCode"] {
        display: block !important;
        height: 24px !important;
        margin-bottom: 0.25rem;
    }

    /* === Grundlegende Druck-Optimierung - KOMPAKT === */
    body {
        background: white !important;
        color: black !important;
        font-size: 9pt !important;
        line-height: 1.2 !important;
    }

    /* === Textfarben für den Druck === */
    * {
        color: black !important;
        text-shadow: none !important;
    }

    h1 {
        font-size: 14pt !important;
        margin-bottom: 0.25rem !important;
    }

    h2,
    h3 {
        font-size: 11pt !important;
        margin-bottom: 0.25rem !important;
        color: #1a1a1a !important;
    }

    h4 {
        font-size: 9pt !important;
        margin-bottom: 0.15rem !important;
    }

    p {
        margin-bottom: 0.25rem !important;
    }

    .text-gray-300,
    .text-gray-400,
    .text-gray-500,
    .text-blue-400,
    .text-white {
        color: #333 !important;
    }

    /* === Hintergründe für den Druck === */
    .bg-gray-800,
    .bg-gray-700,
    .bg-gray-700\/30,
    .bg-gray-700\/50,
    .bg-blue-600\/20,
    .bg-blue-700\/70,
    .bg-gray-800\/80 {
        background: white !important;
        color: black !important;
        border: none !important;
        padding: 0.15rem !important;
    }

    .bg-gray-50,
    .bg-white {
        background: white !important;
    }

    /* === Schatten entfernen === */
    .shadow-lg,
    .shadow-xl,
    .shadow-2xl,
    [class*="shadow-"] {
        box-shadow: none !important;
    }

    /* === Glasmorphismus entfernen === */
    .backdrop-blur-md,
    .backdrop-blur-lg,
    .backdrop-blur-sm,
    [class*="backdrop-blur"] {
        backdrop-filter: none !important;
    }

    /* === Layout für den Druck - 2 Spalten nebeneinander === */
    .p-8 {
        padding: 0.25rem !important;
    }

    .grid {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 0.5rem !important;
    }

    .md\:grid-cols-3 {
        display: flex !important;
    }

    .md\:col-span-1 {
        width: 100% !important;
        margin-bottom: 0.5rem !important;
        flex-shrink: 0 !important;
    }

    .md\:col-span-2 {
        width: 100% !important;
        margin-bottom: 0 !important;
    }

    /* === Schritt-Bilder ausblenden === */
    .step-image,
    [class*="step"] img:not([src*="logo"]) {
        display: none !important;
    }

    /* === Zutaten ULTRA-KOMPAKT === */
    .ingredient-group {
        margin-bottom: 0.15rem !important;
        background: white !important;
        padding: 0 !important;
    }

    .ingredient-group li {
        display: flex !important;
        align-items: baseline !important;
        border-bottom: none !important;
        padding: 0.05rem 0 !important;
        font-size: 9pt !important;
        line-height: 1.2 !important;
    }

    .ingredient-group h4 {
        font-size: 9pt !important;
        font-weight: bold !important;
        margin-bottom: 0.1rem !important;
        margin-top: 0.2rem !important;
    }

    /* === ALLE Bilder und Icon-Container NUR in Zutaten ausblenden === */
    .ingredient-group img,
    .ingredient-group svg,
    .ingredient-group .relative,
    .ingredient-group .w-8,
    .ingredient-group .w-10,
    .ingredient-group .flex-shrink-0.rounded-md,
    .ingredient-group li img,
    .ingredient-group li svg,
    .ingredient-group li .relative.group,
    .ingredient-group li .w-8.h-8,
    .ingredient-group li .w-10.h-10,
    [x-data*="showModal"],
    .fixed.inset-0 {
        display: none !important;
    }

    /* === Schritt-Nummern explizit sichtbar halten === */
    ol.space-y-6 li .flex-shrink-0.rounded-full,
    .space-y-6 li span.bg-blue-100,
    .space-y-6 li span[class*="bg-blue-100"] {
        display: flex !important;
        background: #ddd !important;
        color: #333 !important;
        min-width: 24px !important;
        min-height: 24px !important;
        font-size: 10pt !important;
    }

    ul,
    ol {
        margin: 0 !important;
        padding-left: 0.75rem !important;
    }

    li {
        margin-bottom: 0.1rem !important;
    }

    /* === Portionsbereich: Interaktive Elemente ausblenden === */
    input[type="number"],
    .bg-blue-700\/70 button,
    [class*="bg-blue-700"] button {
        display: none !important;
    }

    /* === Statische Portionsanzeige sichtbar machen === */
    .print-portions {
        display: block !important;
    }

    /* === Mengenangaben clean === */
    .font-mono {
        background: transparent !important;
        border: none !important;
        padding: 0 0.25rem 0 0 !important;
        font-size: 9pt !important;
        color: #333 !important;
        font-weight: 600 !important;
    }

    /* === Alle Buttons ausblenden === */
    button,
    .ingredient-group button,
    a[class*="bg-emerald"],
    a[class*="backdrop-blur"] {
        display: none !important;
    }

    /* === "Hast du alles?" / Equipment komplett ausblenden === */
    [class*="from-orange-50"],
    [class*="from-orange-900"],
    [class*="to-amber-50"],
    [class*="to-amber-900"] {
        display: none !important;
    }

    /* === "Wusstest du schon?" / Backstory komplett ausblenden === */
    [class*="from-purple-50"],
    [class*="from-purple-900"],
    [class*="to-indigo-50"],
    [class*="to-indigo-900"] {
        display: none !important;
    }

    /* === Alle Dark-Mode-Hintergründe auf weiß === */
    .dark\:bg-gray-800,
    .dark\:bg-gray-900,
    .dark\:bg-slate-900\/80,
    .bg-gray-50,
    .bg-gray-800,
    .bg-gray-900 {
        background: white !important;
        color: black !important;
    }

    /* === Metadata-Karten kompakt inline === */
    .grid.grid-cols-2.sm\:grid-cols-4 {
        display: flex !important;
        gap: 0.5rem !important;
        font-size: 8pt !important;
    }

    .grid.grid-cols-2.sm\:grid-cols-4>div {
        padding: 0.2rem 0.3rem !important;
        border: 1px solid #ccc !important;
        background: white !important;
    }

    /* === Metadata Footer (Autor, Datum) ausblenden === */
    .mt-3.flex.items-center.justify-between,
    .border-t.border-gray-700 {
        display: none !important;
    }

    /* === Zubereitung kompakt === */
    .space-y-6 {
        gap: 0.25rem !important;
    }

    .space-y-6>li {
        margin-bottom: 0.25rem !important;
    }

    /* === Tags ausblenden für sauberen Druck === */
    .flex.gap-2.flex-wrap {
        display: none !important;
    }

    /* === Seitenumbruch-Kontrolle === */
    h2,
    h3 {
        page-break-after: avoid;
        font-size: 11pt !important;
        margin-bottom: 0.25rem !important;
    }

    /* === Print-spezifisches Logo/Branding === */
    .print-only {
        display: block !important;
    }

    /* === Margins/Paddings minimieren === */
    .mt-4,
    .mt-6,
    .mt-12,
    .mb-4,
    .mb-6,
    .mb-12 {
        margin-top: 0.2rem !important;
        margin-bottom: 0.2rem !important;
    }

    .p-4,
    .p-6,
    .p-8 {
        padding: 0.25rem !important;
    }

    .gap-8 {
        gap: 0.5rem !important;
    }

    /* === Border-Radius entfernen === */
    .rounded-xl,
    .rounded-lg,
    .rounded-2xl {
        border-radius: 2px !important;
    }

    /* === Einleitungstext volle Breite === */
    .recipe-intro {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
    }

    .recipe-intro:is(p) {
        width: 100% !important;
    }

    /* Parent container of intro text: remove w-fit */
    .w-fit:has(.recipe-intro) {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* === Hero-Bereich für Druck entfernen/vereinfachen === */
    [style*="background: linear-gradient"],
    [style*="background-image"] {
        background: #f5f5f5 !important;
        background-image: none !important;
        color: black !important;
    }

    /* === Zubereitungs-Schritte kompakt === */
    .space-y-6 li p {
        font-size: 9pt !important;
        line-height: 1.3 !important;
    }

    .bg-blue-100,
    .dark\:bg-blue-900\/40 {
        background: #ddd !important;
        min-width: 22px !important;
        min-height: 22px !important;
        font-size: 10pt !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* === Ähnliche Rezepte ausblenden === */
    section:has(h3:contains('Ähnliche')),
    [class*="similar-recipes"],
    .mt-12.border-t {
        display: none !important;
    }

    /* === Nur: Rahmen um Zutatenblock entfernen === */
    [class*="md:col-span-1"][class*="bg-gray-50"][class*="rounded-lg"] {
        border: none !important;
        box-shadow: none !important;
    }
}

/* Im normalen Modus ausblenden */
.print-only {
    display: none;
}