/* Bereich verwaltung — seitenspezifische Regeln.
   Nur Tokens aus app.css verwenden (var(--…)), keine Hex-Farben; Vorgabe:
   docs/DESIGNSYSTEM.md. Gemeinsame Komponenten gehören nach app.css.
   Präfix .vw-: Portal-Team (/admin) und Verwaltung (/anbieter/team, objekte,
   reporting, api). */

/* ---------- Abschnitte & Raster ---------- */
.vw-abschnitt{font-size:var(--fs-lg);font-family:var(--font-text);font-weight:600;color:var(--ink);
  margin:var(--sp-6) 0 var(--sp-3)}
.vw-dash{display:grid;gap:var(--sp-5);grid-template-columns:minmax(0,1fr);margin-bottom:var(--sp-5)}
.vw-dash>.card{margin-bottom:0}
@media(min-width:900px){
  .vw-dash{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
  .vw-dash-unten{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
.vw-dash-unten{margin-top:var(--sp-5)}
.card .card-kopf h2{font-size:var(--fs-lg);font-family:var(--font-text);font-weight:600}
.vw-fussnote{font-size:var(--fs-sm);margin:var(--sp-4) 0 0}

/* ---------- Liste bündig in einer Karte (iOS „inset grouped“ ohne Doppelrahmen) ---------- */
.card .liste.vw-aufgabenliste,.card .liste.vw-bereiche{border:0;border-radius:0;background:transparent;
  margin:0 calc(-1 * var(--sp-6)) calc(-1 * var(--sp-4));border-top:1px solid var(--line)}
@media(max-width:640px){
  .card .liste.vw-aufgabenliste,.card .liste.vw-bereiche{margin:0 calc(-1 * var(--sp-4)) calc(-1 * var(--sp-3))}
  .card .liste.vw-aufgabenliste>li>a,.card .liste.vw-bereiche>li>a{padding-left:var(--sp-4);padding-right:var(--sp-4)}
}
.card .liste.vw-bereiche>li>a{padding-left:var(--sp-6);padding-right:var(--sp-6)}
.card .liste.vw-aufgabenliste>li>a{padding-left:var(--sp-6);padding-right:var(--sp-6)}
.vw-bereiche .neben{margin-left:auto;text-align:right}
.vw-aufgabe-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.vw-aufgabe-titel{font-weight:600;color:var(--ink)}
.vw-aufgabe-hinweis{color:var(--text-2);font-size:var(--fs-sm)}
.vw-aufgabenliste .badge{margin-left:auto}

/* ---------- Ampel-Balken ---------- */
.vw-balken{display:flex;height:12px;border-radius:var(--radius-pill);overflow:hidden;background:var(--fill);gap:2px}
.vw-balken-teil{display:block;height:100%;min-width:6px}
.vw-balken-teil.ok{background:var(--ok)}
.vw-balken-teil.warn{background:var(--warn)}
.vw-balken-teil.err{background:var(--err)}
.vw-legende{display:flex;flex-wrap:wrap;gap:var(--sp-3) var(--sp-6);margin:var(--sp-4) 0 0}
.vw-legende>div{display:flex;align-items:center;gap:var(--sp-2)}
.vw-legende dt{margin:0}
.vw-legende dd{margin:0;font-family:var(--font-display);font-size:var(--fs-lg);color:var(--ink);font-variant-numeric:tabular-nums}

/* ---------- Tabellen ---------- */
.vw-tabelle td{vertical-align:middle}
.vw-tabelle td.zahl,.vw-tabelle td.betrag{font-variant-numeric:tabular-nums;white-space:nowrap}
.vw-tabelle .vw-zweit{display:block;color:var(--text-2);font-size:var(--fs-sm)}
.vw-tabelle td.vw-umbruch{word-break:break-word;overflow-wrap:anywhere}
.vw-tabelle .vw-kennung{font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--text-2);white-space:nowrap}
.vw-tabelle td.vw-aktionen-zelle{text-align:right}
.vw-aktionen{display:flex;gap:var(--sp-2);flex-wrap:wrap;justify-content:flex-end;align-items:center}
.vw-aktionen form{margin:0}
@media(max-width:640px){
  table.stapel.vw-tabelle td{align-items:center}
  table.stapel.vw-tabelle td.vw-aktionen-zelle{display:block;padding-top:var(--sp-2)}
  table.stapel.vw-tabelle .vw-aktionen{justify-content:flex-start}
  table.stapel.vw-tabelle .vw-kennung{white-space:normal;word-break:break-all}
}

/* Kleine Formulare in einer Tabellenzeile: Feld + Knopf in einer Reihe. */
.vw-zeilenform{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;justify-content:flex-end;margin:0}
.vw-zeilenform input:not([type=checkbox]):not([type=hidden]),.vw-zeilenform select{width:auto;min-width:9rem;flex:1 1 9rem;margin:0}
.vw-zeilenform label{margin:0}
@media(max-width:640px){.vw-zeilenform{justify-content:flex-start;width:100%}
  .vw-zeilenform input:not([type=checkbox]):not([type=hidden]),.vw-zeilenform select{flex:1 1 100%}}

/* Visuell verborgen, für Screenreader lesbar (Label an Feldern in Tabellenzeilen). */
.vw-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Werkzeugleiste (Suche, Aktionen über Tabellen) ---------- */
.vw-werkzeuge{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:flex-end}
.vw-werkzeuge .feld{flex:1 1 16rem;margin:0}
.vw-werkzeuge form{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:flex-end;flex:1 1 20rem;margin:0}
.vw-werkzeuge form .feld{flex:1 1 12rem}

/* ---------- Aufgaben-Kacheln der Finanzen ---------- */
.vw-aktionsraster{display:grid;gap:var(--sp-4);grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.vw-aktionsraster>.card{margin:0;display:flex;flex-direction:column}
.vw-aktionsraster>.card form{margin-top:auto}
.vw-aktionsraster h3{margin:0 0 var(--sp-1);font-size:var(--fs-body)}
.vw-aktionsraster p{color:var(--text-2);font-size:var(--fs-sm);margin:0 0 var(--sp-4)}

/* ---------- Prüfung / Snapshot ---------- */
.vw-snapshot{white-space:pre-wrap;word-break:break-word;font-family:var(--font-mono);font-size:var(--fs-xs);
  background:var(--fill);color:var(--text);padding:var(--sp-3) var(--sp-4);border-radius:var(--radius-input);
  max-height:22rem;overflow:auto;margin:var(--sp-3) 0 0}
.vw-regeln{list-style:none;padding:0;margin:var(--sp-3) 0 0;display:grid;gap:var(--sp-2)}
.vw-regeln li{display:flex;gap:var(--sp-2);align-items:baseline}
.vw-kopfzeile-meta{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;margin:0 0 var(--sp-3)}
.vw-fall h2{margin:0}
.vw-trenner{border:0;border-top:1px solid var(--line);margin:var(--sp-5) 0}

/* ---------- Checklisten-Zeichen ---------- */
.vw-haken{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;
  font-size:.75rem;font-weight:700;flex:none}
.vw-haken.ok{background:var(--ok-bg);color:var(--ok)}
.vw-haken.err{background:var(--err-bg);color:var(--err)}

/* ---------- Blättern ---------- */
.vw-blaettern{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;
  margin-top:var(--sp-4);color:var(--text-2);font-size:var(--fs-sm)}
.vw-blaettern .vw-aktionen{justify-content:flex-end}

/* ---------- Leerzustand in einer Karte etwas kompakter ---------- */
.card .vw-leer{padding:var(--sp-6) var(--sp-4)}
.vw-leer .symbol{display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--text-2)}

/* ---------- Kennzahlen-Seite ---------- */
.vw-kpi-zusatz{color:var(--text-2);font-size:var(--fs-xs)}
.kpi.vw-hervor .n{color:var(--accent-ink)}

/* ---------- API-Scopes als Ankreuzliste ---------- */
.vw-scopes{display:grid;gap:0 var(--sp-5);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));margin:0}
.vw-scopes legend{font-weight:600;font-size:var(--fs-sm);color:var(--ink);margin-bottom:var(--sp-2);padding:0}
fieldset.vw-scopes{border:0;padding:0}
.vw-scopes label code{background:transparent;padding:0}

