/* Einweisungstool-Prototyp — bewusst schlichtes, portal-taugliches Stylesheet.
   Klinisch-sachlich: helle Flächen, eine Akzentfarbe, keine Spielereien. */

:root {
  --akzent: #1d5fad;
  --akzent-dunkel: #174c8b;
  --text: #1f2937;
  --text-gedimmt: #6b7280;
  --linie: #d1d5db;
  --flaeche: #f3f4f6;
  --warnung: #b91c1c;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--text);
  background: var(--flaeche);
  font-size: 16px;
  line-height: 1.5;
}

h1 { font-size: 1.5rem; margin: 0 0 .5rem; }
h2 { font-size: 1.15rem; margin: 0 0 .25rem; }
a { color: var(--akzent); }

/* Kopfleiste */
.kopfleiste {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  background: #fff;
  border-bottom: 2px solid var(--akzent);
  padding: .6rem 1.25rem;
}
.kopf-titel strong { font-size: 1.1rem; }
.prototyp-hinweis {
  margin-left: .75rem;
  font-size: .8rem;
  color: var(--text-gedimmt);
}
.kopf-identitaet {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
}
.kopf-identitaet form { margin: 0; }

/* Raster: Navigation links, Inhalt rechts */
.seitenraster {
  display: grid;
  grid-template-columns: 250px 1fr;
  gap: 1.25rem;
  padding: 1.25rem;
  max-width: 1280px;
  margin: 0 auto;
}
.seitenraster.ohne-navigation { grid-template-columns: 1fr; }

.seitennavigation {
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .75rem;
  align-self: start;
}
.nav-sektion + .nav-sektion { margin-top: .9rem; }
.nav-sektion-titel {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-gedimmt);
  margin-bottom: .25rem;
}
.nav-eintrag {
  display: block;
  padding: .25rem .4rem;
  border-radius: 4px;
  text-decoration: none;
  font-size: .95rem;
}
a.nav-eintrag:hover { background: var(--flaeche); }
.nav-folgt { color: var(--text-gedimmt); cursor: default; }
.nav-folgt em {
  font-style: normal;
  font-size: .7rem;
  border: 1px solid var(--linie);
  border-radius: 3px;
  padding: 0 .25rem;
  margin-left: .25rem;
}

.inhalt { min-width: 0; }
.erlaeuterung { color: var(--text-gedimmt); max-width: 60ch; }
.zwischentitel { margin-top: 1.5rem; }

