/* GIMA Reisekosten – Ergänzungen zu style.css (gemeinsames GIMA-Aussehen, Stilvorlage Energieverwaltung) */

.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;
}

/* Badges im Farbschema der Vorlage (hell/dunkel, mit Rand) */
.badge-ok   { background: #eafaf1; color: #1e8449; border-color: #a9dfbf; }
.badge-warn { background: #fdf3e6; color: #8a5000; border-color: #f5cba7; }
.badge-info { background: #fef5ee; color: var(--gima-dark); border-color: #f0b27a; }
[data-theme="dark"] .badge-ok   { background: #1a3a28; color: #58d68d; border-color: #2a5a40; }
[data-theme="dark"] .badge-warn { background: #33280f; color: #e59866; border-color: #5a3f20; }
[data-theme="dark"] .badge-info { background: #3a2a1a; color: #f0b27a; border-color: #5a4030; }

/* 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); }


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

/* ══ Aussehen nach dem Vorbild der GIMA Energieverwaltung (gima-pv-verwaltung) ══
   Kacheln mit Symbol und orangem Verlaufsbalken, Listen aus Karten statt nackter
   Tabellenzeilen, ein farbiger Akzent links zeigt den Stand auf einen Blick. */

/* Statuspunkte -- die Vorlagen benutzten die Farbnamen schon, definiert waren sie nie. */
.status-dot.gruen { background: var(--success); box-shadow: 0 0 0 3px rgba(39,174,96,.18); }
.status-dot.gelb  { background: var(--warning); box-shadow: 0 0 0 3px rgba(230,126,34,.18); }
.status-dot.rot   { background: var(--danger);  box-shadow: 0 0 0 3px rgba(231,76,60,.18); }
.status-dot.grau  { background: var(--text-subtle); }

/* Kennzahlen: die GIMA-Kachel (.kpi-card aus style.css), hier als Link und dichter. */
.kpi-dokumente { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
a.kpi-card { text-decoration: none; color: inherit; }
.kpi-dokumente .kpi-card { padding: 1.3rem 1rem 1.1rem; }
.kpi-dokumente .kpi-icon { font-size: 1.6rem; margin-bottom: .35rem; }
.kpi-dokumente .kpi-label { font-size: .68rem; letter-spacing: .08em; }
.kpi-card.kpi-arbeit { border-color: rgba(230,66,22,.35); }
.kpi-card.kpi-arbeit::before { height: 4px; }
.kpi-value.wert-warn { color: var(--warning); }
.kpi-value.wert-err { color: var(--danger); }
.kpi-value.wert-ok { color: var(--success); }
.kpi-value.wert-null { color: var(--text-subtle); }
.kpi-value.wert-neutral { color: var(--text); }
.ic-warn { color: var(--warning); }
.ic-info { color: var(--gima-orange); }
.ic-ok { color: var(--success); }
.ic-err { color: var(--danger); }
.ic-akte { color: var(--info); }

/* Die Stat-Kacheln der übrigen Seiten (Fristen, Akte, Verwaltung) bekommen denselben Balken. */
.stat-card { position: relative; overflow: hidden; background: var(--surface); border-color: var(--border); }
.stat-card::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: linear-gradient(to right, var(--gima-orange-light), var(--gima-orange));
}
a.stat-card:hover { border-color: var(--gima-orange); box-shadow: 0 4px 16px rgba(230,66,22,.12); }
.stat-value { font-family: 'Poppins', sans-serif; font-variant-numeric: tabular-nums; }
.stat-label { color: var(--text-muted); font-weight: 600; letter-spacing: .08em; font-size: .72rem; }
[data-theme="dark"] .stat-card { background: var(--surface); border-color: var(--border); }

/* Tabellenzeilen zum Anklicken: derselbe orange Schimmer wie in der Vorlage. */
tr.klickbar:hover td { background: rgba(230,66,22,.05); }
[data-theme="dark"] tr.klickbar:hover td { background: rgba(230,66,22,.08); }

/* Hinweis mit dem Postfach */
.hinweis-postfach {
    display: flex; gap: 1rem; align-items: flex-start;
    background: linear-gradient(to right, rgba(230,66,22,.09), rgba(230,66,22,.03));
    border: 1px solid rgba(230,66,22,.25); border-left: 4px solid var(--gima-orange);
    border-radius: 8px; padding: 1rem 1.2rem; margin-bottom: 1rem; font-size: .92rem;
}
.hinweis-ic {
    flex-shrink: 0; width: 42px; height: 42px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    background: var(--gima-orange); color: #fff; font-size: 1.3rem;
    box-shadow: 0 2px 8px rgba(230,66,22,.3);
}
.hinweis-klein { font-size: .84rem; color: var(--text-muted); margin-top: .35rem; }
.hinweis-link { display: inline-block; margin-top: .35rem; font-size: .84rem; font-weight: 600; }

.suche-gross input[type=text] { padding: .65rem .9rem; font-size: .95rem; border-radius: 8px; }
.suche-gross input[type=text]:focus { outline: none; border-color: var(--gima-orange); box-shadow: 0 0 0 3px rgba(230,66,22,.15); }

/* Kartenkopf: Symbol, Titel mit Zähler, Link rechts */
.karten-kopf {
    display: flex; align-items: center; gap: .7rem;
    margin: -.2rem 0 1rem; padding-bottom: .85rem; border-bottom: 1px solid var(--border-subtle);
}
.karten-ic {
    width: 34px; height: 34px; border-radius: 9px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 1.05rem;
    background: var(--surface-2);
}
.karten-titel { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 1.02rem; flex: 1; }
.karten-link { font-size: .82rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.zaehler {
    display: inline-block; min-width: 24px; padding: 0 .45rem; margin-left: .35rem;
    border-radius: 999px; background: var(--surface-2); color: var(--text-muted);
    font-family: 'Open Sans', sans-serif; font-size: .74rem; font-weight: 700; line-height: 20px;
    text-align: center; vertical-align: middle;
}
.zaehler-warn { background: var(--warning); color: #fff; }
.zaehler-info { background: var(--gima-orange); color: #fff; }

/* Die Dokumentliste der Startseite */
.liste-karte { padding-bottom: 1rem; }
.dok-liste { display: flex; flex-direction: column; gap: .55rem; }
.dok-zeile {
    display: flex; align-items: center; gap: .9rem;
    padding: .75rem .9rem; border: 1px solid var(--border-subtle); border-left: 4px solid var(--border);
    border-radius: 8px; background: var(--surface);
    text-decoration: none; color: inherit;
    transition: transform .15s, box-shadow .15s, border-color .15s;
}
.dok-zeile:hover { transform: translateX(2px); box-shadow: 0 3px 12px rgba(230,66,22,.10); border-color: rgba(230,66,22,.35); color: inherit; }
.dok-zeile.akzent-ok { border-left-color: var(--success); }
.dok-zeile.akzent-warn { border-left-color: var(--warning); }
.dok-zeile.akzent-err { border-left-color: var(--danger); }
.dok-zeile.akzent-info { border-left-color: var(--gima-orange); }
.dok-ic {
    width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.15rem; font-weight: 700;
}
.dok-ic-mail { background: rgba(41,128,185,.12); color: var(--info); }
.dok-ic-upload { background: rgba(230,66,22,.10); color: var(--gima-orange); }
.dok-ic-person {
    border-radius: 50%; font-family: 'Poppins', sans-serif; font-size: .9rem; color: #fff;
    background: linear-gradient(135deg, var(--gima-orange-light), var(--gima-orange));
}
.dok-haupt { flex: 1; min-width: 0; }
.dok-titel { font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dok-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; margin-top: .25rem; font-size: .8rem; }
.dok-person { color: var(--text); }
.dok-vorschlag { color: var(--text-muted); font-style: italic; }
.dok-offen { color: var(--warning); font-weight: 600; }
.dok-herkunft { font-size: .76rem; color: var(--text-subtle); margin-top: .2rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.badge-art { background: var(--surface-2); color: var(--text-muted); border-color: var(--border); text-transform: none; letter-spacing: 0; font-weight: 600; }
.badge-fehler { background: #fdf0ee; color: #922b21; border-color: #f1948a; }
.badge-wartet { background: #eaf2fb; color: #2471a3; border-color: #aed6f1; text-transform: none; letter-spacing: 0; display: inline-flex; align-items: center; gap: .35rem; }
[data-theme="dark"] .badge-fehler { background: #3a1a1a; color: #f1948a; border-color: #5a2a2a; }
[data-theme="dark"] .badge-wartet { background: #1a2a40; color: #5dade2; border-color: #2a4060; }
.puls { width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: puls 1.4s ease-in-out infinite; }
@keyframes puls { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }

/* KI-Sicherheit als Zahl mit Balken */
.dok-ki { flex-shrink: 0; width: 118px; text-align: right; }
.dok-ki .badge { white-space: nowrap; }
.ki-wert { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.05rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.ki-wert.ki-sicher { color: var(--success); }
.ki-wert.ki-unsicher { color: var(--warning); }
.ki-balken { height: 5px; border-radius: 3px; background: var(--surface-2); overflow: hidden; margin: .3rem 0 .2rem; }
.ki-balken span { display: block; height: 100%; border-radius: 3px; }
.ki-balken span.ki-sicher { background: linear-gradient(to right, #58d68d, var(--success)); }
.ki-balken span.ki-unsicher { background: linear-gradient(to right, #f5b041, var(--warning)); }
.ki-text { font-size: .64rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-subtle); font-weight: 600; }
.ablegen-hinweis { font-size: .78rem; font-weight: 600; color: var(--gima-orange); white-space: nowrap; }

/* Betrieb als Kacheln */
.betrieb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .8rem; }
.betrieb-kachel { border: 1px solid var(--border-subtle); border-radius: 8px; padding: .85rem 1rem; background: var(--surface-2); }
.betrieb-kopf { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); margin-bottom: .4rem; }
.betrieb-wert { font-weight: 600; font-size: .9rem; word-break: break-word; }
.betrieb-text { font-size: .78rem; color: var(--text-muted); margin-top: .2rem; }

@media (max-width: 600px) {
    .dok-ki { width: auto; }
    .ki-balken, .ki-text { display: none; }
    .hinweis-ic { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .dok-zeile:hover { transform: none; }
    .puls { animation: none; opacity: 1; }
}


/* ══ Das ganze Projekt im Stil der GIMA Energieverwaltung ═════════════════════
   Vorlage: gima-pv-verwaltung. Gilt für alle Seiten, nicht nur die Startseite. */

/* Formulare: Beschriftung oben in kleinen Versalien, Feld volle Breite, oranger
   Fokusring. .form-row ist in style.css ein Zweispalter -- hier ist jede Zeile ein Feld. */
.form-row { display: block; margin-bottom: 1.1rem; }
.form-row label {
    display: block; font-weight: 600; font-size: .76rem; text-transform: uppercase;
    letter-spacing: .07em; color: var(--text-muted); margin-bottom: .4rem;
}
.form-row input[type=text], .form-row input[type=date], .form-row input[type=email],
.form-row input[type=password], .form-row input[type=file], .form-row select, .form-row textarea,
.filter-bar select, .filter-bar input[type=text], .inline-form input[type=text] {
    padding: .55rem .85rem; background: var(--surface); border: 1px solid var(--border);
    border-radius: 5px; font-size: .93rem; color: var(--text);
    transition: border-color .15s, box-shadow .15s;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus,
.filter-bar select:focus, .filter-bar input:focus, .inline-form input:focus {
    outline: none; border-color: var(--gima-orange); box-shadow: 0 0 0 3px rgba(230,66,22,.15);
}
.form-row label:has(input[type=checkbox]) { text-transform: none; letter-spacing: 0; font-size: .9rem; color: var(--text); font-weight: 500; }
.feld-hilfe { font-size: .78rem; margin-top: .35rem; }

/* Filterleiste als eigene Karte wie in der Vorlage (die große Startseiten-Suche nicht) */
.filter-bar:not(.suche-gross) {
    background: var(--surface); border: 1px solid var(--border); border-radius: 8px;
    padding: .9rem 1rem; box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.filter-bar:not(.suche-gross) input[type=text] { flex: 1 1 320px; }

/* Tabellen: Titel in Textfarbe und fett, Orange erst beim Überfahren -- wie die
   Betreffspalte der Vorlage. Unterstreichen nur, wenn es wirklich ein Fließtextlink ist. */
.data-table td a { color: var(--text); font-weight: 600; text-decoration: none; }
.data-table td a:hover, tr.klickbar:hover td a { color: var(--gima-orange); }
.data-table td a.btn { color: inherit; }
.data-table td a.btn-primary, .data-table td a.btn-danger { color: #fff; }

/* Zeilenakzent nach Stand (links ein farbiger Strich, wie .row-urgent der Vorlage) */
tr.zeile-neu > td:first-child       { box-shadow: inset 3px 0 0 var(--warning); }
tr.zeile-geprueft > td:first-child  { box-shadow: inset 3px 0 0 var(--gima-orange); }
tr.zeile-abgelegt > td:first-child  { box-shadow: inset 3px 0 0 var(--success); }
tr.zeile-verworfen > td:first-child { box-shadow: inset 3px 0 0 var(--text-subtle); }
tr.zeile-verworfen td { opacity: .7; }
tr.zeile-warn td { background: #fdf7ef; }
tr.zeile-warn > td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
[data-theme="dark"] tr.zeile-warn td { background: #33280f; }

/* Schlüssel-Wert-Tabellen: links die Beschriftung klein und gedämpft (wie .detail-grid dt) */
.kv-tabelle td { padding: .6rem .9rem; vertical-align: top; }
.kv-tabelle td:first-child {
    width: 34%; color: var(--text-muted); font-size: .76rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .07em; padding-top: .75rem;
}
.kv-tabelle tr:hover td { background: transparent; }
.kv-tabelle tr:last-child td { border-bottom: none; }

/* Der KI-Kasten: Zusammenfassung mit orangem Rand links (.summary-box der Vorlage) */
.karte-ki { border-left: 4px solid var(--gima-orange); background: linear-gradient(to right, rgba(230,66,22,.04), var(--surface) 40%); }

/* Hinweise: einheitlich mit Rand und Akzentstrich, Text in Textfarbe */
.alert-info { background: #fef5ee; color: var(--text); border-color: #f5c6b3; border-left-color: var(--gima-orange); }
[data-theme="dark"] .alert-info { background: #3a2a1a; color: var(--text); border-color: #5a4030; border-left-color: var(--gima-orange); }
.alert-warn { color: #6e4200; }

/* Kartentitel: etwas mehr Gewicht und eine feine Linie darunter */
.card > .card-title:first-child { padding-bottom: .7rem; border-bottom: 1px solid var(--border-subtle); }
.card-gefahr { border-left: 4px solid var(--danger); }

/* Leere Listen */
.empty-state { padding: 2rem 1rem; }

/* Gelesener Text wie der Mailtext der Vorlage */
pre.doktext { background: var(--surface-2); font-family: 'Open Sans', monospace; font-size: .86rem; padding: 1rem 1.2rem; }
.kv-tabelle td a { color: var(--gima-orange); font-weight: inherit; }
.kv-grid dt, .detail-grid dt { color: var(--text-muted); font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; padding-top: .15rem; }
.kv-grid, .detail-grid { margin-top: .6rem; }
.filter-bar:not(.suche-gross) select { max-width: 240px; }

/* ══════════════════════════════════════════════════════════════════════════
   Reisekosten: Summenband, Prüfhinweise, Positionen, Mahlzeiten, Mitarbeiterbereich
   ══════════════════════════════════════════════════════════════════════════ */
.summe-band {
    display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem; align-items: flex-end;
    padding: .9rem 1.2rem; margin-bottom: 1rem;
    background: var(--surface, #fff); border: 1px solid var(--border);
    border-left: 4px solid var(--gima-orange); border-radius: 8px;
}
.summe-band > div { display: flex; flex-direction: column; gap: .15rem; }
.summe-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted, #6c757d); }
.summe-wert { font-family: Poppins, "Open Sans", sans-serif; font-size: 1.7rem; font-weight: 600; color: var(--gima-orange); }

.hinweis-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.hinweis-liste li { padding: .45rem .7rem; border-radius: 6px; border-left: 3px solid var(--border); background: var(--surface-2, #f6f6f6); font-size: .9rem; }
.hinweis-liste .hinweis-marke { display: inline-block; min-width: 4.2rem; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; margin-right: .5rem; }
.hinweis-liste li.hinweis-fehler { border-left-color: var(--danger, #dc3545); background: rgba(220, 53, 69, .08); }
.hinweis-liste li.hinweis-fehler .hinweis-marke { color: var(--danger, #dc3545); }
.hinweis-liste li.hinweis-warnung { border-left-color: var(--warning, #f0ad4e); background: rgba(255, 193, 7, .10); }
.hinweis-liste li.hinweis-warnung .hinweis-marke { color: #b07800; }
.hinweis-liste li.hinweis-info .hinweis-marke { color: var(--text-muted, #6c757d); }

.badge-err { background: rgba(220, 53, 69, .12); color: var(--danger, #dc3545); border: 1px solid rgba(220, 53, 69, .4); }
.badge-muted { opacity: .8; }

.data-table .zahl, .data-table th.zahl { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.data-table .mitte, .data-table th.mitte { text-align: center; }
.data-table.kompakt td, .data-table.kompakt th { padding: .35rem .55rem; }
.data-table tfoot td { font-weight: 600; border-top: 2px solid var(--border); }
tr.zeile-auto td { background: rgba(230, 68, 22, .04); }
.zelle-eingabe { width: 100%; min-width: 6rem; padding: .25rem .4rem; border: 1px solid var(--border); border-radius: 4px; background: var(--bg); color: var(--text); font: inherit; font-size: .86rem; }
.zelle-schmal { min-width: 4.5rem; max-width: 7rem; text-align: right; }

.unterkarte { margin-top: 1rem; padding: .8rem 1rem; border: 1px dashed var(--border); border-radius: 8px; background: var(--surface-2, #fafafa); }
.unterkarte-titel { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted, #6c757d); margin-bottom: .5rem; }
.positions-form { display: flex; flex-wrap: wrap; gap: .5rem .7rem; align-items: flex-end; }
.positions-form .pf-feld { display: flex; flex-direction: column; gap: .2rem; flex: 1 1 8rem; }
.positions-form .pf-breit { flex: 2 1 12rem; }
.positions-form .pf-km { flex: 0 1 6rem; }
.positions-form .pf-knopf { flex: 0 0 auto; }
.positions-form label { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted, #6c757d); }
.positions-form input, .positions-form select { padding: .42rem .55rem; border: 1px solid var(--border); border-radius: 6px; background: var(--bg); color: var(--text); font: inherit; font-size: .9rem; }
.positions-form input:focus, .positions-form select:focus { outline: none; border-color: var(--gima-orange); box-shadow: 0 0 0 3px rgba(230, 68, 22, .15); }

.mz-tabelle input[type=checkbox] { width: 1.15rem; height: 1.15rem; accent-color: var(--gima-orange); }
.knopfreihe { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.knopfreihe form { margin: 0; }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .6rem 1rem; align-items: end; }
.check-inline { display: flex; gap: .45rem; align-items: center; margin: .35rem 0; font-size: .9rem; }

.beleg-vorschau { width: 100%; height: 75vh; border: 1px solid var(--border); border-radius: 6px; background: #fff; }
.beleg-bild { max-width: 100%; max-height: 80vh; border: 1px solid var(--border); border-radius: 6px; }
.beleg-kacheln { list-style: none; margin: 0 0 .8rem; padding: 0; display: flex; flex-direction: column; gap: .35rem; }
.beleg-kacheln li { display: flex; flex-wrap: wrap; gap: .3rem .8rem; align-items: center; padding: .4rem .6rem; border: 1px solid var(--border); border-radius: 6px; }
.upload-zone { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; padding: 1rem; border: 2px dashed var(--gima-orange); border-radius: 10px; background: rgba(230, 68, 22, .04); }
.upload-zone label { flex: 1 1 100%; }
.einreichen-karte { border-left: 4px solid var(--gima-orange); }
.einreichen-karte .btn-primary { font-size: 1.05rem; padding: .6rem 1.4rem; }
.karte-zuordnen { border-left: 4px solid var(--warning, #f0ad4e); }

@media (max-width: 640px) {
    .summe-wert { font-size: 1.4rem; }
    .positions-form .pf-feld { flex: 1 1 100%; }
    .beleg-vorschau { height: 60vh; }
}