/* CRDigital Finance – Oberfläche im CRDigital-Look: Navy, Blau, Silber. Keine Abhängigkeiten. */
:root {
  --navy: #0b2545; --navy-2: #13315c; --blau: #1f6fb2; --blau-hell: #e8f1fa; --silber: #c0c6cf; --silber-hell: #eef0f3;
  --text: #1c2430; --text-2: #5b6573; --weiss: #fff; --gruen: #1e8a4c; --rot: #c0392b; --gelb: #d9a400; --bg: #f5f7fa;
  --radius: 10px; --schatten: 0 1px 2px rgba(11, 37, 69, .08), 0 4px 14px rgba(11, 37, 69, .06);
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { font: 15px/1.5 -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: var(--text); background: var(--bg); }
a { color: var(--blau); text-decoration: none; } a:hover { text-decoration: underline; }
h1 { font-size: 1.5rem; margin: 0 0 .25rem; color: var(--navy); } h2 { font-size: 1.15rem; margin: 1.5rem 0 .5rem; color: var(--navy); }
h3 { font-size: 1rem; margin: 1rem 0 .4rem; color: var(--navy-2); }
.untertitel { color: var(--text-2); margin: 0 0 1rem; }

/* Rahmen */
.app { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
.seite { grid-template-columns: 1fr; }
.seitenleiste { background: var(--navy); color: var(--weiss); display: flex; flex-direction: column; padding: 1rem .75rem; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.marke { display: flex; align-items: center; gap: .6rem; padding: .25rem .5rem 1rem; }
.marke svg { width: 38px; height: 38px; flex: none; }
.marke b { display: block; font-size: 1.05rem; letter-spacing: .02em; } .marke small { color: var(--silber); font-size: .78rem; }
.nav a { display: flex; align-items: center; gap: .6rem; color: #dbe3ee; padding: .5rem .6rem; border-radius: 8px; font-size: .95rem; }
.nav a:hover { background: var(--navy-2); text-decoration: none; } .nav a.aktiv { background: var(--blau); color: #fff; }
.nav svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.seitenleiste .fuss { margin-top: auto; padding: .75rem .5rem 0; font-size: .78rem; color: var(--silber); }
.kopf { display: flex; align-items: center; gap: 1rem; padding: .7rem 1.5rem; background: var(--weiss); border-bottom: 1px solid var(--silber-hell); position: sticky; top: 0; z-index: 5; }
.kopf .mandant { font-weight: 600; color: var(--navy); }
.kopf form.suche { margin-left: auto; display: flex; gap: .4rem; }
.kopf input[type=search] { width: 260px; }
.kopf .benutzer { color: var(--text-2); font-size: .9rem; }
.inhalt { padding: 1.5rem; max-width: 1280px; }
.hamburger { display: none; }

/* Elemente */
.karte { background: var(--weiss); border-radius: var(--radius); box-shadow: var(--schatten); padding: 1.1rem 1.25rem; margin-bottom: 1rem; }
.raster { display: grid; gap: 1rem; } .raster-2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); } .raster-4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.kennzahl { background: var(--weiss); border-radius: var(--radius); box-shadow: var(--schatten); padding: 1rem 1.1rem; border-left: 4px solid var(--blau); }
.kennzahl small { color: var(--text-2); display: block; } .kennzahl b { font-size: 1.4rem; color: var(--navy); }
.kennzahl.warn { border-left-color: var(--gelb); } .kennzahl.rot { border-left-color: var(--rot); } .kennzahl.gruen { border-left-color: var(--gruen); }
table { width: 100%; border-collapse: collapse; background: var(--weiss); }
.karte table { box-shadow: none; }
th, td { padding: .5rem .6rem; text-align: left; border-bottom: 1px solid var(--silber-hell); vertical-align: top; }
th { color: var(--text-2); font-weight: 600; font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; background: #fafbfc; }
td.zahl, th.zahl { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
tr:hover td { background: #fbfcfe; }
.knopf { display: inline-flex; align-items: center; gap: .4rem; background: var(--blau); color: #fff; border: 0; border-radius: 8px; padding: .5rem .95rem; font: inherit; font-weight: 600; cursor: pointer; }
.knopf:hover { background: var(--navy-2); text-decoration: none; } .knopf.leicht { background: var(--blau-hell); color: var(--navy); } .knopf.leicht:hover { background: #d7e6f5; }
.knopf.rot { background: var(--rot); } .knopf.gruen { background: var(--gruen); } .knopf.klein { padding: .3rem .7rem; font-size: .85rem; font-weight: 500; }
.knopf:disabled { opacity: .5; cursor: not-allowed; }
input, select, textarea { font: inherit; padding: .5rem .6rem; border: 1px solid var(--silber); border-radius: 8px; background: #fff; width: 100%; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--blau-hell); border-color: var(--blau); }
input[type=checkbox], input[type=radio] { width: auto; }
label { display: block; font-size: .85rem; color: var(--text-2); margin-bottom: .2rem; }
.feld { margin-bottom: .8rem; } .felder { display: grid; gap: .8rem 1rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.hinweis { padding: .7rem .9rem; border-radius: 8px; margin: .6rem 0; background: var(--blau-hell); color: var(--navy); }
.hinweis.ok { background: #e6f4ec; color: #145a32; } .hinweis.fehler { background: #fbe9e7; color: #7a1f14; } .hinweis.warn { background: #fff6d6; color: #6b5200; }
.marke-text { color: var(--silber); font-size: .8rem; }
.chip { display: inline-block; padding: .1rem .55rem; border-radius: 999px; font-size: .78rem; background: var(--silber-hell); color: var(--navy); }
.chip.gruen { background: #e6f4ec; color: #145a32; } .chip.rot { background: #fbe9e7; color: #7a1f14; } .chip.gelb { background: #fff6d6; color: #6b5200; } .chip.blau { background: var(--blau-hell); }
.aufgabe { display: flex; align-items: center; gap: .8rem; padding: .6rem .3rem; border-bottom: 1px solid var(--silber-hell); }
.aufgabe .punkt { width: 10px; height: 10px; border-radius: 50%; background: var(--blau); flex: none; } .aufgabe.dringlich .punkt { background: var(--rot); }
.aufgabe .text { flex: 1; } .aufgabe .zahl { font-weight: 600; color: var(--navy); }
.schritte { display: flex; flex-wrap: wrap; gap: .4rem; margin: .5rem 0 1rem; }
.schritte span { padding: .25rem .6rem; border-radius: 999px; background: var(--silber-hell); font-size: .82rem; }
.schritte span.fertig { background: #e6f4ec; color: #145a32; } .schritte span.aktiv { background: var(--blau); color: #fff; }
.pruefung li { padding: .5rem 0; border-bottom: 1px solid var(--silber-hell); list-style: none; }
.pruefung .ok::before { content: "✔ "; color: var(--gruen); } .pruefung .offen::before { content: "✖ "; color: var(--rot); }
.pruefung ul { margin: .3rem 0 0 1.2rem; color: var(--text-2); font-size: .9rem; }
.zweispaltig { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.rechts { text-align: right; } .klein { font-size: .85rem; color: var(--text-2); }
.gross { font-size: 1.6rem; font-weight: 700; color: var(--navy); }
.tabs a { display: inline-block; padding: .4rem .9rem; border-radius: 8px 8px 0 0; color: var(--text-2); } .tabs a.aktiv { background: var(--weiss); color: var(--navy); font-weight: 600; box-shadow: var(--schatten); }
.leer { padding: 2rem; text-align: center; color: var(--text-2); }
.posten-zeile { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr auto; gap: .5rem; align-items: end; margin-bottom: .5rem; }
.quittung { max-width: 420px; margin: 1rem auto; padding: 1.5rem; border: 1px solid var(--silber); border-radius: 8px; background: #fff; font-size: .95rem; }
.quittung h2 { margin-top: 0; }
.anmelden { max-width: 380px; margin: 8vh auto; }
.zaehl { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: .5rem; }
.zaehl label { display: flex; flex-direction: column; } .zaehl input { text-align: right; }
.messages { list-style: none; padding: 0; margin: 0 0 1rem; }
@media (max-width: 900px) {
  .app { grid-template-columns: 1fr; }
  .seitenleiste { position: fixed; left: -260px; width: 250px; transition: left .2s; z-index: 10; } .seitenleiste.offen { left: 0; }
  .hamburger { display: inline-block; background: none; border: 0; font-size: 1.5rem; cursor: pointer; color: var(--navy); }
  .inhalt { padding: 1rem; } .kopf input[type=search] { width: 140px; } .zweispaltig { grid-template-columns: 1fr; }
  .posten-zeile { grid-template-columns: 1fr 1fr; }
}
@media print {
  .seitenleiste, .kopf, .knopf, .nicht-drucken { display: none !important; } .app { display: block; } .inhalt { padding: 0; } body { background: #fff; }
}

/* Einrichtungsassistent: Auswahl als Liste */
.wahl{display:flex;gap:.5rem;align-items:center;font-weight:400;margin:.3rem 0;cursor:pointer}
.wahl input{width:auto}