/* ============================================================
   i-alp KNX-Planer – Stylesheet
   Variante 1 "Claude Light": Sidebar/Header/Tab-Leiste bleiben
   i-alp-Blau, der Arbeitsbereich wird hell (Claude.ai-Stil).
   ============================================================ */
:root {
  /* Sidebar & Header (i-alp Navy) */
  --sidebar-bg:          #063b7b;
  --sidebar-bg-2:        rgba(255,255,255,.08);
  --sidebar-border:      rgba(255,255,255,.18);
  --sidebar-text:        #ffffff;
  --sidebar-text-2:      #ffffff;
  --sidebar-text-3:      #afc2dd;
  --sidebar-accent:      #f2ae0a;
  --sidebar-accent-text: #0b2545;

  /* Arbeitsbereich */
  --bg:            #e6edf4;
  --bg-card:       #ffffff;
  --bg-input:      #ffffff;
  --bg-table-head: #f3f6fb;
  --bg-hover:      #f3f6fb;
  --bg-section:    #eef1f6;

  /* Rahmen */
  --border:        #d7e0ec;
  --border-strong: #b9c8de;

  /* Weiche, gestufte Schatten statt harter Kanten (Apple-Pro-App-Stil) */
  --shadow-card: 0 1px 2px rgba(10,30,60,.05), 0 6px 16px -4px rgba(10,30,60,.10);
  --shadow-pop:  0 8px 28px -6px rgba(10,30,60,.20);

  /* Text */
  --text:       #11203a;
  --text-2:     #5b6472;
  --text-3:     #8a94a6;
  --text-label: #11203a;
  --text-value: #0b2545;

  /* Akzent (Navy – Verlinkungen, Fokus-Rahmen, KNX-Badges) */
  --accent:       #063b7b;
  --accent-hover: #0a4a96;
  --accent-light: #eaf0fa;
  /* CTA (Gold – primäre Handlungs-Buttons) */
  --cta:       #f2ae0a;
  --cta-hover: #ffc01a;
  --cta-text:  #0b2545;
  --accent-text:  #0b2545;

  /* Status – ausschließlich als Symbol-/Rahmenfarbe, nie als Flächenfüllung */
  --ok:        #1f9254;
  --ok-text:   #1f9254;
  --ok-border: #1f9254;
  --warn:        #c2680b;
  --warn-text:   #c2680b;
  --warn-border: #c2680b;
  --err:        #c0372b;
  --err-text:   #c0372b;
  --err-border: #c0372b;

  /* Gewerk-Kennfarben – nur noch als Textfarbe auf neutralem Chip, keine Flächenfüllung mehr */
  --pastel-licht:   #eef1f6; --pastel-licht-t:   #2056a8;
  --pastel-besch:   #eef1f6; --pastel-besch-t:   #0f7a6c;
  --pastel-heiz:    #eef1f6; --pastel-heiz-t:    #9a4b2f;
  --pastel-sich:    #eef1f6; --pastel-sich-t:    #9d3f6b;
  --pastel-knx:     #eef1f6; --pastel-knx-t:     #5b3fbf;
  --pastel-wetter:  #eef1f6; --pastel-wetter-t:  #3b6e91;
  --pastel-strom:   #eef1f6; --pastel-strom-t:   #3f4f9e;
  --pastel-allg:    #eef1f6; --pastel-allg-t:    #52606d;
  --pastel-bad:     #eef1f6; --pastel-bad-t:     #0e7490;
  --pastel-fa:      #eef1f6; --pastel-fa-t:      #6b3fa0;
}

/* Dunkles Farbschema (optional, per Umschalter in der Sidebar) – angelehnt an die
   ursprüngliche i-alp-Navy/Gold-Palette. Gleiche Variablennamen wie oben, damit
   jede bestehende Komponente automatisch mitwechselt. */
