/* GIMA Mahnverfahren – Ergänzungen zu style.css (gemeinsames GIMA-Aussehen) */

.zwei-spalten {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 1rem;
    align-items: start;
}
.zwei-spalten > .card, .zwei-spalten > div > .card:last-child { margin-bottom: 0; }
.zwei-spalten + .card, .zwei-spalten + div { margin-top: 1rem; }

a.stat-card { text-decoration: none; color: inherit; }
a.stat-card:hover { border-color: var(--gima-orange); }
.wert-warn { color: var(--warning); }
.wert-err { color: var(--danger); }
.wert-ok { color: var(--success, #198754); }
.wert-info { color: var(--gima-orange); }

.filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    margin-bottom: 1rem;
}
.filter-bar select, .filter-bar input[type=text] {
    padding: .42rem .6rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg);
    color: var(--text);
    font: inherit;
    font-size: .9rem;
}
.filter-bar input[type=text] { min-width: 300px; flex: 1 1 320px; }
.filter-reiter { display: flex; flex-wrap: wrap; gap: .3rem; }
.filter-reiter a {
    padding: .3rem .7rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    font-size: .85rem;
    text-decoration: none;
    color: var(--text);
}
.filter-reiter a.aktiv { border-color: var(--gima-orange); color: var(--gima-orange); font-weight: 600; }

tr.klickbar { cursor: pointer; }
tr.klickbar:hover td { background: var(--border-subtle); }
tr.zeile-aus td { opacity: .6; }
tr.zeile-warn td { background: rgba(255, 193, 7, .10); }

/* Die Fundstelle aus der Volltextsuche. `mark` setzt FTS5 selbst -- deshalb
   steht hier nur Text aus dem Dokument, nie eine Eingabe des Nutzers. */
.treffer {
    display: block;
    margin-top: .25rem;
    font-size: .82rem;
    color: var(--text-muted, #6c757d);
    line-height: 1.5;
}
.treffer mark {
    background: rgba(232, 119, 34, .28);
    color: inherit;
    padding: 0 .12rem;
    border-radius: 3px;
}

.badge-ok { background: rgba(25, 135, 84, .14); color: var(--success, #198754); }
.badge-warn { background: rgba(255, 193, 7, .22); color: #8a6d00; }
.badge-info { background: rgba(232, 119, 34, .14); color: #b85a12; }
[data-theme="dark"] .badge-warn { color: #ffd75e; }
[data-theme="dark"] .badge-info { color: #ffb070; }

/* Ein Formularfeld mit Beschriftung, Eingabe und Erläuterung darunter. */
.form-row { margin-bottom: 1rem; }
.form-row label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .25rem; }
.form-row input[type=text], .form-row input[type=date], .form-row select, .form-row textarea {
    width: 100%;
    max-width: 44rem;
    padding: .45rem .6rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg);
    color: var(--text);
    font: inherit;
    font-size: .92rem;
}
.form-row input[type=checkbox] { width: auto; }
.feld-hilfe {
    display: block;
    margin-top: .25rem;
    font-size: .8rem;
    color: var(--text-muted, #6c757d);
    max-width: 44rem;
}
.form-actions { display: flex; gap: .6rem; align-items: center; margin-top: 1rem; }
.inline-form { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.inline-form input[type=text] {
    padding: .42rem .6rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg);
    color: var(--text);
    font: inherit;
    font-size: .9rem;
}

/* Der gelesene Text eines Dokuments. Umbrechen statt scrollen -- OCR-Text hat
   oft sehr lange Zeilen. */
pre.doktext {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: .82rem;
    line-height: 1.55;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: .8rem 1rem;
    margin: .6rem 0 0;
    max-height: 32rem;
    overflow-y: auto;
}

/* Alles, was nicht rückgängig zu machen ist, steht in einer solchen Karte. */
.card-gefahr { border-color: rgba(220, 53, 69, .45); }
.card-gefahr .card-title { color: var(--danger); }
.btn-danger { background: var(--danger); color: #fff; border-color: var(--danger); }
.btn-danger:hover { filter: brightness(.92); }

.alert-warn { background: rgba(255, 193, 7, .14); border-left: 3px solid var(--warning); }
.alert-info { background: rgba(232, 119, 34, .10); border-left: 3px solid var(--gima-orange); }

details > summary { cursor: pointer; color: var(--gima-orange); font-size: .9rem; }

/* ── Mahnverfahren ─────────────────────────────────────────────────────────── */
.badge-err { background: rgba(220, 53, 69, .14); color: var(--danger, #c0392b); }
[data-theme="dark"] .badge-err { color: #ff8a80; }
tr.zeile-err td { background: rgba(220, 53, 69, .08); }

/* Der Hinweis „Zu welchem Vorgang gehört das?" steht über allem anderen. */
.card-hinweis { border-color: var(--gima-orange); border-width: 2px; }
.card-hinweis .card-title { color: var(--gima-orange); }

/* Ablagefläche zum Hineinziehen. Ohne JavaScript bleibt das Dateifeld sichtbar. */
.dropzone { display: none; }
.dropzone.dz-bereit {
    display: block;
    border: 2px dashed var(--border);
    border-radius: 10px;
    padding: 1.4rem 1rem;
    text-align: center;
    cursor: pointer;
    background: var(--bg);
    transition: border-color .15s, background .15s;
}
.dropzone.dz-bereit:hover, .dropzone.dz-bereit:focus { border-color: var(--gima-orange); outline: none; }
.dropzone.dz-drueber { border-color: var(--gima-orange); background: rgba(232, 119, 34, .08); }
.dropzone.dz-laedt { opacity: .7; cursor: progress; }
.dropzone .dz-zeichen { font-size: 1.8rem; color: var(--gima-orange); line-height: 1; margin-bottom: .3rem; }
.dz-versteckt { display: none; }

/* Der Weg durchs Verfahren als Stufenleiste. */
ol.verfahrensweg { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem; }
ol.verfahrensweg li {
    font-size: .78rem;
    padding: .2rem .55rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--text-muted, #6c757d);
    cursor: help;
}
ol.verfahrensweg li.erreicht { border-color: rgba(232, 119, 34, .4); color: var(--text); }
ol.verfahrensweg li.aktuell { background: var(--gima-orange); border-color: var(--gima-orange); color: #fff; font-weight: 600; }

/* Eine Änderung im Protokoll: alter und neuer Wert. */
.aenderung { margin-top: .3rem; font-size: .8rem; line-height: 1.5; }
.aenderung .alt { text-decoration: line-through; opacity: .7; }
.aenderung .neu { font-weight: 600; }
.form-row input[type=number] {
    padding: .45rem .6rem; border: 1px solid var(--border); border-radius: 6px;
    background: var(--bg); color: var(--text); font: inherit; font-size: .92rem;
}
.inline-form select {
    padding: .42rem .6rem; border: 1px solid var(--border); border-radius: 6px;
    background: var(--bg); color: var(--text); font: inherit; font-size: .9rem;
}
/* Die Punkte der Startseite unter ihren deutschen Namen. */
.status-dot.gruen { background: var(--success); }
.status-dot.gelb { background: var(--warning); }
.status-dot.rot { background: var(--danger); }
.status-dot.grau { background: var(--border); }