/* 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=email], 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:158px 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; }
.sepa-leiste { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; }
.sepa-leiste .zeile { gap:8px; align-items:center; }
.offen-zeile .faellig { position:relative; padding-left:28px; }
.offen-zeile .faellig input[type=checkbox] { position:absolute; left:0; top:2px; width:18px; height:18px; margin:0; }

/* Arbeitsschritte: Menü, Leiste auf den Seiten, Startseite */
nav a.schritt .nr, .schrittleiste .nr, .schritt-karte .nr { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%;
  background:#f0eee9; color:var(--text2); font-size:12px; font-weight:700; flex:none; }
nav a.schritt.aktiv .nr { background:var(--accent); color:#fff; }
nav a.einrichtung { margin-top:14px; border-top:1px solid var(--line); padding-top:12px; }
.schrittleiste { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 18px; }
.schrittleiste ol { display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0; flex-wrap:wrap; }
.schrittleiste li { display:flex; }
.schrittleiste li a { display:inline-flex; align-items:center; gap:7px; padding:5px 10px 5px 6px; border-radius:999px; color:var(--text2); font-size:13px; font-weight:500; }
.schrittleiste li a:hover { background:#f2f0ec; text-decoration:none; color:var(--text); }
.schrittleiste li.aktiv a { background:var(--accent-soft); color:var(--accent2); }
.schrittleiste li.aktiv .nr { background:var(--accent); color:#fff; }
.schrittleiste li.leer:not(.aktiv) .nr { background:var(--ok-soft); color:var(--ok); }
.schrittleiste .z { background:var(--warn-soft); color:var(--warn); border-radius:999px; padding:0 7px; font-size:12px; font-weight:650; line-height:19px; }
@media (max-width:760px) { .schrittleiste li:not(.aktiv) { display:none; } }
.monat { padding:14px 18px; }
.monat-kopf { display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.balken { height:10px; border-radius:6px; background:#f0eee9; overflow:hidden; }
.balken span { display:block; height:100%; background:var(--ok); border-radius:6px; }
.schritt-karten { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; list-style:none; padding:0; margin:0 0 16px; }
.schritt-karte { display:flex; flex-direction:column; gap:6px; padding:14px; border:1px solid var(--line); border-radius:var(--r); background:var(--card); color:var(--text); height:100%; }
.schritt-karte:hover { text-decoration:none; border-color:var(--line2); }
.schritt-karte .t { font-weight:600; font-size:14px; }
.schritt-karte .z { font-size:26px; font-weight:700; line-height:1.1; }
.schritt-karte.erledigt .z { color:var(--ok); font-size:20px; }
.schritt-karte.erledigt .nr { background:var(--ok-soft); color:var(--ok); }
.schritt-karte.naechster { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.schritt-karte.naechster .nr { background:var(--accent); color:#fff; }
@media (max-width:900px) { .schritt-karten { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:520px) { .schritt-karten { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.als-naechstes { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; border-left:4px solid var(--accent); border-radius:0 var(--r) var(--r) 0; }
.als-naechstes h2 { margin:2px 0 4px; }
section[data-bereich][hidden] { display:none; }
/* Freigabe: Beleg rechts neben den Knöpfen, auf schmalen Bildschirmen untereinander */
.freigabe-layout { grid-template-columns:minmax(340px,.8fr) minmax(0,1.2fr); }
.freigabe-layout .pruefkopf { flex-direction:column; align-items:stretch; }
@media (max-width:1200px) { .freigabe-layout { grid-template-columns:minmax(0,1fr); } .freigabe-layout .ansicht { position:static; } }
.verlauf-start { margin-top:18px; }
.verlauf-start > summary { cursor:pointer; color:var(--text2); font-weight:500; font-size:14px; padding:6px 0; }
.verlauf-start[open] > summary { margin-bottom:10px; }
.loeschen-menue { position:relative; }
.loeschen-menue > summary { list-style:none; cursor:pointer; }
.loeschen-menue > summary::-webkit-details-marker { display:none; }
.loeschen-menue .menue-inhalt { position:absolute; right:0; top:calc(100% + 4px); z-index:20; width:280px; display:flex; flex-direction:column; gap:6px;
  padding:10px; background:var(--card); border:1px solid var(--line2); border-radius:var(--r-sm); box-shadow:var(--sh); }
.loeschen-menue .menue-inhalt button { width:100%; justify-content:flex-start; text-align:left; white-space:normal; height:auto; padding:6px 10px; }
.blaettern-leiste { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:-4px 0 14px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.blaettern-leiste .stand { font-weight:650; font-variant-numeric:tabular-nums; }
.freigabe-layout .pruefkopf > div { flex:none !important; }
/* Beleg für Beleg */
nav a.durchlauf-link { font-weight:650; }
.beleg-schritte { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.bs { border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 12px; }
.bs-kopf { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.bs-marke { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:#f0eee9; color:var(--text2);
  font-size:12px; font-weight:700; flex:none; align-self:center; }
.bs-marke .ico { width:14px; height:14px; }
.bs.erledigt { background:#fbfaf8; color:var(--text2); }
.bs.erledigt .bs-marke { background:var(--ok-soft); color:var(--ok); }
.bs.offen { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.bs.offen .bs-marke { background:var(--accent); color:#fff; }
.bs.wartet .bs-marke { background:var(--info-soft); color:var(--info); }
.bs.spaeter { color:var(--muted); border-style:dashed; }
.bs-inhalt { margin-top:10px; }
.bs-inhalt .frage { margin:0; }
.ok-box { background:var(--ok-soft); color:var(--ok); }
.doppelt-hinweis { display:flex; gap:8px; align-items:flex-start; margin:6px 0; padding:8px 10px; border-radius:var(--r-sm);
  background:var(--bad-soft); color:var(--bad); font-size:13px; }
.doppelt-hinweis ul { margin:4px 0 0; padding-left:18px; }
.doppelt-hinweis a { color:inherit; text-decoration:underline; }
.wahlgruppen { display:flex; flex-direction:column; gap:10px; margin:4px 0 8px; }
.wahlgruppe .wg-titel { font-size:12px; font-weight:650; color:var(--text2); text-transform:none; margin:0 0 5px; }
.wahlgruppe .wg-titel span { font-weight:400; color:var(--muted); }
.wahlgruppe .wahlknoepfe { margin:0; }
/* Folgefelder unter dem Verwendungsknopf */
.folgefelder { margin:10px 0 4px; padding:12px 14px; border:1px solid var(--accent); border-radius:var(--r-sm); background:var(--accent-soft); display:flex; flex-direction:column; gap:10px; }
.folgefelder .ff-titel { font-weight:650; font-size:13px; color:var(--accent2); }
.folgefelder .ff-label { display:block; font-size:13px; font-weight:500; margin-bottom:4px; }
.folgefelder input[type=text] { max-width:520px; background:#fff; }
.folgefelder .chips { margin-bottom:6px; }
.folgefelder [data-setzen] { cursor:pointer; }
.stammliste { gap:6px; }
.chip-eintrag { display:inline-flex; align-items:center; gap:2px; padding:2px 4px 2px 10px; border:1px solid var(--line2); border-radius:999px; background:#fff; font-size:13px; }
.chip-eintrag button { min-height:24px; padding:0 6px; }
.folgefelder[hidden] { display:none; }
.bs-aendern-knopf { margin-left:auto; }
.bs-aendern { margin-top:10px; padding-top:10px; border-top:1px dashed var(--line2); }
.bs-aendern[hidden] { display:none; }
.bs-aendern .antworten td { padding:5px 6px; vertical-align:middle; }
.doppelt-hinweis li { margin-bottom:6px; }
.doppelt-hinweis form { margin-left:6px; }
.doppelt-hinweis .small { color:#7a2a24; }
.durchlauf-filter { margin-bottom:12px; }
.durchlauf-filter input[type=search] { flex:1 1 280px; max-width:440px; }
.durchlauf-filter select { max-width:260px; }
.umsatz-aufklapp { margin:4px 0 2px; }
.umsatz-aufklapp > summary { cursor:pointer; text-decoration:underline; display:inline; }
.umsatz-aufklapp[open] { background:#fff; color:var(--text); border:1px solid #efc1bd; border-radius:var(--r-sm); padding:8px 10px; margin:6px 0; }
.umsatz-aufklapp[open] > summary { display:block; margin-bottom:6px; color:var(--bad); }
.umsatz-aufklapp dl { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:3px 12px; margin:0 0 6px; }
.umsatz-aufklapp dt { color:var(--muted); } .umsatz-aufklapp dd { margin:0; overflow-wrap:anywhere; }
.umsatz-aufklapp[open] dd { color:#1f2328; } .umsatz-aufklapp[open] dt { color:#6b6f76; }
.feste-knoepfe { margin:0 0 14px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.gefahr-karte { border-color:#efc1bd; background:#fffafa; margin-top:16px; }
.gefahr-karte h2 { color:var(--bad); }
.gefahr-karte summary { list-style:none; cursor:pointer; }
.gefahr-karte summary::-webkit-details-marker { display:none; }
.reset-dialog { margin-top:12px; padding:12px 14px; border:1px solid #efc1bd; border-radius:var(--r-sm); background:#fff; }
.btn.gefahr { background:var(--card); color:var(--bad); border:1px solid #efc1bd; }
.reset-dialog .postfach-form .voll { flex-direction:column; align-items:flex-start; gap:4px; text-align:left; }
/* Kontoumsätze: jede Zeile einzeilig, voller Text im Tooltip */
.umsatz-tabelle td { vertical-align:middle; }
.umsatz-tabelle td.einzeilig { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.umsatz-tabelle { table-layout:fixed; width:100%; }
.umsatz-tabelle .sp-datum { width:96px; } .umsatz-tabelle .sp-name { width:20%; }
.umsatz-tabelle .sp-betrag { width:110px; } .umsatz-tabelle .sp-status { width:270px; }
.umsatz-tabelle td, .umsatz-tabelle th { overflow:hidden; text-overflow:ellipsis; }
.status-zeile { display:flex; align-items:center; gap:6px; flex-wrap:nowrap; white-space:nowrap; }
.status-zeile .tag { max-width:220px; overflow:hidden; text-overflow:ellipsis; }
.status-zeile .tag.warn, .status-zeile .tag.info { flex-shrink:0; }
.hinweise-klapp summary { cursor:pointer; white-space:nowrap; color:var(--accent, inherit); }
.hinweise-klapp ul { margin:6px 0 0; padding-left:18px; min-width:280px; max-width:520px; }
.hinweise-klapp li { margin-bottom:4px; }
/* Kontoauszug (Schritt 1) und Beleg ohne Zahlung (Schritt 3) */
.kontoauszug .umsatz-zeile > summary, .ohne-zahlung .umsatz-zeile > summary { grid-template-columns:92px minmax(0,1fr) auto 190px; }
.ka-status { display:flex; justify-content:flex-end; min-width:0; }
.ka-status .tag { max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ka-beleg { display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; margin:12px 0 6px; }
.ka-vorschlaege { width:100%; margin-bottom:8px; }
.ka-vorschlaege td { vertical-align:top; padding:6px 8px; }
.ka-wahl { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; }
.ka-wahl select { max-width:520px; flex:1; }
.ka-aktionen { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; }
.ka-unter { margin:8px 0; }
.ka-unter > summary { cursor:pointer; color:var(--accent2); }
aside.seite nav .badge.leise { background:var(--line2); color:var(--text2); }
@media (max-width:700px) { .kontoauszug .umsatz-zeile > summary, .ohne-zahlung .umsatz-zeile > summary { grid-template-columns:minmax(0,1fr) auto; }
  .ka-status { grid-column:1 / -1; justify-content:flex-start; } }
.ka-wahl-block { margin:12px 0 4px; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; }
.ka-titel { font-weight:600; margin-bottom:8px; }
.ka-knoepfe { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ka-vorschlag { display:flex; flex-wrap:wrap; gap:4px 10px; align-items:center; margin-bottom:6px; }
.ka-wahl input[type=email] { flex:1; min-width:240px; max-width:340px !important; }
.ka-frage .frage { border:0; padding:0; margin:0; background:transparent; box-shadow:none; }
.ka-frage .frage > .ft { display:none; }
.ka-hochladen label.btn { cursor:pointer; }
/* Kontoauszug schlank: Vorschlag direkt in der Zeile, aufgeklappt zwei Leisten */
.kontoauszug .umsatz-zeile > summary { grid-template-columns:92px minmax(0,1fr) auto minmax(150px, 260px); }
.ka-status .ka-ok { max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; background:var(--ok-soft); color:var(--ok, #1d7a43); border:1px solid #9fd3b2; }
.ka-status .ka-ok:hover { background:#d9f0e2; }
.ka-leiste { display:grid; grid-template-columns:90px minmax(0,1fr); gap:6px 10px; align-items:start; margin:12px 0 0; }
.ka-leiste:not(.ka-frage) { display:flex; flex-wrap:wrap; align-items:center; }
.ka-leiste:not(.ka-frage) .ka-lbl { width:90px; }
.ka-lbl { font-size:12px; font-weight:650; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); padding-top:6px; }
.ka-leiste select { max-width:300px; }
.ka-mail { max-width:240px; }
.ka-frage .wg-titel span { display:none; }
.ka-frage .wahlgruppe { margin-bottom:6px; }
@media (max-width:700px) { .ka-leiste { grid-template-columns:1fr; } .kontoauszug .umsatz-zeile > summary { grid-template-columns:minmax(0,1fr) auto; } }
/* Kontoauszug: feste Spalten Beleg und Kontierung */
.kontoauszug .umsatz-zeile > summary, .kontoauszug .ka-kopf { grid-template-columns:84px minmax(0,1fr) 110px 170px 230px; }
.kontoauszug .ka-kopf { display:grid; gap:14px; padding:8px 18px; border-bottom:1px solid var(--line); font-size:11.5px; font-weight:650;
  text-transform:uppercase; letter-spacing:.05em; color:var(--muted); background:#faf9f6; }
.kontoauszug .ka-kopf .r, .kontoauszug .umsatz-zeile .betrag { text-align:right; }
.ka-sp { display:flex; min-width:0; }
.ka-sp .tag, .ka-sp .ka-ok, .ka-konto { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ka-sp .ka-ok { max-width:100%; }
.ka-konto { font-size:13px; color:var(--text2); }
@media (max-width:900px) {
  .kontoauszug .ka-kopf { display:none; }
  .kontoauszug .umsatz-zeile > summary { grid-template-columns:minmax(0,1fr) auto; }
  .kontoauszug .umsatz-zeile .datum { grid-column:1 / -1; }
}
.ka-sp .ka-ok { background:var(--ok-soft); color:var(--ok); border:1px solid #9fd3b2; box-shadow:none; font-weight:600; }
.ka-sp .ka-ok:hover { background:#d9f0e2; color:var(--ok); }
.ka-sp .ka-ok .ico { color:var(--ok); }
/* Spalte Beleg: nur Haken (vorhanden, anklickbar) oder Kreuz (fehlt) */
.kontoauszug .umsatz-zeile > summary, .kontoauszug .ka-kopf { grid-template-columns:84px minmax(0,1fr) 110px 64px 260px; }
.kontoauszug .ka-kopf .m, .ka-sp-beleg { justify-content:center; text-align:center; }
.ka-ja, .ka-nein { display:inline-flex; }
.ka-ja .ico, .ka-nein .ico, .ka-frage-haken .ico { width:22px; height:22px; }
.ka-ja .ico { color:var(--ok); }
a.ka-ja:hover .ico { color:#145c33; transform:scale(1.12); }
.ka-extern .ico { color:#7fb894; }
.ka-nein .ico { color:var(--bad); }
.ka-frage-haken { display:inline-flex; align-items:center; gap:1px; padding:2px 6px; border:1px dashed #9fd3b2; border-radius:999px; background:#fff;
  color:var(--ok); font-weight:700; cursor:pointer; box-shadow:none; }
.ka-frage-haken:hover { background:var(--ok-soft); }
.ka-auf { cursor:pointer; }
.ka-auf:hover .ico { color:#145c33; transform:scale(1.12); }
.ka-vorschau iframe, .ka-vorschau img { display:block; width:100%; max-width:820px; height:70vh; min-height:420px; border:1px solid var(--line);
  border-radius:var(--r-sm); background:#fff; margin:8px 0 4px; }
.ka-vorschau img { height:auto; max-height:80vh; object-fit:contain; }
/* aufgeklappter Beleg: Angaben links, Beleg rechts */
.ka-beleg-grid.mit-fragen { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
.ka-beleg-grid .ka-fragen .frage { margin-top:8px; }
.ka-beleg-grid.mit-fragen .ka-vorschau iframe, .ka-beleg-grid.mit-fragen .ka-vorschau img { height:62vh; min-height:380px; max-width:none; position:sticky; top:12px; }
@media (max-width:1000px) { .ka-beleg-grid.mit-fragen { grid-template-columns:1fr; } }
.ka-hoch { display:inline-flex; align-items:center; cursor:pointer; padding:3px; border-radius:6px; color:var(--muted); }
.ka-hoch:hover { color:var(--accent); background:var(--accent-soft); }
.ka-hoch .ico { width:17px; height:17px; }
/* Kontierung als Auswahl in der Zeile */
.ka-sp-konto { gap:4px; align-items:center; }
.ka-wahl-konto { flex:1; min-width:0; max-width:100%; font-size:12.5px; padding:4px 26px 4px 8px; border-radius:8px; border:1px solid #f0c98a; background-color:var(--warn-soft); color:var(--text); }
.ka-wahl-konto.mit-vorschlag { border-color:#9fd3b2; background-color:var(--ok-soft); color:var(--ok); font-weight:600; }
.ka-nur-haken { padding:4px 6px; flex:none; }
.filterleiste select { max-width:200px; }
.regel-bsp-knopf { margin-top:4px; padding-left:0; }
.regel-bsp-zeile > td { background:#fbfaf7; }
.regel-bsp-tabelle { width:100%; }
.beleg-ok { margin-left:6px; color:var(--ok); white-space:nowrap; }
/* Erfassungszeile: alles zu einer Buchung in einer Zeile */
.ka-erfassung { display:flex; flex-wrap:wrap; gap:8px 10px; align-items:flex-end; padding:10px 12px; border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; }
.ka-erfassung label { display:flex; flex-direction:column; gap:3px; font-size:11.5px; font-weight:650; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.ka-erfassung label[hidden] { display:none; }
.ka-erfassung select, .ka-erfassung input { font-size:13.5px; text-transform:none; letter-spacing:0; font-weight:400; color:var(--text); }
.ka-erfassung .ef-kont select { min-width:220px; max-width:280px; }
.ka-erfassung .ef-anlass input, .ka-erfassung .ef-pers input { min-width:200px; }
.ka-erfassung button { align-self:flex-end; }
.ka-erfassung .ki-text { flex-basis:100%; }
.ka-erfassung .ki-knopf { align-self:flex-end; }
.ka-erfassung fieldset.ef-empf { border:0; padding:0; margin:0; display:flex; flex-direction:column; gap:3px; }
.ka-erfassung fieldset.ef-empf legend { padding:0; font-size:11.5px; font-weight:650; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.ef-chips { display:flex; flex-wrap:wrap; gap:4px; }
.ef-chips label { display:inline-flex; align-items:center; gap:4px; padding:4px 9px; border:1px solid var(--line2); border-radius:999px; background:#fff;
  font-size:12.5px; font-weight:500; text-transform:none; letter-spacing:0; color:var(--text2); cursor:pointer; }
.ef-chips label:has(input:checked) { background:var(--accent-soft); border-color:var(--accent); color:var(--text); }
.ef-chips input { margin:0; }
.ka-angaben { font-size:12px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ka-konto { white-space:normal; line-height:1.25; }
.umsatz-tabelle .ka-angaben { max-width:220px; display:inline-block; vertical-align:middle; margin-left:4px; }
/* schmal: Beleg neben dem Betrag, Kontierung in voller Breite darunter */
@media (max-width:900px) {
  .kontoauszug .umsatz-zeile > summary { grid-template-columns:minmax(0,1fr) auto 40px; }
  .kontoauszug .umsatz-zeile .datum { grid-column:1 / -1; }
  .ka-sp-konto { grid-column:1 / -1; justify-content:flex-start; }
  .ka-sp-konto .ka-wahl-konto, .ka-sp-konto .ka-ok { max-width:100%; }
}
.ka-anfordern { display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }

/* Legende (eingeklappt) unter den Filtern */
.legende { margin:-6px 0 14px; font-size:13px; color:var(--text2); }
.legende > summary { cursor:pointer; display:inline-flex; align-items:center; gap:6px; color:var(--muted); list-style:none; }
.legende > summary::-webkit-details-marker { display:none; }
.legende > summary .ico { width:16px; height:16px; }
.legende > summary:hover { color:var(--text); }
.legende-gruppen { display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:12px 32px; margin-top:10px; padding:14px 16px; background:#fff; border:1px solid var(--line); border-radius:12px; }
.legende h4 { margin:0 0 8px; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.legende dl { display:grid; grid-template-columns:minmax(96px, auto) 1fr; gap:8px 12px; margin:0; align-items:center; }
.legende dt { display:flex; align-items:center; justify-content:center; gap:4px; text-align:center; }
.legende dd { margin:0; }
.legende .ka-ja .ico, .legende .ka-nein .ico { width:20px; height:20px; }
.legende-select { display:inline-block; padding:3px 8px; border:1px solid var(--line); border-radius:8px; background:#fff; font-size:12px; color:var(--text2); white-space:nowrap; }
.legende-select::after { content:" ▾"; color:var(--muted); }
.legende-select.mit-vorschlag { background:var(--ok-soft); border-color:#9fd3b2; color:var(--ok); }
.legende-knopf { display:inline-flex; width:24px; height:24px; margin-left:4px; border:1px solid var(--line); border-radius:8px; align-items:center; justify-content:center; color:var(--ok); background:#fff; }
.legende-knopf .ico { width:16px; height:16px; }
.legende-reiter { font-weight:600; color:var(--accent2); border-bottom:2px solid var(--accent); padding-bottom:1px; white-space:nowrap; }

/* Kanzlei-Zugang (Steuerberater) */
.sb-frage { display:block; margin-top:4px; color:var(--info); font-size:12.5px; }
.sb-frage .ico { width:14px; height:14px; vertical-align:-2px; }
.sb-geprueft { margin-left:6px; }
.sb-karten { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; margin-bottom:16px; }
.sb-karte { display:flex; flex-direction:column; gap:4px; color:inherit; text-decoration:none; }
.sb-karte:hover { text-decoration:none; border-color:var(--accent); }
.sb-karte .nr { display:inline-flex; width:24px; height:24px; border-radius:50%; background:var(--accent); color:#fff; font-size:12px; font-weight:700; align-items:center; justify-content:center; }
.sb-karte .zahl { font-size:28px; font-weight:700; line-height:1.1; }
.sb-karte .zahl .ico { width:28px; height:28px; }
.sb-vorlage { display:flex; gap:10px; align-items:center; flex-wrap:wrap; background:var(--info-soft); color:var(--info); border-radius:8px; padding:8px 12px; margin:0 0 10px; font-size:13px; }
.zwei-spalten { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:16px; }
.liste { margin:0; padding-left:18px; } .liste li { margin:4px 0; }

/* Vorschau der Rechnungsanforderung vor dem Senden */
.anf-vorschau { margin:8px 0 12px; }
.anf-form { display:grid; gap:8px; max-width:760px; background:var(--bg); border:1px solid var(--line); border-radius:var(--r-sm); padding:12px 14px; }
.anf-kopf { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:baseline; }
.anf-form label { display:grid; gap:4px; font-size:12px; color:var(--muted); }
.anf-form input, .anf-form textarea { font:inherit; font-size:13px; padding:6px 8px; border:1px solid var(--line); border-radius:8px; width:100%; box-sizing:border-box; background:var(--card); color:inherit; }
.anf-form textarea { resize:vertical; line-height:1.45; }
.anf-form .zeile { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.ef-empf .ef-hinweis { display:block; margin-top:4px; }

/* Benutzerkonten */
.login-code { margin-top:10px; } .login-code summary { cursor:pointer; list-style:none; text-align:center; } .login-code summary::-webkit-details-marker { display:none; }
.seite .angemeldet { display:flex; align-items:center; gap:6px; padding:6px 14px 0; } .seite .angemeldet .ico { width:16px; height:16px; }

/* Mandanten-Umschalter und Benutzerverwaltung */
aside.seite .mandanten-wahl { margin:-8px 8px 0; display:grid; gap:4px; }
aside.seite .mandanten-wahl select { width:100%; font-weight:600; }
.seite a.angemeldet:hover { color:var(--text); text-decoration:none; }
.benutzer-tabelle select { min-width:120px; }
.benutzer-tabelle td { vertical-align:middle; }
.benutzer-aktionen { display:flex; flex-wrap:wrap; gap:6px; align-items:center; min-width:240px; }
.benutzer-tabelle select { min-width:100px; }
.mandanten-freigabe { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:10px 16px; border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 14px 12px; margin:0; }
.mandanten-freigabe legend { font-weight:600; padding:0 6px; }

/* Beleg löschen */
.ka-loeschen { color:var(--muted); padding:2px 6px; }
.ka-loeschen .ico { width:15px; height:15px; }
.ka-loeschen:hover { color:var(--bad); }
.ohne-zahlung .ka-status { display:inline-flex; align-items:center; justify-content:flex-end; gap:6px; }