:root[data-theme="dark"] {
  --sidebar-bg:          #063b7b;
  --sidebar-bg-2:        #0a4a96;
  --sidebar-border:      #1a5fb0;
  --sidebar-text:        #f0f4fa;
  --sidebar-text-2:      #ffffff;
  --sidebar-text-3:      #b8c6dc;
  --sidebar-accent:      #fbbf24;
  --sidebar-accent-text: #041d3d;

  --bg:            #041d3d;
  --bg-card:       #063b7b;
  --bg-input:      #0a4a96;
  --bg-table-head: #0a4a96;
  --bg-hover:      #0a4a96;
  --bg-section:    #072f61;

  --border:        #1a5fb0;
  --border-strong: #2f6fc4;

  --text:       #f0f4fa;
  --text-2:     #b8c6dc;
  --text-3:     #7d92b3;
  --text-label: #f0f4fa;
  --text-value: #ffffff;

  --accent:       #fbbf24;
  --accent-hover: #fcd34d;
  --accent-light: rgba(251,191,36,.16);
  --accent-text:  #fde68a;

  --ok:        rgba(74,222,128,.16);
  --ok-text:   #86efac;
  --ok-border: #4ade80;
  --warn:        rgba(251,146,60,.18);
  --warn-text:   #fdba74;
  --warn-border: #fb923c;
  --err:        rgba(248,113,113,.18);
  --err-text:   #fca5a5;
  --err-border: #f87171;

  --pastel-licht:   #072f61;  --pastel-licht-t:   #6fa8e8;
  --pastel-besch:   #072f61;  --pastel-besch-t:   #5bc9b6;
  --pastel-heiz:    #072f61;  --pastel-heiz-t:    #d98a6b;
  --pastel-sich:    #072f61;  --pastel-sich-t:    #d98ab3;
  --pastel-knx:     #072f61;  --pastel-knx-t:     #b9a4f0;
  --pastel-wetter:  #072f61;  --pastel-wetter-t:  #8fc4de;
  --pastel-strom:   #072f61;  --pastel-strom-t:   #a7b4e8;
  --pastel-allg:    #072f61;  --pastel-allg-t:    #aeb9c4;
  --pastel-bad:     #072f61;  --pastel-bad-t:     #5bc2d6;
  --pastel-fa:      #072f61;  --pastel-fa-t:      #b98ae0;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Inter',"Segoe UI",system-ui,sans-serif;font-size:14px;line-height:1.5;height:100vh;overflow:hidden;}
.app{display:grid;grid-template-columns:260px 1fr;grid-template-rows:auto 1fr;height:100vh;}

/* Sidebar */
.sidebar{grid-column:1;grid-row:1/3;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);overflow-y:auto;padding:16px;display:flex;flex-direction:column;}
.sidebar-content{flex:1;}
.brand-area{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--sidebar-border);}
.brand-logo{height:40px;width:auto;flex-shrink:0;border-radius:4px;}
.brand-text .logo{font-size:15px;font-weight:700;color:#fff;}
.brand-text .logo span{color:var(--sidebar-accent);}
.brand-text .tagline{font-size:10px;color:var(--sidebar-text-3);}
.section-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-3);}
.sidebar .section-title{font-size:10px;letter-spacing:.05em;color:var(--sidebar-text-3);margin:16px 0 6px;}
.field{margin-bottom:10px;}
.field label{display:block;font-size:11px;color:var(--sidebar-text-2);margin-bottom:3px;}
.field input,.field select{width:100%;background:var(--sidebar-bg-2);border:1px solid var(--sidebar-border);color:var(--sidebar-text);padding:7px 9px;border-radius:5px;font-size:12px;font-family:inherit;}
.field input:focus,.field select:focus{outline:none;border-color:var(--sidebar-accent);}