/* Karten */
.kartenraster {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: .9rem;
  margin-top: .75rem;
}
.rollenkarte, .infokarte {
  display: block;
  width: 100%;
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .9rem 1rem;
  text-decoration: none;
  color: inherit;
  text-align: left;
}
.rollenkarte:hover { border-color: var(--akzent); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.rollenkarte h2 { color: var(--akzent); }
.rollenkarte p, .infokarte p { margin: .25rem 0 0; color: var(--text-gedimmt); font-size: .9rem; }
.personenkarte { cursor: pointer; font: inherit; }
.infokarte h2 { font-size: 1.6rem; }

/* Knöpfe — genau ein Primär-Knopf je Seite (UI-Regel 2) */
.knopf {
  font: inherit;
  border-radius: 4px;
  padding: .35rem .9rem;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}
.knopf-primaer {
  background: var(--akzent);
  border: 1px solid var(--akzent);
  color: #fff;
}
.knopf-primaer:hover { background: var(--akzent-dunkel); }
.knopf-sekundaer {
  background: #fff;
  border: 1px solid var(--linie);
  color: var(--text);
}
.knopf-sekundaer:hover { border-color: var(--text-gedimmt); }

/* Tabellen (Listen-Pattern) */
.datentabelle {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  margin-top: .75rem;
}
.datentabelle th, .datentabelle td {
  text-align: left;
  padding: .45rem .6rem;
  border-bottom: 1px solid var(--linie);
  font-size: .95rem;
}
.datentabelle th { background: var(--flaeche); font-weight: 600; }
.datentabelle tr:last-child td { border-bottom: none; }
.datentabelle form { margin: 0; }

.suchfeld {
  font: inherit;
  width: 100%;
  max-width: 28rem;
  padding: .45rem .6rem;
  border: 1px solid var(--linie);
  border-radius: 4px;
  margin-top: .5rem;
}
.suchfeld:focus { outline: 2px solid var(--akzent); border-color: var(--akzent); }

.schlichte-liste { background: #fff; border: 1px solid var(--linie); border-radius: 6px; padding: .75rem 1rem .75rem 2rem; margin-top: .75rem; }
.schlichte-liste li { padding: .15rem 0; }

/* Controlling-Matrix (M11) */
.matrix-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
}
.filterzeile {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .5rem .75rem;
  margin-bottom: .6rem;
}
.filter-umschalter { display: flex; align-items: center; gap: .4rem; cursor: pointer; }
.filter-hinweis { color: var(--text-gedimmt); font-size: .85rem; }

.matrix-rahmen {
  overflow: auto;
  max-height: 72vh;
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
}
.matrixtabelle { border-collapse: separate; border-spacing: 0; width: 100%; }
.matrixtabelle th, .matrixtabelle td {
  border-bottom: 1px solid var(--linie);
  padding: .35rem .5rem;
  font-size: .9rem;
  white-space: nowrap;
}
.matrixtabelle thead th {
  position: sticky;
  top: 0;
  background: var(--flaeche);
  z-index: 2;
  text-align: left;
}
.matrixtabelle .spalte-fest {
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 1;
  min-width: 230px;
  border-right: 1px solid var(--linie);
}
.matrixtabelle thead .spalte-fest { background: var(--flaeche); z-index: 60; }

/* GEK-Spaltenköpfe um 45° gedreht (kompakte Darstellung, Maskenflüsse §4) */
.matrixtabelle th.gek-kopf {
  height: 8.5rem;
  width: 2.4rem;
  min-width: 2.4rem;
  max-width: 2.4rem;
  vertical-align: bottom;
  padding: 0 0 .4rem 0;
}
.gek-dreh {
  transform: translateX(1.1rem) rotate(315deg);
  transform-origin: bottom left;
  width: 0;
  white-space: nowrap;
  line-height: 1;
}
.gek-dreh span {
  display: inline-block;
  max-width: 10.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: .78rem;
  font-weight: 600;
  vertical-align: bottom;
}
.gek-abschluss { min-width: 7rem; }

.gruppenzeile { cursor: pointer; }
.gruppenzeile .spalte-fest, .gruppenzeile td { background: var(--flaeche); }
.gruppenzeile:hover td { background: #e8edf3; }
.klapppfeil { display: inline-block; width: 1rem; color: var(--text-gedimmt); }
.gruppen-detail { color: var(--text-gedimmt); font-size: .8rem; margin-left: .4rem; }
.aggregat { text-align: center; color: var(--text-gedimmt); font-size: .78rem; padding: .3rem .25rem; }
.aggregat-offen span { font-weight: 600; color: var(--warnung); }

.personenzeile .zelle { text-align: center; cursor: pointer; padding: .3rem .25rem; }
.personenzeile .zelle:hover { background: var(--flaeche); }
.personen-name { padding-left: 1.6rem; }
.leerhinweis td { color: var(--text-gedimmt); font-style: italic; cursor: default; }

/* Zell-Symbole: Kasten (Bedarf), Haken (bestätigt), Umrisshaken (in Arbeit) */
.sym {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.05rem;
  height: 1.05rem;
  vertical-align: middle;
}
.sym-kasten { border: 1.5px solid var(--text-gedimmt); border-radius: 3px; }
.sym-haken { color: var(--akzent); font-weight: 700; line-height: 1; }
.sym-umriss { color: #b3bac4; }
.sym-fabrik { margin-left: .15rem; font-size: .85rem; vertical-align: middle; }

/* Seitenpanel (Zell-Detail) */
.zellpanel:empty { display: none; }
.zellpanel { width: 330px; }
.panel-karte {
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .9rem 1rem;
  position: sticky;
  top: 1rem;
  max-height: 85vh;
  overflow-y: auto;
}
.panel-kopf { display: flex; justify-content: space-between; gap: .5rem; align-items: start; }
.panel-untertitel { margin: .1rem 0 0; color: var(--text-gedimmt); font-size: .9rem; }
.panel-abschnitt {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-gedimmt);
  margin: 1rem 0 .25rem;
}
.panel-karte p { margin: .2rem 0; font-size: .9rem; }
.panel-liste { list-style: none; margin: 0; padding: 0; }
.panel-liste li { padding: .45rem 0; border-bottom: 1px solid var(--linie); font-size: .9rem; }
.panel-liste li:last-child { border-bottom: none; }
.panel-liste li.storniert { color: var(--text-gedimmt); text-decoration: line-through; }
.panel-liste li.storniert .storno-grund { text-decoration: none; display: inline-block; }
.storno-grund { color: var(--warnung); font-size: .85rem; }
.panel-dokument { color: var(--text-gedimmt); font-size: .85rem; }
.panel-aktionen { display: flex; gap: .5rem; margin-top: 1rem; flex-wrap: wrap; }
.knopf-inaktiv { opacity: .55; cursor: default; }
.knopf-inaktiv em {
  font-style: normal;
  font-size: .7rem;
  border: 1px solid currentColor;
  border-radius: 3px;
  padding: 0 .25rem;
  margin-left: .25rem;
}

/* Wizard (Erfassungsflüsse, Maskenflüsse §0) */
.wizard { max-width: 880px; }
.wizard-kopf {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  flex-wrap: wrap;
}
.wizard-fortschritt { color: var(--text-gedimmt); font-size: .9rem; white-space: nowrap; }
.wizard-frage { margin-top: .75rem; }
.wizard-leiste {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  margin-top: 1.25rem;
  padding-top: .75rem;
  border-top: 1px solid var(--linie);
}
.wizard-leiste-rechts { display: flex; gap: .5rem; }
.fehlerkasten {
  background: #fef2f2;
  border: 1px solid var(--warnung);
  color: var(--warnung);
  border-radius: 6px;
  padding: .6rem .9rem;
  margin: .75rem 0;
}
.hinweiskasten {
  background: #fffbeb;
  border: 1px solid #d97706;
  border-radius: 6px;
  padding: .6rem .9rem;
  margin: .75rem 0;
  max-width: 60ch;
}
.erfolgskasten {
  background: #f0fdf4;
  border: 1px solid #15803d;
  border-radius: 6px;
  padding: 1rem 1.25rem;
  max-width: 60ch;
}
.erfolgskasten h1 { color: #15803d; }

/* GEK-Kacheln (Schritt „Was wurde eingewiesen?") */
.kachelraster {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: .6rem;
  margin-top: .75rem;
}
.gek-kachel {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: .6rem;
  align-items: start;
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .6rem .75rem;
  cursor: pointer;
}
.gek-kachel:hover { border-color: var(--akzent); }
.gek-kachel:has(input:checked) {
  border-color: var(--akzent);
  outline: 1px solid var(--akzent);
  background: #f4f8fc;
}
.gek-kachel input { grid-row: 1 / span 2; margin-top: .2rem; }
.gek-kachel-name { font-weight: 600; }
.gek-kachel-detail { grid-column: 2; color: var(--text-gedimmt); font-size: .82rem; }

/* Auswahllisten (Radio-Listen, z. B. „Wer hat eingewiesen?") */
.auswahlliste {
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  margin-top: .75rem;
  max-height: 50vh;
  overflow-y: auto;
}
.auswahlzeile {
  display: flex;
  gap: .6rem;
  align-items: baseline;
  padding: .5rem .75rem;
  border-bottom: 1px solid var(--linie);
  cursor: pointer;
}
.auswahlzeile:last-child { border-bottom: none; }
.auswahlzeile:hover { background: var(--flaeche); }
.auswahl-detail { color: var(--text-gedimmt); font-size: .85rem; margin-left: .4rem; }

/* Formularfelder */
.feldgruppe { margin-top: .9rem; max-width: 26rem; }
.feldgruppe label, .feldgruppe-titel { display: block; margin-bottom: .25rem; font-size: .9rem; }
.feldgruppe input {
  font: inherit;
  width: 100%;
  padding: .45rem .6rem;
  border: 1px solid var(--linie);
  border-radius: 4px;
  background: #fff;
}
.feldgruppe input:focus { outline: 2px solid var(--akzent); border-color: var(--akzent); }
.formatwahl { display: flex; gap: .5rem; }
.formatknopf input { position: absolute; opacity: 0; }
.formatknopf span {
  display: inline-block;
  border: 1px solid var(--linie);
  border-radius: 4px;
  padding: .35rem 1.1rem;
  background: #fff;
  cursor: pointer;
}
.formatknopf:has(input:checked) span {
  background: var(--akzent);
  border-color: var(--akzent);
  color: #fff;
}

/* Teilnehmer-Korb (Chip-Leiste) */
.korb {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .5rem .75rem;
  margin: .75rem 0 .6rem;
  min-height: 2.4rem;
}
.korb-anzahl { font-weight: 600; font-size: .9rem; margin-right: .25rem; }
.korb-leer { color: var(--text-gedimmt); font-size: .9rem; }
.chip {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  background: #eaf1f9;
  border: 1px solid var(--akzent);
  border-radius: 99px;
  padding: .1rem .3rem .1rem .7rem;
  font-size: .85rem;
}
.chip-entfernen {
  font: inherit;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--akzent);
  font-weight: 700;
  padding: 0 .3rem;
}
.chip-entfernen:hover { color: var(--warnung); }

/* Listenrahmen + Filterzeile in Tabellenköpfen */
.listenrahmen {
  overflow: auto;
  max-height: 55vh;
  border-radius: 6px;
}
.listenrahmen .datentabelle { margin-top: 0; }
.filterspalten th { padding: .25rem .35rem; background: #fff; }
.filterspalten input {
  font: inherit;
  font-size: .85rem;
  width: 100%;
  min-width: 6rem;
  padding: .25rem .4rem;
  border: 1px solid var(--linie);
  border-radius: 4px;
}
.filterspalten input:focus { outline: 2px solid var(--akzent); border-color: var(--akzent); }
.spalte-auswahl { width: 2rem; text-align: center; }
.leerhinweis-zelle { color: var(--text-gedimmt); font-style: italic; }

/* Rechtstext und Bestätigungen */
.rechtstext {
  background: #fff;
  border: 1px solid var(--linie);
  border-left: 4px solid var(--akzent);
  border-radius: 6px;
  padding: .9rem 1.1rem;
  max-width: 70ch;
  margin-top: .75rem;
}
.bestaetigungszeile {
  display: flex;
  gap: .6rem;
  align-items: baseline;
  margin-top: .9rem;
  max-width: 70ch;
  cursor: pointer;
}

/* Zusammenfassung + Nachweisweg */
.zusammenfassung { max-width: 70ch; }
.begrenzte-liste { max-height: 14rem; overflow-y: auto; }
.nachweiswahl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: .9rem;
  max-width: 70ch;
}
.nachweiskarte {
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .9rem 1rem;
  margin-top: .5rem;
}
.nachweiskarte input[type="file"] { display: block; margin: .6rem 0; max-width: 100%; }
.nachweis-inaktiv { opacity: .65; }
.nachweis-inaktiv em {
  font-style: normal;
  font-size: .7rem;
  border: 1px solid var(--linie);
  border-radius: 3px;
  padding: 0 .25rem;
  margin-left: .25rem;
}
.nachweis-ersetzen { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .5rem; }
.nachweis-ersetzen input[type="file"] { margin: 0; }

/* Storno-Liste (M15) */
.zeile-storniert td { color: var(--text-gedimmt); }
.zeile-storniert td:nth-child(-n+5) { text-decoration: line-through; }
.storno-dialog td { background: #fffbeb; }
.storno-grund-feld { display: block; margin-top: .4rem; font-size: .9rem; }
.storno-grund-feld input {
  font: inherit;
  display: block;
  width: 100%;
  max-width: 32rem;
  margin-top: .25rem;
  padding: .35rem .5rem;
  border: 1px solid var(--linie);
  border-radius: 4px;
}
.storno-aktionen { white-space: nowrap; }
.storno-aktionen .knopf + .knopf { margin-left: .35rem; }

/* Bereichspflege (M07–M10) */
.zweispalter {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 1.25rem;
  align-items: start;
}
@media (max-width: 1000px) { .zweispalter { grid-template-columns: 1fr; } }
.im-bereich { color: var(--akzent); font-weight: 700; }
.warn-chip {
  display: inline-block;
  background: #fffbeb;
  border: 1px solid #d97706;
  color: #92400e;
  border-radius: 99px;
  font-size: .75rem;
  padding: 0 .5rem;
  white-space: nowrap;
}
.spalte-aktion { text-align: right; white-space: nowrap; }
.korb-aktion { margin-left: auto; }
.zeilenformular {
  display: flex;
  gap: .5rem;
  align-items: center;
  flex-wrap: wrap;
  margin-top: .75rem;
}
.zeilenformular .suchfeld { margin-top: 0; max-width: 20rem; }
.gruppen-tabelle td:nth-child(2) { color: var(--text-gedimmt); }

/* Tabs (M09) */
.tabs { display: flex; gap: .25rem; border-bottom: 2px solid var(--linie); margin-top: .75rem; }
.tab {
  padding: .4rem 1rem;
  border: 1px solid var(--linie);
  border-bottom: none;
  border-radius: 6px 6px 0 0;
  background: var(--flaeche);
  text-decoration: none;
  color: var(--text);
}
.tab-aktiv {
  background: #fff;
  border-color: var(--akzent);
  color: var(--akzent);
  font-weight: 600;
  position: relative;
  top: 2px;
  border-bottom: 2px solid #fff;
}
.ergebnisleiste {
  background: #fff;
  border: 1px solid var(--linie);
  border-left: 4px solid var(--akzent);
  border-radius: 6px;
  padding: .6rem .9rem;
  margin-top: .9rem;
  font-size: .9rem;
}

/* Bedarfs-Matrix (M10): Toggle-Zellen + Undo-Toast */
.bedarf-td { padding: 0 !important; }
.bedarf-zelle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 2.4rem;
  height: 2rem;
  border: none;
  background: none;
  cursor: pointer;
}
.bedarf-zelle:hover { background: #eaf1f9; outline: 1px solid var(--akzent); }
.zwischenzeile td { cursor: default; }
.toast {
  position: fixed;
  left: 50%;
  bottom: 1.25rem;
  transform: translateX(-50%);
  display: flex;
  gap: .75rem;
  align-items: center;
  background: var(--text);
  color: #fff;
  border-radius: 6px;
  padding: .55rem .9rem;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
  z-index: 100;
  animation: toast-verblassen 6s forwards;
}
.toast-leer { display: none; animation: none; }
.toast .knopf { padding: .15rem .6rem; font-size: .85rem; }
@keyframes toast-verblassen {
  0%, 80% { opacity: 1; visibility: visible; }
  100% { opacity: 0; visibility: hidden; }
}

/* Akten und Listen (M04, M20–M23) */
.zeile-klickbar { cursor: pointer; }
.zeile-klickbar:hover td { background: var(--flaeche); }
.aktenraster {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: .9rem;
  margin-top: .75rem;
  max-width: 70rem;
}
.aktenraster .infokarte h2 { font-size: 1rem; }
.meldung-ungelesen td { font-weight: 600; background: #f4f8fc; }
.gek-kopf-link { color: inherit; text-decoration: none; }
.gek-kopf-link:hover { color: var(--akzent); text-decoration: underline; }
.personen-name a { color: inherit; text-decoration: none; }
.personen-name a:hover { color: var(--akzent); text-decoration: underline; }
.he-storno-karte { position: static; max-width: 34rem; margin-top: .75rem; }

/* Kurzflüsse: Anträge (M18), Gerätemeldungen (M19), Personal-Demo (M24) */
.antragsformular {
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 6px;
  padding: .9rem 1.1rem 1.1rem;
  margin-top: .75rem;
  max-width: 34rem;
}
.antragsformular .feldgruppe:first-child { margin-top: 0; }
.antragsformular .knopf-primaer { margin-top: 1rem; }
.auswahlfeld {
  font: inherit;
  width: 100%;
  padding: .45rem .6rem;
  border: 1px solid var(--linie);
  border-radius: 4px;
  background: #fff;
}
.status-chip {
  display: inline-block;
  border-radius: 99px;
  font-size: .8rem;
  padding: .05rem .6rem;
  border: 1px solid var(--linie);
  background: var(--flaeche);
  white-space: nowrap;
}
.status-chip.status-beantragt, .status-chip.status-gemeldet {
  background: #fffbeb; border-color: #d97706; color: #92400e;
}
.status-chip.status-in_bearbeitung {
  background: #eaf1f9; border-color: var(--akzent); color: var(--akzent-dunkel);
}
.status-chip.status-abgeschlossen, .status-chip.status-angelegt {
  background: #f0fdf4; border-color: #15803d; color: #15803d;
}
.status-chip.status-abgelehnt {
  background: #fef2f2; border-color: var(--warnung); color: var(--warnung);
}
.zelle-umbruch { white-space: normal; max-width: 26ch; }
.spalte-aktion .knopf + .knopf,
.spalte-aktion form + form .knopf,
.spalte-aktion form + .knopf { margin-left: .35rem; }
.treffer-hinweis { margin: .4rem 0; padding: .3rem .6rem; }
#he-treffer .auswahlliste:empty, #antrag-treffer .auswahlliste:empty { display: none; }
#he-treffer, #antrag-treffer, #pb-treffer { max-width: 34rem; }
#he-treffer .auswahlliste, #antrag-treffer .auswahlliste, #pb-treffer .auswahlliste {
  max-height: 16rem;
}
#pb-treffer a.auswahlzeile { text-decoration: none; color: inherit; display: flex; }

/* Stammdaten/Verwaltung (M02/M03/M05/M06) */
.anlege-bereich { margin: .75rem 0; }
.anlege-bereich summary { list-style: none; width: fit-content; }
.anlege-bereich summary::-webkit-details-marker { display: none; }
.anlege-bereich[open] summary { border-color: var(--akzent); color: var(--akzent); }
.historie-liste { margin: .25rem 0 0; padding-left: 1.1rem; font-size: .9rem; }
.historie-liste li { padding: .1rem 0; }
#rollen-treffer, #mpk-treffer { max-width: 30rem; }
#rollen-treffer .auswahlliste, #mpk-treffer .auswahlliste { max-height: 14rem; }

/* Start-Hauptaktion und Folgeaktionen */
.start-hauptaktion { margin: 1.25rem 0; }
.knopf-gross { font-size: 1.15rem; padding: .7rem 1.6rem; }
.folgeaktionen { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: .75rem; }

/* Anmeldeseite */
.anmeldeseite {
  display: grid;
  place-items: center;
  min-height: 100vh;
}
.anmeldekarte {
  background: #fff;
  border: 1px solid var(--linie);
  border-radius: 8px;
  padding: 2rem 2.5rem;
  width: min(92vw, 24rem);
  text-align: center;
}
.anmeldekarte h1 { color: var(--akzent); }
.anmeldekarte .prototyp-hinweis { margin: 0 0 1.25rem; display: block; }
.anmeldekarte label { display: block; text-align: left; margin-bottom: .3rem; font-size: .9rem; }
.anmeldekarte input {
  font: inherit;
  width: 100%;
  padding: .5rem .6rem;
  border: 1px solid var(--linie);
  border-radius: 4px;
  margin-bottom: 1rem;
}
.anmeldekarte .knopf { width: 100%; padding: .5rem; }
.fehlermeldung { color: var(--warnung); font-size: .9rem; text-align: left; margin: -0.5rem 0 .75rem; }
.anmelde-fuss {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  padding: .75rem;
  font-size: .85rem;
}
.anmelde-fuss a { color: var(--text-gedimmt); text-decoration: none; }
.anmelde-fuss a:hover { color: var(--akzent); text-decoration: underline; }
