/* Buchhaltung · Pommes & Wein – Gestaltung */
:root {
  --bg:#f6f5f2; --card:#fff; --text:#1f2328; --text2:#4b5058; --muted:#7a7f87; --line:#e8e5df; --line2:#d6d2ca;
  --accent:#e2621b; --accent2:#b5480c; --accent-soft:#fff1e7;
  --ok:#1f7a45; --ok-soft:#e6f5ec; --warn:#a15c00; --warn-soft:#fff3d6; --bad:#c0322b; --bad-soft:#fdeceb; --info:#2457c5; --info-soft:#e9f0fe;
  --r:12px; --r-sm:8px;
  --sh:0 1px 2px rgba(20,20,10,.04), 0 1px 3px rgba(20,20,10,.06);
  --sh2:0 8px 24px rgba(20,20,10,.10), 0 2px 6px rgba(20,20,10,.06);
  --fokus:0 0 0 3px rgba(226,98,27,.28);
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; font:15px/1.5 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background:var(--bg); color:var(--text);
  -webkit-font-smoothing:antialiased; }
a { color:var(--accent2); text-decoration:none; } a:hover { text-decoration:underline; }
:focus-visible { outline:none; box-shadow:var(--fokus); border-radius:6px; }
h1 { font-size:24px; line-height:1.25; font-weight:700; letter-spacing:-.01em; margin:0 0 4px; }
h2 { font-size:17px; font-weight:650; margin:24px 0 10px; } h3 { font-size:15px; font-weight:650; margin:16px 0 8px; }
.muted { color:var(--muted); } .small { font-size:13px; } .neg { color:var(--bad); } .pos { color:var(--ok); }
.r, td.r, th.r { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
pre { background:#f3f2ee; padding:10px; border-radius:var(--r-sm); overflow:auto; font-size:12.5px; }
.ico { width:18px; height:18px; flex:none; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; vertical-align:-3px; }

/* ---------- Grundgerüst: Menüleiste links, Inhalt rechts ---------- */
body:has(aside.seite) { display:flex; align-items:flex-start; min-height:100vh; }
aside.seite { position:sticky; top:0; width:248px; flex:none; height:100vh; overflow-y:auto; background:var(--card); border-right:1px solid var(--line);
  padding:18px 14px; display:flex; flex-direction:column; gap:18px; z-index:30; }
aside.seite .logo { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; color:var(--text); padding:2px 8px 6px; min-width:0; }
aside.seite .logo:hover { text-decoration:none; }
aside.seite .logo img { max-height:52px; max-width:92px; width:auto; height:auto; flex:none; object-fit:contain; }
aside.seite .logo .name { font-weight:700; font-size:17px; line-height:1.2; }
aside.seite .logo .name span { display:block; font-weight:500; font-size:12.5px; color:var(--muted); }
aside.seite nav { display:flex; flex-direction:column; gap:2px; }
aside.seite .gruppe { font-size:11px; font-weight:650; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); padding:12px 10px 4px; }
aside.seite nav a { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:var(--r-sm); color:var(--text2); font-weight:500; }
aside.seite nav a .ico { color:var(--muted); }
aside.seite nav a:hover { background:#f4f2ee; text-decoration:none; color:var(--text); }
aside.seite nav a.aktiv { background:var(--accent-soft); color:var(--accent2); }
aside.seite nav a.aktiv .ico { color:var(--accent); }
aside.seite nav .badge { margin-left:auto; background:var(--accent); color:#fff; border-radius:999px; padding:0 7px; font-size:12px; font-weight:650; line-height:20px; min-width:20px; text-align:center; }
aside.seite .postfach { background:#f8f7f4; border:1px solid var(--line); border-radius:var(--r); padding:12px; display:flex; flex-direction:column; gap:8px; }
aside.seite .postfach .kopf { display:flex; align-items:center; gap:8px; font-weight:650; font-size:13px; }
aside.seite .postfach button { width:100%; justify-content:center; }
aside.seite .abmelden { margin-top:auto; }
aside.seite .abmelden button { width:100%; justify-content:flex-start; }
main { flex:1; min-width:0; max-width:1280px; padding:28px 32px 48px; }
main.breit { max-width:none; }
.topbar { display:none; }
.schleier { display:none; }

@media (max-width:900px) {
  body:has(aside.seite) { display:block; }
  .topbar { display:flex; align-items:center; gap:10px; position:sticky; top:0; z-index:20; background:var(--card); border-bottom:1px solid var(--line); padding:8px 12px; }
  .topbar img { height:34px; } .topbar strong { font-size:15px; } .topbar .menue-knopf { margin-left:auto; }
  aside.seite { position:fixed; left:0; top:0; height:100vh; transform:translateX(-105%); transition:transform .2s ease; box-shadow:var(--sh2); }
  body.menue-offen aside.seite { transform:none; }
  body.menue-offen .schleier { display:block; position:fixed; inset:0; background:rgba(20,20,10,.35); z-index:25; }
  main { padding:18px 16px 40px; }
  h1 { font-size:21px; }
}

/* ---------- Seitenkopf ---------- */
.seitenkopf { display:flex; align-items:flex-end; justify-content:space-between; gap:12px 20px; flex-wrap:wrap; margin-bottom:20px; }
.seitenkopf .untertitel { color:var(--muted); margin:4px 0 0; max-width:760px; font-size:14px; }
.seitenkopf .aktionen { display:flex; gap:8px; flex-wrap:wrap; }

/* ---------- Karten, Kennzahlen, Aufgaben ---------- */
.card { background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:18px 20px; margin-bottom:16px; box-shadow:var(--sh); min-width:0; overflow-x:auto; }
.card > h2:first-child, .card > h3:first-child { margin-top:0; }
.card dd, .card p { overflow-wrap:anywhere; }
.grid { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); margin-bottom:16px; }
.kpi { background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:16px; box-shadow:var(--sh); }
.kpi .z { font-size:26px; font-weight:700; letter-spacing:-.01em; font-variant-numeric:tabular-nums; } .kpi .t { color:var(--muted); font-size:13px; }
.zwei { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; } @media (max-width:1200px) { .zwei { grid-template-columns:minmax(0,1fr); } }
.aufgaben { display:grid; gap:14px; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); margin-bottom:24px; }
.aufgabe { display:flex; flex-direction:column; gap:6px; background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:16px 18px; box-shadow:var(--sh);
  color:var(--text); position:relative; transition:box-shadow .15s, transform .15s, border-color .15s; }
.aufgabe:hover { text-decoration:none; box-shadow:var(--sh2); transform:translateY(-1px); border-color:var(--line2); }
.aufgabe .kopf { display:flex; align-items:center; gap:10px; color:var(--text2); font-weight:600; }
.aufgabe .kopf .ico { width:20px; height:20px; padding:6px; box-sizing:content-box; border-radius:10px; background:#f4f2ee; color:var(--text2); }
.aufgabe .zahl { font-size:32px; font-weight:750; line-height:1.1; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.aufgabe .text { color:var(--muted); font-size:13.5px; }
.aufgabe .weiter { margin-top:auto; padding-top:6px; color:var(--accent2); font-weight:600; font-size:13.5px; }
.aufgabe.dringend { border-color:#f3c9ab; background:linear-gradient(180deg,#fffaf6, #fff); }
.aufgabe.dringend .kopf .ico { background:var(--accent-soft); color:var(--accent); }
.aufgabe.erledigt .zahl { color:var(--muted); }
.erledigt-karte { display:flex; align-items:center; gap:14px; }
.erledigt-karte .ico { width:28px; height:28px; color:var(--ok); }
.statuszeile { display:flex; flex-wrap:wrap; gap:10px 24px; font-size:13.5px; color:var(--text2); }
.statuszeile > span { display:inline-flex; align-items:center; gap:8px; }
.punkt { width:8px; height:8px; border-radius:50%; background:var(--muted); display:inline-block; flex:none; }
.punkt.ok { background:#2fa463; } .punkt.warn { background:#e0a100; } .punkt.bad { background:var(--bad); }

/* ---------- Tabellen ---------- */
table { width:100%; border-collapse:separate; border-spacing:0; font-size:14px; }
th, td { text-align:left; padding:9px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.04em; background:#faf9f7; white-space:nowrap; }
tr:last-child td { border-bottom:0; }
tbody tr:hover td, table tr:hover td { background:#fbfaf8; }
td a { font-weight:500; }

/* ---------- Schilder und Meldungen ---------- */
.tag { display:inline-flex; align-items:center; gap:6px; padding:2px 10px; border-radius:999px; font-size:12px; font-weight:600; background:#f0eee9; color:#4b5058; white-space:nowrap; line-height:20px; }
.tag::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.7; }
.tag.ok { background:var(--ok-soft); color:var(--ok); } .tag.warn { background:var(--warn-soft); color:var(--warn); }
.tag.bad { background:var(--bad-soft); color:var(--bad); } .tag.info { background:var(--info-soft); color:var(--info); }
a.tag:hover { text-decoration:none; filter:brightness(.97); }
.meldungen { position:fixed; top:16px; right:16px; z-index:50; display:flex; flex-direction:column; gap:10px; max-width:min(440px, calc(100vw - 32px)); }
.meld { display:flex; align-items:flex-start; gap:10px; padding:12px 14px; border-radius:var(--r); background:var(--card); border:1px solid var(--line); box-shadow:var(--sh2);
  font-size:14px; animation:rein .2s ease; }
.meld .ico { margin-top:1px; }
.meld.ok { border-left:4px solid #2fa463; } .meld.ok .ico { color:var(--ok); }
.meld.bad { border-left:4px solid var(--bad); } .meld.bad .ico { color:var(--bad); }
.meld .zu { margin-left:auto; background:none; border:0; color:var(--muted); padding:0 2px; font-size:18px; line-height:1; cursor:pointer; min-height:0; box-shadow:none; }
.meld .zu:hover { color:var(--text); background:none; }
@keyframes rein { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
.hinweisbox { display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border-radius:var(--r-sm); background:var(--info-soft); color:#1e3a8a; font-size:14px; margin-bottom:14px; }
.leer { text-align:center; color:var(--muted); padding:28px 12px; }
.leer .ico { width:32px; height:32px; color:var(--line2); display:block; margin:0 auto 8px; }

/* ---------- Knöpfe ---------- */
button, .btn { display:inline-flex; align-items:center; gap:7px; background:var(--accent); color:#fff; border:1px solid transparent; border-radius:var(--r-sm);
  padding:0 16px; min-height:38px; font:inherit; font-weight:600; font-size:14px; cursor:pointer; text-decoration:none; transition:background .15s, box-shadow .15s, border-color .15s;
  box-shadow:0 1px 1px rgba(0,0,0,.06); }
button:hover, .btn:hover { background:var(--accent2); text-decoration:none; color:#fff; }
button:focus-visible, .btn:focus-visible { box-shadow:var(--fokus); }
button.sek, .btn.sek { background:var(--card); color:var(--text); border-color:var(--line2); }
button.sek:hover, .btn.sek:hover { background:#f6f5f2; color:var(--text); }
button.leise, .btn.leise { background:transparent; color:var(--text2); border-color:transparent; box-shadow:none; }
button.leise:hover, .btn.leise:hover { background:#f2f0ec; color:var(--text); }
button.gefahr { background:var(--card); color:var(--bad); border-color:#efc1bd; } button.gefahr:hover { background:var(--bad-soft); color:var(--bad); }
button.klein, .btn.klein { min-height:32px; padding:0 11px; font-size:13px; }
button[disabled], button.laedt { opacity:.65; cursor:progress; }
button.laedt::before { content:""; width:13px; height:13px; border-radius:50%; border:2px solid currentColor; border-right-color:transparent; animation:dreh .7s linear infinite; }
@keyframes dreh { to { transform:rotate(360deg); } }

/* ---------- Formulare ---------- */
input[type=text], input[type=number], input[type=date], input[type=password], input[type=search], select, textarea {
  font:inherit; font-size:14px; padding:0 11px; min-height:38px; border:1px solid var(--line2); border-radius:var(--r-sm); background:#fff; width:100%; color:var(--text);
  transition:border-color .15s, box-shadow .15s; }
textarea { padding:9px 11px; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--accent); box-shadow:var(--fokus); }
select { padding-right:30px; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237a7f87' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center; }
input[type=file] { font:inherit; }
input[type=checkbox], input[type=radio] { accent-color:var(--accent); width:16px; height:16px; vertical-align:-3px; }
form.inline { display:inline; } form.zeile { display:flex; gap:8px; align-items:center; flex-wrap:wrap; } form.zeile > * { width:auto; }
.filterleiste { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:14px; }
.filterleiste > * { width:auto; }
.filterleiste .suche { position:relative; flex:1 1 260px; max-width:420px; }
.filterleiste .suche input { width:100%; padding-left:36px; }
.filterleiste .suche .ico { position:absolute; left:11px; top:10px; color:var(--muted); }
.filterleiste .anzahl { margin-left:auto; color:var(--muted); font-size:13px; }
.blaetter { display:flex; gap:8px; align-items:center; justify-content:flex-end; margin-top:12px; font-size:13.5px; color:var(--muted); }

/* Upload-Fläche */
.upload { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.ablage { position:relative; flex:1 1 320px; display:flex; align-items:center; gap:12px; border:1.5px dashed var(--line2); border-radius:var(--r); padding:14px 16px; background:#fcfbf9;
  cursor:pointer; transition:border-color .15s, background .15s; min-height:64px; }
.ablage:hover, .ablage.ueber { border-color:var(--accent); background:var(--accent-soft); }
.ablage input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; }
.ablage .ico { width:24px; height:24px; color:var(--accent); }
.ablage .text { font-size:14px; color:var(--text2); } .ablage .text strong { color:var(--text); }
.ablage .dateien { display:block; font-size:12.5px; color:var(--accent2); margin-top:2px; }

/* Rückfragen */
.frage { border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; margin:10px 0; background:#fcfbf9; }
.frage .ft { font-weight:600; margin-bottom:10px; }
.optionen { display:grid; gap:6px; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); }
.optionen label { display:flex; align-items:center; gap:10px; padding:9px 12px; border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; cursor:pointer; transition:border-color .15s, background .15s; }
.optionen label:hover { border-color:var(--line2); }
.optionen label:has(input:checked) { border-color:var(--accent); background:var(--accent-soft); }
.chips label { display:inline-block; margin:3px 6px 3px 0; padding:5px 12px; border:1px solid var(--line2); border-radius:999px; cursor:pointer; background:#fff; font-size:13px; }
.chips label:hover { border-color:var(--accent); }
.chips label:has(input:checked) { background:var(--accent-soft); border-color:var(--accent); color:var(--accent2); }
.chips input { display:none; }

/* Belege und Freigabe */
iframe.beleg, img.beleg { width:100%; min-height:640px; border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; }
img.beleg { min-height:0; }
.freigabe-hinweis { border-color:#f3c9ab; background:#fffaf5; }
.pruefkopf { display:flex; gap:16px 28px; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; }
.pruefkopf dl { display:grid; grid-template-columns:auto minmax(0,1fr); gap:3px 14px; margin:0; }
.pruefkopf dt { color:var(--muted); } .pruefkopf dd { margin:0; overflow-wrap:anywhere; }
.blaettern { display:flex; align-items:center; gap:6px; white-space:nowrap; }
.blaettern .stand { font-weight:650; padding:0 6px; font-variant-numeric:tabular-nums; }
.maengel { margin:8px 0 6px; padding:10px 14px 10px 32px; color:var(--bad); background:var(--bad-soft); border-radius:var(--r-sm); }
iframe.ganzseite, img.ganzseite { width:100%; height:calc(100vh - 250px); min-height:560px; border:1px solid var(--line); border-radius:var(--r); background:#fff; display:block; box-shadow:var(--sh); }
img.ganzseite { height:auto; min-height:0; }

/* Anmeldung */
.login { max-width:400px; margin:10vh auto; padding:28px; }
.login-logo { display:block; max-height:110px; max-width:220px; width:auto; height:auto; margin:4px auto 14px; }
.login h1 { text-align:center; font-size:21px; margin-bottom:18px; }
.login button { width:100%; justify-content:center; }

dl { display:grid; grid-template-columns:max-content 1fr; gap:6px 16px; margin:0; } dt { color:var(--muted); } dd { margin:0; }
.actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-top:12px; }
details summary { cursor:pointer; color:var(--accent2); font-weight:500; }
details[open] summary { margin-bottom:8px; }

/* Tabellen bei mittlerer Breite: Schilder dürfen umbrechen, lange Kennungen kleiner */
td .tag { max-width:190px; overflow:hidden; text-overflow:ellipsis; display:inline-block; }
td .tag::before { display:inline-block; margin-right:6px; vertical-align:middle; }
.iban { font-size:12px; letter-spacing:.01em; color:var(--muted); font-variant-numeric:tabular-nums; }
td.zweck { min-width:140px; max-width:340px; }
.zeilenaktionen { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
.zeilenaktionen:empty { display:none; }
@media (min-width:901px) and (max-width:1200px) { aside.seite { width:220px; } main { padding:24px 20px 40px; } }
td .small, td .muted, td.small { overflow-wrap:anywhere; }
@media (max-width:1200px) { .nur-breit { display:none; } }
@media (max-width:600px) { .aufgaben { grid-template-columns:1fr 1fr; gap:10px; } .aufgabe { padding:12px 14px; } .aufgabe .text { display:none; } .aufgabe .zahl { font-size:26px; } .aufgabe .kopf { font-size:14px; } .seitenkopf { margin-bottom:14px; } }
.postfach-form { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px 14px; align-items:end; margin-top:8px; }
.postfach-form label { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--text2); font-weight:500; }
.postfach-form .voll { grid-column:1 / -1; display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.ordnerliste { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:6px; }
.ordnerliste label { display:flex; align-items:center; gap:10px; padding:8px 12px; border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; cursor:pointer; }
.ordnerliste label:has(input:checked) { border-color:var(--accent); background:var(--accent-soft); }
.ordnerliste label .muted { margin-left:auto; }
.rueck-layout { display:grid; grid-template-columns:minmax(300px,.85fr) minmax(0,1.15fr); gap:16px; align-items:start; }
.rueck-layout .ansicht { position:sticky; top:16px; }
.rueck-layout iframe.ganzseite, .rueck-layout img.ganzseite { height:calc(100vh - 150px); min-height:520px; }
.rueck-layout .optionen { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:5px; }
.rueck-layout .optionen label { padding:6px 9px; font-size:13px; line-height:1.3; gap:8px; }
@media (max-width:900px) { .rueck-layout { grid-template-columns:minmax(0,1fr); } .rueck-layout .ansicht { position:static; } }
aside.seite .mandanten { margin:-8px 8px 0; font-size:13px; }
aside.seite .mandanten summary { display:flex; align-items:center; gap:6px; color:var(--muted); list-style:none; }
aside.seite .mandanten summary::-webkit-details-marker { display:none; }
aside.seite .mandanten a { display:block; padding:6px 10px; border-radius:var(--r-sm); color:var(--text2); margin-top:4px; }
aside.seite .mandanten a:hover { background:#f4f2ee; text-decoration:none; }
aside.seite .mandanten a.aktiv { background:var(--accent-soft); color:var(--accent2); }
aside.seite .logo .name { min-width:0; overflow-wrap:anywhere; }
.reiter { display:flex; align-items:center; gap:6px; flex-wrap:wrap; border-bottom:1px solid var(--line); margin-bottom:16px; }
.reiter a { padding:9px 14px; color:var(--text2); font-weight:500; border-bottom:2px solid transparent; margin-bottom:-1px; display:inline-flex; align-items:center; gap:8px; }
.reiter a:hover { text-decoration:none; color:var(--text); }
.reiter a.aktiv { color:var(--accent2); border-bottom-color:var(--accent); }
.reiter .zahl { background:#f0eee9; color:var(--text2); border-radius:999px; padding:0 8px; font-size:12px; font-weight:650; line-height:20px; }
.reiter a.aktiv .zahl { background:var(--accent-soft); color:var(--accent2); }
.reiter .reiter-info { margin-left:auto; font-size:13px; color:var(--muted); padding:9px 0; }
.kandidaten { display:flex; flex-direction:column; gap:10px; }
.kandidat { border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; background:#fff; display:flex; flex-direction:column; gap:6px; }
.kandidat.bester { border-color:#f3c9ab; background:#fffaf6; }
.kandidat .kopf { display:flex; align-items:center; gap:10px; }
.kandidat .kopf strong { font-weight:600; min-width:0; overflow-wrap:anywhere; }
.kandidat .betrag { margin-left:auto; font-weight:650; white-space:nowrap; font-variant-numeric:tabular-nums; }
.kandidat .treffer { background:var(--ok-soft); color:var(--ok); border-radius:999px; padding:0 9px; font-size:12px; font-weight:700; line-height:22px; white-space:nowrap; }
.kandidat .gruende { display:flex; flex-wrap:wrap; gap:4px; }
.kandidat .gruende .tag { white-space:normal; }
.kandidat form { align-self:flex-start; }
.umsatzliste { padding:0; overflow:hidden; }
.umsatz-zeile { border-bottom:1px solid var(--line); }
.umsatz-zeile:last-child { border-bottom:0; }
.umsatz-zeile > summary { list-style:none; display:grid; grid-template-columns:92px minmax(0,1fr) auto auto; gap:14px; align-items:center; padding:12px 18px; cursor:pointer; }
.umsatz-zeile > summary::-webkit-details-marker { display:none; }
.umsatz-zeile > summary:hover { background:#fbfaf8; }
.umsatz-zeile[open] > summary { background:var(--accent-soft); }
.umsatz-zeile .datum { color:var(--muted); font-size:13.5px; font-variant-numeric:tabular-nums; }
.umsatz-zeile .wer { display:flex; flex-direction:column; min-width:0; }
.umsatz-zeile .wer strong { font-weight:600; overflow-wrap:anywhere; }
.umsatz-zeile .wer .small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.umsatz-zeile .betrag { font-weight:650; white-space:nowrap; font-variant-numeric:tabular-nums; }
.umsatz-zeile .auf-text { display:none; }
.umsatz-zeile[open] .auf-text { display:inline; } .umsatz-zeile[open] .zu-text { display:none; }
.umsatz-zeile .klaeren { padding:4px 18px 16px; background:#fffcf9; border-top:1px solid var(--line); }
.umsatz-zeile .klaeren .frage { background:#fff; }
@media (max-width:700px) { .umsatz-zeile > summary { grid-template-columns:minmax(0,1fr) auto; } .umsatz-zeile .datum { grid-column:1 / -1; } .umsatz-zeile .klaeren-knopf { grid-column:1 / -1; justify-self:start; } }
.optionen label.vorschlag { border-color:#9fd3b2; background:var(--ok-soft); grid-column:1 / -1; }
.frage-hinweis { display:flex; gap:8px; align-items:flex-start; margin:-4px 0 10px; font-size:13px; color:var(--text2); }
.frage-hinweis .ico { width:16px; height:16px; margin-top:1px; color:var(--info); flex:none; }
.wahlknoepfe { display:flex; flex-wrap:wrap; gap:6px; }
.wahlknoepfe label { display:inline-flex; align-items:center; gap:6px; padding:7px 13px; border:1px solid var(--line2); border-radius:999px; background:#fff;
  cursor:pointer; font-size:13.5px; font-weight:500; color:var(--text2); transition:border-color .15s, background .15s; }
.wahlknoepfe label:hover { border-color:var(--accent); color:var(--text); }
.wahlknoepfe input { position:absolute; opacity:0; width:1px; height:1px; }
.wahlknoepfe label:has(input:checked) { background:var(--accent); border-color:var(--accent); color:#fff; }
.wahlknoepfe label:has(input:focus-visible) { box-shadow:var(--fokus); }
.wahlknoepfe label.vorschlag { border-color:#9fd3b2; }
.wahlknoepfe .marke { font-size:11px; font-weight:650; padding:0 7px; border-radius:999px; background:var(--ok-soft); color:var(--ok); line-height:18px; }
.wahlknoepfe label:has(input:checked) .marke { background:rgba(255,255,255,.25); color:#fff; }
.frage .merken { display:inline-flex; gap:8px; align-items:center; margin-top:10px; color:var(--text2); }
.danach { margin:10px 0 0; }
.lieferant-karte .kopfzeile { display:flex; justify-content:space-between; align-items:flex-start; gap:10px 16px; flex-wrap:wrap; margin-bottom:10px; }
.lieferant-karte h2 { margin:0 0 2px; }
.offen-zeile { display:grid; grid-template-columns:130px minmax(0,1fr) auto auto; gap:14px; align-items:center; padding:12px 18px; border-bottom:1px solid var(--line); }
.offen-zeile:last-child { border-bottom:0; }
.offen-zeile.ueberfaellig { border-left:3px solid var(--bad); }
.offen-zeile.bald { border-left:3px solid #e0a100; }
.offen-zeile .faellig { display:flex; flex-direction:column; font-variant-numeric:tabular-nums; }
.offen-zeile .wer { display:flex; flex-direction:column; min-width:0; gap:2px; }
.offen-zeile .wer a { color:var(--text); } .offen-zeile .wer strong { font-weight:600; }
.offen-zeile .betrag { font-weight:650; white-space:nowrap; font-variant-numeric:tabular-nums; }
.offen-zeile .kopieren { display:flex; flex-wrap:wrap; gap:4px; margin-top:2px; }
.offen-zeile .kopieren button { min-height:26px; padding:0 8px; font-size:12px; color:var(--text2); }
@media (max-width:760px) { .offen-zeile { grid-template-columns:minmax(0,1fr) auto; } .offen-zeile .faellig { flex-direction:row; gap:8px; grid-column:1 / -1; } .offen-zeile .zeilenaktionen { grid-column:1 / -1; justify-content:flex-start !important; } }
.verlauf { margin-top:16px; }
.verlauf summary { list-style:none; display:flex; gap:8px; align-items:baseline; color:var(--text); }
.verlauf summary::-webkit-details-marker { display:none; }
.meld form { margin-left:4px; }