/* Prüfer-App Styles */
body { background: #f8f9fa; }

.navbar-brand { letter-spacing: .02em; }

.card { border: none; box-shadow: 0 1px 4px rgba(0,0,0,.08); }

.table-hover tbody tr:hover { background: #e9f0ff; }

.badge-dulv  { background: #0d6efd; }
.badge-daec  { background: #198754; }

/* Prüfbogen Checkboxen */
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .4rem; }
.check-item label { cursor: pointer; }

/* Statusfarben */
.status-bestanden          { color: #198754; font-weight: 600; }
.status-bestanden_maengel  { color: #fd7e14; font-weight: 600; }
.status-nicht_bestanden    { color: #dc3545; font-weight: 600; }

/* Mobile-freundliche Formular-Abschnitte */
.section-header {
    background: #e7edf8;
    border-left: 4px solid #0d6efd;
    padding: .4rem .8rem;
    margin: 1.2rem 0 .6rem;
    font-weight: 600;
    font-size: .95rem;
}

/* Upload-Vorschau */
.img-thumb { width: 100px; height: 70px; object-fit: cover; border-radius: 4px; cursor: pointer; }

@media (max-width: 576px) {
    .hide-mobile { display: none !important; }
    .container-fluid { padding: .5rem; }
}

/* 2026-06-03: Mobile-Optimierung Prüfformular (pruefung_neu.php) */

/* Aktionsleiste (Speichern/Abbrechen): auf Desktop normal im Fluss */
.form-actions { margin-top: .5rem; }

@media (max-width: 767.98px) {
    /* iOS-Auto-Zoom verhindern: Eingabefelder min. 16px */
    .form-control, .form-select, textarea.form-control {
        font-size: 16px;
    }

    /* Prüfpositionen: 1-2 Spalten, große Touchflächen (~44px Höhe) */
    .check-grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: .35rem;
    }
    .check-item.form-check {
        display: flex;
        align-items: center;
        min-height: 44px;
        margin: 0;
        padding: .35rem .5rem .35rem 2.4rem;  /* Platz für die Checkbox links */
        background: #fff;
        border: 1px solid #dee2e6;
        border-radius: .375rem;
    }
    .check-item .form-check-input {
        width: 1.4em;
        height: 1.4em;
        margin-left: -1.9rem;  /* Checkbox in das Padding ziehen */
        flex-shrink: 0;
    }
    .check-item .form-check-label {
        width: 100%;           /* ganzes Feld klickbar */
        padding-left: .35rem;
        line-height: 1.25;
    }

    /* "✓ alle OK"-Button: größere Touchfläche */
    #alle-ok {
        min-height: 38px;
        padding: .35rem .75rem;
    }

    /* Speichern-Leiste sticky am unteren Rand */
    .form-actions {
        position: sticky;
        bottom: 0;
        z-index: 1020;
        display: flex;
        gap: .5rem;
        margin: .75rem -0.5rem 0;            /* container-fluid-Padding ausgleichen */
        padding: .6rem .75rem calc(.6rem + env(safe-area-inset-bottom));
        background: rgba(248, 249, 250, .97);
        border-top: 1px solid #dee2e6;
        box-shadow: 0 -2px 8px rgba(0, 0, 0, .08);
    }
    .form-actions .btn-success { flex: 1 1 auto; }
    .form-actions .btn.ms-2 { margin-left: 0 !important; }
}

/* 2026-06-04: Prüfpositionen als Tabellenform (Optik wie Original-DULV-Prüfbericht)
   in pruefung_neu.php / pruefung_bearbeiten.php — ersetzt die vorherigen
   .pos-grid/.pos-item-Kacheln. Pro Kategorie eine kompakte table.pos-tabelle:
   grauer Kategorie-Kopf + Spalten OK | n.i.O. | Nr. | Bezeichnung.
   Checkbox-Logik (gegenseitiger Ausschluss, beide leer = NULL) und die
   Hidden-Inputs pos_status[i] sind unverändert; .pos-item ist jetzt die <tr>. */
.pos-tabelle {
    font-size: .85rem;
    line-height: 1.25;
}
/* Kategorie-Kopfzeile — fett, leicht grau hinterlegt wie auf dem Formular */
.pos-tabelle th.pos-gruppe-kopf {
    background: #e9ecef;
    font-weight: 700;
    font-size: .82rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #495057;
    padding: .35rem .5rem;
}
/* Spaltenköpfe OK / n.i.O. / Nr. / Bezeichnung */
.pos-tabelle .pos-spalten-kopf th {
    background: #f8f9fa;
    font-size: .72rem;
    font-weight: 600;
    color: #6c757d;
    text-align: left;
    padding: .2rem .4rem;
    white-space: nowrap;
}
.pos-tabelle .pos-spalten-kopf th.pos-col-cb { text-align: center; }
/* schmale, zentrierte Checkbox-Spalten */
.pos-tabelle td.pos-col-cb {
    width: 48px;
    text-align: center;
    vertical-align: middle;
    padding: 0;
}
/* Label füllt die Zelle = große Touch-Fläche (min. 38px) um die Checkbox */
.pos-tabelle .pos-cb-touch {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    width: 100%;
    margin: 0;                       /* label-Default neutralisieren */
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.pos-tabelle .pos-cb-touch input.form-check-input {
    margin: 0;
    width: 1.25em;
    height: 1.25em;
    flex-shrink: 0;
    cursor: pointer;
}
/* OK = grün, n.i.O. = rot (wie bisherige Kachel-Akzente) */
.pos-tabelle input.pos-cb-ok:checked {
    background-color: #198754;
    border-color: #198754;
}
.pos-tabelle input.pos-cb-nok:checked {
    background-color: #dc3545;
    border-color: #dc3545;
}
/* Zeilen-Hintergrund je Zustand (per :has, progressive enhancement) */
.pos-tabelle tr.pos-item:has(.pos-cb-ok:checked)  > td { background: #f0f7f3; }
.pos-tabelle tr.pos-item:has(.pos-cb-nok:checked) > td { background: #fdf1f2; }
/* Nr.-Spalte schmal, dezent */
.pos-tabelle td.pos-col-nr,
.pos-tabelle th.pos-col-nr {
    width: 36px;
    text-align: center;
    color: #6c757d;
    font-size: .78em;
    vertical-align: middle;
    white-space: nowrap;
}
.pos-tabelle td.pos-col-label { vertical-align: middle; }

@media (max-width: 767.98px) {
    /* Mobile: Tabellen stapeln (col-12 erledigt das), Schrift minimal kleiner */
    .pos-tabelle { font-size: .8rem; }
    .pos-tabelle td.pos-col-cb { width: 44px; }
}