/* Design A (Linear-Stil): ruhige dunkle Flächen, haarfeine Linien, Grün nur für Aktionen und Status. Brandkit bleibt: Nacht, Systemgrün, Space Grotesk, JetBrains Mono. */
:root{color-scheme:dark;--card:#121927;--line:#1f2840;--soft:#aab3c5;--muted:#8791a5;--slate:#5f6a80}
aside{background:#080c14;border-right:1px solid rgba(255,255,255,.06)}
h1{font-weight:500;letter-spacing:-.03em;font-size:30px}
h2{font-weight:500;font-size:18px;color:#dfe5f0;letter-spacing:-.01em}
p.sub{font-size:14.5px}
.card{background:rgba(255,255,255,.025);border-radius:10px;border-color:rgba(255,255,255,.08)}
.kpi .v{color:var(--fog);font-size:30px}
button,.btn{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:7px 14px;font-size:14px}
button:hover{border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.07)}
button.pri{background:var(--green);color:#0b1220;border-color:var(--green);font-weight:600}
button.pri:hover{background:#d4ff4a;border-color:#d4ff4a}
button.sm{padding:4px 10px;font-size:13px}
button.danger{background:transparent}
select,input,textarea{background:rgba(255,255,255,.03);border-radius:6px;border-color:rgba(255,255,255,.1)}
.top select{background:rgba(255,255,255,.04)}
th{font-size:10.5px;color:#5f6a80;border-bottom-color:rgba(255,255,255,.06)}
td{border-bottom:1px solid rgba(255,255,255,.05);padding:10px 12px;font-size:14.5px}
tr:hover td{background:rgba(255,255,255,.02)}
.badge{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.modal .box{border-radius:12px;border-color:rgba(255,255,255,.09)}
.nav a:hover{background:rgba(255,255,255,.04)}.nav a.on{background:rgba(255,255,255,.06)}
.ctile,.chip{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.08)}
.pbar{background:rgba(255,255,255,.07)}
#toast div{background:#121927}
/* Heller Modus (nur Kundenportal und Kundensicht, Umschalter in der Seitenleiste) */
html[data-theme=light]{color-scheme:light;--night:#fbfaf8;--fog:#1d1c1a;--card:#ffffff;--line:#e6e1d9;--soft:#4a4743;--muted:#7a756e;--slate:#9a948c;--green:#4f7000;--moss:#9bb84a;--red:#b4261b;--amber:#8a5a00}
html[data-theme=light] aside{background:#f4f2ee;border-right-color:rgba(0,0,0,.08)}
html[data-theme=light] .nav a,html[data-theme=light] .nav a:hover{color:#1d1c1a}
html[data-theme=light] .nav a:hover{background:rgba(0,0,0,.05)}
html[data-theme=light] .nav a.on{background:#e8e5de;color:#1d1c1a;box-shadow:inset 2px 0 0 #8fb21a;font-weight:600}
html[data-theme=light] .nav h6[data-k]:hover{background:rgba(0,0,0,.04)}
html[data-theme=light] .nav h6 small{background:#C6F432;color:#0E1420}
html[data-theme=light] .card{background:#fff;border-color:rgba(0,0,0,.09);border-radius:12px;box-shadow:rgba(0,0,0,.04) 0 4px 18px,rgba(0,0,0,.02) 0 1px 3px}
html[data-theme=light] h2{color:#1d1c1a}
html[data-theme=light] h1{font-weight:600}
html[data-theme=light] button,html[data-theme=light] .btn{background:#f1eee9;color:#1d1c1a;border-color:#e2ded6}
html[data-theme=light] button:hover{background:#e9e5de;border-color:#cfc9bf}
html[data-theme=light] button.pri{background:#C6F432;color:#0E1420;border-color:#aee02a}
html[data-theme=light] button.pri:hover{background:#d4ff4a}
html[data-theme=light] button.danger{background:#fff;color:#b4261b;border-color:#f0c4bd}
html[data-theme=light] select,html[data-theme=light] input,html[data-theme=light] textarea{background:#fff;color:#1d1c1a;border-color:#ddd8d0}
html[data-theme=light] .top select{background:#fff}
html[data-theme=light] th{color:#9a948c;border-bottom-color:#eeeae4}
html[data-theme=light] td{border-bottom-color:#f1eee9}
html[data-theme=light] tr:hover td{background:#faf8f4}
html[data-theme=light] .badge{background:#f1eee9;color:#615d59;border-color:transparent}
html[data-theme=light] .badge.ok{background:#e8f5bf;color:#3f5a00}
html[data-theme=light] .badge.warn{background:#fdecc6;color:#8a5a00}
html[data-theme=light] .badge.bad{background:#fde1dc;color:#b4261b}
html[data-theme=light] .modal{background:rgba(30,28,24,.45)}
html[data-theme=light] .modal .box{background:#fff;border-color:rgba(0,0,0,.1);box-shadow:0 20px 60px rgba(0,0,0,.18)}
html[data-theme=light] .warn-row.rot,html[data-theme=light] .emerg{background:#fde7e3;border-color:#f3c0b8;color:#b4261b}
html[data-theme=light] .warn-row.gelb{background:#fdf2d3;border-color:#ecd28a;color:#8a5a00}
html[data-theme=light] #toast div{background:#fff;color:#1d1c1a;border-color:#8fb21a;box-shadow:0 8px 24px rgba(0,0,0,.12)}
html[data-theme=light] #toast div.err{border-color:#f0c4bd;color:#b4261b}
html[data-theme=light] .mu{background:#ece8e0;color:#1d1c1a}
html[data-theme=light] .ma{border-color:#e6e1d9;background:#fff}
html[data-theme=light] .ctile,html[data-theme=light] .chip{background:#fff;border-color:rgba(0,0,0,.1);color:#1d1c1a}
html[data-theme=light] .ctile:hover,html[data-theme=light] .chip:hover{border-color:#8fb21a}
html[data-theme=light] .ctile.verbunden,html[data-theme=light] .ctile.hinterlegt{border-color:#9bb84a}
html[data-theme=light] .ctile.angefragt{border-color:#e3b341}
html[data-theme=light] .ct-m,html[data-theme=light] .ct-n.o,html[data-theme=light] .chip small{color:#7a756e}
html[data-theme=light] .ct-n{color:#4f7000}
html[data-theme=light] .ct-s{color:#615d59;border-top-color:#eeeae4}
html[data-theme=light] .dotc{background:#b8b2a8}html[data-theme=light] .dotc.ok{background:#7ab800}
html[data-theme=light] .chip.pf{border-color:#bdb7ad}
html[data-theme=light] .ctabs{border-bottom-color:#e6e1d9}
html[data-theme=light] .ctabs a{color:#615d59}html[data-theme=light] .ctabs a:hover{border-color:#cfc9bf}
html[data-theme=light] .ctabs a.on{background:#0E1420;color:#fff}
html[data-theme=light] .pbar{background:#eeeae4}html[data-theme=light] .pbar i{background:#9bc41d}
html[data-theme=light] .bars i{background:#9bc41d}
html[data-theme=light] .sumbox{background:#faf8f4;border-color:#e6e1d9}
html[data-theme=light] .wb{color:#1d1c1a;background:#f1eee9;border-color:#e2ded6}html[data-theme=light] .wb.wx{color:#fff}
html[data-theme=light] .dchip button{color:#1d1c1a}
html[data-theme=light] .fn{color:#1d1c1a}html[data-theme=light] .fn i{background:#f1eee9}
html[data-theme=light] .pmenu{box-shadow:0 12px 32px rgba(0,0,0,.15)}html[data-theme=light] .pmenu button{color:#1d1c1a}html[data-theme=light] .pmenu button:hover{background:#f1eee9}html[data-theme=light] .pmenu button.danger{color:#b4261b}
html[data-theme=light] .days label{color:#1d1c1a}
html[data-theme=light] a.dl{color:#4f7000}
html[data-theme=light] .office-wrap{background:#fff}
html[data-theme=light] ::selection{background:#d9f06b}
#thm{white-space:nowrap}
.howbox{background:#0f1626}html[data-theme=light] .howbox{background:#f7f5f0}

.achips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}.achips:empty{display:none}
.achip{display:inline-flex;gap:6px;align-items:center;padding:3px 9px;border:1px solid var(--line,#2a3550);border-radius:999px;font-size:12px;max-width:100%}.achip a{color:inherit;text-decoration:none;opacity:.7}
textarea.drop{outline:2px dashed #C6F432;outline-offset:-2px}
.mu,html[data-theme=light] .mu{background:#C6F432;color:#0E1420;font-weight:500}
.mu .hint,.mu summary{color:#2c3a10}.mu pre{background:rgba(14,20,32,.1);color:#0E1420}.mu a{color:#0E1420}

.jb{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap;background:#ececec;color:#555}
.jb.b-neu{background:#e6edf9;color:#254a99}.jb.b-pr{background:#fff0d1;color:#8a5a00}.jb.b-fr{background:#fde2d4;color:#9a3a10}.jb.b-ar{background:#e0f0d0;color:#3b6a00}.jb.b-er{background:#d9f3ea;color:#0a6a4a}
html:not([data-theme=light]) .jb{background:#26304A;color:#c9d2e6}html:not([data-theme=light]) .jb.b-neu{background:#1c2c55;color:#9db8ff}html:not([data-theme=light]) .jb.b-pr{background:#41330f;color:#ffd27a}html:not([data-theme=light]) .jb.b-fr{background:#4a2414;color:#ffb490}html:not([data-theme=light]) .jb.b-ar{background:#243a0c;color:#C6F432}html:not([data-theme=light]) .jb.b-er{background:#0d3a2c;color:#6fe0b6}
.jtpl.jsel{border:2px solid #C6F432;box-shadow:0 0 0 3px rgba(198,244,50,.25)}.jdrop{border:1px dashed var(--line,#2a3550);border-radius:8px;padding:8px}.jdrop.drop{outline:2px dashed #C6F432}
.jsteps{display:flex;margin:12px 0 4px}.jsteps div{flex:1;text-align:center;padding:8px 4px;font-size:12px;opacity:.6;border-bottom:3px solid var(--line,#2a3550)}.jsteps .d{border-color:#7aa300;opacity:1}.jsteps .c{border-color:#C6F432;opacity:1;font-weight:700}
.jtl{border-left:2px solid var(--line,#2a3550);margin-left:6px;padding-left:14px}.jtl>div{position:relative;padding-bottom:12px}.jtl>div:before{content:"";position:absolute;left:-20px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--line,#2a3550)}.jtl>.g:before{background:#C6F432}
.jfil{display:flex;flex-wrap:wrap;gap:8px}.jfil select{width:auto;min-width:170px;flex:0 0 auto}

.msent{background:var(--bg,#0E1420);border:1px solid var(--line,#2a3550);border-radius:10px;padding:10px 12px;margin:10px 0}.msent b{background:rgba(198,244,50,.4);padding:0 4px;border-radius:4px;color:inherit}html:not([data-theme=light]) .msent b{background:none;color:#C6F432}
.mfun{display:flex;flex-direction:column;gap:6px;margin:8px 0}.mr{display:flex;align-items:center;gap:10px;cursor:pointer}.mr:hover .mb{filter:brightness(1.15)}.ml{width:130px;font-size:13px;flex:0 0 130px}.mb{height:30px;border-radius:7px;background:#0E1420;color:#C6F432;display:flex;align-items:center;padding:0 10px;font-weight:700;min-width:44px}html:not([data-theme=light]) .mb{background:#C6F432;color:#0E1420}.mq{font-size:12px;opacity:.75;white-space:nowrap}
.mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px}.mt{border:1px solid var(--line,#2a3550);border-radius:10px;padding:8px 10px}.mt b{font-size:20px;display:block}.mt span{font-size:12px;opacity:.75}
.up{color:#3b6a00;font-style:normal;font-size:12px;font-weight:600}.dn{color:#9a3a10;font-style:normal;font-size:12px;font-weight:600}html:not([data-theme=light]) .up{color:#C6F432}html:not([data-theme=light]) .dn{color:#ffb490}
.spark{display:flex;align-items:flex-end;gap:3px;height:44px;margin-top:6px}.spark i{flex:1;background:#0E1420;border-radius:2px;opacity:.75;min-width:3px}html:not([data-theme=light]) .spark i{background:#C6F432}
.msplit{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media(max-width:900px){.mgrid{grid-template-columns:repeat(2,1fr)}.msplit{grid-template-columns:1fr}}
.jfil input[type=date]{width:auto;flex:0 0 auto}

.apb{background:#C6F432;color:#0E1420;border-radius:9px;padding:1px 6px;font-size:11px;font-weight:700;margin-left:4px}
.aprow{display:flex;gap:10px;align-items:center;padding:9px 6px;border-bottom:1px solid var(--line,#2a3550);color:inherit;text-decoration:none}.aprow b{flex:1}
.aprow2{display:flex;gap:12px;align-items:center;padding:10px 4px;border-bottom:1px solid var(--line,#2a3550)}.apcb{width:20px;height:20px;border:2px solid #8f9bb5;border-radius:5px;background:none;cursor:pointer;padding:0;flex:0 0 20px;color:#0E1420;font-size:13px;line-height:16px}.apcb:hover,.apcb.on{background:#C6F432;border-color:#C6F432}
.apchat{display:grid;grid-template-columns:220px minmax(0,1fr);gap:14px}.apch{border:1px solid var(--line,#2a3550);border-radius:12px;padding:10px;align-self:start}.apl{font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin:6px 4px 3px}
.apri{display:block;padding:6px 8px;border-radius:7px;color:inherit;text-decoration:none}.apri.on{background:rgba(198,244,50,.2);font-weight:600}
.apmm{border:1px solid var(--line,#2a3550);border-radius:12px;padding:12px}.apmsgs{height:46vh;overflow:auto;display:flex;flex-direction:column;gap:8px}
.bub2{max-width:80%;padding:8px 12px;border-radius:12px;border:1px solid var(--line,#2a3550);white-space:pre-wrap;word-break:break-word}.bub2.me{align-self:flex-end;background:#C6F432;color:#0E1420;border-color:#C6F432}.bub2 small{display:block;opacity:.7;font-size:11.5px;margin-bottom:2px}
.atask2{margin-top:6px;padding:5px 8px;border-radius:8px;background:rgba(14,20,32,.1);font-size:12.5px}.atask2 a{color:inherit;font-weight:600}

.mnt{background:rgba(198,244,50,.25);border-radius:5px;padding:0 3px;font-weight:600}.bub2.me .mnt{background:rgba(14,20,32,.18)}.bub2.mnme{box-shadow:0 0 0 2px #C6F432}
.mnpop{position:absolute;bottom:100%;left:0;background:#141c2e;border:1px solid #2a3550;border-radius:10px;padding:4px;z-index:50;min-width:220px}.mnpop a{display:block;padding:6px 10px;border-radius:7px;color:inherit;text-decoration:none}.mnpop a:hover{background:rgba(198,244,50,.2)}
/* Dropdowns: undurchsichtiger Hintergrund und eigene Farben, damit die aufgeklappte Liste lesbar bleibt */
html{color-scheme:dark}html[data-theme=light]{color-scheme:light}
select{background-color:#121927;color:#e8ecf4}select option,select optgroup{background-color:#121927;color:#e8ecf4}
.top select,.jfil select{background-color:#121927}
html[data-theme=light] select,html[data-theme=light] .top select,html[data-theme=light] .jfil select{background-color:#fff;color:#1d1c1a}
html[data-theme=light] select option,html[data-theme=light] select optgroup{background-color:#fff;color:#1d1c1a}
select option:checked,select option:hover{background-color:#C6F432;color:#0E1420}

/* Breite Bildschirme: Raster statt langer Spalten */
.form{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.tkw{display:grid;gap:16px;align-items:start;grid-template-columns:minmax(0,1.3fr) minmax(320px,1fr)}
.tkw .tkc1{grid-column:1}.tkw .tkc3{grid-column:2;grid-row:1}
.tkw.has{grid-template-columns:minmax(260px,1fr) minmax(0,2.2fr) minmax(320px,1fr)}
.tkw.has .tkc1{grid-column:1}.tkw.has .tkc2{grid-column:2;grid-row:1}.tkw.has .tkc3{grid-column:3;grid-row:1}
.tksticky{position:sticky;top:12px;max-height:calc(100vh - 28px);overflow:auto}
.apheute{display:grid;gap:16px;align-items:start;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.apheute>.card:nth-child(n+4){grid-column:span 1}
@media(max-width:1500px){.tkw.has{grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr)}.tkw.has .tkc2{grid-column:1;grid-row:1 / span 2}.tkw.has .tkc3{grid-column:2;grid-row:1}.tkw.has .tkc1{grid-column:2;grid-row:2}.tksticky{position:static;max-height:none}}
@media(max-width:1100px){.tkw,.tkw.has{grid-template-columns:1fr}.tkw .tkc1,.tkw .tkc2,.tkw .tkc3,.tkw.has .tkc1,.tkw.has .tkc2,.tkw.has .tkc3{grid-column:1;grid-row:auto}.apheute{grid-template-columns:1fr}}


.row>select{width:auto;min-width:200px}

.apheute2{display:grid;gap:16px;margin-top:16px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}

/* Menü einklappbar */
#navtg{position:fixed;top:16px;left:244px;z-index:60;width:28px;height:28px;border-radius:50%;border:1px solid var(--line,#2a3550);background:var(--card,#121927);color:var(--soft,#9aa6bf);cursor:pointer;padding:0;font-size:15px;line-height:1;display:grid;place-items:center}
#navtg:hover{background:#C6F432;color:#0E1420;border-color:#C6F432}
html.nav-off #navtg{left:10px}
html.nav-off .shell{grid-template-columns:1fr}
html.nav-off aside{display:none}
body:not(:has(.shell)) #navtg{display:none}
@media(max-width:860px){#navtg{display:none}html.nav-off aside{display:flex}}
html.nav-off main{padding-left:56px}

.ldw{display:grid;gap:16px;align-items:start;grid-template-columns:minmax(0,1fr) minmax(300px,420px);margin-top:10px}
@media(max-width:1100px){.ldw{grid-template-columns:1fr}}

.lenabtn{font-size:15px;padding:10px 20px;font-weight:700;box-shadow:0 0 0 3px rgba(198,244,50,.25);margin:0 12px}
#lchat{position:fixed;right:20px;bottom:20px;width:min(420px,calc(100vw - 24px));height:min(600px,calc(100vh - 40px));max-height:calc(100vh - 40px);z-index:9000;background:#0E1420;border:1px solid #2a3550;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.5)}
html[data-theme=light] #lchat{background:#fff;border-color:#e6e1d9}
#lchat .lc-h{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #2a3550}
#lchat .lc-m{flex:1 1 0;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px;display:flex;flex-direction:column;gap:10px;scroll-behavior:auto}#lchat .lc-m>*{flex-shrink:0;overflow-wrap:anywhere}#lchat .lc-h,#lchat .lc-q,#lchat .lc-i{flex-shrink:0}
#lchat .lc-q{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 8px}
#lchat .lc-i{display:flex;gap:8px;padding:10px 14px;border-top:1px solid #2a3550;align-items:flex-end}#lchat .lc-i textarea{flex:1}

/* Erinnerungen nach Stufe */
.aprow.lv1,.aprow2.lv1{background:rgba(240,200,60,.10);border-left:4px solid #e0b020;padding-left:10px}
.aprow.lv2,.aprow2.lv2{background:rgba(240,140,40,.14);border-left:4px solid #ee8a1c;padding-left:10px}
.aprow.lv3,.aprow2.lv3{background:rgba(230,70,60,.16);border-left:4px solid #e5443a;padding-left:10px}
.lvtag{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:99px;margin-left:8px;white-space:nowrap;vertical-align:middle}
.lvtag.lv1{background:#e0b020;color:#2a1f00}.lvtag.lv2{background:#ee8a1c;color:#2a1400}.lvtag.lv3{background:#e5443a;color:#fff}

#newver{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:100000;background:#0E1420;color:#fff;border:1px solid #C6F432;border-radius:12px;padding:10px 16px;display:flex;gap:12px;align-items:center;box-shadow:0 8px 30px rgba(0,0,0,.5)}

.nav .nlbl{padding:10px 12px 2px;color:var(--soft,#9aa6bf);font-size:15px}
.nav a.sub{padding-left:28px;font-size:14px;line-height:1.25}

#msgs>*,.apmsgs>*,#dkm>*{flex-shrink:0}

input[type=date]::-webkit-calendar-picker-indicator,input[type=month]::-webkit-calendar-picker-indicator,input[type=datetime-local]::-webkit-calendar-picker-indicator{order:-1;margin:0 10px 0 0;cursor:pointer}
input[type=date],input[type=month],input[type=datetime-local]{text-align:left}