/* Buttons (Arbeitsbereich) */
.btn{background:var(--cta);color:var(--cta-text);border:none;padding:9px 12px;border-radius:10px;font-weight:600;font-size:13px;cursor:pointer;width:100%;margin-bottom:5px;font-family:inherit;transition:background .15s,transform .1s;}
.btn:active{transform:scale(.98);}
.btn:hover{background:var(--cta-hover);}
.btn.secondary{background:var(--bg-card);color:var(--text);border:0.5px solid var(--border-strong);}
.btn.secondary:hover{background:var(--bg-hover);}
.btn.danger{background:var(--err);color:#ffffff;border:none;}
.btn.small{padding:5px 10px;font-size:11px;width:auto;margin:0;}

/* Buttons (Sidebar – i-alp Gelb, unverändert) */
.sidebar .btn{background:var(--sidebar-accent);color:var(--sidebar-accent-text);font-weight:600;transition:opacity .15s;}
.sidebar .btn:hover{opacity:.85;background:var(--sidebar-accent);}
.sidebar .btn.secondary{background:var(--sidebar-bg-2);color:var(--sidebar-text);border:1px solid var(--sidebar-border);}
.sidebar .btn.secondary:hover{opacity:1;background:var(--sidebar-border);}

.modus-toggle{display:flex;gap:2px;margin-bottom:12px;background:var(--sidebar-bg-2);border:1px solid var(--sidebar-border);border-radius:12px;padding:3px;}
.modus-btn{flex:1;padding:7px 6px;font-size:11px;font-weight:600;border:none;border-radius:9px;background:transparent;color:var(--text);cursor:pointer;text-align:center;transition:background .15s,color .15s;}
.modus-btn.active{background:var(--sidebar-accent);color:var(--sidebar-accent-text);box-shadow:0 1px 4px rgba(0,0,0,.25);}
.sidebar-footer{margin-top:16px;padding-top:14px;border-top:1px solid var(--sidebar-border);font-size:10px;color:var(--sidebar-text-3);text-align:center;}
.sidebar-footer .copyright{color:var(--sidebar-text-2);font-weight:500;}

/* Top-Bar */
.topbar{grid-column:2;grid-row:1;background:var(--sidebar-bg);border-bottom:1px solid var(--sidebar-border);padding:0 20px;display:flex;align-items:center;gap:12px;height:48px;}
#haupt-titel{font-size:16px;font-weight:700;flex:1;color:#ffffff;}
#haupt-subtitle{font-size:11px;color:var(--sidebar-text-3);}
.theme-toggle{background:var(--sidebar-bg-2);border:1px solid var(--sidebar-border);color:var(--sidebar-text);padding:7px 14px;border-radius:10px;cursor:pointer;font-size:12px;font-weight:600;font-family:inherit;margin-left:auto;flex-shrink:0;white-space:nowrap;transition:border-color .15s;}
.theme-toggle:hover{border-color:var(--sidebar-accent);}

/* Tab-Navigation */
.tab-nav-wrapper{background:var(--sidebar-bg);border-bottom:1px solid var(--sidebar-border);padding:0 20px;}
#tab-nav{display:flex;gap:2px;}
.tab{padding:10px 14px;cursor:pointer;font-size:12px;color:var(--sidebar-text-2);border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s;white-space:nowrap;}
.tab.active{color:var(--sidebar-accent);border-bottom-color:var(--sidebar-accent);font-weight:600;}
.tab:hover{color:var(--sidebar-text);}

/* Hauptbereich */
.main-area{grid-column:2;grid-row:2;display:flex;flex-direction:column;overflow:hidden;}
#tab-inhalt{flex:1;overflow-y:auto;padding:20px 24px;background:var(--bg);}

/* Tab-Header */
.tab-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:8px;}
.tab-header h2{font-size:18px;font-weight:600;color:var(--text);}
.subtitle{color:var(--text-3);font-size:12px;}
.tab-header-left,.tab-header-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.field-inline{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text);}
.field-inline select{background:var(--bg-input);border:0.5px solid var(--border-strong);color:var(--text);padding:5px 8px;border-radius:6px;font-size:11px;font-family:inherit;}

/* Norm-Banner */
.norm-banner{display:flex;align-items:center;gap:10px;background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--border);color:var(--text);padding:11px 16px;border-radius:12px;margin-bottom:16px;font-size:12px;box-shadow:var(--shadow-card);}
.norm-banner.ok{border-left-color:var(--ok-text);}
.norm-banner.ok .norm-icon{color:var(--ok-text);}
.norm-banner.warn{border-left-color:var(--warn-text);}
.norm-banner.warn .norm-icon{color:var(--warn-text);}
.norm-banner.err{border-left-color:var(--err-text);}
.norm-banner.err .norm-icon{color:var(--err-text);}
.norm-icon{font-size:16px;flex-shrink:0;}

/* Etage-Block */
.etage-block{background:var(--bg-card);border:0.5px solid var(--border);border-radius:14px;margin-bottom:14px;overflow:hidden;box-shadow:var(--shadow-card);}
.etage-header{background:var(--bg-table-head);padding:10px 16px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;border-bottom:0.5px solid var(--border);}
.etage-title{display:flex;align-items:center;gap:10px;}
.etage-name{font-weight:600;font-size:14px;color:var(--text);}
.etage-stats{font-size:11px;color:var(--text-3);}
.etage-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.raum-typ-select{background:var(--bg-input);border:0.5px solid var(--border-strong);color:var(--text);padding:5px 8px;border-radius:6px;font-size:11px;font-family:inherit;}

