/*
 * Druckansichten.
 *
 * Bewusst kein Tailwind: die Tailwind-Datei wird in diesem Projekt nur manuell neu generiert
 * (node_modules/.bin/tailwindcss -i Styles/tailwind.css -o wwwroot/css/tailwind.min.css --minify),
 * neue Utility-Klassen waeren im Build also nicht enthalten. Diese Datei wird direkt in der
 * index.html eingebunden und ist damit unabhaengig vom Tailwind-Build.
 *
 * Aufbau: Der Druckbericht liegt als eigener Block im Markup und ist am Bildschirm ausgeblendet.
 * Im Druck wird umgekehrt die gesamte App ausgeblendet und nur der Bericht sichtbar geschaltet.
 */

.print-report {
    display: none;
}

@media print {

    @page {
        size: A4 landscape;
        margin: 8mm;
    }

    /* body traegt "flex h-screen flex-col", #app "h-screen w-screen" - beides wuerde den Bericht
       auf eine Bildschirmhoehe eindampfen. */
    html,
    body {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
        background: #fff !important;
    }

    /*
     * Der Bericht muss im normalen Fluss stehen, sonst bricht eine lange Tabelle nicht sauber
     * ueber mehrere Seiten um (absolut positionierte Bloecke werden je nach Browser auf die
     * erste Seite beschnitten). Statt ihn herauszuloesen, wird die Kette seiner Vorfahren zu
     * simplen Bloecken gemacht und auf jeder Ebene alles ausgeblendet, was ihn nicht enthaelt.
     *
     * Die :has()-Bedingung greift nur, wenn die Seite ueberhaupt einen Bericht enthaelt - sonst
     * wuerde Strg+P auf jeder anderen Maske ein leeres Blatt ergeben.
     */
    body:has(.print-report) *:has(.print-report) {
        display: block !important;
        position: static !important;
        overflow: visible !important;
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        box-shadow: none !important;
        flex: none !important;
    }

    /* Geschwister auf jeder Ebene ausblenden - inklusive der direkten body-Kinder (#blazor-error-ui
       und Konsorten), die von der Regel darueber nicht erfasst werden. */
    body:has(.print-report) *:has(.print-report) > *:not(:has(.print-report)):not(.print-report),
    body:has(.print-report) > *:not(:has(.print-report)):not(.print-report) {
        display: none !important;
    }

    .print-report {
        display: block !important;
        width: 100%;
        margin: 0;
        padding: 0;
        color: #111827;
        font-family: "Segoe UI", Arial, sans-serif;
        font-size: 7pt;
        line-height: 1.25;
    }

    /* Hintergrundfarben der Fehlzeitenschluessel muessen mitgedruckt werden. */
    .print-report,
    .print-report * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* ---------- Kopf ---------- */

    .print-report__head {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 8mm;
        border-bottom: 0.6pt solid #374151;
        padding-bottom: 2mm;
        margin-bottom: 3mm;
    }

    .print-report__title {
        margin: 0;
        font-size: 13pt;
        font-weight: 700;
    }

    .print-report__subtitle {
        margin: 0.5mm 0 0;
        font-size: 9pt;
        color: #4b5563;
    }

    .print-report__meta {
        display: flex;
        gap: 6mm;
        margin: 0;
        text-align: right;
        font-size: 6.5pt;
    }

    .print-report__meta dt {
        color: #6b7280;
        text-transform: uppercase;
        letter-spacing: 0.02em;
    }

    .print-report__meta dd {
        margin: 0.3mm 0 0;
        font-weight: 600;
    }

    /* ---------- Matrix ---------- */

    .print-grid {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }

    /* Kopfzeile auf jeder Druckseite wiederholen. */
    .print-grid thead {
        display: table-header-group;
    }

    .print-grid tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .print-grid th,
    .print-grid td {
        border: 0.4pt solid #9ca3af;
        padding: 0.4mm 0.6mm;
        overflow: hidden;
        vertical-align: middle;
    }

    .print-grid thead th {
        background: #f3f4f6;
        font-size: 6pt;
        font-weight: 600;
        text-align: center;
    }

    .print-grid__name {
        width: 30mm;
        text-align: left;
    }

    .print-grid__dept {
        width: 18mm;
        text-align: left;
        font-size: 6pt;
        color: #4b5563;
    }

    .print-grid__vacation,
    .print-grid__total {
        width: 11mm;
        text-align: center;
    }

    .print-grid__day {
        text-align: center;
    }

    .print-grid__day--weekend {
        background: #e5e7eb;
    }

    .print-grid__day--holiday {
        background: #dbeafe;
    }

    .print-grid tbody .print-grid__day--weekend {
        background: #f3f4f6;
    }

    .print-grid tbody .print-grid__day--holiday {
        background: #eff6ff;
    }

    .print-grid__dow {
        display: block;
        font-size: 5pt;
        color: #6b7280;
        text-transform: uppercase;
    }

    .print-grid__dom {
        display: block;
        font-size: 6.5pt;
        font-weight: 700;
    }

    .print-grid tbody th,
    .print-grid tbody td {
        font-size: 6.5pt;
    }

    .print-grid__employee {
        display: block;
        font-weight: 600;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .print-grid__personalnr {
        display: block;
        font-size: 5.5pt;
        color: #6b7280;
    }

    /* Farbiger Marker fuer eine Fehlzeit an einem Tag; Farben kommen inline aus dem Schluessel. */
    .print-mark {
        display: block;
        border: 0.4pt solid transparent;
        border-radius: 3pt;
        padding: 0.2mm 0;
        font-size: 5.5pt;
        font-weight: 700;
        letter-spacing: -0.01em;
        white-space: nowrap;
        overflow: hidden;
    }

    /* Offener Urlaubsantrag - wie im Raster weiss mit gestricheltem Rand. */
    .print-mark--requested {
        border-style: dashed;
    }

    /* Deaktiviert = generiert + abgelehnt, wie in der Maske ausgegraut dargestellt. */
    .print-mark--inactive {
        opacity: 0.45;
        text-decoration: line-through;
    }

    /* ---------- Legende ---------- */

    .print-legend {
        margin-top: 4mm;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .print-legend__title {
        margin: 0 0 1.5mm;
        font-size: 8pt;
        font-weight: 700;
    }

    .print-legend__items {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5mm 5mm;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .print-legend__item {
        display: flex;
        align-items: center;
        gap: 1.5mm;
        font-size: 6.5pt;
    }

    .print-legend__swatch {
        display: inline-block;
        min-width: 7mm;
        border: 0.4pt solid #9ca3af;
        border-radius: 1pt;
        padding: 0.2mm 0.8mm;
        text-align: center;
        font-size: 5.5pt;
        font-weight: 700;
    }

    .print-legend__count {
        color: #6b7280;
    }

    .print-legend__notes {
        margin: 2mm 0 0;
        font-size: 6pt;
        color: #6b7280;
    }

    /* ---------- Fuss ---------- */

    .print-report__footer {
        margin-top: 4mm;
        border-top: 0.4pt solid #9ca3af;
        padding-top: 1.5mm;
        font-size: 6pt;
        color: #6b7280;
    }

    .print-report__empty {
        margin: 6mm 0;
        font-size: 9pt;
        color: #4b5563;
    }
}