/* Mietkumpel.com – Backend-Designsystem 1.3.0
   Alle Farben, Abstände und Radien als CSS-Variablen. Hell/Dunkel über html[data-theme].
   Die öffentliche Website und das Kundenportal behalten das Markenrot (app.css). */
body.admin{
  --primary:#1e3a8a;--primary-d:#172e6e;--primary-2:#2563eb;--primary-soft:#eef3ff;
  --bg:#f3f5f9;--card:#fff;--card-2:#f8fafc;--line:#e2e8f0;--line-2:#cbd5e1;
  --text:#1e293b;--muted:#64748b;--heading:#0f172a;
  --ok:#16a34a;--ok-soft:#dcfce7;--ok-text:#166534;
  --warn:#ea580c;--warn-soft:#ffedd5;--warn-text:#9a3412;
  --danger:#dc2626;--danger-soft:#fee2e2;--danger-text:#991b1b;
  --info:#2563eb;--info-soft:#dbeafe;--info-text:#1e40af;
  --side:#0f1f4b;--side-2:#162a5e;--side-text:#c7d2fe;--side-muted:#7f8db8;
  --r:12px;--r-sm:8px;--sh:0 1px 2px rgba(15,23,42,.06),0 4px 14px rgba(15,23,42,.05);--sh-lg:0 18px 50px rgba(15,23,42,.22);
  --sidew:248px;--ease:cubic-bezier(.2,.7,.2,1);
  /* vorhandene Variablen aus app.css im Backend umfärben */
  --red:var(--primary);--red-d:var(--primary-d);--black:var(--heading);--grey:var(--card-2);--grey2:var(--line);--green:var(--ok);--amber:var(--warn);
  background:var(--bg);color:var(--text);font-size:15px;transition:background-color .2s var(--ease),color .2s var(--ease)}
html[data-theme="dark"] body.admin{
  --primary:#3b82f6;--primary-d:#2563eb;--primary-2:#60a5fa;--primary-soft:#172554;
  --bg:#0b1220;--card:#121a2b;--card-2:#0f1626;--line:#23304a;--line-2:#33415e;
  --text:#d6deeb;--muted:#8b98b0;--heading:#f1f5f9;
  --ok-soft:#052e1a;--ok-text:#86efac;--warn-soft:#3b1d08;--warn-text:#fdba74;--danger-soft:#3b0d0d;--danger-text:#fca5a5;--info-soft:#0c1f4a;--info-text:#93c5fd;
  --side:#070d1a;--side-2:#111c33;--side-text:#c7d2fe;--side-muted:#64748b;
  --sh:0 1px 2px rgba(0,0,0,.4);color-scheme:dark}