/* Raum-Grid */
.raum-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;padding:12px;}

/* Raum-Karte */
.raum-karte{background:var(--bg-card);border:0.5px solid var(--border);border-radius:12px;overflow:hidden;transition:border-color .15s,box-shadow .15s;box-shadow:var(--shadow-card);}
.raum-karte.ok{border-color:var(--border);}
.raum-karte.warn{border-left:3px solid var(--warn-border);}
.raum-karte-header{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:0.5px solid var(--border);}
.raum-icon{font-size:16px;flex-shrink:0;}
.raum-name-input{flex:1;background:transparent;border:none;color:var(--text);font-size:12px;font-weight:600;font-family:inherit;padding:0;}
.raum-name-input:focus{outline:none;border-bottom:1px solid var(--accent);}
.raum-badges{display:flex;gap:3px;}
.mini-badge{padding:1px 5px;border-radius:6px;font-size:9px;font-weight:600;}
.mini-badge.knx{background:var(--accent-light);color:var(--accent-text);border:1px solid var(--accent-light);}
.icon-btn-small{background:transparent;border:none;color:var(--text-3);cursor:pointer;font-size:13px;padding:0 2px;}
.icon-btn-small:hover{color:var(--err-text);}
.raum-karte-body{padding:8px 10px;}
.ausstattung-row{display:flex;align-items:center;gap:6px;margin-bottom:6px;min-height:28px;}
.ausstattung-label{font-size:11px;color:var(--text-2);flex:1;min-width:70px;}
.zaehler{display:flex;align-items:center;gap:4px;}
.zaehler-btn{background:var(--bg-section);border:0.5px solid var(--border);color:var(--text);width:22px;height:22px;border-radius:4px;cursor:pointer;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;}
.zaehler-btn:hover{background:var(--border);}
.zaehler-wert{font-weight:700;min-width:20px;text-align:center;font-size:13px;color:var(--text);}
.zaehler-warn{color:var(--warn-text);}
.din-soll{font-size:10px;padding:1px 6px;border-radius:6px;background:var(--bg-section);color:var(--text-2);font-weight:600;}
.din-soll.ok{color:var(--ok-text);}
.din-soll.warn{color:var(--warn-text);font-weight:700;}
.knx-row{background:var(--accent-light);border-radius:4px;padding:4px 6px;margin-left:-2px;margin-right:-2px;}
.knx-checks{display:flex;gap:8px;flex-wrap:wrap;}
.knx-checks label{display:flex;align-items:center;gap:4px;font-size:11px;cursor:pointer;color:var(--text);}
.knx-checks input{accent-color:var(--accent);}
.festanschluesse-bereich{border-top:0.5px solid var(--border);margin-top:6px;padding-top:6px;}
.festanschluss-liste{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:4px;}
.fa-badge{display:inline-flex;align-items:center;gap:3px;background:var(--bg-section);color:var(--pastel-fa-t);border:1px solid var(--border);padding:2px 6px;border-radius:6px;font-size:10px;font-weight:600;}
.fa-badge button{background:none;border:none;color:var(--pastel-fa-t);cursor:pointer;font-size:11px;padding:0 1px;opacity:.6;}
.fa-badge button:hover{opacity:1;}
.btn-link{background:none;border:none;color:var(--accent);cursor:pointer;font-size:10px;padding:0;font-family:inherit;text-decoration:underline;}
.raum-warning{background:var(--bg-card);border-top:1px solid var(--border);padding:6px 10px;font-size:10px;font-weight:600;color:var(--warn-text);}

/* Popup */
.popup-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;z-index:200;}
.popup-box{background:var(--bg-card);border:0.5px solid var(--border);border-radius:16px;padding:20px;min-width:260px;max-width:90vw;max-height:80vh;overflow-y:auto;box-shadow:var(--shadow-pop);}
.popup-box h4{margin-bottom:12px;font-size:14px;color:var(--text);}
.fa-menu{display:flex;flex-direction:column;gap:4px;}
.fa-menu-item{background:var(--bg-section);border:0.5px solid var(--border);color:var(--text);padding:8px 12px;border-radius:6px;cursor:pointer;font-size:12px;text-align:left;font-family:inherit;}
.fa-menu-item:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light);}

