/* Werkbank — Einstellungen, neu geordnet am 30.10.2026 (Konzept „Einstellungen neu ordnen“, Entscheidungen von Flavio).
   Links eine flache Navigation in vier Gruppen mit Suche, rechts die Seite aus Zeilen: Titel, Stand in einem Satz,
   Status mit Wort und Punkt. Eine Zeile öffnet sich zum Bearbeiten, mehrere dürfen offen sein. Eckig wie der Rest der
   Software; die Rundung bleibt eine Ausnahme des Postfachs. Schmal wird die Navigation zur Startliste. */

html.wb .st-layout{display:grid;grid-template-columns:264px minmax(0,1fr);gap:28px;align-items:start}

/* ---------- Navigation ---------- */
html.wb .st-nav{position:sticky;top:18px;display:flex;flex-direction:column;gap:16px;min-width:0}
html.wb .st-such{position:relative;display:flex;align-items:center;gap:8px;height:40px;padding:0 12px;background:var(--surface);border:1px solid var(--field-line)}
html.wb .st-such:focus-within{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
html.wb .st-such-i{display:flex;color:var(--ink-faint)}
html.wb .st-such input{flex:1;min-width:0;height:100%;margin:0;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;font:inherit;font-size:14px;color:var(--ink);outline:none}
html.wb .st-such input::-webkit-search-cancel-button{display:none}
html.wb .st-treffer{position:absolute;left:-1px;right:-1px;top:calc(100% + 4px);z-index:40;max-height:60vh;overflow:auto;padding:6px 0;background:var(--surface);box-shadow:var(--shadow)}
html.wb .st-treffer[hidden]{display:none}
html.wb .st-tz{display:flex;flex-direction:column;gap:1px;width:100%;padding:8px 14px;border:0;background:transparent;font:inherit;text-align:left;cursor:pointer}
html.wb .st-tz b{font-size:14px;font-weight:600;color:var(--ink)}
html.wb .st-tz small{font-size:12.5px;color:var(--ink-soft)}
html.wb .st-tz.an,html.wb .st-tz:hover{background:var(--accent-soft)}
html.wb .st-tz-leer{margin:0;padding:8px 14px;font-size:13.5px;color:var(--ink-soft)}
html.wb .st-nliste{display:flex;flex-direction:column;gap:14px}
html.wb .st-ngruppe{display:flex;flex-direction:column;gap:2px}
html.wb .st-ngtitel{padding:0 12px 4px;font-size:12.5px;font-weight:650;color:var(--ink-faint)}
html.wb .st-nitem{display:flex;align-items:center;gap:12px;min-height:38px;padding:8px 12px;color:var(--ink-mid);font-size:14.5px;font-weight:500;text-decoration:none}
html.wb .st-nitem svg{flex:none;width:18px;height:18px;color:var(--ink-soft)}
html.wb .st-nitem:hover{background:var(--wb-hover);color:var(--ink)}
html.wb .st-nitem:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
html.wb .st-nitem.an{background:var(--accent-soft);color:var(--accent-dark);font-weight:650}
html.wb .st-nitem.an svg{color:var(--accent-dark)}
html.wb .st-nt{display:flex;flex-direction:column;flex:1;min-width:0}
html.wb .st-nt b{font-weight:inherit}
html.wb .st-nt small{display:none}
html.wb .st-nitem .st-pfeil{display:none}
html.wb .st-nzahl{flex:none;display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;background:var(--wb-warn);color:var(--surface);font-size:11.5px;font-weight:700}
html.wb .st-nzahl[hidden]{display:none}

/* ---------- Seite ---------- */
html.wb .st-seite{display:flex;flex-direction:column;gap:16px;min-width:0}
html.wb .st-zurueck{display:none}
html.wb .st-kopf{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:10px 20px}
html.wb .st-kopf h2{margin:0;font-size:22px;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
html.wb .st-kopf p{margin:4px 0 0;max-width:660px;font-size:14px;line-height:1.5;color:var(--ink-soft)}
html.wb .st-link{display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:650;color:var(--accent-dark);text-decoration:none}
html.wb .st-link:hover{text-decoration:underline}
html.wb #stFehlt{display:flex;flex-direction:column;gap:8px}
html.wb #stFehlt:empty{display:none}
html.wb .st-fehlt{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px;padding:12px 16px;background:var(--wb-warn-bg)}
html.wb .st-fehlt-n{font-size:22px;font-weight:700;line-height:1;color:var(--wb-warn)}
html.wb .st-fehlt-t{display:flex;flex:1;flex-direction:column;gap:2px;min-width:200px}
html.wb .st-fehlt-t b{font-size:14.5px;font-weight:700;color:var(--ink)}
html.wb .st-fehlt-t small{font-size:13px;color:var(--ink-mid)}
html.wb .st-fehlt .btn{text-decoration:none}

/* Gruppe: weiße Karte mit Überschrift; wer sie ändert, steht rechts in einem Satz */
html.wb .st-gruppe{background:var(--surface);box-shadow:var(--wb-card)}
html.wb .st-gruppe[hidden]{display:none}
html.wb .st-gkopf{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;padding:14px 20px 12px}
html.wb .st-gkopf h3{margin:0;font-size:15.5px;font-weight:700;color:var(--ink)}
html.wb .st-gelt{font-size:13px;color:var(--ink-soft)}
html.wb .st-wer{display:inline-flex;align-items:center;gap:6px;margin-left:auto;font-size:12.5px;font-weight:600;color:var(--ink-soft)}
html.wb .st-leer{margin:0;padding:14px 20px 18px;border-top:1px solid var(--line);font-size:14px;color:var(--ink-soft)}
html.wb .st-fussnote{margin:2px 0 0;max-width:720px;font-size:13px;line-height:1.5;color:var(--ink-soft)}

/* Zeile */
html.wb .st-zeile{border-top:1px solid var(--line)}
html.wb .st-zeile[hidden]{display:none}
html.wb .st-zkopf{display:grid;grid-template-columns:minmax(150px,210px) minmax(0,1fr) auto 18px;align-items:center;gap:16px;width:100%;min-height:52px;
  padding:12px 20px;border:0;background:transparent;font:inherit;color:inherit;text-align:left;text-decoration:none;cursor:pointer}
html.wb .st-zkopf:hover{background:var(--wb-hover)}
html.wb .st-zkopf:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
html.wb .st-zkopf:disabled{cursor:default}
html.wb .st-zkopf:disabled:hover{background:transparent}
html.wb .st-zt{display:flex;align-items:center;gap:6px;min-width:0;font-size:14.5px;font-weight:650;color:var(--ink)}
html.wb .st-zs{min-width:0;overflow:hidden;font-size:14px;color:var(--ink-mid);text-overflow:ellipsis;white-space:nowrap}
html.wb .st-lade,html.wb .st-zeile.ist-aus .st-zs{color:var(--ink-faint)}
html.wb .st-zstat{display:flex;justify-content:flex-end}
html.wb .st-chev{flex:none;color:var(--ink-faint);transition:transform .15s}
html.wb .st-zeile.offen > .st-zkopf .st-chev{transform:rotate(180deg)}
html.wb .st-zeile.ist-aus .st-chev{opacity:.35}
html.wb .st-zeile.ist-verweis .st-zt{font-weight:600;color:var(--ink-mid)}
html.wb .st-zeile.offen > .st-zkopf{background:var(--wb-soft)}
html.wb .st-zinhalt{padding:6px 20px 24px}
html.wb .st-zinhalt[hidden]{display:none}
@media (prefers-reduced-motion:reduce){html.wb .st-chev{transition:none}}

/* Status: Wort und Punkt. Der Punkt ist eckig wie die übrigen Marken. */
html.wb .st-stat{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:650;white-space:nowrap}
html.wb .st-stat i{flex:none;width:7px;height:7px}
html.wb .st-ton-gut{color:var(--accent-dark)} html.wb .st-ton-gut i{background:var(--accent)}
html.wb .st-ton-aus{color:var(--ink-soft)} html.wb .st-ton-aus i{background:var(--ink-faint)}
html.wb .st-ton-warte{color:var(--ink-mid)} html.wb .st-ton-warte i{background:var(--info)}
html.wb .st-ton-fehlt{color:var(--wb-warn)} html.wb .st-ton-fehlt i{background:var(--wb-warn)}
html.wb .st-ton-fehler{color:var(--red)} html.wb .st-ton-fehler i{background:var(--red)}

/* Team und Rechte: belegte Plätze über den Teammitgliedern */
html.wb .st-team{display:flex;align-items:center;flex-wrap:wrap;gap:14px 20px;padding:14px 20px;background:var(--surface);box-shadow:var(--wb-card)}
html.wb .st-team-plaetze{display:flex;flex:1;flex-direction:column;gap:8px;min-width:220px;font-size:14px;color:var(--ink-mid)}
html.wb .st-team-plaetze b{color:var(--ink)}
html.wb .st-balken{display:block;max-width:320px;height:6px;background:var(--wb-seg)}
html.wb .st-balken i{display:block;height:100%;background:var(--accent)}
html.wb .st-sub{display:flex;align-items:center;gap:12px;margin:4px 0 0}
html.wb .st-sub-wer{display:flex;flex-direction:column;min-width:0}
html.wb .st-sub-wer small{font-size:13px;color:var(--ink-soft)}
html.wb .st-sub-akt{justify-content:flex-start!important;flex-wrap:wrap}

/* Die bisherigen Karten in der Zeile: ohne eigenen Rahmen und ohne doppelten Titel (den trägt die Zeile) */
html.wb .st-zinhalt .acc-card{margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
html.wb .st-zinhalt .acc-prof-head,html.wb .st-zinhalt .acc-prof-head + .acc-card-hr{display:none!important}
html.wb .st-zinhalt > div > .acc-int-head:first-child:not(:has(p)){display:none}
html.wb .st-zinhalt .acc-int-head h3{display:none}
html.wb .st-zinhalt > div > .acc-int-head:first-child + p.muted{margin-top:0!important}
html.wb .st-zinhalt .acc-actions{margin-top:16px}
html.wb .st-zinhalt .koop-card-sub{margin:0 0 12px}
html.wb .st-zinhalt .acc-ui-sofort{margin:0 0 6px}
html.wb .st-zinhalt .bmk-stand{align-items:center}

/* ---------- Schmal: erst die Liste der Seiten, dann die Seite mit Zurück ---------- */
@media (max-width:900px){
  html.wb .st-layout{grid-template-columns:minmax(0,1fr);gap:16px}
  html.wb .st-nav{position:static}
  html.wb .st-layout:not(.st-liste) .st-nav{display:none}
  html.wb .st-layout.st-liste .st-seite{display:none}
  html.wb .st-ngruppe{gap:0;background:var(--surface);box-shadow:var(--wb-card)}
  html.wb .st-ngtitel{padding:10px 16px 6px;background:var(--wb-page)}
  html.wb .st-nitem{min-height:56px;padding:10px 16px;border-top:1px solid var(--line)}
  html.wb .st-ngtitel + .st-nitem{border-top:0}
  html.wb .st-nt small{display:block;overflow:hidden;font-size:12.5px;font-weight:400;color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap}
  html.wb .st-nitem .st-pfeil{display:block;color:var(--ink-faint)}
  html.wb .st-zurueck{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;font-size:14px;font-weight:650;color:var(--accent-dark);text-decoration:none}
  html.wb .st-zurueck .st-chev{transform:rotate(180deg);color:currentColor}
  html.wb .st-zkopf{grid-template-columns:minmax(0,1fr) auto 16px;gap:2px 12px;padding:12px 16px}
  html.wb .st-zt{grid-column:1;grid-row:1}
  html.wb .st-zs{grid-column:1;grid-row:2;font-size:13px}
  html.wb .st-zstat{grid-column:2;grid-row:1 / span 2}
  html.wb .st-zkopf > .st-chev{grid-column:3;grid-row:1 / span 2}
  html.wb .st-gkopf{padding:12px 16px 10px}
  html.wb .st-wer{margin-left:0}
  html.wb .st-zinhalt{padding:6px 16px 20px}
  html.wb .st-team{padding:14px 16px}
}

/* Neuerungen im Dialog (Menü unter dem Namen): Liste ohne Akzentkante, Trennlinien zwischen den Einträgen */
html.wb #modalBody .neu-list{gap:0}
html.wb #modalBody .neu-item{padding:0 0 16px;margin:0 0 16px;border:0;border-bottom:1px solid var(--line)}
html.wb #modalBody .neu-item:last-child{margin-bottom:0;border-bottom:0}
html.wb #modalBody .neu-t{margin:4px 0 6px!important;padding:0!important;font-size:17px;font-weight:700}
html.wb #modalBody .neu-act{display:flex;gap:8px;margin-top:10px}