body.admin a{color:var(--primary-2)}
html[data-theme="dark"] body.admin a{color:#93c5fd}
body.admin h1,body.admin h2,body.admin h3,body.admin h4,body.admin label{color:var(--heading)}
body.admin input[type=text],body.admin input[type=email],body.admin input[type=tel],body.admin input[type=number],body.admin input[type=date],body.admin input[type=datetime-local],body.admin input[type=time],body.admin input[type=month],body.admin input[type=search],body.admin input[type=password],body.admin input[type=url],body.admin select,body.admin textarea{background:var(--card);color:var(--text);border-color:var(--line-2);border-radius:var(--r-sm)}
body.admin input:focus,body.admin select:focus,body.admin textarea:focus{outline:3px solid color-mix(in srgb,var(--primary-2) 30%,transparent);border-color:var(--primary-2)}
body.admin .check input,body.admin input[type=checkbox],body.admin input[type=radio]{accent-color:var(--primary-2)}
body.admin details{background:var(--card);border-color:var(--line)}
/* Buttons */
body.admin .btn{border-radius:var(--r-sm);transition:background-color .15s,box-shadow .15s,transform .05s;font-weight:650}
body.admin .btn:active{transform:translateY(1px)}
body.admin .btn-primary{background:var(--primary);color:#fff}body.admin .btn-primary:hover{background:var(--primary-d);text-decoration:none}
body.admin .btn-dark{background:var(--heading);color:var(--card)}
body.admin .btn-outline{border:1px solid var(--line-2);color:var(--text);background:var(--card)}body.admin .btn-outline:hover{background:var(--primary-soft);color:var(--primary-2);border-color:var(--primary-2);text-decoration:none}
body.admin .btn-white{background:var(--card);color:var(--text);border:1px solid var(--line-2)}body.admin .btn-white:hover{background:var(--primary-soft)}
body.admin .btn-danger{background:var(--danger);color:#fff}body.admin .btn-success{background:var(--ok);color:#fff}
body.admin .btn-ghost{background:transparent;border-color:transparent;color:var(--muted)}body.admin .btn-ghost:hover{background:var(--card-2);color:var(--text)}
body.admin .btn-lg{padding:14px 26px;font-size:1.05rem}
body.admin .btn-icon{padding:7px;width:36px;height:36px}
/* Layout */
.adm{display:grid;grid-template-columns:var(--sidew) 1fr;min-height:100vh;transition:grid-template-columns .2s var(--ease)}
html.side-collapsed .adm{grid-template-columns:68px 1fr}
.side{background:var(--side);color:var(--side-text);position:sticky;top:0;height:100vh;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;scrollbar-width:thin}
.side .logo{padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:10px;min-height:66px}.side .logo img{height:40px}
.side nav{flex:1;padding:6px 0 14px}
.side nav a{display:flex;align-items:center;gap:11px;color:var(--side-text)!important;padding:8px 14px;margin:1px 8px;font-size:.92rem;border-radius:8px;white-space:nowrap;position:relative}
.side nav a .ico{width:18px;height:18px;opacity:.85}
.side nav a:hover{background:var(--side-2);color:#fff!important;text-decoration:none}
.side nav a.active{background:var(--primary-2);color:#fff!important;box-shadow:0 4px 12px rgba(37,99,235,.35)}
.side nav a.active .ico{opacity:1}
.side nav .grp{font-size:.68rem;text-transform:uppercase;letter-spacing:.9px;color:var(--side-muted);padding:16px 22px 4px;white-space:nowrap}
.side .cnt{margin-left:auto;background:var(--warn);color:#fff;border-radius:999px;font-size:.7rem;padding:1px 7px;font-weight:700}
.side .fav-star{margin-left:auto;opacity:0;background:none;border:0;color:var(--side-muted);cursor:pointer;padding:0 2px;line-height:1}
.side nav a:hover .fav-star{opacity:1}.side .fav-star.on{opacity:1;color:#fbbf24}
.side nav a .cnt+.fav-star{margin-left:6px}
.side .sidefoot{padding:10px 16px;border-top:1px solid rgba(255,255,255,.07);font-size:.75rem;color:var(--side-muted);display:flex;justify-content:space-between;align-items:center;gap:8px}
.side .sidefoot button{background:none;border:0;color:var(--side-muted);cursor:pointer;display:flex;padding:4px}
.side .sidefoot button:hover{color:#fff}
html.side-collapsed .side nav a{justify-content:center;padding:9px 0}
html.side-collapsed .side nav a .lbl,html.side-collapsed .side nav .grp,html.side-collapsed .side .cnt,html.side-collapsed .side .fav-star,html.side-collapsed .side .logo img,html.side-collapsed .side .sidefoot .ver{display:none}
html.side-collapsed .side nav .grp+a,html.side-collapsed .side nav .grp{margin-top:6px}
html.side-collapsed .side nav a:hover::after{content:attr(data-label);position:absolute;left:58px;background:var(--heading);color:var(--card);padding:5px 10px;border-radius:6px;font-size:.8rem;z-index:60;white-space:nowrap;box-shadow:var(--sh)}
.top{background:color-mix(in srgb,var(--card) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:10px 22px;position:sticky;top:0;z-index:30;min-height:62px}
.top form.search{flex:1;max-width:520px;position:relative}
.top form.search input{padding-left:38px;background:var(--card-2)}
.top form.search>.ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted)}
.top .who{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:.9rem}
.livesearch{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-lg);max-height:70vh;overflow:auto;z-index:70;display:none;padding:6px}
.livesearch.open{display:block;animation:pop .14s var(--ease)}
.livesearch .lg{font-size:.7rem;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);padding:8px 10px 3px}
.livesearch a{display:flex;flex-direction:column;padding:7px 10px;border-radius:8px;color:var(--text)!important}
.livesearch a small{color:var(--muted)}
.livesearch a:hover,.livesearch a.hl{background:var(--primary-soft);text-decoration:none}
.livesearch .none{padding:12px;color:var(--muted)}
.menu{position:relative}
.menu>.pop{position:absolute;right:0;top:calc(100% + 8px);background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-lg);min-width:240px;padding:6px;display:none;z-index:80}
.menu.open>.pop{display:block;animation:pop .14s var(--ease)}
.menu .pop a,.menu .pop button.item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:8px;color:var(--text)!important;background:none;border:0;font:inherit;cursor:pointer;text-align:left}
.menu .pop a:hover,.menu .pop button.item:hover{background:var(--card-2);text-decoration:none}
.menu .pop hr{border:0;border-top:1px solid var(--line);margin:6px 0}
.menu .pop .hd{padding:8px 10px;font-size:.82rem;color:var(--muted)}
.menu .pop .hd b{display:block;color:var(--heading);font-size:.95rem}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;border:0;cursor:pointer}
.bellbtn{position:relative}.bellbtn .dot{position:absolute;top:2px;right:2px;background:var(--danger);color:#fff;border-radius:999px;font-size:.62rem;min-width:16px;height:16px;display:flex;align-items:center;justify-content:center;padding:0 4px;font-weight:700}
.notif-list{max-height:420px;overflow:auto;min-width:330px}
.notif-list .n{display:block;padding:9px 10px;border-radius:8px;color:var(--text)!important;border-left:3px solid transparent}
.notif-list .n.unread{background:var(--primary-soft);border-left-color:var(--primary-2)}
.notif-list .n small{display:block;color:var(--muted)}
.themeseg{display:flex;gap:4px;padding:4px 6px}
.themeseg button{flex:1;border:1px solid var(--line);background:var(--card-2);color:var(--text);border-radius:8px;padding:6px;cursor:pointer;font:inherit;font-size:.8rem;display:flex;gap:4px;align-items:center;justify-content:center}
.themeseg button.on{border-color:var(--primary-2);color:var(--primary-2);background:var(--primary-soft)}
.admmain{padding:24px;min-width:0;max-width:1600px;animation:fadein .25s var(--ease)}
.admmain h1{font-size:1.5rem;margin-bottom:4px;letter-spacing:-.01em}
.head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.head .actions{display:flex;gap:8px;flex-wrap:wrap}
.box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;margin-bottom:18px;box-shadow:var(--sh)}
.box h2{font-size:1.06rem;margin-bottom:12px}
.box>h2:first-child{display:flex;align-items:center;gap:8px}
/* KPIs & Widgets */
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;margin-bottom:18px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;color:var(--heading)!important;box-shadow:var(--sh);display:block;position:relative;transition:border-color .15s,transform .15s,box-shadow .15s}
.kpi:hover{text-decoration:none;border-color:var(--primary-2);transform:translateY(-1px);box-shadow:0 8px 22px rgba(37,99,235,.12)}
.kpi b{display:block;font-size:1.75rem;line-height:1.1;letter-spacing:-.02em}
.kpi span{color:var(--muted);font-size:.84rem}
.kpi .ico.k{position:absolute;right:14px;top:14px;width:22px;height:22px;color:var(--primary-2);opacity:.6}
.kpi.warn b{color:var(--danger)}.kpi.ok b{color:var(--ok)}.kpi.orange b{color:var(--warn)}
.widgets{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;align-items:start}
.widgets>.w{grid-column:span 6;margin:0}.widgets>.w.w12{grid-column:span 12}.widgets>.w.w4{grid-column:span 4}.widgets>.w.w8{grid-column:span 8}
.widget-cfg{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px 18px}
.chart-bars{display:flex;align-items:flex-end;gap:10px;height:160px;padding-top:10px}
.chart-bars .c{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.75rem;color:var(--muted);height:100%;justify-content:flex-end}
.chart-bars .c i{display:block;width:100%;max-width:46px;background:linear-gradient(180deg,var(--primary-2),var(--primary));border-radius:6px 6px 2px 2px;min-height:2px}
.chart-bars .c b{color:var(--heading);font-size:.72rem;font-weight:600}
.meter{height:8px;background:var(--line);border-radius:999px;overflow:hidden}.meter>i{display:block;height:100%;background:var(--primary-2);border-radius:999px}
.meter.ok>i{background:var(--ok)}.meter.warn>i{background:var(--warn)}.meter.danger>i{background:var(--danger)}
.quick{display:flex;flex-wrap:wrap;gap:8px}
/* Tabellen */
body.admin .table{font-size:.92rem;background:var(--card);border-radius:var(--r)}
body.admin .table td,body.admin .table th{padding:10px 12px;border-bottom-color:var(--line)}
body.admin .table th{background:var(--card-2);color:var(--muted);font-weight:650;font-size:.76rem;letter-spacing:.5px;white-space:nowrap}
body.admin .table tr:hover td{background:var(--card-2)}
body.admin .table th.sortable{cursor:pointer;user-select:none}
body.admin .table th.sortable::after{content:"↕";opacity:.35;margin-left:5px;font-size:.8em}
body.admin .table th.sort-asc::after{content:"↑";opacity:1;color:var(--primary-2)}body.admin .table th.sort-desc::after{content:"↓";opacity:1;color:var(--primary-2)}
.tablewrap{overflow-x:auto;border-radius:var(--r)}
.tabletools{display:flex;gap:8px;align-items:center;margin-bottom:10px;flex-wrap:wrap}
.tabletools input[type=search]{max-width:280px}
.tabletools .cnt{color:var(--muted);font-size:.85rem;margin-left:auto}
tr.ctx-open td{background:var(--primary-soft)!important}
.ctxmenu{position:fixed;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-lg);padding:6px;z-index:90;min-width:200px;animation:pop .12s var(--ease)}
.ctxmenu a{display:block;padding:7px 10px;border-radius:7px;color:var(--text)!important}.ctxmenu a:hover{background:var(--card-2);text-decoration:none}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.cols4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.cols-main{display:grid;grid-template-columns:2fr 1fr;gap:18px;align-items:start}
form.inline{display:inline}
.filterbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;align-items:end}
.filterbar input,.filterbar select{width:auto;min-width:150px;padding:7px 10px}
/* Status-Farben – überall identisch */
body.admin .badge{background:var(--line);color:var(--text);font-weight:650;letter-spacing:.1px}
.badge-info{background:var(--info-soft)!important;color:var(--info-text)!important}
.badge-warning{background:var(--warn-soft)!important;color:var(--warn-text)!important}
.badge-primary{background:var(--primary-soft)!important;color:var(--primary-2)!important}
.badge-danger{background:var(--danger)!important;color:#fff!important}
.badge-success{background:var(--ok-soft)!important;color:var(--ok-text)!important}
.badge-muted{background:var(--line)!important;color:var(--muted)!important}
body.admin .alert{border-radius:var(--r);border-left-width:4px;animation:slidein .25s var(--ease)}
body.admin .alert-success{background:var(--ok-soft);border-color:var(--ok);color:var(--ok-text)}
body.admin .alert-danger{background:var(--danger-soft);border-color:var(--danger);color:var(--danger-text)}
body.admin .alert-warning{background:var(--warn-soft);border-color:var(--warn);color:var(--warn-text)}
body.admin .alert-info{background:var(--info-soft);border-color:var(--info);color:var(--info-text)}
.prio-hoch{color:var(--danger);font-weight:700}.prio-normal{color:var(--muted)}.prio-niedrig{color:var(--muted);opacity:.7}
.dl{display:grid;grid-template-columns:160px 1fr;gap:6px 12px;font-size:.93rem}.dl dt{color:var(--muted)}.dl dd{margin:0}
.tabsbar{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:16px;flex-wrap:wrap}
.tabsbar a{padding:9px 14px;color:var(--muted)!important;font-weight:600;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabsbar a:hover{color:var(--heading)!important;text-decoration:none}
.tabsbar a.on{border-color:var(--primary-2);color:var(--primary-2)!important}
/* Kalender */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cal .d{background:var(--card);min-height:110px;padding:4px;font-size:.78rem}
.cal .d.out{background:var(--card-2);color:var(--muted)}.cal .d.today{outline:2px solid var(--primary-2);outline-offset:-2px}
.cal .h{background:var(--card-2);font-weight:700;text-align:center;padding:6px;font-size:.8rem;color:var(--muted)}
.ev{display:block;border-radius:5px;padding:2px 6px;margin-top:3px;color:#fff!important;background:#475569;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ev:hover{text-decoration:none;opacity:.9}
.ev.bestaetigt,.ev.abholbereit{background:#1d4ed8}.ev.vermietet{background:var(--primary)}.ev.anfrage,.ev.bearbeitung,.ev.angebot{background:#0891b2}.ev.zurueckgegeben,.ev.abgeschlossen{background:#64748b}.ev.wartung{background:var(--warn)}.ev.service{background:var(--ok)}.ev.transport{background:#7c3aed}.ev.absenz{background:#a855f7}
.timeline{display:grid;gap:6px}
.progress{height:16px;background:var(--line);border-radius:999px;overflow:hidden}.progress div{height:100%;background:var(--primary-2);transition:width .3s}
.log{font-family:Consolas,monospace;font-size:.82rem;background:#0b1220;color:#d6deeb;padding:12px;border-radius:8px;max-height:420px;overflow:auto;white-space:pre-wrap}
.log .ok{color:#86efac}.log .err{color:#fca5a5}
.login{max-width:420px;margin:8vh auto;padding:0 20px}
.rowtools{display:flex;gap:6px;flex-wrap:wrap}
.bar{height:10px;background:var(--primary-2);border-radius:4px}
.qrbox svg{width:180px;height:180px;background:#fff;padding:6px;border-radius:8px}
.repeat-row{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;margin-bottom:6px}
.repeat-row.acc{grid-template-columns:110px 2fr 90px 110px 90px auto}
.thumbgrid{display:flex;gap:10px;flex-wrap:wrap}.thumbgrid .t{border:1px solid var(--line);border-radius:8px;padding:6px;width:150px;text-align:center;font-size:.8rem;background:var(--card)}
.thumbgrid img{height:90px;width:100%;object-fit:contain}
.sidetoggle{display:none}
.sigpad{border:2px dashed var(--line-2);border-radius:10px;background:#fff;position:relative;max-width:620px}.sigpad canvas{width:100%;height:180px;touch-action:none;display:block;cursor:crosshair}.sigpad button{position:absolute;right:8px;top:8px}
/* 1.4.0: Brotkrumen, Formulare, Tabellenwerkzeuge, Ladebalken, Workflow */
.crumbs-adm{font-size:.8rem;color:var(--muted);margin:-6px 0 10px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.crumbs-adm a{color:var(--muted)!important}.crumbs-adm a:hover{color:var(--primary-2)!important}
body.admin label .req{color:var(--danger);margin-left:2px;font-weight:700}
body.admin .field .help{display:block;font-size:.78rem;color:var(--muted);margin-top:3px}
body.admin .field.invalid input,body.admin .field.invalid select,body.admin .field.invalid textarea{border-color:var(--danger);background:var(--danger-soft)}
body.admin .field .err{display:block;font-size:.78rem;color:var(--danger);margin-top:3px;font-weight:600}
body.admin fieldset{border:1px solid var(--line);border-radius:var(--r);padding:12px 16px 4px;margin:0 0 14px}
body.admin legend{font-weight:700;color:var(--heading);padding:0 6px;font-size:.92rem}
.draft-note{font-size:.78rem;color:var(--info-text);background:var(--info-soft);border-radius:8px;padding:6px 10px;margin-bottom:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.colmenu{position:relative}.colmenu .pop{position:absolute;right:0;top:calc(100% + 4px);background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-lg);padding:8px 12px;z-index:60;display:none;min-width:200px;max-height:320px;overflow:auto}
.colmenu.open .pop{display:block}.colmenu .pop label{display:flex;gap:6px;align-items:center;font-weight:400;font-size:.85rem;margin:3px 0;color:var(--text)}
.bulkbar{display:none;gap:8px;align-items:center;background:var(--primary-soft);border:1px solid var(--primary-2);border-radius:var(--r);padding:8px 12px;margin-bottom:10px}
.bulkbar.on{display:flex}
.topbar-progress{position:fixed;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,var(--primary-2),#60a5fa);z-index:300;transition:width .4s var(--ease),opacity .3s;opacity:0}
html.is-loading .topbar-progress{width:80%;opacity:1;transition:width 6s cubic-bezier(.1,.7,.2,1)}
.flow{display:flex;gap:0;overflow-x:auto;padding:4px 0 10px;margin-bottom:14px}
.flow .st{flex:1;min-width:92px;text-align:center;font-size:.72rem;color:var(--muted);position:relative;padding-top:28px}
.flow .st::before{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;background:var(--card);border:2px solid var(--line-2);z-index:1}
.flow .st::after{content:"";position:absolute;top:15px;left:-50%;width:100%;height:2px;background:var(--line-2)}
.flow .st:first-child::after{display:none}
.flow .st.done{color:var(--text)}.flow .st.done::before{background:var(--ok);border-color:var(--ok)}.flow .st.done::after{background:var(--ok)}
.flow .st.cur{color:var(--primary-2);font-weight:700}.flow .st.cur::before{background:var(--primary-2);border-color:var(--primary-2);box-shadow:0 0 0 4px var(--primary-soft)}
.chart-line svg,.chart-pie svg{width:100%;height:auto;display:block}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:.78rem;color:var(--muted)}.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:4px;vertical-align:middle}
.trend-up{color:var(--ok);font-weight:700}.trend-down{color:var(--danger);font-weight:700}
.msg-thread{display:flex;flex-direction:column;gap:8px;max-height:460px;overflow:auto;padding:4px}
.msg{max-width:80%;padding:8px 12px;border-radius:12px;background:var(--card-2);border:1px solid var(--line);font-size:.9rem}
.msg.me{align-self:flex-end;background:var(--primary-soft);border-color:transparent}.msg.internal{border-style:dashed}
.msg small{display:block;color:var(--muted);font-size:.72rem;margin-top:3px}
.syncstate{font-size:.78rem;padding:3px 8px;border-radius:999px;background:var(--ok-soft);color:var(--ok-text)}
.syncstate.pending{background:var(--warn-soft);color:var(--warn-text)}.syncstate.conflict{background:var(--danger-soft);color:var(--danger-text)}
/* Modal, Toast, Skeleton */
.modal-back{position:fixed;inset:0;background:rgba(15,23,42,.5);backdrop-filter:blur(2px);z-index:200;display:flex;align-items:center;justify-content:center;padding:16px;animation:fadein .15s}
.modal{background:var(--card);color:var(--text);border-radius:14px;box-shadow:var(--sh-lg);max-width:440px;width:100%;padding:20px;animation:pop .18s var(--ease)}
.modal h3{margin:0 0 8px;font-size:1.1rem}.modal .acts{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.toasts{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;z-index:220}
.toast{background:var(--heading);color:var(--card);padding:11px 16px;border-radius:10px;box-shadow:var(--sh-lg);font-size:.9rem;display:flex;gap:8px;align-items:center;animation:slidein .2s var(--ease);max-width:380px}
.toast.success{background:var(--ok);color:#fff}.toast.danger{background:var(--danger);color:#fff}
.skeleton{background:linear-gradient(90deg,var(--line) 25%,var(--card-2) 50%,var(--line) 75%);background-size:200% 100%;animation:shimmer 1.2s infinite;border-radius:6px;min-height:14px}
.offline-bar{position:fixed;left:0;right:0;bottom:0;background:var(--warn);color:#fff;text-align:center;padding:7px;font-size:.88rem;z-index:150;display:none}
html.is-offline .offline-bar{display:block}
.offline-bar.syncing{background:var(--info)}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
@keyframes slidein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes shimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){body.admin *{animation:none!important;transition:none!important}}
/* Mobile Navigation */
.mobnav{display:none}
.side-back{display:none}
@media (max-width:1000px){
  .adm,html.side-collapsed .adm{grid-template-columns:1fr}
  .side{position:fixed;left:-280px;width:270px;z-index:120;transition:left .22s var(--ease);box-shadow:var(--sh-lg)}
  .side.open{left:0}
  html.side-collapsed .side nav a .lbl,html.side-collapsed .side nav .grp,html.side-collapsed .side .cnt,html.side-collapsed .side .logo img{display:revert}
  html.side-collapsed .side nav a{justify-content:flex-start;padding:8px 14px}
  .sidetoggle{display:inline-flex}.side .sidefoot .collapse{display:none}
  .cols2,.cols3,.cols4,.cols-main{grid-template-columns:1fr}
  .widgets>.w,.widgets>.w.w4,.widgets>.w.w8{grid-column:span 12}
  .top{padding:8px 12px}.top form.search{max-width:none}
  .admmain{padding:16px 14px 86px}
  .mobnav{display:flex;position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);z-index:100;justify-content:space-around;padding:4px 0 calc(4px + env(safe-area-inset-bottom))}
  .mobnav a{display:flex;flex-direction:column;align-items:center;font-size:.68rem;color:var(--muted)!important;padding:5px 8px;border-radius:8px;gap:2px;min-width:58px}
  .mobnav a.active{color:var(--primary-2)!important}.mobnav a:hover{text-decoration:none}
  .mobnav .ico{width:22px;height:22px}
  .side-back{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:110}.side.open+.side-back{display:block}
  .offline-bar{bottom:60px}
}
/* Tabellen als Karten auf dem Handy */
@media (max-width:760px){
  body.admin .table.cards thead{display:none}
  body.admin .table.cards,body.admin .table.cards tbody,body.admin .table.cards tr,body.admin .table.cards td{display:block;width:100%}
  body.admin .table.cards tr{border:1px solid var(--line);border-radius:var(--r);margin-bottom:10px;padding:8px 4px;background:var(--card)}
  body.admin .table.cards td{border:0;padding:4px 12px;display:flex;justify-content:space-between;gap:12px;text-align:right}
  body.admin .table.cards td::before{content:attr(data-label);color:var(--muted);font-size:.78rem;text-align:left;font-weight:600}
  body.admin .table.cards td[data-label=""]::before{content:none}
  body.admin .table.cards td .rowtools{justify-content:flex-end}
  .head h1{font-size:1.25rem}
  .kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi{padding:12px}.kpi b{font-size:1.4rem}.kpi .ico.k{width:18px;height:18px}
}
@media print{.side,.top,.head .actions,.noprint,.mobnav,.toasts{display:none!important}.adm{display:block}body.admin{background:#fff;--card:#fff;--text:#000}}
/* 1.1.5: Angebote Miete/Hausmeister, Positionen */
[data-kind="miete"] [data-for="hausmeister"], [data-kind="hausmeister"] [data-for="miete"] { display: none !important; }
.repeat-row > span > select, .repeat-row > span > input { width: 100%; }
.items-total { text-align: right; font-weight: 600; margin-top: 6px; }
/* 1.1.6: Hausmeister vor Ort */
.field-card.running{border-left:4px solid var(--primary)}
.field-card .btn{padding:10px 16px}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}.photo-grid img{width:100%;height:110px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.table.plan td{vertical-align:top;padding:6px}.table.plan th.today{background:var(--primary-soft)}
.plan-item{border:1px solid var(--line);border-left:3px solid var(--info);border-radius:6px;padding:4px 6px;margin-bottom:6px;background:var(--card)}
.plan-item.st-erledigt{border-left-color:var(--ok)}.plan-item.st-rechnung{border-left-color:#6b7280}.plan-item.conflict{border-color:var(--danger);background:var(--danger-soft)}
@media (max-width:700px){.field-card .rowtools{flex-direction:column;align-items:stretch}.field-card .rowtools .btn,.field-card .rowtools form{width:100%}.field-card .rowtools form .btn{width:100%}}
.field-card .table td.r,.box .table td.r{white-space:nowrap}
/* 1.2.0: Einsatzplan Drag & Drop */
.plan-item[draggable="true"]{cursor:grab}.plan-item.dragging{opacity:.45}
.table.plan td.drop-over{background:var(--primary-soft);outline:2px dashed var(--primary);outline-offset:-3px}
.table.plan td[data-drop]{min-height:60px;height:60px}
.plan-move{display:flex;flex-direction:column;gap:3px;margin-top:4px}.plan-move select,.plan-move input{padding:2px 4px;font-size:.78rem;min-width:0}
.plan-more summary{cursor:pointer;color:var(--muted);list-style:none}.plan-more summary::-webkit-details-marker{display:none}.plan-more[open] summary{margin-bottom:2px}

/* 1.6.0 – table/filter editor polish */
body.admin .market-price-editor{border:1px solid var(--line);box-shadow:var(--sh-lg)}
body.admin .market-price-editor fieldset{border-color:var(--line)}
body.admin .market-price-editor input,body.admin .market-price-editor select,body.admin .market-price-editor textarea{border-radius:9px}
body.admin .market-price-editor .actions{margin-top:18px}
body.admin .table td{vertical-align:middle}
body.admin .filterbar{gap:10px;flex-wrap:wrap}

/* Mietkumpel 1.8.0 – konsistente moderne Backend-Oberfläche (Refresh Iteration 1) */
body.admin{
  --primary:#2457d6;--primary-d:#1b43a7;--primary-2:#3974f6;--primary-soft:#edf3ff;
  --bg:#f5f7fb;--card:#fff;--card-2:#f9fbff;--line:#e6eaf2;--line-2:#d4dbe8;
  --text:#253047;--muted:#718096;--heading:#14213d;
  --side:#111b34;--side-2:#1b2a4d;--side-text:#dbe5ff;--side-muted:#8292b8;
  --r:16px;--r-sm:10px;--sh:0 2px 5px rgba(20,33,61,.035),0 8px 24px rgba(20,33,61,.045);
  --sh-lg:0 24px 70px rgba(20,33,61,.18);
}
html[data-theme="dark"] body.admin{
  --primary:#5b8cff;--primary-d:#3f70e8;--primary-2:#7ba4ff;--primary-soft:#172746;
  --bg:#0b1020;--card:#121a2c;--card-2:#0f1728;--line:#202c43;--line-2:#31405c;
  --text:#d8e1f2;--muted:#91a0bb;--heading:#f0f5ff;--side:#080d19;--side-2:#121d32;
}
body.admin .admmain{padding:26px clamp(16px,2.2vw,34px) 40px;max-width:1800px;margin:0 auto;width:100%;box-sizing:border-box}
body.admin .head{margin-bottom:22px;gap:16px;align-items:center}
body.admin .head h1{font-size:clamp(1.45rem,2vw,1.95rem);letter-spacing:-.035em;font-weight:780;line-height:1.2}
body.admin .head p{color:var(--muted);margin-top:6px;line-height:1.55}
body.admin .box,body.admin .card,body.admin .kpi,body.admin .widget,body.admin .field-card,body.admin .panel{border-radius:var(--r);border-color:var(--line);box-shadow:var(--sh)}
body.admin .box{padding:20px;background:var(--card)}
body.admin .kpi{padding:18px 20px;transition:transform .18s ease,box-shadow .18s ease;border:1px solid var(--line)}
body.admin .kpi:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(20,33,61,.09)}
body.admin .kpi b{letter-spacing:-.035em;font-weight:780}
body.admin .table{border-collapse:separate;border-spacing:0;background:var(--card);border:1px solid var(--line);border-radius:13px;overflow:hidden}
body.admin .table thead th{background:var(--card-2);color:var(--muted);font-size:.74rem;font-weight:750;text-transform:uppercase;letter-spacing:.055em;border-bottom:1px solid var(--line);padding:12px 14px}
body.admin .table tbody td{padding:12px 14px;border-bottom:1px solid var(--line);line-height:1.45}
body.admin .table tbody tr:last-child td{border-bottom:0}
body.admin .table tbody tr:hover td{background:color-mix(in srgb,var(--primary-soft) 45%,var(--card))}
body.admin .btn{padding:9px 14px;border-radius:10px;min-height:38px;letter-spacing:-.01em}
body.admin .btn-primary{box-shadow:0 3px 8px color-mix(in srgb,var(--primary) 22%,transparent)}
body.admin .btn-primary:hover{box-shadow:0 5px 14px color-mix(in srgb,var(--primary) 30%,transparent);transform:translateY(-1px)}
body.admin input,body.admin select,body.admin textarea{min-height:40px;padding:9px 11px;transition:border-color .15s,box-shadow .15s}
body.admin textarea{min-height:100px}
body.admin .side nav a{padding:9px 14px;margin:2px 9px;border-radius:10px;font-weight:540;transition:background .14s,color .14s}
body.admin .side nav a.active{background:linear-gradient(135deg,var(--primary-2),var(--primary));box-shadow:0 6px 16px rgba(57,116,246,.24)}
body.admin .side .grp{font-weight:750;letter-spacing:1.1px;padding-top:18px}
body.admin .top{padding:11px clamp(14px,2vw,28px);min-height:68px;border-bottom-color:var(--line);box-shadow:0 2px 10px rgba(20,33,61,.025)}
body.admin .top form.search input{border-radius:12px;min-height:42px}
body.admin .badge,body.admin .pill,body.admin .status{border-radius:999px;font-weight:700;letter-spacing:-.01em}
body.admin details{border-radius:12px;padding:12px 14px}
body.admin hr{border:0;border-top:1px solid var(--line);margin:20px 0}
body.admin .filterbar,body.admin .actions,body.admin .rowtools{gap:8px}
body.admin .modal{border-radius:18px;padding:24px;border:1px solid var(--line)}
@media(max-width:1000px){body.admin .admmain{padding:18px 14px 90px}body.admin .head{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){body.admin .kpi:hover,body.admin .btn-primary:hover{transform:none}}