/* Dashboard: rechte Spalte = Ampel + Marktplatz-Kacheln 2 × 2 */
.vw-spalte{display:flex;flex-direction:column;gap:var(--sp-3);min-width:0}
.vw-spalte>.card{margin:0}
.vw-spalte .vw-abschnitt{margin:var(--sp-3) 0 0}
.grid3.vw-kpi-2:has(>.kpi){grid-template-columns:repeat(2,minmax(0,1fr))}
.vw-abstand-oben{margin-top:var(--sp-5)}
.card>h2.vw-karte-titel,.card h2.vw-karte-titel,.card h3.vw-karte-titel{font-size:var(--fs-lg);font-family:var(--font-text);font-weight:600;margin:0 0 var(--sp-3)}
.vw-feldtitel{display:block;font-weight:500;font-size:var(--fs-sm);color:var(--ink);margin:0 0 6px}
.vw-zeilenform.vw-links{justify-content:flex-start;flex-wrap:nowrap}
.vw-zeilenform.vw-links select{flex:0 1 11rem;min-width:8.5rem}
@media(max-width:640px){.vw-zeilenform.vw-links{justify-content:flex-end}.vw-zeilenform.vw-links select{flex:0 1 11rem}}
.vw-scope-liste{justify-content:flex-start}
@media(max-width:640px){table.stapel.vw-tabelle .vw-scope-liste{justify-content:flex-end}}