/* Stromkreis-Tabelle */
.stromkreis-tabelle-wrapper{overflow-x:auto;margin-bottom:20px;}
.stromkreis-tabelle{width:100%;border-collapse:collapse;font-size:12px;}
.stromkreis-tabelle th{background:var(--bg-table-head);color:var(--text-2);padding:8px 10px;text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border);}
.stromkreis-tabelle td{padding:7px 10px;border-bottom:0.5px solid var(--border);color:var(--text);}
.stromkreis-tabelle tr:hover td{background:var(--bg-hover);}
.sk-fehler td:first-child{border-left:3px solid var(--err-text);}
.sk-nr{font-family:'JetBrains Mono','Cascadia Code','Courier New',monospace;font-size:11px;color:var(--accent);}
.typ-badge{padding:2px 7px;border-radius:6px;font-size:10px;font-weight:700;background:var(--bg-section);border:1px solid var(--border);color:var(--text-2);}
.sk-licht{color:var(--pastel-licht-t);}
.sk-sd{color:var(--pastel-besch-t);}
.sk-fa{color:var(--pastel-fa-t);}
.sk-bad{color:var(--pastel-bad-t);}
.sk-knx{color:var(--pastel-knx-t);}
.sk-allg{color:var(--pastel-allg-t);}
.hint{font-size:10px;color:var(--text-3);}
.fehler-badge{display:inline-block;background:var(--bg-section);color:var(--err-text);font-weight:600;border-radius:6px;padding:1px 6px;font-size:9px;margin-left:4px;}
.fi-gruppen-uebersicht h3{font-size:14px;margin-bottom:10px;color:var(--text);}
.fi-gruppen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;}
.fi-gruppe-karte{background:var(--bg-card);border:0.5px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:var(--shadow-card);}
.fi-gruppe-header{background:var(--bg-table-head);padding:8px 12px;font-size:12px;font-weight:600;border-bottom:0.5px solid var(--border);color:var(--text);}
.fi-gruppe-kreise{padding:8px 12px;display:flex;flex-wrap:wrap;gap:4px;}
.sk-badge{background:var(--bg-section);border:0.5px solid var(--border);padding:2px 6px;border-radius:6px;font-size:10px;color:var(--text-2);}

