:root {
  --bg:#f5f7fa;
  --card:#fff;
  --text:#17202a;
  --muted:#6f7782;
  --border:#e4e8ed;
  --shadow:0 12px 34px rgba(32,42,55,.07);
}

*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
.topbar{height:76px;padding:0 28px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.topbar>div{display:flex;flex-direction:column}.brand{font-size:22px;font-weight:760;text-decoration:none}.topbar small,.live,.lead,.card p,.row small,.compact-list small{color:var(--muted)}
.live{display:flex;align-items:center;gap:8px}.live i{width:9px;height:9px;background:#28c76f;border-radius:50%}
.container{max-width:1050px;margin:0 auto;padding:42px 22px 80px}
h1{font-size:36px;margin:10px 0 5px}.back{color:var(--muted);text-decoration:none}
.title-row{display:flex;align-items:end;justify-content:space-between;gap:20px}.actions{display:flex;gap:10px;flex-wrap:wrap}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:26px}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.card,.panel,.list{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow)}
.card{min-height:126px;padding:22px;display:flex;align-items:center;gap:18px;text-decoration:none}.card b,.row b{margin-left:auto;font-size:28px;color:#a2a9b1}.card h2,.panel h2{margin:0 0 7px}.muted{opacity:.65}
.traffic{width:34px;height:34px;border-radius:50%;border:5px solid rgba(0,0,0,.06);flex:0 0 auto}.small{width:19px;height:19px;border-width:3px}.tiny{width:13px;height:13px;border-width:2px}.green{background:#28c76f}.yellow{background:#ffb020}.red{background:#e5484d}.none{background:#c8cdd3}
.list{margin-top:24px;overflow:hidden}.row{min-height:74px;padding:15px 19px;display:flex;align-items:center;gap:15px;text-decoration:none;border-bottom:1px solid var(--border)}.row:last-child{border-bottom:0}.row div{display:flex;flex-direction:column;gap:4px}.empty{padding:24px;color:var(--muted)}
.panel{margin-top:18px;padding:24px}.static{pointer-events:none}.button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;padding:12px 18px;background:#17202a;color:#fff;font-weight:700;text-decoration:none;cursor:pointer}.button.secondary{background:#e8ebef;color:#17202a}
.flash{padding:14px 16px;border-radius:12px;margin-bottom:18px}.flash.success{background:#e8f8ef}.flash.error{background:#fdebec}
.compact-list>div{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--border)}.compact-list>div:last-child{border-bottom:0}.compact-list>div>div{display:flex;flex-direction:column;gap:4px}
.passport-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:18px}dl{display:grid;grid-template-columns:170px 1fr;gap:10px 18px}dt{font-weight:700}dd{margin:0;color:var(--muted);word-break:break-word}.qr-panel{text-align:center}.qr-panel img{width:220px;max-width:100%;background:#fff;padding:10px;border-radius:14px}
.form{display:flex;flex-direction:column;gap:16px}.form label{display:flex;flex-direction:column;gap:7px;font-weight:700}.form input,.form select,.form textarea{width:100%;border:1px solid var(--border);border-radius:10px;padding:11px 12px;font:inherit;background:#fff}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.two-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media(max-width:760px){.grid,.grid.three,.passport-layout,.two-column,.form-grid{grid-template-columns:1fr}.title-row{align-items:start;flex-direction:column}dl{grid-template-columns:1fr;gap:3px}.topbar{padding:0 18px}}

.client-row{pointer-events:auto}
.client-type{margin-left:auto;color:var(--muted);font-size:13px;font-weight:700}


.blue{background:#3b82f6}
.main-nav{display:flex;gap:18px;margin-left:auto;margin-right:28px}
.main-nav a{color:var(--muted);text-decoration:none;font-size:14px;font-weight:650}
.main-nav a:hover{color:var(--text)}
.panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.panel-title p{margin:4px 0 0;color:var(--muted)}
.panel-title>a{color:var(--muted);text-decoration:none;font-size:14px}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0 16px}
.filters a{padding:8px 12px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--muted);text-decoration:none;font-size:13px;font-weight:700}
.filters a.active{background:var(--text);color:#fff;border-color:var(--text)}
.activity-list{margin-top:0}
.activity-list time{color:var(--muted);font-size:12px}
@media(max-width:900px){
  .main-nav{display:none}
}


.location-tree{display:flex;flex-direction:column}
.location-tree-row{display:flex;align-items:center;gap:12px;padding:13px 8px 13px calc(8px + var(--depth) * 22px);border-bottom:1px solid var(--border);text-decoration:none}
.location-tree-row:last-child{border-bottom:0}
.location-tree-row:hover{background:#fafbfd}
.location-tree-row>div{display:flex;flex-direction:column;gap:4px}
.location-tree-row>b,.compact-link>b{margin-left:auto;color:#a2a9b1;font-size:24px}
.location-type{min-width:70px;padding:4px 8px;border-radius:999px;background:#eef1f4;color:var(--muted);font-size:11px;font-weight:750;text-align:center;text-transform:uppercase}
.breadcrumbs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 14px;color:var(--muted);font-size:13px}
.breadcrumbs a{color:var(--muted);text-decoration:none}
.compact-link{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--border);text-decoration:none}
.compact-link:last-child{border-bottom:0}
.compact-link>div{display:flex;flex-direction:column;gap:4px}
.muted-text{color:var(--muted)}
.danger-zone{margin-top:18px;padding:20px 24px;border:1px solid #f3c2c4;border-radius:18px;background:#fff5f5;display:flex;align-items:center;justify-content:space-between;gap:20px}
.danger-zone p{margin:4px 0 0;color:var(--muted)}
.button.danger{background:#b4232a}
@media(max-width:760px){
  .danger-zone{align-items:flex-start;flex-direction:column}
  .location-type{min-width:58px}
}


.unassigned{color:var(--muted)}
.inline-action{margin-left:10px;font-size:13px;font-weight:700;text-decoration:none}
.attention-panel{border-color:#d8e4f2;background:#f8fbff}
.assign-label{margin-left:auto;color:var(--muted);font-size:12px;font-weight:750;text-transform:uppercase}


.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.top-search{margin-left:auto;margin-right:18px}
.top-search input{width:230px;border:1px solid var(--border);border-radius:999px;padding:9px 13px;background:#fafbfc;font:inherit}
.health-score{font-size:54px;font-weight:800;line-height:1;margin:16px 0}
.health-score.green{color:#1f9d58;background:none}
.health-score.yellow{color:#c47a00;background:none}
.health-score.red{color:#c93439;background:none}
.plain-list{margin:0;padding-left:20px;color:var(--muted)}
.upload-form{display:grid;grid-template-columns:180px 1fr auto;gap:12px;align-items:center;margin:18px 0}
.upload-form select,.upload-form input,.search-page-form input{border:1px solid var(--border);border-radius:10px;padding:11px 12px;font:inherit;background:#fff}
.attachment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.attachment-card{border:1px solid var(--border);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px;background:#fff}
.attachment-card img{width:100%;height:150px;object-fit:cover;border-radius:10px}
.attachment-card small{color:var(--muted)}
.document-icon{height:150px;display:flex;align-items:center;justify-content:center;font-size:58px;background:#f4f6f8;border-radius:10px;text-decoration:none}
.link-button{border:0;background:none;padding:0;color:#b4232a;cursor:pointer;text-align:left}
.search-page-form{display:grid;grid-template-columns:1fr auto;gap:12px;margin:22px 0}
.search-page-form input{font-size:17px}
@media(max-width:900px){
  .grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .top-search{display:none}
}
@media(max-width:760px){
  .attachment-grid{grid-template-columns:1fr}
  .upload-form{grid-template-columns:1fr}
  .grid.four{grid-template-columns:1fr}
}


.dashboard-head{margin-bottom:22px}
.overall-status{display:flex;align-items:center;gap:16px;padding:20px 22px;border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:var(--shadow)}
.overall-status.green{border-color:#ccebd9;background:#f7fcf9}
.overall-status.yellow{border-color:#f2d39b;background:#fffaf1}
.overall-status.red{border-color:#efc3c5;background:#fff7f7}
.overall-status strong{font-size:20px}
.overall-status p{margin:4px 0 0;color:var(--muted)}
.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.dashboard-card{min-height:112px}
.dashboard-summary{margin:22px 4px 0;color:var(--muted);font-size:14px}
@media(max-width:760px){.dashboard-grid{grid-template-columns:1fr}}
.field-help{color:var(--muted);font-size:12px;font-weight:500;line-height:1.4}
.form-actions{display:flex;justify-content:flex-end;margin-top:4px}

/* F-007e – kompakte Detailseiten für Netzwerkgeräte */
.quick-facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-top:18px;
}
.quick-facts>div{
  border:1px solid var(--border);
  border-radius:14px;
  padding:15px 16px;
  background:#fafbfc;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.quick-facts span{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.quick-facts strong{font-size:16px;word-break:break-word}
.technical-panel details>summary{
  cursor:pointer;
  font-size:18px;
  font-weight:750;
  list-style:none;
}
.technical-panel details>summary::-webkit-details-marker{display:none}
.technical-panel details>summary::after{
  content:"›";
  float:right;
  color:var(--muted);
  font-size:24px;
  transform:rotate(90deg);
}
.technical-panel details[open]>summary::after{transform:rotate(-90deg)}
.technical-panel details[open]>dl{margin-top:22px}
@media(max-width:900px){
  .quick-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .quick-facts{grid-template-columns:1fr}
}

/* F009a – Mobile App Access */
.app-limit-form{
  display:flex;
  align-items:end;
  gap:12px;
  margin-top:20px;
}
.app-limit-form label{
  display:flex;
  flex-direction:column;
  gap:7px;
  font-weight:700;
}
.app-limit-form input{
  width:130px;
  border:1px solid var(--border);
  border-radius:10px;
  padding:11px 12px;
  font:inherit;
  background:#fff;
}
.app-device-action{margin-left:auto}
.app-device-revoked{
  margin-left:auto;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.activation-link{
  padding:12px;
  border-radius:10px;
  background:#f4f6f8;
  overflow-wrap:anywhere;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13px;
}
@media(max-width:760px){
  .app-limit-form{align-items:stretch;flex-direction:column}
  .app-limit-form input{width:100%}
}
