/* =============================================================
   fms.css — Gemeinsames FMS-Stylesheet für FlitzService
   Extrahiert aus Mockups: fms-handys-uebersicht-mock.html,
   fms-disponent-mock.html, fms-setup-mock.html,
   fms-konfig-mock.html, fms-stammdaten-mock.html,
   fms-fahrzeuge-mock.html
   ============================================================= */

/* ---------------------------------------------------------------
   1. CSS-Tokens + Reset + Body
--------------------------------------------------------------- */
:root{
  --win:#eceee8; --desktop:#c9cdc4; --face:#e3e6df; --field:#fff;
  --req:#ffff00; --err:#f7d4d7; --sel:#2f6fd0; --hdr:#7d7d7d; --accent:#2b7fc0;
  --ok:#43a047; --okbadge:#76d72b; --danger:#d23b32; --ink:#1b1b1b;
  --line:#b3b7ae; --bdark:#808479; --blight:#fff;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{font-family:"Segoe UI",Tahoma,"Microsoft Sans Serif",sans-serif;font-size:12px;color:var(--ink);
  background:var(--win);display:flex;flex-direction:column;height:100vh;overflow:hidden}
.mono{font-family:Consolas,"Courier New",monospace}
.hidden{display:none !important}


/* ---------------------------------------------------------------
   2. Shell: Top-Leiste / Tabs / User / Logout
--------------------------------------------------------------- */
.topbar{display:flex;align-items:center;height:38px;padding:0 10px;gap:14px;
  background:linear-gradient(#f4f6f0,#dde1d8);border-bottom:1px solid #b6bab1}
.brand{font-weight:800;font-style:italic;color:var(--accent);font-size:16px;letter-spacing:.3px}
.brand .s{color:#555;font-style:normal;font-weight:600}
.tabs{display:flex;gap:2px;height:100%}
.tab{display:flex;align-items:center;padding:0 12px;cursor:default;color:#333;border-bottom:3px solid transparent}
.tab:hover{background:#e7ece2}
.tab.active{color:#000;font-weight:700;border-bottom-color:var(--sel);background:#e7ebe3}
.topbar .sp{flex:1}
.user{display:flex;align-items:center;gap:8px;color:#333}
.user .who{background:#dfe7df;border:1px solid #b7c2b7;padding:2px 8px}
.user .who b{color:#000}
.logout{padding:3px 10px;background:var(--face);cursor:default;color:#a32c25;font-weight:600;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}


/* ---------------------------------------------------------------
   3. Statuszeile
--------------------------------------------------------------- */
.statusbar{display:flex;align-items:center;gap:16px;height:24px;padding:0 10px;background:var(--win);
  border-top:1px solid #c4c8bf;font-size:11px;color:#333}
.statusbar .sp{flex:1}
.statusbar b{color:#111}
.led{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3fbf2a;margin-right:5px;vertical-align:-1px}


/* ---------------------------------------------------------------
   4. Arbeitsbereich / Sidebar
--------------------------------------------------------------- */
.work{flex:1;display:flex;min-height:0}
.side{width:150px;background:var(--win);border-right:1px solid #c4c8bf;padding:6px;display:flex;flex-direction:column;gap:3px}
.side .grp{font-size:10px;font-weight:700;color:#8a8e85;text-transform:uppercase;padding:8px 6px 3px}
.navitem{display:flex;align-items:center;gap:8px;padding:6px 8px;cursor:default;color:#1c1c1c;border:1px solid transparent}
.navitem:hover{background:#eef1ea}
.navitem.active{background:#fcefc0;border-color:#e6c75a #b89a2e #b89a2e #e6c75a;font-weight:700}
.navitem .ic{width:14px;height:14px;flex:0 0 14px;color:var(--accent)}
.navitem .lb{flex:1}
/* Zähler-Badge in Sidebar-Einträgen (Disponent) */
.navitem .cnt{font-family:Consolas,monospace;font-size:11px;background:#dfe3da;border:1px solid #c2c6bd;padding:0 5px;border-radius:8px;color:#333}
.navitem.active .cnt{background:#fff7da;border-color:#d9bf63}


/* ---------------------------------------------------------------
   5. Hauptpanel / Sektionsleiste
--------------------------------------------------------------- */
.main{flex:1;display:flex;flex-direction:column;min-width:0}
.section-hd{display:flex;align-items:center;gap:10px;background:linear-gradient(#8b8f86,#71756c);
  color:#fff;font-weight:700;font-size:13px;padding:5px 10px;border-bottom:1px solid #5f6359}
.section-hd .sp{flex:1}
.section-hd .hint{font-weight:400;font-size:11px;opacity:.9}
.hd-cnt{font-weight:400;font-size:12px;opacity:.92}
.hd-search{display:flex;align-items:center;background:var(--field);border:2px solid;
  border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);height:24px;padding:0 6px;gap:5px;width:200px}
.hd-search input{border:0;outline:0;font-size:12px;flex:1;background:transparent}
.hd-search svg{color:#777}
.hd-select{height:24px;border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);
  background:var(--field);font-size:12px;padding:0 4px}
.hd-btn{display:flex;align-items:center;gap:5px;height:24px;padding:0 9px;background:var(--face);cursor:default;color:#111;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}
.hd-btn .k{font-size:9px;color:#fff;background:var(--accent);padding:0 3px;border-radius:2px}


/* ---------------------------------------------------------------
   6. Tabelle
--------------------------------------------------------------- */
.tablewrap{flex:1 1 auto;min-height:0;overflow:auto;background:var(--field);border-bottom:2px solid #9b9f96}
table{width:100%;border-collapse:collapse;font-size:12px}
th{position:sticky;top:0;background:linear-gradient(#e9ebe4,#d6dad0);color:#000;font-weight:700;text-align:left;
  padding:5px 8px;border-right:1px solid #c2c6bd;border-bottom:1px solid #aeb2a9;white-space:nowrap}
td{padding:4px 8px;border-right:1px solid var(--line);border-bottom:1px solid #e1e3dc;white-space:nowrap}
tbody tr{cursor:default}
tbody tr:nth-child(even){background:#f6f7f3}
tbody tr:hover{background:#eaf0fb}
tbody tr.sel{background:var(--sel);color:#fff}
tbody tr.sel td{border-right-color:#5a86d6}
tbody tr.off{color:#8a8a8a}
tbody tr.off.sel{color:#fff}
/* neue Zeile (Disponent) */
tr.neu td:first-child{box-shadow:inset 3px 0 0 #f0b400}

/* Status-Punkt */
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;vertical-align:-1px;border:1px solid rgba(0,0,0,.3)}
.dot.on{background:#3fbf2a}
.dot.offl{background:#cf4034}
/* Setup-Seite nutzt .dot.off (kein .offl) */
.dot.off{background:#cf4034}

/* Häkchen / Muted / Badges */
.chk{color:#2a9d35;font-weight:700}
tr.sel .chk{color:#bfffce}
.muted{color:#8a8a8a}
.ubadge{font-size:11px;font-weight:700;padding:0 6px;border-radius:2px;border:1px solid rgba(0,0,0,.18)}
.u-wait{background:#ffe14d;color:#5b4a00}
.u-avail{background:#ffc66b;color:#5a3a00}

/* Status-Quelle (Disponent) */
.src{font-weight:600}
.src.app{color:#2b7fc0}
.src.bot{color:#8a5cc0}
.src.web{color:#2e9e6e}
.src.zentrale{color:#b5651d}
.src-ch{color:#888;font-size:.85em;margin-left:2px}
.vart{font-weight:600;padding:1px 6px;border-radius:3px;font-size:11px}
.vart.mietwagen{background:#e4eef9;color:#22557f}
.vart.taxi{background:#fbe9a8;color:#7a5a00}
.xb{display:inline-block;background:#eee;color:#444;border:1px solid #d2d2d2;border-radius:3px;padding:0 5px;font-size:11px;margin-right:3px}
.nb-ban{background:#f3c0bd;color:#6b1813;font-weight:700;padding:4px 8px;border:1px solid #d23b32;border-radius:3px;margin-bottom:6px}
.nb-vip{background:#fbe9a8;color:#7a5a00;font-weight:700;padding:4px 8px;border:1px solid #d9bf63;border-radius:3px;margin-bottom:6px}
.nb-note{background:#eef1ea;color:#444;padding:4px 8px;border:1px solid #c2c6bd;border-radius:3px;margin-bottom:6px}
.nb-picker{border:1px solid #c2c6bd;background:#f6f7f3;max-height:160px;overflow:auto;margin-bottom:6px}
.nb-pick-hd{font-weight:700;padding:3px 6px;background:#e6e9e1}
.nb-pick{padding:3px 6px;cursor:pointer;border-top:1px solid #e1e3dc}
.nb-pick:hover{background:#eaf0fb}


/* ---------------------------------------------------------------
   7. Status-Pills (Disponent)
--------------------------------------------------------------- */
.pill{display:inline-block;font-weight:700;font-size:11px;padding:1px 7px;border-radius:2px;border:1px solid rgba(0,0,0,.18)}
tbody tr.sel .pill{filter:brightness(1.05)}
.p-offen{background:#ffe14d;color:#5b4a00}
.p-ueb{background:#bcd6f7;color:#143a6b}
.p-best{background:#bdebbb;color:#15401a}
.p-abg{background:#d9dcd4;color:#444}
.p-stor{background:#f3c0bd;color:#6b1813}


/* ---------------------------------------------------------------
   8. Detail-Panel
--------------------------------------------------------------- */
.detail{flex:0 0 auto;display:flex;flex-direction:column;background:var(--win)}
.detail .sub{background:linear-gradient(#9a9e95,#82867d);color:#fff;font-weight:700;padding:4px 10px;font-size:12px;display:flex;align-items:center;gap:8px}
.detail .sub .tag{background:#fff;color:#333;font-family:Consolas,monospace;padding:0 6px;border-radius:2px}
.ptabs{display:flex;gap:2px;background:#dfe2db;border-bottom:1px solid #bcc0b7;padding:0 6px}
.ptab{padding:5px 16px;cursor:default;color:#333;border:1px solid transparent;border-bottom:none;margin-top:3px}
.ptab.active{background:var(--win);color:#000;font-weight:700;border-color:#bcc0b7;position:relative;top:1px}
.pbody{padding:9px 14px;min-height:118px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.row{display:grid;grid-template-columns:118px 1fr;align-items:center;gap:8px;margin-bottom:5px}
.row label{font-weight:700;text-align:right}
.val{color:#222}

/* Akku-Balken */
.bat{display:inline-block;width:90px;height:13px;border:1px solid #888;background:#fff;vertical-align:-2px;position:relative;margin-right:6px}
.bat>i{position:absolute;left:0;top:0;bottom:0;width:87%;background:#5bbf3a}

/* Aktionsgruppen im Detail-Panel */
.actgrp{margin-bottom:8px}
.actgrp .h{font-size:10px;font-weight:700;color:#8a8e85;text-transform:uppercase;margin-bottom:4px}
.actrow{display:flex;flex-wrap:wrap;gap:6px}
.abtn{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:var(--face);cursor:default;color:#111;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}
.abtn .ic{width:14px;height:14px;color:var(--accent)}
.abtn .pop{font-size:10px;color:#888;margin-left:2px}

/* Detail-Formular (Disponent) */
.fkey{display:inline-block;font-weight:400;color:#fff;background:var(--accent);font-size:9px;padding:0 4px;border-radius:2px;margin-left:4px}
.fld{height:24px;padding:0 7px;background:var(--field);font-size:12px;width:100%;
  border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark)}
.fld:focus{outline:1px dotted #333;outline-offset:-3px}
.fld.req{background:var(--req)}
.summary{font-size:12px;line-height:1.7;background:var(--field);border:2px solid;
  border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);padding:7px 10px;color:#234}
.summary b{color:#000}


/* ---------------------------------------------------------------
   9. Commit-Buttons
--------------------------------------------------------------- */
.commit{grid-column:1 / -1;display:flex;justify-content:flex-end;gap:8px;padding-top:4px}
.cbtn{display:flex;align-items:center;gap:7px;height:38px;padding:0 16px;font-size:13px;font-weight:700;cursor:default;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}
.cbtn .g{font-size:18px}
.cbtn.ok{background:#e7f4e6;color:var(--ok)}
.cbtn.cancel{background:#f6e3e2;color:var(--danger)}


/* ---------------------------------------------------------------
   10. Event-Log (einklappbar)
--------------------------------------------------------------- */
.eventlog{border-top:1px solid #c4c8bf;background:var(--win)}
.eventlog .lhd{display:flex;align-items:center;gap:7px;padding:4px 10px;cursor:default;font-weight:700;color:#444;background:#e3e6df}
.eventlog .lhd .car{transition:none}
.eventlog .lbody{display:none;max-height:104px;overflow:auto;padding:6px 10px;font-family:Consolas,monospace;font-size:11px;background:#f7f8f4;line-height:1.6}
.eventlog.open .lbody{display:block}
.eventlog .t{color:#777;margin-right:6px}


/* ---------------------------------------------------------------
   11. Log-Farben (gemeinsam für Event-Log und Konsole)
--------------------------------------------------------------- */
.le-ok{color:#1c7d28}
.le-err{color:#b32a22}
.le-info{color:#2b6fa8}
.le-warn{color:#9a6d00}
.le-data{color:#555}


/* ---------------------------------------------------------------
   12. FMS-Popup / Overlay
--------------------------------------------------------------- */
.overlay{position:fixed;inset:0;background:rgba(40,42,38,.32);display:none;align-items:center;justify-content:center;z-index:50}
.overlay.show{display:flex}
.fmswin{width:540px;background:var(--win);border:1px solid #6f736a;box-shadow:0 12px 34px rgba(0,0,0,.45)}
.fmswin .tb{display:flex;align-items:center;height:28px;padding:0 6px;gap:8px;background:linear-gradient(#f4f6f0,#dde1d8);border-bottom:1px solid #b6bab1;font-weight:600;color:#2a2e27}
.fmswin .tb .ttl{flex:1}
.fmswin .x{width:28px;height:19px;display:grid;place-items:center;background:#e9534a;color:#fff;border:1px solid;border-color:#f3a39d #a32c25 #a32c25 #f3a39d;font-weight:700;cursor:default}
.fmswin .wb{padding:11px 13px}
.mapbox{height:240px;border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);position:relative;
  background:linear-gradient(0deg,rgba(0,0,0,.04),rgba(0,0,0,0)),
    repeating-linear-gradient(0deg,#e4ebe2,#e4ebe2 22px,#dbe3d9 22px,#dbe3d9 23px),
    repeating-linear-gradient(90deg,#e4ebe2,#e4ebe2 22px,#dbe3d9 22px,#dbe3d9 23px)}
.mapbox .pin{position:absolute;left:52%;top:46%;transform:translate(-50%,-100%);color:#d23b32;font-size:26px}
.mapbox .scale{position:absolute;left:8px;bottom:8px;background:rgba(255,255,255,.85);border:1px solid #aaa;font-size:10px;padding:1px 6px}
.kv{margin:9px 0;font-size:12px;line-height:1.7}
.kv b{color:#000}
.winrow{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.wbtn{display:flex;align-items:center;gap:6px;height:28px;padding:0 12px;background:var(--face);cursor:default;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}


/* ---------------------------------------------------------------
   13. Setup: Zwei-Spalten-Layout / Verbindung / Info / Primär-Button
--------------------------------------------------------------- */
.cols{flex:1;display:grid;grid-template-columns:368px 1fr;min-height:0}
.ctrl{overflow:auto;border-right:1px solid #c4c8bf;background:var(--win);padding:8px}
.console{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--win)}

/* Grauer Untertitel */
.subhd{background:linear-gradient(#9a9e95,#82867d);color:#fff;font-weight:700;font-size:12px;padding:4px 9px;margin:8px 0 6px;display:flex;align-items:center;gap:7px}
.subhd:first-child{margin-top:0}

/* Verbindungsbox */
.connbox{display:flex;align-items:center;gap:8px;background:var(--field);border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);padding:7px 9px}
.connbox .lb{flex:1;font-weight:700}
.tiny{font-size:10px;color:#8a8e85;margin-top:3px}

/* Geräteinfo */
.info{background:var(--field);border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);padding:7px 10px}
.irow{display:grid;grid-template-columns:84px 1fr;gap:6px;padding:2px 0;font-size:12px}
.irow label{font-weight:700;text-align:right;color:#333}
.irow .v{color:#111}
.bad{color:var(--danger);font-weight:700}

/* Allgemeiner Button (Setup / Konsole) */
.btn{display:flex;align-items:center;gap:6px;height:26px;padding:0 11px;background:var(--face);cursor:default;color:#111;border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}
.btn:hover{background:#eef1ea}
.btn:disabled,.btn.dis{color:#9a9e95}
.btn .ic{width:13px;height:13px;color:var(--accent)}

/* Primär-Button */
.primary{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:38px;margin:10px 0 8px;font-size:13px;font-weight:700;cursor:default;
  background:linear-gradient(#eaf4e6,#d9ecd3);color:#1f6b2a;border:1px solid;border-color:#bfe0b3 #6fa563 #6fa563 #bfe0b3}
.primary .ic{width:16px;height:16px}


/* ---------------------------------------------------------------
   14. Setup: Schritt-Fortschritt
--------------------------------------------------------------- */
.steps{background:var(--field);border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);padding:5px 8px}
.step{display:flex;align-items:center;gap:8px;padding:3px 2px;border-bottom:1px solid #edeee8}
.step:last-child{border-bottom:none}
.step .n{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;border:1px solid #b7bbb2;background:#f3f4ef;color:#555}
.step .t{flex:1}
.step .st{font-weight:700;font-size:11px}
.step.done .n{background:#d7f0d2;border-color:#7cc06a;color:#1f6b2a}
.step.done .st{color:#1f6b2a}
.step.run .n{background:#fff2c4;border-color:#d9bf63;color:#8a6d00}
.step.run .st{color:#8a6d00}
.step.todo{color:#8a8e85}


/* ---------------------------------------------------------------
   15. Accordion
--------------------------------------------------------------- */
.acc{margin-top:8px;border:1px solid #c4c8bf;background:var(--win)}
.acc .ahd{display:flex;align-items:center;gap:7px;padding:5px 9px;background:#e3e6df;cursor:default;font-weight:700}
.acc .ahd .car{color:#666}
.acc .abody{display:none;padding:8px 9px;border-top:1px solid #cfd3ca}
.acc.open .abody{display:block}
.arow{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.arow:last-child{margin-bottom:0}


/* ---------------------------------------------------------------
   16. Log-Konsole (Setup)
--------------------------------------------------------------- */
.log-hd{display:flex;align-items:center;gap:8px;background:linear-gradient(#9a9e95,#82867d);color:#fff;font-weight:700;font-size:12px;padding:4px 9px}
.log-hd .sp{flex:1}
.seg{display:flex;border:1px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark)}
.seg span{padding:2px 9px;background:var(--face);color:#222;cursor:default;border-right:1px solid #b7bbb2;font-weight:400}
.seg span:last-child{border-right:none}
.seg span.on{background:var(--sel);color:#fff;font-weight:700}
.lbtn{height:22px;padding:0 9px;background:var(--face);color:#111;cursor:default;border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}
.log-body{flex:1;overflow:auto;background:#f7f8f4;border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);margin:6px;padding:7px 9px;font-family:Consolas,monospace;font-size:12px;line-height:1.65}
.le .t{color:#888;margin-right:7px}


/* ---------------------------------------------------------------
   17. Konfig-Formular
--------------------------------------------------------------- */
.formwrap{flex:1 1 auto;min-height:0;overflow:auto;background:var(--win);padding:0}
/* Gruppen-Überschrift */
.grphd{display:flex;align-items:center;gap:8px;background:linear-gradient(#9a9e95,#82867d);
  color:#fff;font-weight:700;font-size:12px;padding:4px 10px;border-top:1px solid #5f6359;border-bottom:1px solid #5f6359}
.grphd .gic{width:13px;height:13px;color:#fff}
.fgrp{background:var(--win)}
.fbody{padding:10px 14px 14px}
/* Label-links-Zeilen */
.frow{display:grid;grid-template-columns:170px 1fr;align-items:center;gap:10px;
  padding:3px 0;border-bottom:1px solid #dfe2da}
.frow:last-child{border-bottom:none}
.frow>label{font-weight:700;text-align:right;color:#222}
.fctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* Checkbox */
.fctl input[type=checkbox]{width:14px;height:14px;margin:0}
.fctl .chklbl{cursor:default}
/* Felder im 3D-Senk-Look */
.fctl select,.fctl input[type=text]{font-family:inherit;font-size:12px;height:23px;padding:1px 6px;
  background:var(--field);border:2px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);outline:0}
.fctl select{min-width:190px}
.fctl input[type=text]{min-width:190px}
.fctl input.req{background:var(--req)}
.maxlen{font-size:10px;color:#8a8e85}
.hint{font-size:11px;color:#8a8e85}
/* Button-Gruppe Größe */
.segbtns{display:inline-flex}
.segbtns .sb{height:23px;padding:0 12px;display:flex;align-items:center;background:var(--face);cursor:default;color:#222;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight);margin-left:-1px}
.segbtns .sb:first-child{margin-left:0}
.segbtns .sb.on{background:var(--sel);color:#fff;font-weight:700;
  border-color:#1b4f9e #6da0e6 #6da0e6 #1b4f9e}
/* Apply-Button */
.applybar{padding:12px 14px;background:var(--win);border-top:1px solid #c4c8bf}
.bigbtn{display:flex;align-items:center;gap:9px;width:100%;height:38px;padding:0 16px;justify-content:center;
  background:linear-gradient(#eef1ea,#d9ddd3);cursor:default;color:#143d12;font-weight:700;font-size:13px;font-family:inherit;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}
.bigbtn .ok{color:#1c7d28;font-size:15px;font-weight:700}
.bigbtn .fk{font-size:10px;color:#fff;background:var(--accent);padding:1px 5px;border-radius:2px;margin-left:6px}
/* FMS-Log-Container (Konfig) */
.fmslog{margin:0 14px 14px;background:#f7f8f4;border:2px solid;
  border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);
  padding:7px 10px;font-family:Consolas,"Courier New",monospace;font-size:11px;line-height:1.65;max-height:120px;overflow:auto}
.fmslog .t{color:#777;margin-right:6px}
.lg-ok{color:#1c7d28;font-weight:700;margin-right:5px}
.lg-err{color:#b32a22;font-weight:700;margin-right:5px}


/* ---------------------------------------------------------------
   18. Stammdaten: Inline-Edit-Tabelle
--------------------------------------------------------------- */
.tablewrap.edit table{table-layout:fixed}
td.cell{padding:1px 2px}
td.celln{padding:1px 2px;text-align:center}
/* .cellinput — gemeinsame Basis für Stammdaten + Fahrzeuge */
.cellinput{width:100%;height:22px;border:1px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);
  background:var(--field);font-family:inherit;font-size:12px;color:var(--ink);padding:0 5px;outline:0}
td.celln .cellinput{text-align:center;font-family:Consolas,"Courier New",monospace}
.cellinput:focus{border-color:var(--accent);background:#fff}
.cellinput.req{background:var(--req)}
.cellinput.req:focus{background:#ffffb0}
/* geänderte Zeile */
tr.changed .cellinput{border-color:var(--ok);box-shadow:inset 0 0 0 1px var(--ok)}
/* Lösch-Spalte */
td.del{text-align:center;padding:1px 2px}
.delbtn{display:inline-grid;place-items:center;width:20px;height:20px;background:var(--face);cursor:default;
  color:var(--danger);font-weight:700;font-size:12px;line-height:1;
  border:1px solid;border-color:var(--blight) var(--bdark) var(--bdark) var(--blight)}
.delbtn:hover{background:#f0d6d6}


/* ---------------------------------------------------------------
   19. Fahrzeuge: Inline-Edit-Ergänzungen
--------------------------------------------------------------- */
/* Pflicht-Gelb NUR im Editier-/Neu-Zustand (JS setzt .req auf den Input) — nicht dauerhaft */
td.editcell .cellinput.req{background:var(--req)}
td.editcell .cellinput.req:focus{background:#fffbb0}
td.editcell{padding:0}
/* Fahrzeuge-spezifisches .cellinput (transparent, kein Rahmen) */
td.editcell .cellinput{border:0;height:auto;background:transparent;min-width:90px;padding:4px 8px;color:inherit}
td.editcell .cellinput:focus{background:#fffbdd;box-shadow:inset 0 0 0 1px var(--accent);border:0}
td.pflicht .cellinput:focus{background:#fffbb0}
/* Ja/Nein-Select */
td.jn{padding:2px 4px}
.jnsel{font-family:inherit;font-size:12px;border:1px solid;border-color:var(--bdark) var(--blight) var(--blight) var(--bdark);
  background:var(--field);padding:1px 2px}
.jnsel.ja{color:#1c7d28;font-weight:700}
.jnsel.nein{color:#b32a22;font-weight:700}
/* Fortschrittsbalken */
td.prog{min-width:118px}
.pbar{display:inline-block;width:78px;height:12px;border:1px solid #888;background:#fff;vertical-align:-2px;position:relative;margin-right:6px}
.pbar>i{position:absolute;left:0;top:0;bottom:0;background:#5bbf3a}
.pbar.full>i{background:#43a047}
.ptxt{font-family:Consolas,"Courier New",monospace;font-weight:700}
tr.sel .pbar{border-color:#bcd0f4}
tr.sel .pbar>i{background:#9fe07f}
/* Fahrzeuge-Löschbutton (rot, abweichend von Stammdaten) */
td.delc{text-align:center;padding:3px 6px}
td.delc .delbtn{width:18px;height:18px;background:#e9534a;color:#fff;
  border-color:#f3a39d #a32c25 #a32c25 #f3a39d}

/* ============================================================
   LOGIN-DIALOG (Austrosoft-angelehnt)
   ============================================================ */
.lgn-back{position:fixed;inset:0;background:#0a0a0a;display:flex;align-items:center;
    justify-content:center;z-index:1000}
.lgn-box{width:430px;background:var(--win,#eef0ee);border:1px solid #888;
    box-shadow:0 4px 24px rgba(0,0,0,.5);font-family:inherit}
.lgn-box .lgn-title{background:#fff;border-bottom:1px solid #cfcfcf;padding:6px 10px;
    font-weight:600;display:flex;justify-content:space-between;align-items:center}
.lgn-logo{background:#7d7d7d;color:#fff;text-align:center;padding:22px 0;margin:14px;
    font-size:26px;letter-spacing:.5px}
.lgn-logo .s{color:#bfe3ff}
.lgn-row{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:8px;
    margin:10px 18px}
.lgn-row label{text-align:right;font-weight:600}
.lgn-row input{padding:5px 7px;border:1px solid #7a7a7a;background:#fff;font-family:inherit;font-size:14px}
.lgn-foot{display:flex;align-items:center;padding:12px 18px 16px}
.lgn-gear{width:38px;height:38px;border:1px solid #9a9a9a;background:#e3e3e3;cursor:pointer;
    display:flex;align-items:center;justify-content:center;border-radius:3px}
.lgn-gear:hover{background:#d6d6d6}
.lgn-foot .sp{flex:1}
.lgn-ok,.lgn-cancel{width:64px;height:40px;border:1px solid #9a9a9a;background:#e3e3e3;
    cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:3px;margin-left:8px}
.lgn-ok:hover{background:#d8efd8}
.lgn-cancel:hover{background:#f3dada}
.lgn-ok svg{stroke:#2e9e2e}
.lgn-cancel svg{stroke:#cc3b30}
.lgn-err{color:#cc3b30;font-weight:600;margin:0 18px 8px;min-height:1.1em}
.lgn-pop{position:absolute;background:#fff;border:1px solid #888;box-shadow:0 2px 10px rgba(0,0,0,.3);
    padding:8px 12px;font-size:12px;line-height:1.5;z-index:1001}

/* ============================================================
   MODAL-DIALOG (Benutzer anlegen/bearbeiten)
   ============================================================ */
.dlg-back{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;
    justify-content:center;z-index:900}
.dlg{width:420px;background:var(--win,#eef0ee);border:1px solid #888;box-shadow:0 4px 20px rgba(0,0,0,.4)}
.dlg-hd{background:#7d7d7d;color:#fff;padding:7px 12px;font-weight:600}
.dlg-body{padding:14px}
.dlg-row{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:8px;margin-bottom:10px}
.dlg-row label{text-align:right;font-weight:600}
.dlg-row input,.dlg-row select{padding:5px 7px;border:1px solid #7a7a7a;background:#fff;
    font-family:inherit;font-size:14px}
.dlg-row input.req{background:var(--req,#ffff00)}
.dlg-foot{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid #cfcfcf}
/* Footer-Buttons nebeneinander, gleich gross (ueberschreibt .bigbtn/.primary width:100% + .primary-margin) */
.dlg-foot .bigbtn{width:auto;min-width:110px;height:34px;margin:0}

/* ============================================================
   ROLLEN-RASTER (Seiten | Rechte)
   ============================================================ */
.rgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:8px}
.rgrid-col{border:1px solid #c4c4c4;background:#fafafa;padding:10px 12px}
.rgrid-col h4{margin:0 0 8px;font-size:13px;border-bottom:1px solid #d8d8d8;padding-bottom:5px}
.rchk{display:flex;align-items:center;gap:7px;padding:3px 0}
.rchk input[disabled]+span{color:#999}

/* =============================================================
   CALL-BANNER (CTI incoming_call Hinweis)
   ============================================================ */
.call-banner{position:fixed;top:8px;left:50%;transform:translateX(-50%);z-index:9999;
  background:#1f6feb;color:#fff;padding:8px 14px;border-radius:4px;font-size:14px;
  box-shadow:0 2px 8px rgba(0,0,0,.3);cursor:pointer;display:flex;align-items:center;gap:10px;}
.call-banner .cb-x{font-weight:bold;cursor:pointer;padding:0 4px;opacity:.85;}
.call-banner .cb-x:hover{opacity:1;}