/* Verteiler */
.verteiler-info-leiste{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px;}
.info-karte{background:var(--bg-card);border:0.5px solid var(--border);padding:10px 12px;border-radius:12px;box-shadow:var(--shadow-card);}
.info-karte.warn{border-color:var(--border);border-left:3px solid var(--warn-text);}
.info-wert{font-size:18px;font-weight:700;color:var(--text);}
.info-label{font-size:11px;color:var(--text-3);margin-top:2px;}
.verteiler-layout{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:20px;}
.verteiler-layout>*{min-width:0;}
.verteiler-grafik-panel h3,.verteiler-liste-panel h3{font-size:13px;margin-bottom:8px;color:var(--text-2);}
.verteiler-grafik-header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap;}
.verteiler-grafik-header h3{margin-bottom:0;}
.verteiler-schrank-wrapper{overflow-x:auto;background:var(--bg-card);border:0.5px solid var(--border);border-radius:12px;padding:10px;box-shadow:var(--shadow-card);}
.vt-toolbar{display:flex;align-items:center;gap:6px;margin-bottom:8px;flex-wrap:wrap;}
.vt-zoom-label{min-width:42px;text-align:center;font-size:12px;color:var(--text-2);}
.vt-viewport{padding:10px;max-height:none;}
.vt-zoom{--vt-zoom:1;width:calc(min(100%,1600px) * var(--vt-zoom));margin:0 auto;}
.vt-zoom .verteiler-svg{display:block;width:100%;height:auto;}
@media(max-width:700px){.vt-zoom{min-width:calc(640px * var(--vt-zoom));max-width:none;width:calc(640px * var(--vt-zoom));}}
.verteiler-grafik-panel:fullscreen{background:var(--bg);padding:16px;overflow:auto;}
.verteiler-grafik-panel:fullscreen .verteiler-schrank-wrapper{overflow:auto;}
.reihe-liste-block{background:var(--bg-card);border:0.5px solid var(--border);border-radius:12px;margin-bottom:8px;overflow:hidden;box-shadow:var(--shadow-card);}
.reihe-liste-header{background:var(--bg-table-head);padding:7px 12px;display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:11px;font-weight:600;border-bottom:0.5px solid var(--border);color:var(--text);}
.reihe-titel{white-space:nowrap;}
.reihe-label-input{flex:1;min-width:80px;background:var(--bg-input);border:0.5px solid var(--border-strong);color:var(--text);padding:3px 6px;border-radius:4px;font-size:11px;font-family:inherit;font-weight:400;}
.reihe-label-input:focus{outline:none;border-color:var(--accent);}
.te-zaehler{color:var(--text-3);font-weight:400;white-space:nowrap;}
.reihe-leer-hinweis{padding:8px 12px;font-size:11px;color:var(--text-3);font-style:italic;}
.reihe-geraete-liste{display:flex;flex-direction:column;}
.geraet-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:5px 10px;border-bottom:0.5px solid var(--border);font-size:11px;color:var(--text);}
.geraet-zeile:last-child{border-bottom:none;}
.geraet-pos{color:var(--text-3);width:16px;flex-shrink:0;}
.geraet-sym{font-family:'JetBrains Mono','Cascadia Code',monospace;font-size:10px;color:var(--accent);min-width:32px;flex-shrink:0;}
.geraet-bez{flex:1;min-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.geraet-te{color:var(--text-3);flex-shrink:0;}
.geraet-actions{display:flex;align-items:center;gap:2px;flex-shrink:0;}
.reihe-move-select,.sk-zuordnung-select{background:var(--bg-input);border:0.5px solid var(--border-strong);color:var(--text);padding:2px 4px;border-radius:4px;font-size:10px;font-family:inherit;}
.reihe-move-select{width:46px;}
.sk-zuordnung-select{flex-basis:100%;width:100%;margin-top:2px;}
.leer-zeile{color:var(--text-3);opacity:.6;}
.geraete-palette{background:var(--bg-card);border:0.5px solid var(--border);border-radius:14px;padding:14px;box-shadow:var(--shadow-card);}
.geraete-palette h3{font-size:13px;margin-bottom:10px;color:var(--text);}
.palette-ziel{margin-bottom:10px;}
.palette-grid{display:flex;flex-wrap:wrap;gap:6px;}
.palette-item{background:var(--bg-section);border:0.5px solid var(--border);color:var(--text);padding:6px 10px;border-radius:6px;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:6px;font-size:11px;}
.palette-item:hover{border-color:var(--accent);background:var(--accent-light);}
.palette-symbol{font-weight:700;color:var(--accent);min-width:25px;font-family:'JetBrains Mono',monospace;}
.palette-label{color:var(--text-2);}
.palette-te{color:var(--text-3);margin-left:auto;}

/* KNX-Tab */
.knx-zwei-spalten{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.knx-zwei-spalten h3{font-size:13px;margin-bottom:8px;color:var(--text-2);}
.preview-list{background:var(--bg-card);border:0.5px solid var(--border);border-radius:12px;padding:4px;max-height:50vh;overflow-y:auto;box-shadow:var(--shadow-card);}
.preview-item{display:grid;grid-template-columns:80px 1fr;gap:8px;padding:5px 8px;border-bottom:0.5px solid var(--border);font-size:12px;}
.preview-item:last-child{border-bottom:none;}
.preview-ga{font-family:'JetBrains Mono','Cascadia Code','Courier New',monospace;font-size:11px;color:var(--accent);}
.preview-name{color:var(--text);}
.preview-section{background:var(--bg-table-head);padding:5px 8px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-2);margin-top:4px;border-radius:6px;}

/* Abkürzungen-Legende */
.legende-block{margin-top:16px;}
.legende-liste{padding:4px;}
.legende-item{display:grid;grid-template-columns:90px 1fr;gap:8px;padding:5px 12px;border-bottom:0.5px solid var(--border);font-size:12px;}
.legende-item:last-child{border-bottom:none;}
.legende-abk{font-weight:700;color:var(--accent);font-family:'JetBrains Mono','Cascadia Code','Courier New',monospace;font-size:11px;white-space:nowrap;}
.legende-text{color:var(--text-2);}

/* Export-Grid */
.export-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;}
.export-karte{background:var(--bg-card);border:0.5px solid var(--border);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow-card);transition:box-shadow .15s;}
.export-karte:hover{box-shadow:var(--shadow-pop);}
.export-icon{font-size:28px;}
.export-titel{font-weight:600;font-size:14px;color:var(--text);}
.export-desc{font-size:12px;color:var(--text-2);flex:1;}

