/* Erscheinungsbild von Nuevo Solutions (Homepage nuevo-solutions.de, 04.10.2026): Aktenpetrol und Siegelrot,
   Barlow / Barlow Condensed / IBM Plex Mono – lokal eingebunden (OFL, Lizenztexte in fonts/), kein fremder Server. */
@font-face { font-family: "Barlow"; font-weight: 400; font-display: swap; src: url(fonts/barlow-400.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 500; font-display: swap; src: url(fonts/barlow-500.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-display: swap; src: url(fonts/barlow-600.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 600; font-display: swap; src: url(fonts/barlow-condensed-600.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 700; font-display: swap; src: url(fonts/barlow-condensed-700.woff2) format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-weight: 400; font-display: swap; src: url(fonts/ibm-plex-mono-400.woff2) format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-weight: 500; font-display: swap; src: url(fonts/ibm-plex-mono-500.woff2) format("woff2"); }

:root {
  --grund: #f2f6f5; --flaeche: #fff; --text: #1b2e33; --leise: #5f7174; --linie: #dce5e3;
  --akzent: #1f5a63; --akzent-hell: #e4eeed; --erfolg: #2e7a52; --fehler: #b23b30; --hinweis: #8a6d1d;
  --siegel: #b23b30;
  --schrift: "Barlow", "Segoe UI", system-ui, sans-serif;
  --titel: "Barlow Condensed", "Arial Narrow", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --radius: 10px;
}
* { box-sizing: border-box; }
body { margin: 0; font: 15.5px/1.5 var(--schrift); background: var(--grund); color: var(--text); }
a { color: var(--akzent); }

.kopf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1.5rem;
        padding: .8rem clamp(1rem, 4vw, 2.5rem); background: var(--flaeche); border-bottom: 1px solid var(--linie); }
.marke { display: inline-flex; align-items: center; gap: .5rem; font: 700 1.4rem/1 var(--titel); color: var(--text);
          text-decoration: none; letter-spacing: .01em; }
.marke svg { width: 1.55rem; height: 1.55rem; flex: none; }
.menue { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1.1rem; }
.menue a { text-decoration: none; }
.inline { display: inline; margin: 0; }
button.link { background: none; border: 0; padding: 0; color: var(--akzent); font: inherit; cursor: pointer; width: auto; margin: 0; }

.inhalt { max-width: 1560px; margin: 1.5rem auto; padding-inline: clamp(1rem, 4vw, 2.5rem); }
/* Seit 12.10.2026 nutzt jede Seite die Breite wie der Katalog (Desktop statt Handy, Abschnitt am Ende);
   „weit“ bleibt als gleichbedeutender Zusatz in den Vorlagen stehen. */
.inhalt.weit { max-width: 1560px; }
.fuss { text-align: center; color: var(--leise); font-size: .8rem; padding: 2rem 1rem; }
/* Anbieterhinweis: leise, ohne Werbung – führt Testnutzer zur Homepage des Anbieters. */
.fuss a { color: inherit; text-decoration: underline; text-decoration-color: var(--linie); text-underline-offset: 2px; }
.fuss a:hover { color: var(--akzent); text-decoration-color: currentColor; }
h1, h2 { font-family: var(--titel); font-weight: 600; letter-spacing: .005em; line-height: 1.15; }
h1 { font-size: 1.85rem; margin: 0 0 .8rem; }
h2 { font-size: 1.3rem; margin: 0 0 .5rem; }

.karte { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 1.2rem 1.4rem; margin-bottom: 1.2rem; }
.karte.schmal { max-width: 440px; margin-inline: auto; }   /* nur Anmelde- und Fehlerseiten */
.karte.hervorgehoben { border-color: var(--akzent); background: var(--akzent-hell); }
/* Katalog (Grill 08.10.2026): Datenstand und Einstieg in die Einzelprüfung */
.datenstand { margin: -.2rem 0 .6rem; }
.pruef-hinweis { margin: .8rem 0 0; font-size: .9rem; }
.pruef-hinweis.hervorgehoben { padding: .6rem .8rem; border: 1px solid var(--akzent); border-radius: 6px;
  background: var(--akzent-hell); font-size: 1rem; }

label { display: block; margin: .8rem 0 .25rem; font-weight: 600; font-size: .9rem; }
input, select { width: 100%; padding: .55rem .7rem; border: 1px solid var(--linie); border-radius: 7px; font: inherit; background: #fff; }
input[type=checkbox], input[type=radio] { width: auto; padding: 0; margin: 0; }          /* Punkt 115 */
input:focus, select:focus, button:focus-visible { outline: 2px solid var(--akzent); outline-offset: 1px; }
button { margin-top: 1rem; padding: .6rem 1rem; border: 0; border-radius: 7px; background: var(--akzent); color: #fff; font: inherit; font-weight: 600; cursor: pointer; width: auto; }
.karte.schmal button[type=submit], .karte.schmal button:not([type]) { width: 100%; }   /* Prüfung 15.10.2026, Punkt 116 */
.klein { font-size: .82rem; color: var(--leise); }
.linkfeld { font-family: var(--mono); font-size: .85rem; }

.meldung { padding: .6rem .9rem; border-radius: 7px; margin: 0 auto 1rem; max-width: 1560px; border-left: 4px solid; background: var(--flaeche); }
.meldung.erfolg { border-color: var(--erfolg); }
.meldung.fehler { border-color: var(--fehler); }
.meldung.hinweis { border-color: var(--hinweis); }

.kacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; }   /* Punkt 128 */
.kachel { display: block; background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 1.1rem 1.2rem; color: var(--text); text-decoration: none; }
a.kachel:hover { border-color: var(--akzent); }
.kachel span { font-size: .8rem; color: var(--leise); }
.kachel span.dringend { color: var(--fehler); font-weight: 600; }
.kachel p { margin: .3rem 0 0; color: var(--leise); }
.kachel.folgt { opacity: .65; }

.marke-rolle { display: inline-block; padding: .05rem .5rem; border-radius: 99px; font-size: .8rem; background: var(--akzent-hell); color: var(--akzent); }
.marke-rolle.admin { background: #f3e8ff; color: #6b3fa0; }
.marke-rolle.leitung { background: #fdf2e0; color: #8a5a12; }
.marke-test { display: inline-block; padding: .05rem .45rem; border-radius: 99px; font-size: .8rem; background: #ebf0ef; color: var(--leise); }

.tabelle { width: 100%; border-collapse: collapse; }
.karte:has(> .tabelle) { overflow-x: auto; }
/* Spaltenköpfe langer Listen bleiben beim Blättern oben stehen (Nutzer 05.10.2026). Dafür darf die Karte kein
   eigener Scrollbereich sein – die Spalten passen dank fester Breiten (table-layout: fixed) ohnehin hinein. */
.karte:has(> table[data-lineal]) { overflow: visible; }
table[data-lineal] > thead th { position: sticky; top: 0; z-index: 2; background: var(--flaeche);
                                box-shadow: inset 0 -2px 0 var(--linie), 0 4px 6px -4px rgba(27, 46, 51, .25); }
.tabelle th, .tabelle td { text-align: left; padding: .5rem .5rem; border-bottom: 1px solid var(--linie); vertical-align: middle; }
.tabelle th { font-size: .8rem; color: var(--leise); font-weight: 600; }
.tabelle tr.inaktiv td { color: var(--leise); }
.aktionen { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: flex-end; }
.aktionen form { margin: 0; }
/* In Tabellen bleibt die Knopfspalte eine Zelle – als Flexbox lag ihre Linie 18 px höher (Prüfung 15.10.2026, Punkt 114) */
td.aktionen { display: table-cell; text-align: right; }
td.aktionen > form, td.aktionen > a, td.aktionen > span { display: inline-block; margin: .1rem 0 .1rem .3rem; vertical-align: middle; }
a.klein-knopf { display: inline-block; text-decoration: none; }
.klein-knopf { margin: 0; width: auto; padding: .3rem .6rem; font-size: .8rem; background: #edf3f2; color: var(--text); font-weight: 500; }
.klein-knopf.gefahr { background: #fbe9e8; color: var(--fehler); }

.raster { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 1rem; align-items: end; }
.haken { display: flex; align-items: center; gap: .5rem; padding-top: 1.6rem; }
.haken input { width: auto; }
.haken label { margin: 0; }

/* --- Gebietssuche --------------------------------------------------------- */
.suchzeile { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: flex-end; }
.suchzeile .feld { flex: 1 1 280px; }
.suchzeile button { width: auto; margin: 0; }
.status { display: inline-block; padding: .05rem .55rem; border-radius: 99px; font-size: .8rem; font-weight: 600; background: #ebf0ef; color: var(--leise); white-space: nowrap; }
.status.laeuft { background: var(--akzent-hell); color: var(--akzent); }
.status.fertig { background: #e3f3e8; color: var(--erfolg); }
.status.abgebrochen { background: #fdf2e0; color: #8a5a12; }
.status.fehler { background: #fbe9e8; color: var(--fehler); }
.stand-kopf { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.trichter { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: .9rem 0 .2rem; }
.trichter div { min-width: 90px; }
.trichter dt { font-size: .8rem; color: var(--leise); }
.trichter dd { margin: 0; font-size: 1.25rem; font-weight: 700; font-variant-numeric: tabular-nums; }
#stand form { margin-top: .8rem; }
.kennzahlen { margin-bottom: 1.2rem; }
.kennzahlen h2 { font-size: 1.8rem; margin: 0; font-variant-numeric: tabular-nums; }
.kennzahlen p { margin: 0; }
.ergebnisse td { font-size: .9rem; }
/* Feste Spaltenbreiten: ohne sie richtet sich die Tabelle nach dem laengsten
   Produktnamen und waechst ueber den Rand hinaus. So bricht der Text um,
   statt die Tabelle zu sprengen. */
.ergebnisse { table-layout: fixed; }
.ergebnisse td, .ergebnisse th { overflow-wrap: anywhere; }
.sp-betrieb { width: 20%; }
.sp-ort { width: 13%; }
.sp-ware { width: 15%; }
.sp-beleg { width: 17%; }
.sp-status { width: 14%; }
.sp-rm { width: 21%; }
/* Katalog (Nutzer 09.10.2026, PDF): elf Spalten – jede Angabe für sich, nebeneinander statt untereinander */
.katalog-tabelle .sp-betrieb { width: 10%; }
.katalog-tabelle .sp-web { width: 10%; }
.katalog-tabelle .sp-branche { width: 7%; }
.katalog-tabelle .sp-ort { width: 9%; }
.katalog-tabelle .sp-ware { width: 8%; }
.katalog-tabelle .sp-beleg { width: 10%; }
.katalog-tabelle .sp-relevanz { width: 9%; }
.katalog-tabelle .sp-guete { width: 7%; }
.katalog-tabelle .sp-status { width: 8%; }
.katalog-tabelle .sp-rm { width: 13%; }
.katalog-tabelle .sp-aktion { width: 9%; }
.katalog-tabelle .status-marke { white-space: normal; hyphens: manual; }   /* „Probe / genommen“, nie „genom-men“ */
/* Lange Wörter an Silbengrenzen trennen („Misch-sortiment“) statt mitten im Wort („Mischsortime-nt“) */
.katalog-tabelle td, .katalog-tabelle th { hyphens: auto; overflow-wrap: break-word; }
/* Senkrechte Trennlinien in jeder Zeile, auch im Kopf (Nutzer 09.10.2026) */
.katalog-tabelle th, .katalog-tabelle td { border-left: 1px solid var(--linie); }
.katalog-tabelle th:first-child, .katalog-tabelle td:first-child { border-left: 0; }
.katalog-tabelle .probe-knopf { margin-top: 0; white-space: nowrap; }
.gekappt { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid var(--linie); }
.stufe { display: inline-block; padding: .05rem .5rem; border-radius: 6px; font-size: .82rem; background: #edf3f2; }

/* --- Rueckmeldungen ------------------------------------------------------- */
.rm-spalte { min-width: 210px; }
.ergebnisse .rm-spalte { min-width: 0; }   /* unter table-layout: fixed regelt die colgroup */
.rm { font-size: .85rem; }
.rm p { margin: 0 0 .25rem; }
/* Nutzer 09.10.2026: alle Entscheidungsknöpfe gleich breit untereinander statt versetzt nebeneinander */
.rm-knoepfe { display: grid; grid-template-columns: minmax(0, 13rem); gap: .3rem; margin-top: .25rem; }
.rm-knoepfe form { margin: 0; }
.rm-knoepfe .klein-knopf { width: 100%; text-align: center; }
.rm-korrektur { background: #f2f4f5; color: var(--text); }
/* Entscheiden statt urteilen (08.10.2026): die Knöpfe nennen, was mit dem Betrieb passiert */
.rm-arbeit { background: #e3f3e8; color: var(--erfolg); }
.rm-aussortieren { background: #fbe9e8; color: var(--fehler); }
.rm-spaeter { background: var(--akzent-hell); color: var(--akzent); }
.rm-speichern { background: var(--akzent); color: #fff; }
.rm-programm strong { color: var(--text); font-weight: 600; }
.rm-stand { font-weight: 600; }
.rm-stand.stand-arbeit, .rm-stand.stand-passt, .rm-stand.stand-hochstufen { color: var(--erfolg); }
.rm-stand.stand-aussortieren, .rm-stand.stand-falsch { color: var(--fehler); }
.rm-stand.stand-spaeter, .rm-stand.stand-unklar { color: var(--akzent); }
.rm-korrigieren { margin-top: .2rem; }
/* Kleine Textknöpfe sichtbar als Verweis – sonst hält man „Angaben korrigieren“ oder „rückgängig“ für Text */
.rm-korrigieren button.link, .rm-nachtrag button.link, .verschoben button.link { color: var(--akzent); text-decoration: underline; text-underline-offset: 2px; }
.rm-gruende { border: 0; padding: 0; margin: .3rem 0 .4rem; display: grid; gap: .15rem; }
.rm-grund { display: flex; gap: .4rem; align-items: baseline; font-weight: 400; cursor: pointer; }
.rm-grund input { width: auto; margin: 0; }
.rm-nachtrag { display: flex; flex-wrap: wrap; gap: .3rem .8rem; align-items: center; margin: .15rem 0; }
.rm-nachtrag select { width: auto; padding: .15rem .3rem; font-size: .8rem; }
.akte-verlauf { margin-top: .6rem; }
.akte-verlauf li.zurueckgenommen { text-decoration: line-through; color: var(--leise); }
.rm-ok { color: var(--erfolg); font-weight: 500; }
.rm-offen { background: #f8fbfa; border: 1px solid var(--linie); border-radius: 8px; padding: .5rem .6rem; }
.rm-offen label { margin: .45rem 0 .15rem; font-size: .8rem; }
.rm-titel { font-weight: 700; }
/* Zusatzfelder nur beim passenden Grund (ohne :has()-Unterstützung bleiben sie einfach sichtbar) */
.rm-offen:has(select[name=grund] option[value=andere_url]:not(:checked)) .feld-shopadresse,
.rm-offen:has(select[name=grund] option[value=warengruppe]:not(:checked)) .feld-warengruppe { display: none; }
textarea { width: 100%; padding: .45rem .6rem; border: 1px solid var(--linie); border-radius: 7px; font: inherit; resize: vertical; }
.klein-auswahl { padding: .25rem .4rem; font-size: .82rem; width: auto; }
.arbeitsstatus { display: flex; align-items: center; gap: .3rem; margin: 0; }
.status-verworfen { color: var(--leise); }
.status-marke { display: block; width: fit-content; font-size: .82rem; padding: .12rem .55rem; margin-bottom: .35rem; border-radius: 999px;
                background: var(--flaeche); border: 1px solid var(--linie); white-space: nowrap; }
.status-marke.status-neu { border-color: var(--streifen-offen); color: #7a5600; }
.status-marke.status-relevant, .status-marke.status-probe_genommen { border-color: var(--erfolg); }
.status-relevant, .status-probe_genommen { color: var(--erfolg); font-weight: 600; }
.unsichtbar { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.erlaeuterung { margin: -.4rem 0 1.2rem; }

/* --- Eingang & Katalog ----------------------------------------------------- */
.eingang-kopf p { margin: 0; }
.eingang-kopf a { margin-left: .3rem; }
tr.verschoben td { background: #f1f8f3; color: var(--leise); font-size: .9rem; }
/* Lange Listen (Nutzer 05.10.2026): offen und bearbeitet farbig getrennt, die Zeile im Blick wie mit einem
   Lineal über alle Spalten (static/lineal.js). Offen = Arbeitsstatus „neu“. */
:root { --zeile-offen: #fff7e3; --streifen-offen: #d39200; --zeile-bearbeitet: #e9f3ec; --streifen-bearbeitet: #3d8a56;
        --lineal: #d7e7f8; --lineal-rand: #2c6db0; }
.tabelle tr.zeile-offen > td { background: var(--zeile-offen); }
.tabelle tr.zeile-bearbeitet > td { background: var(--zeile-bearbeitet); }
.tabelle tr.zeile-offen > td:first-child { box-shadow: inset 5px 0 0 var(--streifen-offen); }
.tabelle tr.zeile-bearbeitet > td:first-child { box-shadow: inset 5px 0 0 var(--streifen-bearbeitet); }
.tabelle tr.im-blick > td { background: var(--lineal); box-shadow: inset 0 2px 0 var(--lineal-rand), inset 0 -2px 0 var(--lineal-rand); }
.tabelle tr.zeile-offen.im-blick > td:first-child { box-shadow: inset 5px 0 0 var(--streifen-offen), inset 0 2px 0 var(--lineal-rand), inset 0 -2px 0 var(--lineal-rand); }
.tabelle tr.zeile-bearbeitet.im-blick > td:first-child { box-shadow: inset 5px 0 0 var(--streifen-bearbeitet), inset 0 2px 0 var(--lineal-rand), inset 0 -2px 0 var(--lineal-rand); }
.ergebnisse td:first-child { padding-left: .85rem; }
.stand-marke { white-space: nowrap; font-size: .9rem; margin-left: .2rem; }
.stand-marke::before { content: ""; display: inline-block; width: .8rem; height: .8rem; margin-right: .3rem; vertical-align: -.05rem;
                   border-radius: 2px; }
.stand-offen::before { background: var(--zeile-offen); box-shadow: inset 3px 0 0 var(--streifen-offen), 0 0 0 1px var(--streifen-offen); }
.stand-bearbeitet::before { background: var(--zeile-bearbeitet); box-shadow: inset 3px 0 0 var(--streifen-bearbeitet), 0 0 0 1px var(--streifen-bearbeitet); }
tr.gruppenkopf th { background: #edf3f2; color: var(--text); font-size: .9rem; padding-top: .6rem; }
.marke-korrigiert { display: inline-block; padding: 0 .4rem; border-radius: 99px; font-size: .8rem; background: #fdf2e0; color: #8a5a12; }
.marke-rueckwaerts { display: inline-block; padding: 0 .4rem; border-radius: 99px; font-size: .8rem; background: var(--akzent-hell); color: var(--akzent); }
.hinweis-offen { color: var(--hinweis); }
/* Ortsangabe: auswaertige Postleitzahl und Ortsteil bleiben lesbar, ohne der
   Warengruppe die Aufmerksamkeit zu nehmen – beides ist Einordnung, kein Alarm. */
.auswaerts { display: inline-block; padding: 0 .4rem; border-radius: 99px; font-size: .8rem; background: #eceef1; color: #46585b; }
.ortsteil { color: var(--leise); }
/* Zuständigkeit fraglich (Sammelanschrift, Sprachfassungen widersprechen sich) – prüfen, nicht verwerfen */
.zust-unklar { display: inline-block; padding: 0 .4rem; border-radius: 99px; font-size: .8rem; background: #fdf2e0; color: #8a5a12; }
.zust-hinweis { margin: .4rem 0 .8rem; }
.zust-hinweis ul { margin: .2rem 0 0; padding-left: 1.1rem; }
/* Mehrfachauftritte: gebuendelte Unterdomains und der vorsichtige Verweis auf
   gleichnamige Betriebe – beides Nebeninformation, nie lauter als der Name. */
.weitere { margin-top: .25rem; font-size: .8rem; color: var(--leise); }
.weitere summary { cursor: pointer; }
.weitere ul { margin: .2rem 0 0; padding-left: 1.1rem; }
.namensgleich { margin-top: .25rem; color: var(--leise); }
.filter { padding-bottom: .8rem; }
.filter-raster { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 0 .9rem; }
.filter-raster .feld-breit { grid-column: span 2; }
@media (max-width: 480px) { .filter-raster .feld-breit { grid-column: auto; } }
.haken-zeile { border: 0; padding: 0; margin: .8rem 0 0; display: flex; flex-wrap: wrap; gap: .35rem 1.1rem; align-items: center; }
.haken-inline { display: inline-flex; align-items: center; gap: .35rem; margin: 0; font-weight: 500; }
.haken-inline input { width: auto; }
.trenner { width: 1px; height: 1.2rem; background: var(--linie); }
.filter-knoepfe { display: flex; gap: 1rem; align-items: center; margin-top: .6rem; }
.weitere-filter { margin-top: .7rem; }
.trefferzahl { margin: 0 0 .6rem; }
.kopier-knopf { font: inherit; font-size: .82rem; font-weight: 600; padding: .2rem .6rem; border: 1px solid var(--linie);
                border-radius: 6px; background: var(--flaeche); color: var(--akzent); cursor: pointer; white-space: nowrap;
                width: auto; margin: 0; }
.kopier-knopf:hover { border-color: var(--akzent); }
.kopier-knopf.kopiert { color: var(--erfolg); border-color: var(--erfolg); }
.werkzeugzeile { margin: .2rem 0 1rem; }
.drei { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0 .9rem; }
.automatik-produkte { list-style: none; padding: 0; margin: .6rem 0; }
.automatik-produkte li { padding: .15rem 0; }
.automatik-produkte .ap-erhoben { color: var(--erfolg); }
.automatik-produkte .ap-nicht_erhebbar, .automatik-produkte .ap-ersetzt { color: var(--leise); }
.knopf-link.zweitrangig { background: var(--flaeche); color: var(--akzent); border: 1px solid var(--akzent); margin-left: .6rem; }
.kopierzeile { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; }
.korb-menge input { width: 4.5rem; }
.menge-stand { display: block; margin-top: .2rem; white-space: nowrap; }
.trefferzahl strong { font-size: 1.1rem; }
/* htmx setzt die Klasse, solange der Filter lädt – sonst sieht ein Klick aus wie keiner */
#katalog-liste.htmx-request { opacity: .45; transition: opacity .15s; }
.weitere-filter summary { cursor: pointer; font-weight: 600; color: var(--akzent); font-size: .92rem; }
.weitere-filter[open] summary { margin-bottom: .3rem; }
.seiten { display: flex; gap: 1rem; justify-content: center; align-items: center; margin-top: 1rem; }

/* --- Probenahme ------------------------------------------------------------ */
.knopf-link { display: inline-block; padding: .5rem .9rem; border-radius: 7px; background: var(--akzent); color: #fff; text-decoration: none; font-weight: 600; }
.probe-knopf { display: inline-block; margin-top: .35rem; text-decoration: none; }
.warnkasten { background: #fff4e5; border: 1px solid #f0b35b; border-left: 5px solid #e08a00; border-radius: var(--radius); padding: .8rem 1rem; margin-bottom: 1.2rem; }
.probe-kopf { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; }
.probe-kopf h2 { margin: 0; }
.probe-aktionen { margin: .6rem 0 1rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.kennzeichnung th { width: 28%; color: var(--leise); font-weight: 600; font-size: .85rem; vertical-align: top; }
.kennzeichnung td { white-space: pre-wrap; }
.kennzeichnung tr.leer td { color: #a0671a; font-style: italic; }
.kennzeichnung th .quelle { display: block; font-weight: 400; font-size: .8rem; color: var(--leise); margin-top: .1rem; }
.maske-zeile { margin: .4rem 0 .2rem; }
.marke-maske { display: inline-block; margin-left: .3rem; padding: 0 .45rem; border-radius: 99px; font-size: .8rem; background: var(--akzent-hell); color: var(--akzent); }
.leise-text { color: var(--leise); }
h3 { font-size: 1rem; margin: 1.1rem 0 .5rem; }
.abbilder { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .8rem; }
.abbild { display: block; border: 1px solid var(--linie); border-radius: 8px; overflow: hidden; text-decoration: none; background: #fff; }
.abbild img { display: block; width: 100%; height: 150px; object-fit: cover; object-position: top; }
.abbild span { display: block; padding: .3rem .5rem; }
.aufklapp { margin-top: .9rem; }
.aufklapp summary { cursor: pointer; font-weight: 600; color: var(--akzent); }
.anschreiben { font-family: var(--mono); font-size: .82rem; margin-top: .5rem; }
.mono { font-family: var(--mono); word-break: break-all; }

/* --- Fristen & Wiedervorlage ----------------------------------------------
   Stand-Farben mit dem dataviz-Palettenpruefer getestet (alle Paare, Protan/
   Deutan/Tritan >= 8, Normalsicht >= 15, Kontrast >= 3:1). Farbe nie allein:
   jeder Stand hat Symbol UND Wort; ausgeblieben zusaetzlich schraffiert. */
:root { --st-offen: #1f6fb2; --st-bald: #c07a00; --st-ueber: #b0302a; --st-eingang: #1a9a7a;
        --st-erledigt: #9aa3ad; --st-aus: #46585b; --st-farbe: var(--st-offen); }
.st-offen { --st-farbe: var(--st-offen); }
.st-bald { --st-farbe: var(--st-bald); }
.st-ueber { --st-farbe: var(--st-ueber); }
.st-eingang { --st-farbe: var(--st-eingang); }
.st-erledigt { --st-farbe: var(--st-erledigt); }
.st-aus { --st-farbe: var(--st-aus); }

.stand { display: inline-flex; align-items: center; gap: .35rem; font-size: .82rem; font-weight: 600; color: var(--text); white-space: nowrap; }
.sym, .ev-punkt { display: inline-grid; place-items: center; flex: none; width: 1.2rem; height: 1.2rem; border-radius: 50%;
       background: var(--st-farbe); color: #fff; font-size: .72rem; line-height: 1; font-weight: 700; }
.st-erledigt .sym, .ev-punkt.st-erledigt { color: var(--text); }
.st-aus .sym, .ev-punkt.st-aus { border-radius: 3px; }
.st-bald .sym, .ev-punkt.st-bald, .st-ueber .sym, .ev-punkt.st-ueber { border-radius: 4px; }

.zaehler { display: inline-block; min-width: 1.3rem; padding: 0 .35rem; border-radius: 99px; background: var(--st-ueber);
           color: #fff; font-size: .8rem; font-weight: 700; text-align: center; }
.fristen-kopf { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: .6rem 1rem; }
.fristen-kopf h1 { margin-bottom: .1rem; }
.fristen-werkzeuge { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.knopf-link-leise { display: inline-block; text-decoration: none; border-radius: 7px; }
.schalter-form { margin: 0; }
.schalter { display: inline-flex; align-items: center; gap: .5rem; width: auto; margin: 0; padding: .3rem .7rem; font-size: .82rem;
            font-weight: 500; background: #edf3f2; color: var(--text); }
.schalter-bahn { position: relative; width: 2.1rem; height: 1.15rem; border-radius: 99px; background: #b9c1ca; transition: background .15s; }
.schalter-knopf { position: absolute; top: .15rem; left: .15rem; width: .85rem; height: .85rem; border-radius: 50%; background: #fff; transition: left .15s; }
.schalter.an .schalter-bahn { background: var(--st-eingang); }
.schalter.an .schalter-knopf { left: 1.1rem; }

.reiter { display: flex; gap: .3rem; margin: 1rem 0 1.1rem; border-bottom: 1px solid var(--linie); overflow-x: auto; }
.reiter a { padding: .5rem .9rem; text-decoration: none; color: var(--leise); border-bottom: 3px solid transparent; white-space: nowrap; }
.reiter a .zahl { display: inline-block; min-width: 1.4rem; padding: 0 .35rem; margin-left: .25rem; border-radius: 99px; background: #ebf0ef; font-size: .8rem; text-align: center; }
.reiter a.aktiv .zahl { background: var(--akzent-hell); color: var(--akzent); }
.reiter a.aktiv { color: var(--text); font-weight: 600; border-bottom-color: var(--akzent); }

.frist-kacheln { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .8rem; margin-bottom: 1.4rem; }
.frist-kachel { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .7rem; align-items: center;
                padding: .9rem 1rem; background: var(--flaeche); border: 1px solid var(--linie); border-left: 5px solid var(--st-farbe);
                border-radius: var(--radius); color: var(--text); text-decoration: none; }
.frist-kachel .sym { grid-row: span 2; width: 1.9rem; height: 1.9rem; font-size: 1rem; }
.frist-kachel strong { font-size: 1.7rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.frist-kachel > span:last-child { font-size: .82rem; color: var(--leise); }
.frist-kachel.null { border-left-color: var(--linie); }
.frist-kachel.null .sym { background: #d5dbe2; color: var(--leise); }
.frist-kachel:hover { border-color: var(--st-farbe); }

.frist-gruppe { margin-bottom: 1.6rem; }
.frist-gruppe > h2 { margin-bottom: .1rem; }
.frist-gruppe > p { margin: 0 0 .6rem; }
.frist-karte { background: var(--flaeche); border: 1px solid var(--linie); border-left: 5px solid var(--st-farbe);
               border-radius: var(--radius); padding: .8rem 1.1rem; margin: .6rem 0; overflow-x: auto; }
.frist-karte-kopf { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem 1rem; align-items: flex-start; }
.frist-karte-kopf h3 { margin: 0; }
.frist-karte-kopf p { margin: 0; }
.frist-datum { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .7rem; }
.frist-datum strong { font-variant-numeric: tabular-nums; }
.proben-liste td { padding: .35rem .5rem; }
.mono-kurz { font-family: var(--mono); font-size: .85rem; white-space: nowrap; }
.stand-knoepfe { display: flex; flex-wrap: wrap; gap: .3rem; justify-content: flex-end; }
.stand-knoepfe form, .sammel { margin: 0; }
.sammel { margin-top: .5rem; text-align: right; }
.leer-hinweis p { margin: 0; }

.datum-form { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: 0; }
.datum-form input[type=date] { width: auto; }
.wv-aktionen { margin-top: .6rem; }
.wv-aktionen > .datum-form { margin: .4rem 0; }
.wiedervorlage { border-left: 5px solid var(--akzent); scroll-margin-top: 1rem; }
.verlauf { list-style: none; padding: 0; margin: .5rem 0 0; }
.verlauf li { padding: .35rem 0; border-bottom: 1px solid var(--linie); font-size: .9rem; }

.legende { display: flex; flex-wrap: wrap; gap: .3rem 1rem; list-style: none; padding: 0; margin: .4rem 0 .9rem; font-size: .8rem; color: var(--leise); }
.legende li { display: inline-flex; align-items: center; gap: .3rem; }
.lg-balken { display: inline-block; width: 1.4rem; height: .55rem; border-radius: 3px; background: var(--st-farbe); }
.lg-balken.st-aus { background: repeating-linear-gradient(45deg, var(--st-aus) 0 2px, #fff 2px 5px); border: 1px solid var(--st-aus); }
.lg-heute { display: inline-block; width: 2px; height: .95rem; background: var(--text); }
.ev-bestellt { --st-farbe: #6b7684; }

/* Monatskalender */
.kalender-kopf { display: flex; align-items: center; gap: .7rem; }
.kalender-kopf h2 { margin: 0; min-width: 9rem; text-align: center; }
.kalender { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: var(--linie); border: 1px solid var(--linie); border-radius: 8px; overflow: hidden; }
.kal-wt { background: #edf3f2; padding: .3rem .5rem; font-size: .8rem; font-weight: 600; color: var(--leise); }
.kal-tag { background: var(--flaeche); min-height: 6.4rem; padding: .3rem .35rem .4rem; display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.kal-tag.we { background: #fafcfb; }
.kal-tag.fremd { background: #f1f6f5; }
.kal-tag.fremd .kal-nr, .kal-tag.fremd .ev { opacity: .55; }
.kal-nr { font-size: .8rem; color: var(--leise); }
.kal-tag.heute { box-shadow: inset 0 0 0 2px var(--akzent); }
.kal-tag.heute .kal-nr strong { color: #fff; background: var(--akzent); border-radius: 99px; padding: 0 .35rem; }
.kal-nr em { margin-left: .3rem; font-style: normal; font-size: .8rem; color: var(--akzent); font-weight: 600; }
.ev { display: flex; align-items: flex-start; gap: .3rem; padding: .15rem .3rem; border-radius: 5px; font-size: .8rem; line-height: 1.25;
      color: var(--text); text-decoration: none; background: #f2f6f5; border-left: 3px solid var(--st-farbe); min-width: 0; }
.ev:hover { background: var(--akzent-hell); }
.ev .ev-punkt { width: .95rem; height: .95rem; font-size: .6rem; margin-top: .05rem; }
.ev-text { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; }
@media (min-width: 761px) { .kal-nr { font-size: 0; } .kal-nr strong, .kal-nr em { font-size: .8rem; } .kal-nr em { font-size: .8rem; } }
@media (max-width: 760px) {
  .kalender { grid-template-columns: 1fr; }
  .kal-wt, .kal-tag:not(.hat), .kal-tag.fremd { display: none; }
  .kal-tag { min-height: 0; padding: .5rem .6rem; }
  .kal-tag.heute { display: flex; }
  .ev { font-size: .85rem; }
}

/* Zeitstrahl und Monatsbalken (SVG – Farben nur hier, Positionen im Markup) */
.zs-kopf { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .5rem 1rem; }
.zs-kopf p { margin: 0; }
.zs-filter { display: flex; flex-wrap: wrap; gap: .4rem .8rem; align-items: center; margin: 0; }
.zs-filter .haken-inline { margin: 0; font-weight: 400; font-size: .85rem; }
.zs-rahmen { overflow-x: auto; }
.zeitstrahl { display: block; width: 100%; min-width: 760px; height: auto; font-family: inherit; }
.monatsbalken { display: block; width: 100%; min-width: 520px; height: auto; font-family: inherit; }
.zs-monat { stroke: #a9b8b6; stroke-width: 1; }
.zs-monat-text { font-size: 12px; font-weight: 600; fill: var(--leise); }
.zs-raster { stroke: #e5ecea; stroke-width: 1; }
.zs-achse { font-size: 12px; fill: var(--leise); font-variant-numeric: tabular-nums; }
.zs-grundlinie { stroke: #c3cad3; stroke-width: 1; }
.zs-trenner { stroke: var(--linie); stroke-width: 1; }
.zs-gruppe { font-size: 13px; font-weight: 700; fill: var(--text); }
.zs-gruppe-zusatz { font-size: 12px; fill: var(--leise); }
.zs-trefferflaeche { fill: transparent; }
.zs-zeile:hover .zs-trefferflaeche, .zs-zeile:focus .zs-trefferflaeche { fill: #ecf4f3; }
.zs-label { font-size: 12px; fill: var(--text); font-family: var(--mono); }
.zs-stand { font-size: 12px; fill: var(--leise); }
.zs-balken { fill: var(--st-farbe); stroke: #fff; stroke-width: 2; paint-order: stroke; }
.st-aus .zs-balken { stroke: var(--st-aus); stroke-width: 1; }
.st-erledigt .zs-balken { fill: #c4cad1; }
.zs-verlaengerung { stroke: var(--st-ueber); stroke-width: 1; }
.zs-frist { stroke: var(--text); stroke-width: 2; stroke-linecap: round; }
.zs-eingang { fill: var(--st-eingang); stroke: #fff; stroke-width: 2; }
.st-erledigt .zs-eingang { fill: #7d8791; }
.zs-eingang-haken { font-size: 9px; font-weight: 700; fill: #fff; pointer-events: none; }
.zs-kreuz { font-size: 12px; font-weight: 700; fill: var(--st-aus); }
.zs-heute { stroke: var(--text); stroke-width: 1.5; stroke-dasharray: 4 3; }
.zs-heute-marke { fill: var(--text); }
.zs-heute-text { font-size: 10px; font-weight: 700; fill: #fff; }
.mb-raster { stroke: #e5ecea; stroke-width: 1; }
.mb-basis { stroke: #a9b8b6; stroke-width: 1; }
.mb-treffer { fill: transparent; }
.mb-saeule:hover .mb-treffer { fill: #ecf4f3; }
.mb-balken { fill: var(--akzent); }
.mb-wert { font-size: 12px; font-weight: 600; fill: var(--text); font-variant-numeric: tabular-nums; }

.stand-knoepfe .klein-knopf { white-space: nowrap; }
@media (max-width: 640px) {
  .frist-karte { overflow-x: visible; padding-inline: .8rem; }
  .proben-liste, .proben-liste tbody, .proben-liste td { display: block; }
  .proben-liste thead { display: none; }
  .proben-liste tr { display: grid; grid-template-columns: auto 1fr; gap: .25rem .7rem; align-items: center;
                     padding: .55rem 0; border-bottom: 1px solid var(--linie); }
  .proben-liste td { border: 0; padding: 0; }
  .proben-liste td:nth-child(n+3) { grid-column: 1 / -1; }
  .stand-knoepfe { justify-content: flex-start; }
  .sammel { text-align: left; }
}

@media print {
  .kopf, .fuss, .reiter, .fristen-werkzeuge, .stand-knoepfe, .sammel, .zs-filter, .wv-aktionen form, .datum-form button { display: none !important; }
  body { background: #fff; }
  .karte, .frist-karte, .frist-kachel { break-inside: avoid; border-color: #999; }
  .zeitstrahl, .monatsbalken { min-width: 0; }
}

/* Sammelkorb (Probe nehmen) */
.korb-schritte { margin: 0 0 1rem; padding-left: 1.3rem; display: grid; gap: .45rem; }
.korb-schritte li::marker { color: var(--leise); font-weight: 600; }
.korb-ablage { border: 2px dashed var(--linie); border-radius: var(--radius); padding: .9rem 1rem; background: var(--grund); transition: border-color .15s, background .15s; }
.korb-ablage.aktiv { border-color: var(--akzent); background: var(--akzent-hell); }
.korb-ablage p { margin: 0 0 .5rem; }
.korb-ablage-text { font-size: .95rem; }
.korb-eingabe { display: flex; gap: .5rem; align-items: center; }
.korb-eingabe input[type=text] { flex: 1; min-width: 0; }
.korb-eingabe .klein-knopf { flex: none; padding: .55rem .9rem; }
.korb-hinweis { margin: .6rem 0 0; min-height: 1.2em; }
.korb-hinweis .klein-knopf, #zwischenablage-stand .klein-knopf { margin-right: .3rem; }
.korb-kopf { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .3rem 1rem; }
.korb-kopf h2 .klein { font-weight: 400; }
.korb-meldung { margin: 0 0 .5rem; font-size: .88rem; font-weight: 500; }
.korb-meldung.erfolg { color: var(--erfolg); }
.korb-meldung.fehler { color: var(--fehler); }
.korb-meldung.hinweis { color: var(--hinweis); }
.korb-produkt { max-width: 34rem; }
.korb-titel { display: block; }
.korb-titel.leise { color: var(--leise); font-style: italic; font-size: .88rem; }
.korb-url { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 34rem; }
.marke-fremd { display: table; margin-top: .25rem; padding: 0 .45rem; border-radius: 99px; font-size: .8rem; background: #fdf2e0; color: #8a5a12; }
.korb-nummer { min-width: 13rem; }
.korb-nummer .nummer-feld { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; }
.korb-variante { min-width: 11rem; }
.nr-stand { display: block; min-height: 1.1em; }
.nr-mangel { color: var(--fehler); }
.korb-entfernen { padding: .3rem .55rem; }
.korb-fuss { margin-top: .8rem; }
.korb-fuss .klein-knopf { margin-right: .4rem; }
.korb-starten { max-width: 22rem; }
.korb-leer { color: var(--leise); margin: .3rem 0 0; }
.korb-verwerfen { margin-top: .4rem; text-align: right; }
.korb-offen { margin: 0; padding-left: 1.1rem; }
@media (max-width: 640px) {
  .korb-tabelle thead { display: none; }
  .korb-tabelle tr { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr) auto; gap: .2rem .5rem; padding: .6rem 0; border-bottom: 1px solid var(--linie); }
  .korb-tabelle td { border: 0; padding: 0; }
  .korb-tabelle { display: block; }
  .korb-tabelle tbody { display: block; }
  .korb-tabelle td.korb-nummer, .korb-tabelle td.korb-variante { grid-column: 2 / 4; min-width: 0; }
  .korb-tabelle td:last-child { grid-column: 3; grid-row: 1; }
  .korb-url { max-width: 100%; }
  .korb-starten { max-width: none; }
}

/* Bestellweg im Katalog */
.weg { display: inline-block; padding: 0 .4rem; border-radius: 99px; font-size: .8rem; background: #ebf0ef; color: var(--leise); }
.weg-versand { background: #e3f2ea; color: #26623f; }
.weg-lieferdienst, .weg-abholung { background: #fdf2e0; color: #8a5a12; }
.weg-unklar { background: #e8eef5; color: #2c5578; }
.vorschlag { display: inline-block; font-size: .8rem; color: var(--leise); border-bottom: 1px dotted var(--linie); cursor: help; }

/* Punktzahl der Einstufung. Bewusst zurueckhaltend gefaerbt: die Zahl ordnet
   ein, sie urteilt nicht – die Stufe daneben traegt die Aussage. */
.guete { display: inline-block; padding: 0 .4rem; border-radius: 99px; font-size: .8rem;
         background: #ebf0ef; color: var(--leise); cursor: help; }
.guete-hoch { background: #e3f2ea; color: #26623f; }
.guete-mittel { background: #eef4ea; color: #4a6b3a; }
.guete-niedrig { background: #fdf2e0; color: #8a5a12; }
.guete-sehr-niedrig { background: #f6eaea; color: #8a3030; }

/* Suche: Feld in der Kopfzeile, Suchzeile auf Such- und Eingangsseite */
.nur-vorlesen { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }
.kopf-suche { margin: 0; }
.kopf-suche input { width: 13rem; padding: .3rem .6rem; font-size: .88rem; }
@media (max-width: 640px) { .kopf-suche, .kopf-suche input { width: 100%; } }
.suchzeile { display: flex; gap: .6rem; align-items: stretch; }
.suchzeile input { flex: 1; min-width: 0; }
.suchzeile button { margin: 0; width: auto; }
.suchzeile .feld ~ button { align-self: flex-end; }      /* nach Feld mit Beschriftung: bündig mit dem Feld, nicht gestreckt */
.karte > .suchzeile { margin-bottom: 1.2rem; }
.eingang-suche { padding-block: .4rem .9rem; }
.eingang-suche label { margin-top: .4rem; }

/* Dokumentenablage (01.10.2026) */
.ablage { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 1.2rem; margin: .6rem 0;
  border: 2px dashed var(--linie); border-radius: var(--radius); background: #f8fbfa; cursor: pointer; text-align: center; }
.ablage.ueber { border-color: var(--akzent); background: var(--akzent-hell); }
.ablage input[type=file] { max-width: 100%; }
.ablage .gewaehlt { color: var(--text); }
.hochladen .zeile { display: flex; flex-wrap: wrap; gap: .6rem 1rem; }
.hochladen .zeile label { flex: 1 1 14rem; }
.dokumente td.aktionen { white-space: nowrap; }
.dokumente details.fassung { display: inline-block; }
.dokumente details.fassung form { display: flex; gap: .4rem; margin-top: .3rem; }
.frist-bald { color: var(--fehler); }

/* Vorlagen-Editor (01.10.2026) */
.anleitung { background: var(--akzent-hell); border-radius: var(--radius); padding: .7rem 1rem; }
.vorlagen-editor { display: grid; grid-template-columns: minmax(14rem, 18rem) 1fr; gap: 1.2rem; align-items: start; margin-bottom: 1.2rem; }
@media (max-width: 760px) { .vorlagen-editor { grid-template-columns: 1fr; } }
.bausteinleiste { position: sticky; top: .8rem; background: var(--flaeche); border: 1px solid var(--linie);
  border-radius: var(--radius); padding: .6rem .8rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
.bausteinleiste h3 { font-size: .85rem; margin: .7rem 0 .3rem; color: var(--leise); }
.bausteinleiste .bausteine { display: flex; flex-wrap: wrap; gap: .35rem; }
.baustein { display: inline-block; width: auto; margin: 0; padding: .25rem .55rem; border-radius: 999px; font-size: .82rem;
  font-weight: 600; background: #e3eefb; color: #174a7c; border: 1px solid #b9d3f0; cursor: grab; user-select: none; }
.baustein:active { cursor: grabbing; }
.vorlage-seite .baustein.gesetzt { cursor: pointer; font-size: .9em; padding: .05rem .45rem; background: #fff3c4; color: #6b4b00;
  border-color: #e6c35c; }
.vorlage-seite .baustein.gesetzt:hover { background: #fbe9e8; color: var(--fehler); border-color: var(--fehler); text-decoration: line-through; }
.vorlage-hinweis { padding: .5rem .8rem; border-radius: var(--radius); background: #edf3f2; margin-bottom: .6rem; font-size: .9rem; }
.vorlage-hinweis.bereit { background: var(--akzent-hell); }
.vorlage-hinweis.erfolg { background: #e6f5ef; }
.vorlage-hinweis.fehler { background: #fbe9e8; color: var(--fehler); }
.vorlage-seite { background: #fff; border: 1px solid var(--linie); border-radius: 4px; box-shadow: 0 1px 6px rgba(0,0,0,.08);
  padding: 2rem 2.4rem; font-family: Calibri, Arial, sans-serif; line-height: 1.45; }
.vorlage-teil { border-top: 1px dashed var(--linie); padding-top: .4rem; margin-top: .6rem; }
.vorlage-teil:first-child { border-top: 0; margin-top: 0; }
.vorlage-teil h4 { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--leise); margin: 0 0 .3rem; }
.vorlage-seite p { margin: 0 0 .35rem; min-height: 1.2em; border-radius: 3px; }
.vorlage-seite p.leer { min-height: 1.4em; background: repeating-linear-gradient(90deg, transparent 0 6px, #f1f4f8 6px 7px); }
.vorlage-seite p.ziel { outline: 2px dashed var(--akzent); outline-offset: 2px; background: var(--akzent-hell); }
.vorlage-seite p.mitte { text-align: center; } .vorlage-seite p.rechts { text-align: right; } .vorlage-seite p.block { text-align: justify; }
.vorlage-seite p.ueberschrift { font-weight: 700; font-size: 1.1em; }
.vorlage-seite .tab, .vorlage-seite .umbruch { white-space: pre; }
.vorlage-tabelle { border-collapse: collapse; margin: .3rem 0 .6rem; }
.vorlage-tabelle td { border: 1px solid #e3e7ec; padding: .2rem .5rem; vertical-align: top; }
.vorlage-aktionen .zeile-knoepfe { display: flex; gap: .6rem; flex-wrap: wrap; margin-bottom: .6rem; }
label.auswahl { display: flex; gap: .5rem; align-items: center; font-weight: 500; margin-top: .6rem; }
label.auswahl input { width: auto; margin: 0; }
/* Dokument erstellen (01.10.2026) */
.vorlagenwahl { list-style: none; padding: 0; display: grid; gap: .4rem; }
.kontextwahl { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: flex-end; margin-bottom: 1rem; }
.kontextwahl label { flex: 1 1 14rem; }
.werte td:first-child { width: 34%; }
.werte tr.fehlt td { background: #fff8e6; }
.hinweis-fehlt { color: #9a6700; }
.werte textarea, .werte input { margin: 0; }

/* Bezirke (01.10.2026) */
.marke-bezirk { display: inline-block; padding: 0 .4rem; border-radius: 4px; font-size: .8rem; border: 1px solid var(--linie); background: var(--flaeche); white-space: nowrap; }

/* Verdeckte Probenahme (01.10.2026) */
.marke-verdeckt { display: inline-block; padding: 0 .45rem; border-radius: 4px; font-size: .8rem; font-weight: 600;
  vertical-align: middle; color: #fff; background: #5b4b8a; }
.art-wahl { border: 1px solid var(--linie); border-radius: var(--radius); padding: .6rem .9rem; margin: .8rem 0; }
.art-wahl legend { font-weight: 600; padding: 0 .3rem; }
.art-wahl .art-deck { display: block; margin-top: .4rem; }
.schritte { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .8rem; }
.schritte > li { border: 1px solid var(--linie); border-left: 5px solid var(--linie); border-radius: var(--radius); padding: .6rem .9rem; }
.schritte > li.erledigt { border-left-color: var(--erfolg); }
.schritte h3 { margin: 0 0 .4rem; font-size: 1rem; }
.vorlagenwahl li.passend { font-weight: 600; }
.unterrichtung-liste { list-style: none; padding: 0; display: grid; gap: .4rem; }


/* PDF-Formulare (Dokumentenmodul Stufe 4) */
.pdf-seite { position: relative; margin: 0 0 1rem; border: 1px solid var(--linie); background: #fff; cursor: crosshair; }
.pdf-seite img { display: block; width: 100%; height: auto; user-select: none; }
.pdf-seite .stempel { position: absolute; transform: translateY(-15%); white-space: nowrap; font-size: .8rem; cursor: pointer; }
.bausteinleiste .baustein.gewaehlt { outline: 3px solid var(--akzent); outline-offset: 1px; }
.vorlage-hinweis.fehler { color: var(--fehler); }

/* Rechte, Verwaltung, Auswertung (01.10.2026) */
.marke-recht { display: inline-block; padding: .05rem .5rem; border-radius: 99px; font-size: .8rem; margin: .1rem 0;
  white-space: nowrap; background: var(--akzent-hell); color: var(--akzent); }
.unternavigation { display: flex; flex-wrap: wrap; gap: .3rem 1rem; margin: 0 0 .8rem; font-size: .92rem; }
.unternavigation a[aria-current] { font-weight: 700; text-decoration: none; border-bottom: 2px solid var(--akzent); }
.rechte-tabelle .haken-zelle { text-align: center; }
.rechte-tabelle input[type=checkbox] { width: 1.15rem; height: 1.15rem; margin: 0; }
.auswertung-zahlen { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .8rem; margin-bottom: 1.2rem; }
.auswertung-zahlen .kennzahl { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: .8rem 1rem; }
.auswertung-zahlen .kennzahl strong { display: block; font-size: 1.7rem; font-variant-numeric: tabular-nums; }
.auswertung-zahlen .kennzahl span { font-size: .85rem; color: var(--leise); }
.auswertung-zahlen .kennzahl.warnend strong { color: var(--fehler); }
.spalten-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 0 1.2rem; }
.tabelle td.zahl { text-align: right; font-variant-numeric: tabular-nums; }

/* --- Online-Kontrolle (03.10.2026) ------------------------------------------------ */
.feststellung { border: 1px solid var(--linie); border-left: 5px solid var(--leise); border-radius: var(--radius);
  padding: .7rem 1rem; margin: .8rem 0; background: var(--flaeche); }
.feststellung.stufe-A { border-left-color: var(--fehler); }
.feststellung.stufe-B { border-left-color: #e08a00; }
.feststellung.stufe-C { border-left-color: var(--akzent); }
.feststellung.stufe-hinweis { border-left-color: var(--leise); }
.feststellung.durchsicht-verworfen { opacity: .65; }
.feststellung h3 { margin: 0; font-size: 1rem; }
.feststellung .durchsicht { margin-top: .5rem; }
.feststellung .durchsicht form { margin-top: .6rem; }
.stufe-marke { display: inline-block; min-width: 1.8rem; text-align: center; padding: 0 .45rem; border-radius: 4px;
  font-weight: 700; font-size: .85rem; color: #fff; background: var(--leise); }
.stufe-marke.stufe-A { background: var(--fehler); }
.stufe-marke.stufe-B { background: #c07a00; }
.stufe-marke.stufe-C { background: var(--akzent); }
.marke-risiko, .marke-notloesung { display: inline-block; padding: 0 .45rem; border-radius: 99px; font-size: .8rem;
  background: #fdf2e0; color: #8a5a12; }
.marke-notloesung { background: #fbe9e8; color: var(--fehler); }
ul.kandidaten { list-style: none; padding: 0; max-height: 26rem; overflow: auto; border: 1px solid var(--linie);
  border-radius: var(--radius); }
ul.kandidaten li { padding: .35rem .7rem; border-bottom: 1px solid var(--linie); }
ul.kandidaten li:last-child { border-bottom: 0; }
.pruefliste .ergebnis-fehlt td:nth-child(2) { color: var(--fehler); font-weight: 600; }
.pruefliste .ergebnis-nicht_pruefbar td:nth-child(2), .pruefliste .ergebnis-befreit td:nth-child(2) { color: var(--leise); }
h2.inline { display: inline; }
@media (max-width: 640px) {
  .feststellung { padding: .6rem .7rem; }
  .pruefliste td:nth-child(3) { display: none; }
}

/* Ruhige Formulare und Seitenkopf (04.10.2026): Felder untereinander, Optionsgruppen einheitlich gerahmt,
   Optionsfelder neben ihrer Beschriftung; je Seite höchstens ein Leitsatz. */
.leitsatz { color: var(--leise); margin: -.4rem 0 1.2rem; max-width: 70ch; }
.spalten { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); gap: 0 1.2rem; align-items: start; }
.formular { display: grid; gap: .1rem; }
.formular label { margin-top: .6rem; }
.formular .zwei { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.formular fieldset, fieldset.art-wahl { border: 1px solid var(--linie); border-radius: var(--radius); padding: .45rem .9rem .7rem; margin: .8rem 0 0; }
.formular legend, fieldset.art-wahl legend { font-weight: 600; font-size: .9rem; padding: 0 .3rem; }
label.wahl { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; font-weight: 400; margin: .45rem 0 0; }
label.wahl input[type=radio], label.wahl input[type=checkbox] { width: auto; margin: 0; flex: none; }
label.wahl input.kurz { width: 12rem; flex: none; }
.formular button { justify-self: start; width: auto; padding-inline: 1.6rem; margin-top: 1.1rem; }
.warteschlange summary { cursor: pointer; }
.warteschlange summary h2 { display: inline; }
.stufen-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: 0 0 .8rem; font-weight: 600; }
.stufen-zeile .stufe-marke { font-weight: 600; }

/* Kontrolle als eine Liste (04.10.2026): Feststellung = Kopf mit ausgeschriebener Stufe, Bezug, Text, Bildbeleg,
   ein Klick zum Bestätigen; alles Weitere eingeklappt. */
.kontrolle-ueberblick .stufen-zeile { margin-bottom: .4rem; }
.offen-zahl { margin-left: .4rem; color: var(--fehler); font-weight: 600; }
h2.abschnitt { margin: 1.6rem 0 .4rem; }
.fs-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .7rem; }
.fs-kopf h3 { flex: 1 1 14rem; margin: 0; font-size: 1.05rem; }
.fs-kopf .stufe-marke { font-size: .8rem; padding: .1rem .55rem; }
.fs-status { font-size: .82rem; color: var(--leise); }
.fs-status.fs-offen { color: var(--fehler); font-weight: 600; }
.fs-status.fs-bestaetigt { color: var(--erfolg, #2e7d32); font-weight: 600; }
.fs-bezug { margin: .25rem 0 .4rem; font-size: .85rem; color: var(--leise); }
.fs-text { margin: .3rem 0 .5rem; line-height: 1.5; }
.fs-belege { display: flex; flex-wrap: wrap; gap: .6rem; margin: .5rem 0; }
.fs-belege a { display: flex; flex-direction: column; gap: .2rem; max-width: 22rem; text-decoration: none;
  border: 1px solid var(--linie); border-radius: var(--radius); padding: .3rem; background: #fff; }
.fs-belege img { display: block; max-width: 100%; max-height: 13rem; object-fit: contain; object-position: left top; }
.fs-belege span { font-size: .8rem; color: var(--leise); }
.fs-aktionen { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .5rem 1rem; margin-top: .6rem;
  padding-top: .6rem; border-top: 1px dashed var(--linie); }
.fs-mehr { flex: 1 1 16rem; }
.fs-mehr > summary { cursor: pointer; color: var(--akzent); font-size: .9rem; }
.fs-mehr[open] > summary { margin-bottom: .3rem; }
.feststellung.durchsicht-bestaetigt { background: #f6faf6; }
.produkt-kurz h3 { margin: 0; font-size: 1rem; }
.freigabe-karte button { width: auto; padding-inline: 1.6rem; }
@media (max-width: 640px) { .fs-belege a { max-width: 100%; } }
/* Markierte Ausschnitte über die volle Breite – sonst ist die markierte Stelle zu klein zum Lesen. */
.fs-belege a.beleg-ausschnitt { flex: 1 1 100%; max-width: 100%; }
.fs-belege a.beleg-ausschnitt img { max-height: 14rem; }

/* Rechtsgrundlagen als Link zur genauen Stelle (Nutzer 04.10.2026: „blau unterlegt“) */
a.norm-link { background: #e3eef8; color: #1a4e8a; text-decoration: none; border-bottom: 1px solid #9dbbe0;
  border-radius: 3px; padding: 0 .2rem; white-space: normal; }
a.norm-link:hover, a.norm-link:focus { background: #cfe0f3; border-bottom-color: #1a4e8a; }
.normen-zeile { margin: -.2rem 0 .5rem; }
button.normen-alle { font-size: .85rem; color: #1a4e8a; }

/* Gebiet: Ortsteile, Arbeitsliste, Verzeichnis (07.10.2026) */
.gebiet-zeile { display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; }
.gebiet-zeile label { margin: 0; display: flex; gap: .35rem; align-items: center; }
.gebiet-zeile select, .gebiet-zeile input { width: auto; margin: 0; }
.gebiet-zeile select[name=ortsteil_id] { width: 15rem; max-width: 100%; }      /* Prüfung 15.10.2026, Punkt 73 */
.gebiet-zeile button { width: auto; margin: 0; }
.gebiet-zeile details { display: inline-block; }
.ortsteil-liste { margin: .2rem 0 .6rem; padding-left: 1.1rem; }
.ortsteil-liste li { padding: .1rem 0; }
.ortsteil-gruppe { margin: .5rem 0 0; }

/* Gebietswahl in der Kopfleiste (07.10.2026) */
.gebietswahl { position: relative; }
.gebietswahl > summary { cursor: pointer; list-style: none; padding: .25rem .6rem; border: 1px solid var(--linie, #d5dde0); border-radius: 7px; font-size: .88rem; white-space: nowrap; max-width: 22rem; overflow: hidden; text-overflow: ellipsis; }
.gebietswahl > summary::-webkit-details-marker { display: none; }
.gebietswahl > summary::after { content: " ▾"; color: var(--leise); }
.gebietswahl[open] > summary { background: var(--akzent-hell, #e6f0f2); }
.gebietswahl-feld { position: absolute; right: 0; top: calc(100% + .35rem); z-index: 60; width: min(30rem, 92vw); max-height: 72vh; overflow: auto; background: var(--flaeche, #fff); border: 1px solid var(--linie, #d5dde0); border-radius: 9px; box-shadow: 0 10px 28px rgba(0,0,0,.14); padding: .7rem .8rem; }
@media (max-width: 640px) { .gebietswahl, .gebietswahl > summary { width: 100%; max-width: none; } .gebietswahl-feld { position: static; width: auto; max-height: none; } }
.gw-form { margin: 0; }
.gw-suche { width: 100%; margin: 0 0 .5rem; }
.gw-schnell { display: flex; flex-wrap: wrap; gap: .2rem 1rem; padding-bottom: .4rem; margin-bottom: .4rem; border-bottom: 1px solid var(--linie, #d5dde0); }
.gw-baum, .gw-baum ul { list-style: none; margin: 0; padding: 0; }
.gw-baum ul { padding-left: 1.25rem; }
.gw-baum li { padding: .08rem 0; }
.gw-baum summary { cursor: pointer; }
.gw-zeile { display: inline-flex; align-items: center; gap: .35rem; margin: 0; font-weight: normal; cursor: pointer; }
.gw-zeile input { width: auto; margin: 0; }
.gw-zahl, .gw-plz { font-size: .8rem; color: var(--leise); }
.gw-plz { margin-left: .2rem; }
.gw-zahl::before { content: "· "; }
.gw-offen em { color: var(--leise); }
.gw-besonders { border-top: 1px solid var(--linie, #d5dde0); margin-top: .35rem; padding-top: .3rem !important; }
.gw-besonders + .gw-besonders { border-top: 0; margin-top: 0; padding-top: .08rem !important; }
.gw-knoepfe { display: flex; gap: .6rem; justify-content: flex-end; margin-top: .6rem; position: sticky; bottom: -.7rem; background: var(--flaeche, #fff); padding: .45rem 0; }
.gw-knoepfe button { width: auto; margin: 0; }
.gw-seite .gebietswahl-feld { position: static; }
.gw-knoepfe .zweitrangig { background: var(--flaeche); color: var(--akzent); border: 1px solid var(--akzent); }
.gw-titel { font-size: 1rem; margin: 1.1rem 0 .2rem; }
#formular .gw-baum-rahmen { border: 1px solid var(--linie); border-radius: 8px; padding: .6rem .8rem; max-height: 26rem; overflow: auto; }

/* Deckadresse erst, wenn „verdeckt“ gewählt ist (Fable-Review 2, 08.10.2026) */
.art-wahl:not(:has(input[value="verdeckt"]:checked)) .art-deck { display: none; }

/* --- Schlicht wie ein Amtsprogramm (Nutzer 09.10.2026) ------------------------------------------------------------
   Markierungen in Katalog, Akte, Prüfseite und Suche sind Text: keine farbige Hinterlegung, keine runden Umrandungen
   („das ist ein Amtsprogramm, keine Spielerei“). Steht eine Markierung hinter anderem Text, trennt ein Mittelpunkt.
   Knöpfe bleiben Knöpfe. Steht am Ende der Datei, damit es die Farbvarianten (.weg-versand, .guete-hoch …) überstimmt. */
.stufe, .status-marke, .status-marke[class*="status-"], .weg, .weg[class*="weg-"], .guete, .guete[class*="guete-"],
.marke-korrigiert, .marke-rueckwaerts, .marke-bezirk, .auswaerts, .zust-unklar {
  display: inline; width: auto; min-width: 0; padding: 0; margin: 0; border: 0; border-radius: 0; background: none;
  box-shadow: none; color: inherit; font-size: inherit; font-weight: inherit; white-space: normal; }
.auswaerts::before, .zust-unklar::before, .marke-korrigiert::before, .marke-rueckwaerts::before { content: "· "; }
.reiter a .zahl { display: inline; min-width: 0; padding: 0; margin-left: .2rem; border-radius: 0; background: none;
                  font-size: inherit; color: inherit; }
.reiter a .zahl::before { content: "("; }
.reiter a .zahl::after { content: ")"; }
/* Die blau hervorgehobene Zeile (Lineal) behält ihre senkrechten Trennlinien – sonst verschwinden sie im Blau */
.katalog-tabelle tr.im-blick > td:not(:first-child) { border-left-color: #8fadcc; }


/* --- Bemerkungen und Nachrichten (Grill 09.10.2026) – schlicht, ohne Hinterlegung ------------------------------- */
.bemerkung-form { margin-bottom: 1rem; }
.bemerkung-form textarea { margin-top: .4rem; }
.bemerkung-an summary { cursor: pointer; font-size: .9rem; }
.bemerkung-an-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .15rem .8rem;
                      margin: .4rem 0; padding: .4rem 0; border-top: 1px solid var(--linie); border-bottom: 1px solid var(--linie); }
.bemerkung-an-liste label { display: flex; align-items: center; gap: .4rem; font-weight: 400; margin: 0; }
.bemerkung-an-liste input { width: auto; margin: 0; }
.bemerkung-knopfzeile { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .8rem; margin: .4rem 0 0; }
.bemerkung { border-top: 1px solid var(--linie); padding: .5rem 0; }
.bemerkung p { margin: 0 0 .2rem; }
.bemerkung-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.erwaehnen-liste { list-style: none; margin: .2rem 0 0; padding: 0; border: 1px solid var(--linie); max-width: 22rem; background: var(--flaeche); }
.erwaehnen-liste button { display: block; width: 100%; margin: 0; padding: .3rem .5rem; text-align: left; background: none;
                          color: var(--text); font-weight: 400; border-bottom: 1px solid var(--linie); }
.erwaehnen-liste button:hover, .erwaehnen-liste button:focus { text-decoration: underline; }
.nachrichten-liste tr.ungelesen td { font-weight: 600; }
.menue a.nachrichten-neu { font-weight: 600; }


/* --- Desktop statt Handy (Nutzer 12.10.2026) ----------------------------------------------------------------------
   Gearbeitet wird an Bildschirmen von 13 bis 23 Zoll, nie am Handy: Jede Seite nutzt die Breite wie der Katalog
   (.inhalt bis 1560 px). Fließtext behält eine lesbare Zeilenlänge, Formulare legen ihre Felder nebeneinander
   (.raster), Formularknöpfe sind so breit wie ihr Text (.knopf-auto). Lange Seiten stellen Karten nebeneinander:
   .nebeneinander bildet zwei Spalten, sobald jede mindestens 36rem breit sein kann – eine einzelne Karte nimmt die
   ganze Breite. Die schmale Karte (.karte.schmal) bleibt den Anmelde- und Fehlerseiten vorbehalten. */
:where(.inhalt) p { max-width: 105ch; }
.knopf-auto { width: auto; min-width: 12rem; }
.nebeneinander { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 36rem), 1fr)); gap: 0 1.2rem;
                 align-items: start; }
.nebeneinander > * { min-width: 0; }
.raster.oben { align-items: start; }
.raster .feld-breit { grid-column: 1 / -1; }                           /* Dienststelle nicht abgeschnitten (Punkt 133) */
.raster.zwei-zu-eins { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.korb-automatik { margin-bottom: 1.2rem; }   /* „Automatisch beproben“ über dem Sammelkorb (Nutzer 12.10.2026) */
.lebenszeichen { margin: .4rem 0 0; }     /* läuft seit … · letzte Meldung vor … (Nutzer 12.10.2026) */
.lebenszeichen.still { color: var(--hinweis); }
button.gefahr { background: var(--fehler); }            /* Löschen, Zurücksetzen – Knöpfe mit endgültiger Wirkung */
.suchzeile .feld.feld-kurz { flex: 0 1 20rem; }

/* --- Rückwärts-Probensuche im Reiter Probenahme (Nutzer 14.10.2026) -----------------------------------------------
   Schlicht über den Vorgängen: Suchzeile mit „Liste hochladen“ daneben; die Dateiauswahl selbst ist unsichtbar, der
   Knopf ist ihre Beschriftung. Je Anforderung eine Kopfzeile in der Tabelle, der Rest unter „+ n weitere“. */
.probensuche .suchzeile { margin-bottom: .4rem; }
.probensuche label.probenliste-knopf { align-self: flex-end; margin-left: 0; cursor: pointer; }
/* Während des Hochladens (Prüfstand 17.10.2026, Befund 27): Wartetext am Label, keine zweite Auswahl */
.probensuche label.probenliste-knopf[aria-disabled="true"] { cursor: progress; opacity: .7; }
.probensuche-aeltere { margin: .3rem 0 0; }
.probensuche-aeltere > summary { cursor: pointer; }
.probenliste-form { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.probensuche-tabelle tr.anforderung th { text-align: left; padding-top: 1rem; }
.probensuche-tabelle details.weitere > table { margin: 0; }
/* Ruhiges Zeilenbild (Nutzer 15.10.2026: Zeilenhöhe, Knöpfe und Schrift „unbeständig“): feste Spalten – auch in der
   Unterliste „+ n weitere“, die sonst eigene Breiten, kleinere und graue Schrift bekam –, jede Angebotszeile gleich hoch
   (Produkt höchstens zwei Zeilen, Shop eine Zeile und darunter die Webadresse), der Knopf bricht nie um. */
.probensuche-tabelle { table-layout: fixed; }
.probensuche-tabelle col.sp-produkt { width: 42%; }
.probensuche-tabelle col.sp-shop { width: 30%; }
.probensuche-tabelle col.sp-ort { width: 16%; }
.probensuche-tabelle col.sp-aktion { width: 12%; }
.probensuche-tabelle tr.angebot > td { height: 4rem; }
.probensuche-tabelle .zwei-zeilen { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; }
.probensuche-tabelle .eine-zeile { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.probensuche-tabelle .klein-knopf { white-space: nowrap; }
.probensuche-tabelle td.weitere-zelle { padding: 0; }
.probensuche-tabelle .weitere { margin: 0; font-size: inherit; color: inherit; }
.probensuche-tabelle .weitere > summary { padding: .5rem; font-size: .8rem; color: var(--leise); }
.probensuche-tabelle .weitere > table tr:last-child > td { border-bottom: 0; }
.probensuche h2 .klein { font-weight: 400; }
.probensuche-listen { margin: .8rem 0 0; }
/* Stufe C (Nutzer 17.10.2026): die Stufe als Text unter dem Produkt, eine Zeile, voller Wortlaut im Titel. Alle Zeilen
   einer geprüften Anforderung sind gleich hoch – auch die noch ungeprüften (Zeilenbild ruhig, Nutzer 15.10.2026). */
.probensuche-tabelle tr.angebot.mit-befund > td { height: 5.2rem; }
.probensuche-tabelle .befund { margin-top: .2rem; }
.probensuche-tabelle tr.anforderung .pruefen-form { margin-left: .4rem; }

/* --- Gesperrte Knöpfe sehen gesperrt aus (Prüfung 15.10.2026, Punkt 55) ----------------------------------------- */
button:disabled, input[type=submit]:disabled, .knopf[aria-disabled=true] { opacity: .5; cursor: not-allowed; }
.fs-geprueft a, .kennung, .zusammen { white-space: nowrap; }                      /* „B-“ / „9“ (Punkt 83) */
.zeichenzaehler { margin: .2rem 0 0; color: var(--leise); }
.zeichenzaehler.zu-lang { color: var(--fehler); font-weight: 600; }
/* Meldung für Hintergrund-Aktionen, die scheitern (Punkt 53) */
.hintergrund-meldung { position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 50;
  max-width: min(44rem, calc(100% - 2rem)); display: flex; gap: .8rem; align-items: center; flex-wrap: wrap;
  box-shadow: 0 6px 24px rgb(0 0 0 / .18); }

/* --- Absendesperre (Prüfung 15.10.2026, Punkte 18 und 19, web/static/absenden.js) ----------------------------------
   Ein abgeschicktes Formular zeigt „Bitte warten …“; während einer Nachlade-Anfrage ist der auslösende Knopf gesperrt. */
button[data-absendesperre], input[data-absendesperre] { cursor: progress; opacity: .7; }
button.htmx-request, form.htmx-request button[type=submit], form.htmx-request input[type=submit] {
  pointer-events: none; opacity: .6; }

/* --- Schlicht auch außerhalb des Katalogs (Prüfung 15.10.2026, Punkt 111) ------------------------------------------
   Status und Markierungen in Probenahme, Kontrolle, Rückwärtssuche, Recherche und Verwaltung waren noch farbige,
   runde Pillen. Wie im Katalog: Text, ohne Hinterlegung und ohne Umrandung. Zähler im Menü bleiben. */
.status, .status[class*=" "], .marke-verdeckt, .marke-rolle, .marke-test, .marke-maske, .marke-fremd, .marke-risiko,
.marke-notloesung, .marke-recht {
  display: inline; min-width: 0; padding: 0; margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
  color: inherit; font-size: inherit; white-space: normal; }
.status { font-weight: 600; }
.marke-test::before, .marke-verdeckt::before, .marke-maske::before { content: "· "; }
/* Prüfstand 17.10.2026, Befund 37: Auch die Stufen der Online-Kontrolle sind Text („1 × Verstoß“), keine roten,
   orangen und grauen Plaketten. Die Kopfzeile der Feststellungen fließt dafür als Satz („…: 1 × Verstoß, 2 × …“). */
.stufe-marke, .stufe-marke[class*="stufe-"] {
  display: inline; min-width: 0; padding: 0; margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
  color: inherit; font-size: inherit; font-weight: 600; white-space: normal; }
.stufen-zeile { display: block; }
.rueckwaerts-funde { table-layout: fixed; }                             /* Spalten springen nicht (Punkt 123) */
.rueckwaerts-funde td form { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
/* Häkchen vor ihrem Text, nicht allein darüber (Punkt 115) */
.kandidaten label, label.haken-zeile { display: flex; gap: .5rem; align-items: baseline; font-weight: 400; }

/* --- Kopfleiste: „Verwaltung ▾“ (Prüfung 15.10.2026, Punkte 125/126) – ab 13 Zoll einzeilig ---------------------- */
.kopf { flex-wrap: nowrap; gap: .5rem 1rem; padding-inline: clamp(1rem, 2.5vw, 2.5rem); }
.marke { font-size: 1.3rem; }
/* Wird es doch zu eng (Zähler an Fristen und Nachrichten), bricht das Menü rechts neben dem Logo um, nicht darunter */
.menue { flex: 1 1 auto; justify-content: flex-end; gap: .3rem .75rem; }
.kopf-suche input { width: 8.5rem; }
@media (max-width: 900px) { .kopf { flex-wrap: wrap; } .menue { justify-content: flex-start; } }
.menue-mehr { position: relative; }
.menue-mehr > summary { cursor: pointer; list-style: none; white-space: nowrap; color: var(--akzent); }
.menue-mehr > summary::-webkit-details-marker { display: none; }
.menue-mehr > summary::after { content: " ▾"; color: var(--leise); }
.menue-mehr-feld { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 60; display: grid; min-width: 13rem;
  padding: .35rem 0; background: var(--flaeche, #fff); border: 1px solid var(--linie, #d5dde0); border-radius: 9px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .14); }
.menue-mehr-feld a { padding: .35rem .95rem; white-space: nowrap; }
.menue-mehr-feld a:hover, .menue-mehr-feld a:focus { background: var(--akzent-hell, #e6f0f2); }
.menue-mehr-feld hr { border: 0; border-top: 1px solid var(--linie, #d5dde0); margin: .3rem 0; }