/* ============== Grid ============== */
.dnfGrid {
    display: grid;
    grid-template-columns: 1fr;
    /* z.B. */
    /* grid-template-columns: 8rem minmax(0,1fr) minmax(0,1fr) 7rem; */
    row-gap: 0;
    min-height: 0;
}

/* Kopfzeile */
.dnfGridHead {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: 1 / -1;
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--dnf-flowwer-head-bg);
    box-shadow: 0 1px 2px rgba(0,0,0,.05); /* dezenter Schatten für Layering */
    font-weight: 600;
    font-size: 95%; /* etwas kleiner als groupHeading */
    color: #1e1b4b; /* dunkler Akzent */
}

    .dnfGridHead.heavy {
        font-weight: 700;
        text-transform: uppercase; /* optional: wirkt „tabellarischer“ */
        letter-spacing: .04em;
    }

    .dnfGridHead > * {
        text-align: center;
        padding: .5rem .75rem; /* mehr Luft */
        min-width: 0;
        align-items: center;
        /*overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;*/
    }

.dnfGrid .groupHeadingRow {
    grid-column: 1 / -1;
    overflow: hidden;
    background: #f7f7fb; /* zarter Ton */
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    padding: .375rem .75rem;
    font-weight: 500;
    letter-spacing: .02em;
    color: #2b2f36;
}

/* Row (Form + Grid) */
.dnfGridRow {
    --row-bg: transparent;
    background: var(--row-bg);
    display: grid;
    grid-template-columns: subgrid;
    grid-template-rows: unset;
    grid-auto-rows: min-content;
    grid-column: 1 / -1;
    padding: .25rem 0;
    border-bottom: 1px solid #e5e7eb;
    border-inline-start: .25rem solid transparent;
    transition: background-color .15s ease, border-color .15s ease;
}

    /* Zellblock: zwei Zeilen */
    .dnfGridRow > .dnfGridCell {
        display: grid;
        grid-template-rows: auto auto;
        row-gap: 0.125rem;
        grid-row: 1 / span 2;
        padding: .25rem .75rem;
        min-width: 0;
    }

        /* Standard: Beide Zeilen truncaten (dnfGridCell selbst nicht, damit dropdowns nicht abgeschnitten werden) */
        .dnfGridRow > .dnfGridCell > .firstLine,
        .dnfGridRow > .dnfGridCell > .secondLine {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

            /* Wenn ein Dropdown/Select in firstLine: Overflow wieder aufmachen (damit das Dropdown nicht abgeschnitten wird) */
            .dnfGridRow > .dnfGridCell > .firstLine:has(select, .dropdown, .dnfDropdown, [data-bs-toggle="dropdown"]) {
                overflow: visible;
                text-overflow: clip;
            }

                /* Dann das Truncate auf den Trigger selbst legen (Button/Toggle/Select) */
                .dnfGridRow > .dnfGridCell > .firstLine:has(select, .dropdown, .dnfDropdown, [data-bs-toggle="dropdown"]):is(select, .dropdown-toggle, button) {
                    max-width: 100%;
                    min-width: 0;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }

        /* secondLine mit kleinerem Text */
        .dnfGridRow > .dnfGridCell > .secondLine {
            font-size: 90%;
        }

    /* Zusatzzeile über volle Breite */
    .dnfGridRow > .dnfGridCellFullWidth {
        grid-row: 3;
        grid-column: 1 / -1;
        padding: .375rem .75rem;
        font-size: 80%;
        border-top: 1px dashed #e5e7eb;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        display: flex;
        gap: 1rem;
    }

/* Medien/Inputs sicher skalieren */
.dnfGridCell img,
.dnfGridCellFullWidth img,
.dnfGridCell input,
.dnfGridCellFullWidth input,
.dnfGridCell select,
.dnfGridCellFullWidth select,
.dnfGridCell button,
.dnfGridCellFullWidth button,
.dnfGridCell a {
    max-width: 100%;
    min-width: 0;
}

.dnfGridRow:nth-of-type(even) {
    --row-bg: #fcfcfc;
}

.dnfGridRow:hover {
    --row-bg: #f7f7f7;
}

.dnfGridRow.active,
.dnfGridRow.flag-primary,
.dnfGridRow[aria-selected="true"],
.dnfGridRow.is-active {
    --row-bg: var(--bs-primary-bg-subtle);
    border-inline-start-color: var(--bs-primary);
}

.dnfGridRow.flag-success {
    --row-bg: var(--bs-success-bg-subtle);
    border-inline-start-color: var(--bs-success);
}

.dnfGridRow.flag-warning {
    --row-bg: var(--bs-warning-bg-subtle);
    border-inline-start-color: var(--bs-warning);
}

.dnfGridRow.flag-danger {
    --row-bg: var(--bs-danger-bg-subtle);
    border-inline-start-color: var(--bs-danger);
}

/* ============== Utility-Klasse für optionales Wrap ============== */
.wrap {
    white-space: normal !important; /* überschreibt nowrap */
    overflow-wrap: break-word;
    word-break: break-word;
}