/* Berechnungen-Tab */
.berechnung-globals{display:flex;align-items:center;gap:12px;background:var(--bg-card);border:0.5px solid var(--border);padding:10px 14px;border-radius:12px;margin-bottom:14px;flex-wrap:wrap;box-shadow:var(--shadow-card);}
.berechnung-globals input{width:100px;background:var(--bg-input);border:0.5px solid var(--border-strong);color:var(--text);padding:6px 8px;border-radius:6px;font-size:12px;font-family:inherit;}
.hinweis-text{font-size:11px;color:var(--text-3);}

.ampel-leiste{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-bottom:16px;}
.ampel-karte{background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--border);border-radius:10px;padding:11px 14px;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:600;color:var(--text);box-shadow:var(--shadow-card);}
.ampel-karte.ok{border-left-color:var(--ok-text);}
.ampel-karte.ok .ampel-icon{color:var(--ok-text);}
.ampel-karte.warn{border-left-color:var(--warn-text);}
.ampel-karte.warn .ampel-icon{color:var(--warn-text);}
.ampel-karte.err{border-left-color:var(--err-text);}
.ampel-karte.err .ampel-icon{color:var(--err-text);}
.ampel-icon{font-size:16px;flex-shrink:0;}

.berechnung-abschnitt{background:var(--bg-card);border:0.5px solid var(--border);border-radius:14px;margin-bottom:14px;overflow:hidden;box-shadow:var(--shadow-card);}
.berechnung-abschnitt summary{background:var(--bg-table-head);padding:10px 14px;font-weight:600;font-size:13px;cursor:pointer;list-style:none;color:var(--text);}
.berechnung-abschnitt summary::-webkit-details-marker{display:none;}
.berechnung-abschnitt summary::before{content:'▸ ';color:var(--accent);}
.berechnung-abschnitt[open] summary::before{content:'▾ ';}
.berechnung-abschnitt .stromkreis-tabelle-wrapper{margin:10px;}

.bk-input{width:70px;background:var(--bg-input);border:0.5px solid var(--border-strong);color:var(--text);padding:4px 6px;border-radius:4px;font-size:11px;font-family:inherit;}
.bk-input.bk-small{width:55px;}
.bk-select{background:var(--bg-input);border:0.5px solid var(--border-strong);color:var(--text);padding:4px 6px;border-radius:4px;font-size:11px;font-family:inherit;}
.bk-readonly{color:var(--text-3);font-family:'JetBrains Mono','Cascadia Code',monospace;font-size:11px;}
.bk-empfehlung{font-size:10px;color:var(--warn-text);}

.status-badge{padding:2px 7px;border-radius:6px;font-size:10px;font-weight:700;white-space:nowrap;background:var(--bg-section);color:var(--text-2);}
.status-badge.ok{color:var(--ok-text);}
.status-badge.warn{color:var(--warn-text);}
.status-badge.err{color:var(--err-text);}

/* Empty State */
.empty-state{text-align:center;padding:60px 20px;color:var(--text-3);}
.empty-icon{font-size:48px;margin-bottom:12px;}
.empty-state h3{color:var(--text);margin-bottom:8px;font-weight:600;}
.empty-state p{font-size:13px;}

/* Toast */
.toast{position:fixed;bottom:20px;right:20px;background:var(--bg-card);border:0.5px solid var(--border-strong);color:var(--text);padding:10px 16px;border-radius:12px;font-size:13px;box-shadow:var(--shadow-pop);transform:translateX(120%);transition:transform .3s;z-index:300;max-width:300px;}
.toast.show{transform:translateX(0);}
.toast.err{border-color:var(--err-border);color:var(--err-text);}

/* Scrollbar */
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--text-3);}

/* Responsive */
@media(max-width:900px){
  .verteiler-layout{grid-template-columns:1fr;}
  .knx-zwei-spalten{grid-template-columns:1fr;}
  .verteiler-info-leiste{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){
  .app{grid-template-columns:1fr;}
  .sidebar{display:none;}
  .raum-grid{grid-template-columns:1fr;}
}