/* src/public/style.css */
body { font-family: system-ui, sans-serif; margin: 0; color: #1a1a1a; }
header { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.5rem; background: #1a2b3c; color: white; }
.header-links { display: flex; align-items: center; gap: 0.6rem; min-width: 0; }
header .logo { color: white; text-decoration: none; font-weight: bold; white-space: nowrap; }
.header-sep { color: #8aa0b8; }
.header-termin { color: #fff; text-decoration: none; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.header-termin:hover { text-decoration: underline; }
header nav a, header nav span { color: white; margin-left: 1rem; }
main { padding: 1.5rem; max-width: 1400px; margin: 0 auto; }
table { border-collapse: collapse; width: 100%; margin: 1rem 0; }
th, td { border: 1px solid #ccc; padding: 0.4rem 0.6rem; text-align: right; }
th:first-child, td:first-child { text-align: left; }
.error { color: #b00020; }
.ok { color: #0a7d1e; }
.besser { background: #d7f5d7; }
.schlechter { background: #f8d7d7; }
input[type="number"] { width: 4.5rem; }

/* Schriftlicher Auswertungsbogen */
.bogen-wrap { overflow-x: auto; }

/* Jeder Bereich ist eine eigene Tabelle mit echter <h2>-Überschrift. Damit die
   Spalten über alle Bereichs-Tabellen bündig untereinander stehen, nutzen alle
   Tabellen dieselbe feste Spaltenaufteilung (colgroup + table-layout: fixed). */
table.bogen { table-layout: fixed; width: 100%; min-width: 40rem; margin: 0; }
table.bogen col.col-feldname { width: 16rem; }
table.bogen col.col-pruefling { width: auto; }
table.bogen .feld-name { text-align: left; white-space: nowrap; }
table.bogen .gebunden td:first-child { font-style: italic; }
table.bogen thead th { background: #f4f7fa; }
table.bogen .ergebnis-zeile td.feld-name { font-weight: bold; }
table.bogen .gesamt-zeile td.feld-name,
table.bogen .gesamt-status-zeile td.feld-name { font-weight: bold; }

/* Bereichsblock: echter Abstand zwischen den Bereichen + Header mit h2. */
.tg-block { margin-top: 1.75rem; }
.tg-block:first-of-type { margin-top: 0.5rem; }
.tg-header { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-bottom: 0.35rem; }
.tg-header h2 { margin: 0; font-size: 1.15rem; display: inline-flex; align-items: baseline; gap: 0.5rem; }

/* Gewichtung und Sperrfach für die Prüfer sichtbar machen. */
.tg-gewicht { font-size: 0.8rem; font-weight: normal; color: #fff; background: #5b6b7f;
  border-radius: 4px; padding: 0.05rem 0.4rem; }
.tg-sperrfach { font-size: 0.75rem; font-weight: bold; color: #b00020; background: #f8d7d7;
  border: 1px solid #e6a2a2; border-radius: 4px; padding: 0.05rem 0.4rem; letter-spacing: 0.02em; }

/* Bestehens-Färbung der Punkte-/Gesamt-Zellen (50%-Grenze je Bereich). */
table.bogen td.punkte-status { font-weight: bold; }
table.bogen td.punkte-status.bestanden { background: #d7f5d7; color: #0a5d1e; }
table.bogen td.punkte-status.durchgefallen { background: #f8d7d7; color: #8a0016; }
table.bogen td.gesamt-status { font-weight: bold; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 0.03em; }
table.bogen td.gesamt-status.bestanden { background: #b8ebc0; color: #0a5d1e; }
table.bogen td.gesamt-status.durchgefallen { background: #f4bcbc; color: #8a0016; }
table.bogen td.gesamt-status.mep { background: #ffe4a3; color: #7a5200; }
.gesamt-status-text { display: block; }
.mep-hinweis:not(:empty) { display: block; margin-top: 0.2rem; font-size: 0.72rem;
  font-weight: normal; text-transform: none; letter-spacing: 0; }

/* Punkt-Zelle: kein Padding, Eingabefeld füllt die ganze Zelle klickbar aus.
   Bei WISO liegt der Streich-Button absolut in der linken Ecke. */
/* Klick irgendwo in die Zelle fokussiert das Eingabefeld (JS in den calc-
   Skripten); die Zelle zeigt daher den Text-Cursor. */
table.bogen td.feld-zelle { padding: 0; position: relative; cursor: text; }
table.bogen .feld-input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  text-align: right;
  font: inherit;
  color: inherit;
  padding: 0.4rem 0.6rem;
  -moz-appearance: textfield;
  appearance: textfield;
  cursor: text;
}
/* Fremd-Werte nur zur Anzeige – Klicks darauf sollen ins Eingabefeld gehen. */
table.bogen .fremd-werte { pointer-events: none; }
/* Platz für den Streich-Button links schaffen (nur WISO-Zellen). */
table.bogen td.feld-zelle:has(.strich-btn) .feld-input { padding-left: 2rem; }
table.bogen .feld-input::-webkit-outer-spin-button,
table.bogen .feld-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
table.bogen .feld-input:focus {
  outline: none;
  background: transparent;
}

/* Anzahl-Feld in der Teilgebiets-Überschrift, mit eigenem Speichern-Button */
.anzahl-form { display: inline-flex; align-items: center; gap: 0.4rem; }
.anzahl-label { font-weight: normal; font-size: 0.85em; }
.anzahl-input { width: 3.5rem; }
.anzahl-speichern {
  font-size: 0.78rem;
  font-weight: normal;
  padding: 0.12rem 0.5rem;
  background: transparent;
  color: #567;
  border: 1px solid #b7c2d0;
  border-radius: 4px;
  cursor: pointer;
}
.anzahl-speichern:hover { background: #e7edf3; color: #1a2b3c; }

/* Streich-Button: nur ✗, kompakt, absolut in der linken Zellenecke */
.strich-btn { position: absolute; left: 0.35rem; top: 50%; transform: translateY(-50%);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  width: 1.4rem; height: 1.4rem; border: 1px solid #ccc; border-radius: 50%;
  font-size: 0.8rem; line-height: 1; color: #aaa; background: #fafafa; user-select: none; }
.strich-btn:hover { border-color: #b00020; color: #b00020; }
.strich-input { position: absolute; opacity: 0; width: 0; height: 0; }
.strich-btn.aktiv { background: #f8d7d7; border-color: #b00020; color: #b00020; font-weight: bold; }

/* Sichtbare Streichung einer Aufgabe (Zelle) */
td.zelle-gestrichen .feld-input { text-decoration: line-through; opacity: 0.5; }

/* Auto-Save-Status */
#autosave-status { min-height: 1.2em; }
#autosave-status.autosave-fehler { color: #b00020; font-weight: bold; }
.hinweis { color: #555; font-size: 0.9rem; }
.pruefling-nav { display: flex; gap: 0.4rem; flex-wrap: wrap; margin: 0.5rem 0 1rem; }
.pruefling-nav a { padding: 0.2rem 0.6rem; border: 1px solid #ccc; border-radius: 4px; text-decoration: none; color: #1a2b3c; }
.pruefling-nav a.aktiv { background: #1a2b3c; color: white; }
.tg-block { margin: 1.5rem 0; }
.tg-block h2 { margin-bottom: 0.3rem; }

/* Fachgespräch-Bogen: je Bereich eine eigene Tabelle mit Bewertungszeilen. */
.fg-skala-legende { display: flex; flex-wrap: wrap; gap: 0.2rem 0.9rem; align-items: baseline; }
.fg-skala-legende-item { white-space: nowrap; }

.fg-bereich { margin: 1.5rem 0; }
.fg-bereich:first-of-type { margin-top: 0.5rem; }
/* Bereichstitel dezent: kleiner, normale Schriftstärke. */
.fg-bereich-header h3 { margin: 0 0 0.35rem; font-size: 0.95rem; font-weight: normal;
  color: #445; display: inline-flex; align-items: center; gap: 0.45rem; }
.fg-bereich-name { font-weight: 600; color: #1a2b3c; }
.fg-beschreibung { margin: 0 0 0.5rem; font-size: 0.82rem; font-style: italic; color: #555; }
.fg-info { width: 1.1rem; height: 1.1rem; border-radius: 50%; cursor: pointer;
  border: none; background: transparent; color: #aab3bd; font-size: 0.72rem;
  font-weight: bold; line-height: 1; padding: 0; }
.fg-info:hover, .fg-info[aria-expanded="true"] { color: #5b6b7f; }
.fg-faktor-badge { font-size: 0.72rem; font-weight: normal; color: #667;
  background: #eef2f7; border-radius: 4px; padding: 0.05rem 0.4rem; }

table.fg-tabelle { table-layout: fixed; width: 100%; min-width: 48rem; }
table.fg-tabelle col.fg-col-nr { width: 3rem; }
table.fg-tabelle col.fg-col-thema { width: 30%; }
table.fg-tabelle col.fg-col-begruendung { width: auto; }
table.fg-tabelle col.fg-col-skala { width: 11rem; }
table.fg-tabelle thead th { background: #f7f9fb; text-align: left;
  font-weight: normal; font-size: 0.78rem; color: #778; text-transform: none;
  letter-spacing: 0; padding: 0.3rem 0.5rem; }
table.fg-tabelle th.fg-th-nr, table.fg-tabelle td.fg-zeile-nr { text-align: center; }
table.fg-tabelle td.fg-zeile-nr { vertical-align: top; color: #667;
  display: flex; align-items: baseline; justify-content: center; gap: 0.3rem; padding-top: 0.45rem; }
/* Kleiner Löschen-Button je Protokoll-Zeile (dezent, deutlicher beim Hover). */
.fg-zeile-del { border: none; background: transparent; cursor: pointer; padding: 0;
  font-size: 0.75rem; line-height: 1; color: #c3ccd6; }
.fg-zeile:hover .fg-zeile-del { color: #99a3ad; }
.fg-zeile-del:hover { color: #b00020; }

/* Text-Zellen: Auto-Grow-Textfeld ohne Kasten-Optik, füllt die Zelle. */
td.fg-zelle { padding: 0; vertical-align: top; }
.fg-thema, .fg-begruendung { display: block; width: 100%; box-sizing: border-box;
  font: inherit; color: inherit; border: none; background: transparent;
  resize: none; overflow: hidden; padding: 0.4rem 0.5rem; line-height: 1.4; }
.fg-thema:focus, .fg-begruendung:focus { outline: 2px solid #7c5cff;
  outline-offset: -2px; background: #f3f0ff; }

/* Skala-Wahl je Zeile (fünf Stufen). */
td.fg-skala-zelle { vertical-align: top; }
.fg-skala-wahl { display: flex; gap: 0.15rem; flex-wrap: nowrap; }
.fg-skala-btn { cursor: pointer; border: 1px solid #ccc; background: #fafafa;
  color: #667; border-radius: 4px; padding: 0.15rem 0; font-size: 0.75rem;
  line-height: 1.1; flex: 1 1 0; min-width: 0; }
.fg-skala-btn:hover { border-color: #7c5cff; color: #1a2b3c; }
/* Aktive Stufe hervorheben: hoch=grün, mittel=neutral, niedrig=rot. */
.fg-zeile[data-skala="pp"] .fg-skala-btn[data-skala="pp"],
.fg-zeile[data-skala="p"] .fg-skala-btn[data-skala="p"] {
  background: #d7f5d7; border-color: #0a7d1e; color: #0a5d1e; font-weight: bold; }
.fg-zeile[data-skala="null"] .fg-skala-btn[data-skala="null"] {
  background: #e7edf3; border-color: #5b6b7f; color: #1a2b3c; font-weight: bold; }
.fg-zeile[data-skala="m"] .fg-skala-btn[data-skala="m"],
.fg-zeile[data-skala="mm"] .fg-skala-btn[data-skala="mm"] {
  background: #f8d7d7; border-color: #b00020; color: #8a0016; font-weight: bold; }

/* +Zeile und Bereichs-Ergebniszeile. */
.fg-zeile-add { font-size: 0.75rem; padding: 0.1rem 0.2rem; background: transparent;
  color: #99a3ad; border: none; cursor: pointer; }
.fg-zeile-add:hover { color: #5b6b7f; text-decoration: underline; }
/* Bereichsergebnis-Zeile: links "+ Zeile", rechts "Ergebnis <Punkte>". */
table.fg-tabelle .fg-bereich-ergebnis td { background: #f7f9fb; }
table.fg-tabelle td.fg-bereich-punkte { text-align: right; white-space: nowrap; }
.fg-ergebnis-label { font-size: 0.8rem; color: #778; }
.fg-ergebnis-wert {
  font-weight: 600; font-size: 1rem; color: #1a2b3c; margin-left: 0.3rem;
  cursor: pointer; border-radius: 4px; padding: 0 0.3rem;
  min-width: 1.4em; display: inline-block; text-align: right;
}
.fg-ergebnis-wert:hover { background: #e7edf3; }
.fg-ergebnis-wert.fg-ergebnis-edit {
  cursor: text; background: #fff; outline: 2px solid #4a7bd0; outline-offset: 0;
}
/* Manuell überschriebener Bereich: Wert hervorheben. */
.fg-bereich-punkte.fg-override .fg-ergebnis-wert { color: #b8620a; }
.fg-bereich-punkte.fg-override .fg-ergebnis-label::after {
  content: " (manuell)"; font-size: 0.72rem; color: #b8620a;
}

/* Gesamt-/Statuszeile: erbt fg-tabelle (gleiche Spaltenbreiten wie die
   Bereichstabellen). Ergebnis-/Statuswert steht in der letzten Spalte. */
table.fg-gesamt-tabelle .feld-name { font-weight: bold; }
table.fg-gesamt-tabelle .fg-gesamt { text-align: right; font-weight: bold; }
table.fg-gesamt-tabelle .fg-status { white-space: normal; text-align: right; }
.fg-status-text { display: block; }
.fg-note { display: block; margin-top: 0.2rem; font-size: 0.72rem; font-weight: normal;
  text-transform: none; letter-spacing: 0; }

/* Dashboard-Ergebnistabelle */
.ergebnis-tabelle th, .ergebnis-tabelle td {
  padding: 0.4rem 0.6rem; text-align: center; border-bottom: 1px solid #e0e6ec; }
.ergebnis-tabelle th:first-child, .ergebnis-tabelle td:first-child { text-align: left; }
.ergebnis-tabelle thead th { background: #f4f7fa; }
.ergebnis-tabelle td.ok, .ergebnis-tabelle td.error { font-weight: 600; }
.mep-moeglich { color: #8a6d00; font-weight: 600; cursor: help; }

/* Kritischer Bereichswert (< 50) – rot markiert wie in der Matrix. */
.ergebnis-tabelle td.zelle-krit { background: #f8d7d7; color: #8a0016; font-weight: 600; }
/* Marker für aus dem Vortermin übernommene Werte (Wiederholer). */
.ueb-mark { display: inline-block; margin-left: 0.2rem; font-size: 0.65rem; font-weight: 700;
  color: #556; background: #e7edf3; border-radius: 3px; padding: 0 0.2rem; vertical-align: super; cursor: help; }

/* Status-Spalte: farbige Pille + Kurzbegründung. */
.status-zelle { text-align: left; }
.status-pille { display: inline-block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.02em;
  text-transform: uppercase; border-radius: 4px; padding: 0.1rem 0.5rem; white-space: nowrap; }
.status-ok { background: #d7f5d7; color: #0a5d1e; }
.status-fail { background: #f8d7d7; color: #8a0016; }
.status-offen { background: #eef2f7; color: #556; }
.status-grund { display: block; margin-top: 0.2rem; font-size: 0.75rem; color: #667; line-height: 1.3; }

/* Mündliche Ergänzungsprüfung: Bereichswahl */
.mep-bereichswahl { margin: 1rem 0; }
.mep-bereich-optionen { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.mep-bereich-option {
  display: flex; flex-direction: column; gap: 0.15rem;
  border: 1px solid #ccd; border-radius: 6px; padding: 0.5rem 0.8rem;
  cursor: pointer; min-width: 12rem;
}
.mep-bereich-option:hover { border-color: #7c5cff; }
.mep-bereich-option:has(input:checked) { border-color: #7c5cff; background: #f4f1ff; }
.mep-bereich-option .mep-bereich-name { font-weight: 600; }
.mep-muendlich-wert, .mep-bereich-nach { font-weight: 600; }

.vergangene { margin-top: 2rem; }
.vergangene details { margin: 0.5rem 0; }
.vergangene summary { cursor: pointer; font-weight: 600; padding: 0.3rem 0; }

/* Dashboard: Prüfungs-Karten über die volle Breite mit Fortschritt. */
.termin-liste { display: flex; flex-direction: column; gap: 0.75rem; margin: 0.75rem 0 1.5rem; }
.termin-karte { display: block; text-decoration: none; color: #1a2b3c;
  border: 1px solid #d7dde4; border-radius: 8px; background: #fff; padding: 1rem 1.25rem;
  transition: border-color 0.08s ease, box-shadow 0.08s ease; }
.termin-karte:hover { border-color: #1a2b3c; box-shadow: 0 1px 4px rgba(26,43,60,0.08); }
.termin-karte-kopf { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; }
.termin-karte-name { font-weight: 700; font-size: 1.1rem; }
.termin-karte-anzahl { margin-left: auto; font-size: 0.85rem; color: #667; }
.termin-karte-leer { margin: 0.6rem 0 0; font-size: 0.9rem; color: #778; }

.termin-fortschritt { position: relative; display: flex; align-items: center; gap: 0.5rem;
  margin: 0.7rem 0 0.6rem; }
.termin-fortschritt::before { content: ''; flex: 1; height: 0.6rem;
  background: #eef2f7; border-radius: 999px;
  background-image: linear-gradient(#1a2b3c, #1a2b3c); background-repeat: no-repeat;
  background-size: var(--fortschritt, 0%) 100%; }
.termin-fortschritt-text { font-size: 0.78rem; font-weight: 700; color: #1a2b3c; min-width: 2.5rem; text-align: right; }

.termin-kennzahlen { display: flex; flex-wrap: wrap; gap: 0.4rem 1.75rem; margin-top: 0.4rem; }
.kennzahl { display: flex; flex-direction: column; gap: 0.05rem; }
.kennzahl-label { font-size: 0.72rem; color: #778; text-transform: uppercase; letter-spacing: 0.02em; }
.kennzahl-wert { font-size: 1.05rem; font-weight: 700; display: inline-flex; gap: 0.3rem; align-items: center; }
.pill { font-size: 0.8rem; font-weight: 700; border-radius: 4px; padding: 0.05rem 0.4rem; }
.pill-ok { background: #d7f5d7; color: #0a5d1e; }
.pill-fail { background: #f8d7d7; color: #8a0016; }
.pill-offen { background: #eef2f7; color: #556; }

/* Brotkrumen */
.brotkrumen { font-size: 0.85rem; color: #667; margin-bottom: 0.5rem; }
.brotkrumen a { color: #1a2b3c; text-decoration: none; }
.brotkrumen a:hover { text-decoration: underline; }

/* Prüfungs-Typ-Badge */
.art-badge { display: inline-block; font-size: 0.75rem; font-weight: 600;
  border-radius: 4px; padding: 0.05rem 0.45rem; letter-spacing: 0.02em; vertical-align: middle; }
.art-abschluss { background: #e3ecf6; color: #1a2b3c; border: 1px solid #b9cde3; }
.art-zwischen { background: #eef2f7; color: #556; border: 1px solid #cdd6e0; }

/* Prüfungs-Liste auf dem Dashboard */
.pruefung-liste { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0.5rem 0 1.5rem; }
.pruefung-karte { display: flex; align-items: center; gap: 0.6rem;
  padding: 0.6rem 0.9rem; border: 1px solid #ccc; border-radius: 6px;
  text-decoration: none; color: #1a2b3c; background: #fff; }
.pruefung-karte:hover { border-color: #1a2b3c; }
.pruefung-karte-name { font-weight: 600; }

/* Bereichs-Links auf der Prüfungs-Übersicht */
.bereich-links { display: flex; flex-wrap: wrap; gap: 0.8rem; margin: 1.25rem 0 1.75rem; }
.bereich-karte { display: flex; flex-direction: column; gap: 0.25rem; min-width: 13rem; flex: 1 1 13rem;
  max-width: 20rem;
  padding: 1.1rem 1.2rem; border-radius: 8px;
  background: #1a2b3c; text-decoration: none; color: #fff;
  transition: background-color 0.08s ease; }
.bereich-karte:hover { background: #2c4360; }
.bereich-karte-name { font-weight: 700; font-size: 1.05rem; color: #fff; }
.bereich-karte-hinweis { font-size: 0.82rem; color: #c3d0de; }

/* In Vorbereitung: zurückgenommen (gedämpftes Blau). */
.bereich-karte--offen { background: #55677a; }
.bereich-karte--offen:hover { background: #63768a; }
.bereich-karte--offen .bereich-karte-hinweis { color: #d8e0ea; }

/* Finalisierung: abhängiger Schritt der schriftlichen Prüfung – eingerückt. */
.bereich-karte--unter { margin-left: 0.5rem; }

/* Kompakte Bereichs-Navigation (schlanke Reiter) auf den Arbeitsseiten. */
.bereich-nav { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.5rem 0 1.25rem; }
.bereich-tab { padding: 0.35rem 0.85rem; border-radius: 6px;
  background: #e7ecf2; color: #1a2b3c; text-decoration: none;
  font-size: 0.9rem; font-weight: 600; transition: background-color 0.08s ease; }
.bereich-tab:hover { background: #d4dce6; }
.bereich-tab.aktiv { background: #1a2b3c; color: #fff; }
.bereich-tab.aktiv:hover { background: #2c4360; }
.bereich-tab--offen { color: #7a8694; }

/* Prüfung-anlegen-Formular */
.pruefung-neu { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.6rem; margin: 0.5rem 0; }
.pruefung-neu label { display: flex; flex-direction: column; font-size: 0.85rem; gap: 0.15rem; }

/* Prüfer-getrennte schriftliche Bewertung */
.eigene-bewertung-hinweis { background: #eef4fb; border: 1px solid #cdd6e0; border-radius: 6px;
  padding: 0.5rem 0.75rem; font-size: 0.9rem; margin: 0.5rem 0; }
/* Bewertungen der anderen Prüfer: rechtsbündig unter dem eigenen Wert, bei
   mehreren Prüfern direkt nebeneinander. */
.fremd-werte { display: flex; flex-wrap: wrap; justify-content: flex-end;
  gap: 0.2rem; margin-top: 0.15rem; padding: 0 0.6rem 0.2rem; }
.fremd-wert { font-size: 0.72rem; color: #667; background: #f0f0f0; border-radius: 3px;
  padding: 0 0.3rem; cursor: help; }

/* Einstellungen auf der Prüfungs-Übersicht */
.einstellungen { margin: 1rem 0; padding: 0.6rem 0.9rem; border: 1px solid #e0e0e0;
  border-radius: 6px; background: #fafafa; }
.einstellungen form { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.toggle-label { font-size: 0.9rem; }

/* Finalisierung */
.final-kopf { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.final-spalte { background: #eef4fb; }
th.final-spalte { border-bottom: 2px solid #1a2b3c; }
.feld-zelle.read-only { text-align: center; color: #556; background: #fafafa; }
.final-badge { font-size: 0.8rem; font-weight: 600; border-radius: 4px; padding: 0.1rem 0.5rem; }
.final-badge--zu { background: #fde9c8; color: #8a5a00; border: 1px solid #e6c78a; }
.feld-input.gesperrt { background: #f0f0f0; color: #888; }

/* Vorausgefüllter Prüfer-Durchschnitt (noch nicht final): deutlich abgesetzt –
   gedämpfte Farbe, kursiv, zarter Hintergrund. Wird beim Bestätigen/Ändern
   (Klasse entfernt) zur normalen finalen Optik. */
table.bogen .feld-input.feld-vorschlag { color: #8a6d00; font-style: italic; background: #fffbe9; }
table.bogen .feld-input.feld-vorschlag:focus { color: inherit; font-style: normal; background: transparent; }
.final-vorschlag-legende { display: flex; align-items: center; gap: 0.4rem; }
.vorschlag-muster { display: inline-block; color: #8a6d00; font-style: italic;
  background: #fffbe9; border: 1px solid #e6d9a2; border-radius: 4px; padding: 0 0.4rem; font-weight: 600; }

/* Wiederverwendbare Buttons (passend zur dunkelblauen Design-Sprache). */
.btn { display: inline-block; font: inherit; font-weight: 600; font-size: 0.9rem;
  padding: 0.45rem 0.9rem; border-radius: 6px; cursor: pointer;
  border: 1px solid #c3cdd8; background: #fff; color: #1a2b3c;
  text-decoration: none; transition: background-color 0.08s ease, border-color 0.08s ease; }
.btn:hover { background: #eef2f7; border-color: #1a2b3c; }
.btn-primary { background: #1a2b3c; border-color: #1a2b3c; color: #fff; }
.btn-primary:hover { background: #2c4360; border-color: #2c4360; }

/* Verwaltungsseite (admin/index) */
.admin-block { margin-bottom: 2rem; }
.admin-liste { list-style: none; padding: 0; margin: 0.75rem 0 1rem;
  display: flex; flex-direction: column; gap: 0.5rem; }
.admin-karte { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap;
  padding: 0.7rem 1rem; border: 1px solid #d7dde4; border-radius: 8px; background: #fff; }
.admin-karte-titel { font-weight: 600; color: #1a2b3c; text-decoration: none; }
a.admin-karte-titel:hover { text-decoration: underline; }
.admin-karte .status-aktiv { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em;
  color: #0a5d1e; background: #d7f5d7; border: 1px solid #a9dbb4; border-radius: 4px; padding: 0.05rem 0.4rem; }
.admin-karte .admin-aktion { margin-left: auto; font-size: 0.88rem; font-weight: 600;
  color: #1a2b3c; text-decoration: none; white-space: nowrap; }
.admin-karte .admin-aktion:hover { text-decoration: underline; }
.pruefer-meta { color: #667; font-size: 0.88rem; }
.rolle-badge { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em;
  border-radius: 4px; padding: 0.05rem 0.45rem; }
/* Rolle-Badge nach rechts, wenn keine Inline-Aktion folgt (Prüfer-Liste ohne
   Reset-Button gibt es nicht mehr; hier bleibt sie direkt bei den Meta-Daten). */
.admin-karte .rolle-badge:last-child { margin-left: auto; }
.rolle-admin { background: #e3ecf6; color: #1a2b3c; border: 1px solid #b9cde3; }
.rolle-pruefer { background: #eef2f7; color: #556; border: 1px solid #cdd6e0; }

/* Prüfung-anlegen-Formular: Karten-Optik */
.pruefung-neu { align-items: flex-end; padding: 0.9rem 1rem; border: 1px solid #d7dde4;
  border-radius: 8px; background: #fafbfc; }
.pruefung-neu select, .pruefung-neu input[type="text"] {
  font: inherit; height: 2.25rem; box-sizing: border-box;
  padding: 0 0.55rem; border: 1px solid #c3cdd8; border-radius: 6px; background: #fff; }
.pruefung-neu .btn { height: 2.25rem; box-sizing: border-box;
  display: inline-flex; align-items: center; }

/* Kleiner Sekundär-Button (Inline-Aktionen in Karten) */
.btn-klein { font-size: 0.8rem; padding: 0.3rem 0.6rem; }
.admin-inline-form { margin: 0; margin-left: auto; }
.admin-karte .admin-inline-form { margin-left: auto; }
.inline-label { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.9rem; }
.inline-label select { font: inherit; height: 2.25rem; box-sizing: border-box;
  padding: 0 0.55rem; border: 1px solid #c3cdd8; border-radius: 6px; background: #fff; }
.admin-unter { font-size: 1rem; margin: 1.25rem 0 0.5rem; }

/* Wiederholer-Import: Kandidatenliste mit offenen/übernommenen Teilen. */
.import-karte { flex-wrap: wrap; }
.import-wahl { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.import-teile { display: flex; flex-wrap: wrap; gap: 0.3rem 1rem; margin-left: auto; font-size: 0.8rem; }
.teil-gruppe { color: #667; display: inline-flex; flex-wrap: wrap; gap: 0.25rem; align-items: baseline; }
.teil { font-size: 0.72rem; font-weight: 600; border-radius: 4px; padding: 0.05rem 0.4rem; }
.teil-offen { background: #f8d7d7; color: #8a0016; }
.teil-ok { background: #d7f5d7; color: #0a5d1e; }

/* Einmalig angezeigter Einladungs-/Reset-Link */
.link-box { border: 1px solid #b9cde3; background: #eef4fb; border-radius: 8px;
  padding: 0.9rem 1rem; margin: 0.75rem 0 1.25rem; }
.link-box p { margin: 0 0 0.5rem; }
.link-feld { width: 100%; box-sizing: border-box; font: inherit; font-size: 0.85rem;
  padding: 0.5rem 0.6rem; border: 1px solid #c3cdd8; border-radius: 6px; background: #fff; }

/* Vertikales Formular (Login, Registrieren, Passwort) */
.stack-form { display: flex; flex-direction: column; gap: 0.85rem; max-width: 22rem; margin: 1rem 0; }
.stack-form label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.9rem; font-weight: 600; }
.stack-form input, .stack-form select {
  font: inherit; font-weight: normal; height: 2.4rem; box-sizing: border-box;
  padding: 0 0.6rem; border: 1px solid #c3cdd8; border-radius: 6px; background: #fff; }
.stack-form input:focus, .stack-form select:focus {
  outline: 2px solid #7c5cff; outline-offset: -1px; }
.stack-form .btn { align-self: flex-start; margin-top: 0.25rem; }

/* Stammdaten-Formular (Prüfling anlegen) */
.stamm-neu { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; margin: 0.75rem 0; }
.stamm-neu input[type="text"] {
  font: inherit; height: 2.25rem; box-sizing: border-box;
  padding: 0 0.55rem; border: 1px solid #c3cdd8; border-radius: 6px; min-width: 12rem; }
.stamm-neu .btn { height: 2.25rem; box-sizing: border-box;
  display: inline-flex; align-items: center; }