/* Zweistufige Aktion in einer Tabellenzeile: erst aufklappen, dann bestätigen. */
details.vw-klapp{display:inline-block;text-align:right;max-width:100%}
details.vw-klapp>summary{display:inline-flex;width:auto;margin-left:auto}
details.vw-klapp>summary::after{content:none}
details.vw-klapp[open]>summary{margin-bottom:var(--sp-2)}
details.vw-klapp>form{min-width:min(22rem,100%)}
@media(max-width:640px){details.vw-klapp{display:block;text-align:left}details.vw-klapp>form{min-width:0}}
@media(max-width:640px){.vw-bereiche .neben{display:none}}
/* Lange Knopftexte dürfen auf schmalen Schirmen umbrechen statt über den Rand zu laufen. */
.btn.vw-lang{white-space:normal;text-align:center;max-width:100%;height:auto;line-height:1.3}
/* Stapel-Tabelle: die erste Zelle (Name + Zweitzeile) wird auf dem Handy zum Kartentitel. */
@media(max-width:640px){
  table.stapel.vw-tabelle td.vw-kopfzelle{display:block;text-align:left;padding-bottom:var(--sp-2);font-size:var(--fs-body)}
  table.stapel.vw-tabelle td.vw-kopfzelle::before{content:none}
  table.stapel.vw-tabelle tbody tr:last-child{border-bottom:0}
}
/* Gebührenkatalog: Bearbeiten aufklappbar, damit die Liste überblickbar bleibt. */
details.vw-bearbeiten{border-top:1px solid var(--line);margin-top:var(--sp-4);padding-top:var(--sp-1)}
details.vw-bearbeiten>summary{color:var(--accent-ink)}
details.vw-bearbeiten[open]>summary{margin-bottom:var(--sp-2)}
.vw-kv-kurz{margin-top:var(--sp-3)}
.vw-kartenraster{display:grid;gap:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));align-items:start;margin-bottom:var(--sp-5)}
.vw-kartenraster>.card{margin:0}
