@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@600&display=swap');
:root{--bg:#071018;--bg2:#0b1722;--panel:#0e1d29;--line:#20313e;--text:#ecf4f8;--muted:#78909e;--cyan:#36d6e7;--blue:#3988ff;--green:#35d07f;--amber:#f0b34a;--red:#ff5b67}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 70% 0,#102838 0,transparent 38%),var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;min-height:100vh}button,input,select,textarea{font:inherit}.topbar{height:74px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:rgba(7,16,24,.9);backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:2px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#021018;border-radius:10px;font:800 14px JetBrains Mono}.system-state,.status-pill{font:600 11px JetBrains Mono;color:#9bb0bc;letter-spacing:1px}.system-state i,.status-pill i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);margin-right:8px}.operator{display:flex;align-items:center;gap:10px}.operator-text{text-align:right}.operator-text b,.operator-text span{display:block;font-size:12px}.operator-text span{color:var(--muted);margin-top:3px}.avatar{
  width:40px;
  height:40px;
  flex:0 0 40px;
  border-radius:50%;
  background:linear-gradient(135deg,#183247,#0d2432);
  display:grid;
  place-items:center;
  font-weight:800;
  overflow:hidden;
  border:2px solid #2e596c;
  box-shadow:0 0 0 3px rgba(54,214,231,.08),0 5px 14px rgba(0,0,0,.32)
}
.avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover
}
.avatar span{
  color:var(--text);
  font-size:14px
}.logout{color:var(--muted);text-decoration:none;font-size:12px;margin-left:8px}.dashboard{display:flex;min-height:calc(100vh - 74px)}.sidebar{width:82px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;padding:20px 12px}.sidebar nav{display:grid;gap:10px}.nav-item{height:54px;border:0;border-radius:12px;background:transparent;color:var(--muted);cursor:pointer;font-size:20px}.nav-item span{display:none}.nav-item.active,.nav-item:hover{background:#112737;color:var(--cyan)}.mini-clock{text-align:center;font:600 11px JetBrains Mono}.mini-clock span,.mini-clock small{display:block}.mini-clock small{font-size:7px;color:var(--muted);margin-top:5px}.workspace{padding:32px;flex:1;min-width:0}.page-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px}.eyebrow{font:700 10px JetBrains Mono;letter-spacing:2px;color:var(--cyan)}h1,h2,h3,p{margin-top:0}.page-heading h1{font-size:30px;margin:7px 0 0}.primary,.discord-button{border:0;color:#031219;background:linear-gradient(135deg,var(--cyan),#71e2ed);padding:13px 18px;border-radius:9px;font-weight:800;cursor:pointer}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:14px}.stats article,.panel{background:linear-gradient(145deg,rgba(16,35,49,.96),rgba(10,24,35,.96));border:1px solid var(--line);border-radius:13px}.stats article{padding:18px}.stats article>span{font:700 9px JetBrains Mono;color:var(--muted);letter-spacing:1.3px}.stats strong{font:800 29px JetBrains Mono;display:block;margin:10px 0 5px}.stats small{color:var(--muted);font-size:11px}.green{color:var(--green)!important}.amber{color:var(--amber)!important}.main-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:14px}.panel{overflow:hidden}.panel-head{padding:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.panel-head h2{font-size:17px;margin:6px 0 0}.live-badge{color:var(--red);font:700 9px JetBrains Mono}.live-badge:before{content:'●';margin-right:6px}.ghost{background:#142b3b;border:1px solid var(--line);color:var(--text);border-radius:8px;width:34px;height:34px}.incident-list,.unit-list{max-height:430px;overflow:auto;padding:10px}.incident-card{display:flex;gap:14px;padding:14px;border:1px solid transparent;border-bottom-color:var(--line);position:relative}.incident-card:hover{background:#102432}.priority-box{width:50px;height:50px;border-radius:9px;background:#382029;display:flex;flex-direction:column;align-items:center;justify-content:center}.priority-box b{color:var(--red);font:800 16px JetBrains Mono}.priority-box span{font-size:8px;color:#d9a2a7}.priority-2 .priority-box{background:#382f20}.priority-2 .priority-box b{color:var(--amber)}.priority-3 .priority-box{background:#17332f}.priority-3 .priority-box b{color:var(--green)}.incident-body{flex:1;min-width:0}.incident-body h3{font-size:14px;margin-bottom:5px}.location{font-size:11px;color:var(--cyan)}.incident-body p{font-size:11px;color:var(--muted);margin:10px 0}.incident-meta{display:flex;gap:18px;font-size:9px;color:#5f7684}.close-incident{align-self:center;background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:7px;padding:8px;font-size:10px;cursor:pointer}.unit-row{display:flex;align-items:center;gap:11px;padding:12px;border-bottom:1px solid var(--line)}.unit-icon{width:42px;height:42px;border-radius:9px;display:grid;place-items:center;font:700 10px JetBrains Mono;background:#153350;color:var(--cyan)}.unit-icon.brandweer{background:#3a2022;color:#ff7b72}.unit-icon.ambulance{background:#17352b;color:#5de19a}.unit-icon.kmar{background:#2d2841;color:#b79cff}.unit-icon.meldkamer{background:#40351c;color:#ffd068}.unit-main{flex:1}.unit-main b,.unit-main span{display:block}.unit-main b{font:700 12px JetBrains Mono}.unit-main span{font-size:10px;color:var(--muted);margin-top:3px}.status-select{max-width:115px;background:#0a1822;color:var(--text);border:1px solid var(--line);border-radius:7px;padding:7px;font-size:9px}.presence-dot{width:7px;height:7px;border-radius:50%;background:var(--green)}.empty{padding:50px 20px;text-align:center;color:var(--muted)}.empty b,.empty span{display:block}.empty span{font-size:11px;margin-top:7px}.radio-console{margin-top:14px;display:flex;align-items:center;gap:16px;padding:18px}.radio-info{flex:1}.radio-info h2{font-size:16px;margin:5px 0}.radio-info p{font-size:10px;color:var(--muted);margin:0}.radio-console select{background:#091822;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:11px}.join-radio{border:1px solid var(--cyan);color:var(--cyan);background:transparent;border-radius:8px;padding:11px 14px;font-weight:700}.join-radio.connected{border-color:var(--green);color:var(--green)}.ptt{width:92px;height:58px;border-radius:10px;border:1px solid #286273;background:linear-gradient(145deg,#123746,#0b2733);color:var(--cyan);cursor:pointer}.ptt span,.ptt small{display:block}.ptt span{font:800 16px JetBrains Mono}.ptt small{font-size:7px;margin-top:3px}.ptt.talking{background:var(--red);color:white;box-shadow:0 0 24px rgba(255,91,103,.35)}.ptt:disabled{opacity:.35}.radio-members{text-align:center}.radio-members strong,.radio-members span{display:block}.radio-members strong{font:800 20px JetBrains Mono}.radio-members span{font-size:8px;color:var(--muted)}.modal{display:none;position:fixed;inset:0;background:rgba(0,5,9,.8);backdrop-filter:blur(7px);z-index:30;align-items:center;justify-content:center;padding:20px}.modal.show{display:flex}.modal-card{width:min(560px,100%);background:#0d1d29;border:1px solid #294050;border-radius:16px;padding:28px;position:relative;box-shadow:0 30px 80px #0008}.modal-card h2{margin:7px 0}.modal-card>p{font-size:12px;color:var(--muted)}label{display:block;font-size:10px;font-weight:700;color:#a5b6c0;margin:17px 0 7px}.service-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.service-option{background:#0a1822;border:1px solid var(--line);color:var(--muted);border-radius:9px;padding:11px 5px;font-size:9px;cursor:pointer}.service-option span{display:block;color:var(--text);font:700 11px JetBrains Mono;margin-bottom:5px}.service-option.selected{border-color:var(--cyan);background:#11313c;color:var(--cyan)}input,textarea,.modal select{width:100%;background:#081620;border:1px solid var(--line);border-radius:8px;padding:12px;color:var(--text);outline:none}input:focus,textarea:focus{border-color:var(--cyan)}.wide{width:100%;margin-top:20px}.error{color:var(--red)!important}.close-modal{position:absolute;right:18px;top:15px;background:none;border:0;color:var(--muted);font-size:25px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.full{grid-column:1/-1}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:#e8f7fa;color:#06141d;padding:12px 18px;border-radius:9px;font-weight:700;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:50}#toast.show{opacity:1;transform:translate(-50%,0)}
.login-page{overflow:hidden}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.3fr .7fr}.login-visual{position:relative;padding:40px;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(circle at 30% 40%,#173c4d,transparent 35%),linear-gradient(135deg,#061018,#0a1e2b);overflow:hidden}.hero-copy{position:relative;z-index:2;max-width:650px;margin:auto 8%}.hero-copy h1{font-size:58px;line-height:1.04;margin:14px 0 22px}.hero-copy em{font-style:normal;color:var(--cyan)}.hero-copy p{color:#96acb8;max-width:560px;line-height:1.7}.feature-row{display:flex;gap:25px;font:700 10px JetBrains Mono;color:#8ba2af;margin-top:32px}.grid-overlay{position:absolute;inset:0;background-image:linear-gradient(#51d6e70b 1px,transparent 1px),linear-gradient(90deg,#51d6e70b 1px,transparent 1px);background-size:45px 45px;mask-image:linear-gradient(to bottom,transparent,#000,transparent)}.login-panel{display:grid;place-items:center;padding:40px;background:#09141e}.login-card{width:min(380px,100%)}.mobile-brand{display:none}.login-card h2{font-size:32px;margin:20px 0 8px}.login-card>p{color:var(--muted);font-size:13px;margin-bottom:30px}.discord-button,.demo-button{display:block;text-align:center;text-decoration:none;width:100%;padding:15px;margin-bottom:12px}.discord-button.disabled{opacity:.4}.demo-button{border:1px solid var(--line);color:var(--text);border-radius:9px;font-weight:700}.login-card small{display:block;color:#536b79;font-size:9px;line-height:1.6;margin-top:20px;text-align:center}
@media(max-width:1000px){.stats{grid-template-columns:repeat(2,1fr)}.main-grid{grid-template-columns:1fr}.radio-console{flex-wrap:wrap}.login-shell{grid-template-columns:1fr}.login-visual{display:none}.login-panel{min-height:100vh}.mobile-brand{display:flex;align-items:center;gap:12px;margin-bottom:35px;font-weight:800;letter-spacing:2px}}
@media(max-width:650px){.topbar{padding:0 14px}.system-state,.operator-text,.logout{display:none}.sidebar{width:58px;padding:14px 7px}.workspace{padding:18px 12px}.page-heading{align-items:center}.page-heading h1{font-size:22px}.primary{padding:11px;font-size:11px}.stats{gap:8px}.stats article{padding:13px}.stats strong{font-size:23px}.service-grid{grid-template-columns:repeat(2,1fr)}.radio-console>*{width:100%}.ptt{height:70px}.incident-card{gap:8px}.close-incident{position:absolute;right:8px;bottom:8px}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}}

/* V2: radiobeheer, spreekindicator en incidentkoppeling */
.dispatch-radio{margin-top:14px}.drag-help{font:700 9px JetBrains Mono;color:var(--muted)}.channel-board{display:grid;grid-template-columns:repeat(5,minmax(170px,1fr));gap:10px;padding:14px;overflow-x:auto}.channel-column{min-height:150px;border:1px solid var(--line);border-radius:10px;background:#091721;transition:.18s}.channel-column.drag-over{border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan);background:#0d2732}.channel-column header{padding:10px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line);font:700 10px JetBrains Mono;color:var(--cyan)}.channel-column header span{background:#153244;border-radius:10px;padding:2px 7px}.channel-drop{padding:8px;min-height:105px}.drag-unit{display:flex;align-items:center;gap:7px;padding:9px;margin-bottom:6px;background:#102737;border:1px solid #234052;border-radius:8px;cursor:grab}.drag-unit b{font:700 10px JetBrains Mono;flex:1}.drag-unit small{font-size:8px;color:var(--muted)}.drag-unit.speaking,.unit-row.speaking{border-color:var(--red)!important;background:rgba(255,91,103,.1);box-shadow:0 0 18px rgba(255,91,103,.12)}.mic-live{font-style:normal;animation:micPulse .8s infinite alternate}.assigned-chips{display:flex;gap:5px;flex-wrap:wrap;margin:8px 0}.assigned-chips span{font:700 9px JetBrains Mono;color:var(--cyan);background:#12313d;border:1px solid #245064;border-radius:12px;padding:4px 8px}.assigned-chips small{color:var(--muted);font-size:9px}.assign-open{background:transparent;border:1px solid var(--line);color:var(--cyan);border-radius:6px;padding:6px 8px;font-size:9px;cursor:pointer;margin-top:8px}.assign-menu{display:none;margin-top:7px;padding:8px;background:#081620;border:1px solid var(--line);border-radius:8px;max-height:135px;overflow:auto}.assign-menu.show{display:grid;grid-template-columns:repeat(2,1fr);gap:5px}.assign-menu label{margin:0;font-size:9px;color:var(--text)}.assign-menu input{width:auto;margin-right:5px}.speaking .presence-dot{background:var(--red);box-shadow:0 0 12px var(--red)}@keyframes micPulse{from{filter:drop-shadow(0 0 0 var(--red))}to{filter:drop-shadow(0 0 7px var(--red))}}@media(max-width:900px){.channel-board{grid-template-columns:repeat(10,180px)}}

.ghost-keybind{border:1px solid var(--line);background:#0a1822;color:#9fb4c0;border-radius:8px;padding:11px 13px;font-size:10px;font-weight:700;cursor:pointer}.ghost-keybind:hover{border-color:var(--cyan);color:var(--cyan)}.helper-steps{color:#9db0bb;font-size:12px;line-height:1.8;padding-left:20px}.token-row{display:flex;gap:8px}.token-row input{font-family:JetBrains Mono;font-size:10px}.token-row .primary{white-space:nowrap}.security-note{display:block;color:#657d8b;font-size:9px;line-height:1.5;margin-top:10px}@media(max-width:650px){.ghost-keybind{width:100%}.token-row{flex-direction:column}}

.mic-toggle.muted{border-color:#6c7880;background:#202a31;color:#aab6bd;box-shadow:none}
.mic-toggle.talking:not(.muted){background:var(--red);color:white;box-shadow:0 0 24px rgba(255,91,103,.35)}

.incident-channel{display:inline-flex;align-items:center;margin:2px 0 10px;padding:5px 8px;border:1px solid #4c3036;border-radius:6px;background:#271a20;color:#ff7b83;font:700 9px JetBrains Mono;letter-spacing:.5px}
.create-unit-picker{max-height:190px;overflow:auto;border:1px solid var(--line);border-radius:9px;background:#081620;padding:7px}
.create-unit-picker label{display:flex;align-items:center;gap:10px;margin:0;padding:9px;border-bottom:1px solid #172936;cursor:pointer}
.create-unit-picker label:last-child{border-bottom:0}
.create-unit-picker input{width:auto}
.create-unit-picker span{display:flex;flex-direction:column;gap:3px}
.create-unit-picker b{font:700 11px JetBrains Mono}
.create-unit-picker small,.field-help{color:var(--muted);font-size:9px}
.channel-column[data-channel^="INCIDENT-"]{border-color:#64343b;background:linear-gradient(180deg,#25171d,#0d1a24)}
.channel-column[data-channel^="INCIDENT-"] header b{color:#ff727d}

.service-switch{background:transparent;border:0;cursor:pointer}
.small-primary{padding:9px 12px;font-size:10px}
.group-panel{margin-top:14px}
.group-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;padding:12px}
.group-card{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid var(--line);border-radius:10px;background:#091923}
.group-card.mine{border-color:#2f6873}
.group-badge{width:45px;height:45px;border-radius:9px;display:grid;place-items:center;background:#153350;color:var(--cyan);font:700 10px JetBrains Mono}
.group-badge.brandweer{background:#3a2022;color:#ff7b72}
.group-badge.ambulance{background:#17352b;color:#5de19a}
.group-badge.kmar{background:#2d2841;color:#b79cff}
.group-card-main{flex:1;min-width:0}
.group-title{display:flex;justify-content:space-between;gap:10px;align-items:center}
.group-title b{font:700 12px JetBrains Mono}
.group-title span{font-size:9px;color:var(--muted)}
.group-members{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
.group-members span{padding:4px 6px;border-radius:5px;background:#122733;color:#9fb3be;font-size:9px}
.group-chip{background:#2b2138!important;border:1px solid #4b3c63!important;color:#c8a9ff!important}
.assigned-groups{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:7px}
.picker-section{margin-top:13px}
.picker-section>b{display:block;font-size:10px;color:#b6c6ce;margin-bottom:6px}
.danger-button{border:1px solid #73323a;background:#2b171c;color:#ff8991;padding:12px;border-radius:8px;font-weight:700;cursor:pointer}
.assign-heading{display:block;color:var(--cyan);font:700 9px JetBrains Mono;letter-spacing:1px;margin:9px 0 5px}
.assign-group-label{display:flex!important;align-items:center;gap:7px}
.assign-group-label span{display:flex;flex-direction:column}
.assign-group-label small{color:var(--muted)}
.leader-fixed{opacity:.85}
@media(max-width:650px){
  .group-list{grid-template-columns:1fr}
  .group-title{align-items:flex-start;flex-direction:column}
}

.channel-heading{display:flex;flex-direction:column;gap:4px;min-width:0}
.channel-heading small{display:block;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:8px;font-weight:600}
.channel-column[data-channel^="INCIDENT-"] .channel-heading small{color:#ff9aa1}



/* V8.3 minimal sidebar */
.sidebar nav{display:none!important;}
.sidebar{width:88px!important}
.logo{margin-bottom:auto}

.voice-request-panel{margin:14px 0}
.request-count{min-width:28px;height:28px;padding:0 8px;display:grid;place-items:center;border-radius:999px;background:#183242;color:var(--cyan);font:800 11px JetBrains Mono}
.voice-request-list{padding:10px;display:grid;gap:8px}
.voice-request-card{display:grid;grid-template-columns:76px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px;border:1px solid #315568;border-radius:10px;background:linear-gradient(135deg,#0d2431,#0a1923)}
.voice-request-card.urgent{border-color:#9d3944;background:linear-gradient(135deg,#32171d,#111b25);animation:urgentRequestGlow 1.5s infinite}
.request-priority{padding:8px 6px;border-radius:7px;background:#113949;color:var(--cyan);text-align:center;font:800 9px JetBrains Mono}
.voice-request-card.urgent .request-priority{background:#611f28;color:#ff8b93}
.request-unit b,.request-unit span,.request-unit small{display:block}
.request-unit b{font:800 12px JetBrains Mono}
.request-unit span{margin-top:3px;color:#a8bbc5;font-size:10px}
.request-unit small{margin-top:4px;color:var(--muted);font-size:9px}
.request-join,.self-channel-button{border:1px solid var(--cyan);background:#0d2935;color:var(--cyan);border-radius:8px;padding:10px 12px;cursor:pointer;font-weight:800;font-size:10px}
.request-join:hover,.self-channel-button:hover{background:#123b49;color:#fff}
@keyframes urgentRequestGlow{0%,100%{box-shadow:0 0 0 rgba(255,91,103,0)}50%{box-shadow:0 0 22px rgba(255,91,103,.22)}}
@media(max-width:650px){.voice-request-card{grid-template-columns:1fr}.request-join{width:100%}}

.channel-auto-hint{
  display:block;
  color:var(--muted);
  font-size:8px;
  max-width:135px;
  line-height:1.3
}

.radio-select-stack{display:flex;flex-direction:column;gap:5px}
.radio-select-stack label{margin:0;color:var(--muted);font:700 8px JetBrains Mono;letter-spacing:.8px}
.radio-select-stack select{min-width:155px}
.audio-test-button{width:auto;padding:10px 12px;cursor:pointer}
.radio-error{color:var(--red)!important}
#audioContainer{position:fixed;width:1px;height:1px;overflow:hidden;left:-9999px;top:-9999px}
@media(max-width:650px){
  .radio-select-stack{width:100%}
  .radio-select-stack select{width:100%}
  .audio-test-button{width:100%}
}

#audioReadyStatus{
  display:block;
  margin-top:4px;
  max-width:90px;
  color:var(--muted);
  font-size:7px;
  line-height:1.25
}

#turnStatus{
  display:block;
  margin-top:3px;
  max-width:110px;
  font-size:7px;
  line-height:1.2
}
#turnStatus.turn-active{color:var(--green)}
#turnStatus.turn-missing{color:var(--red);font-weight:800}

.assignment-alert{
  position:fixed;top:92px;right:24px;width:min(460px,calc(100vw - 32px));
  z-index:80;display:grid;grid-template-columns:58px minmax(0,1fr) auto;
  align-items:center;gap:14px;padding:16px;border:1px solid #ff5b67;
  border-radius:14px;background:linear-gradient(135deg,rgba(61,18,25,.98),rgba(10,24,35,.98));
  box-shadow:0 20px 55px rgba(0,0,0,.58),0 0 35px rgba(255,91,103,.24);
  transform:translateX(calc(100% + 40px));opacity:0;transition:.25s ease
}
.assignment-alert.show{transform:translateX(0);opacity:1}
.assignment-alert-icon{
  width:54px;height:54px;display:grid;place-items:center;border-radius:12px;
  background:#6b1f29;border:1px solid #ff6974;font-size:27px;
  animation:assignmentIconPulse .85s infinite
}
.assignment-alert-content h2{margin:5px 0 4px;font-size:17px}
.assignment-alert-content p{margin:0;color:#c9d6dc;font-size:11px}
.assignment-alert-meta{display:flex;gap:7px;margin-top:10px}
.assignment-alert-meta span{
  padding:5px 7px;border-radius:6px;background:#281921;border:1px solid #63333a;
  color:#ff9aa1;font:700 9px JetBrains Mono
}
.assignment-alert-confirm{
  border:0;border-radius:8px;padding:10px 12px;background:#ff5b67;
  color:#fff;font-weight:800;cursor:pointer
}
@keyframes assignmentIconPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,91,103,.3)}
  50%{box-shadow:0 0 0 10px rgba(255,91,103,0)}
}
@media(max-width:650px){
  .assignment-alert{top:auto;right:16px;bottom:16px;grid-template-columns:48px minmax(0,1fr)}
  .assignment-alert-confirm{grid-column:1/-1;width:100%}
}

.discord-voice-panel{margin-top:14px}.discord-voice-actions{display:flex;align-items:center;gap:10px}.discord-bot-state{display:flex;align-items:center;gap:6px;color:var(--muted);font:700 8px JetBrains Mono}.discord-bot-state i{width:7px;height:7px;border-radius:50%;background:#80909a}.discord-bot-state.online{color:var(--green)}.discord-bot-state.online i{background:var(--green);box-shadow:0 0 10px var(--green)}.discord-bot-state.offline{color:var(--red)}.discord-bot-state.offline i{background:var(--red)}.discord-voice-message{padding:10px 14px;border-bottom:1px solid var(--line);color:#8da5b1;font-size:9px}.discord-voice-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:10px;padding:12px;align-items:start}.discord-channel{min-height:110px;border:1px solid var(--line);border-radius:10px;background:#081720;overflow:hidden;transition:.18s}.discord-channel>header{display:flex;justify-content:space-between;align-items:center;padding:10px 11px;border-bottom:1px solid var(--line);background:#0c202b}.discord-channel>header b{display:block;font:700 10px JetBrains Mono}.discord-channel>header small{display:block;margin-top:3px;color:var(--muted);font-size:8px}.discord-channel>header>span{min-width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#163242;color:var(--cyan);font:800 9px JetBrains Mono}.discord-channel.incident{border-color:#6c343c}.discord-channel.incident>header{background:#28171c}.discord-channel.incident>header b{color:#ff7d86}.discord-channel.politie>header b{color:#70bdff}.discord-channel.ambulance>header b{color:#60df9a}.discord-channel.brandweer>header b{color:#ff7b72}.discord-channel.meldkamer>header b{color:#d1b3ff}.discord-channel.drag-over{border-color:var(--cyan);box-shadow:0 0 22px rgba(52,215,231,.18);transform:translateY(-2px)}.discord-channel-members{padding:7px;display:grid;gap:6px}.discord-channel-empty{padding:14px;text-align:center;color:#536b77;font-size:8px}.discord-member{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:7px;border:1px solid #1b3340;border-radius:8px;background:#0a1c26}.discord-member[draggable=true]{cursor:grab}.discord-member.dragging{opacity:.45}.discord-member-avatar{width:32px;height:32px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#183747;border:1px solid #31596b;font-weight:800}.discord-member-avatar img{width:100%;height:100%;object-fit:cover}.discord-member-main b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 9px JetBrains Mono}.discord-member-main small{display:block;margin-top:3px;color:var(--muted);font-size:7px}.discord-bot-tag{padding:3px 5px;border-radius:4px;background:#342956;color:#c6afff;font:800 7px JetBrains Mono}.discord-disconnect{width:24px;height:24px;border:0;border-radius:6px;background:#2b171c;color:#ff7a83;cursor:pointer}@media(max-width:650px){.discord-voice-board{grid-template-columns:1fr}}


/* V10 — automatische realtime updates */
.realtime-indicator{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 9px;
  border:1px solid var(--line);
  border-radius:7px;
  color:var(--muted);
  background:#091923;
  font:800 8px JetBrains Mono
}
.realtime-indicator i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#80909a
}
.realtime-indicator.online{
  color:var(--green);
  border-color:#24573d
}
.realtime-indicator.online i{
  background:var(--green);
  box-shadow:0 0 10px var(--green)
}
.realtime-indicator.offline{
  color:#ff8b93;
  border-color:#653039
}
.realtime-indicator.offline i{
  background:#ff5b67;
  animation:realtimePulse 1s infinite
}
.unit-row,.incident-card{
  transition:border-color .2s ease,background .2s ease,transform .2s ease
}
@keyframes realtimePulse{
  0%,100%{opacity:.35}
  50%{opacity:1}
}

/* V11.2 — nieuw Discord-overzicht */
.discord-voice-board{display:block;padding:14px}
.discord-voice-group{margin-bottom:16px;border:1px solid #1b3441;border-radius:12px;overflow:hidden;background:#07151e}
.discord-group-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #1d3744;background:linear-gradient(90deg,#0d2531,#0a1d27)}
.discord-group-title{display:flex;align-items:center;gap:10px}
.discord-group-title>span{font-size:20px}
.discord-group-title b{display:block;font:800 11px JetBrains Mono}
.discord-group-title small{display:block;margin-top:3px;color:var(--muted);font-size:8px}
.discord-group-count{min-width:30px;height:30px;padding:0 8px;display:grid;place-items:center;border-radius:8px;background:#123242;color:var(--cyan);font:800 10px JetBrains Mono}
.discord-voice-group.politie .discord-group-header{border-left:3px solid #4ba9ff}
.discord-voice-group.ambulance .discord-group-header{border-left:3px solid #48d98b}
.discord-voice-group.brandweer .discord-group-header{border-left:3px solid #ff6d68}
.discord-voice-group.meldkamer .discord-group-header{border-left:3px solid #b69cff}
.discord-voice-group.incident .discord-group-header{border-left:3px solid #ffb34a}
.discord-group-channels{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px;padding:10px}
.discord-channel{min-height:92px;border:1px solid #1c3440;border-radius:9px;background:#091923;overflow:hidden}
.discord-channel.empty-channel{opacity:.72}
.discord-channel-title{display:flex;align-items:center;gap:8px}
.discord-channel-dot{width:8px;height:8px;border-radius:50%;background:#506773}
.discord-channel.occupied .discord-channel-dot{background:var(--green);box-shadow:0 0 8px rgba(53,208,127,.65)}
.discord-channel-count{min-width:22px;height:22px;display:grid;place-items:center;border-radius:999px;background:#143140;color:var(--cyan);font:800 8px JetBrains Mono}
.discord-member-main small{display:flex;align-items:center;gap:5px}
.member-audio-dot{width:6px;height:6px;border-radius:50%;background:#5d727c}
.discord-member-main small.active-mic{color:#66d99b}
.discord-member-main small.active-mic .member-audio-dot{background:#43d786;box-shadow:0 0 7px rgba(67,215,134,.55)}
.discord-member-main small.muted{color:#b27a7f}
.discord-member-main small.muted .member-audio-dot{background:#dc5b65}
.discord-channel-empty{min-height:43px;display:grid;place-items:center;border:1px dashed #1c3541;border-radius:6px;color:#4e6874;font-size:8px}
.discord-empty-state{min-height:210px;display:grid;place-items:center;align-content:center;gap:7px;text-align:center;color:var(--muted)}
.discord-empty-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:#102b38;border:1px solid #265062;font-size:27px}
.discord-empty-state b{color:var(--text);font-size:12px}
.discord-empty-state span{max-width:370px;font-size:9px;line-height:1.5}
@media(max-width:650px){.discord-group-channels{grid-template-columns:1fr}}


/* V11.3 — compact Discord-stijl voiceoverzicht */
.discord-voice-panel{
  max-width:100%;
  overflow:hidden
}

.discord-voice-board{
  display:block!important;
  padding:8px!important;
  background:#090b2b
}

.voice-service-group{
  margin:0 0 10px;
  border:1px solid #252852;
  border-radius:8px;
  overflow:hidden;
  background:#0c0f38
}

.voice-service-heading{
  min-height:38px;
  padding:8px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid #252852;
  background:#10133f
}

.voice-service-heading>div{
  display:flex;
  align-items:center;
  gap:7px
}

.voice-service-heading>div>span{
  font-size:14px
}

.voice-service-heading b{
  font:800 10px JetBrains Mono;
  color:#f1f3ff
}

.voice-service-heading small{
  color:#7f85b2;
  font-size:8px
}

.voice-service-channels{
  display:block
}

.voice-channel-row{
  position:relative;
  border-bottom:1px solid #20244c;
  background:#0c0f38;
  transition:.15s ease
}

.voice-channel-row:last-child{
  border-bottom:0
}

.voice-channel-row:hover{
  background:#111544
}

.voice-channel-row.drag-over{
  background:#172052;
  box-shadow:inset 3px 0 #5865f2
}

.voice-channel-header{
  min-height:40px;
  padding:7px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px
}

.voice-channel-name{
  min-width:0;
  display:flex;
  align-items:center;
  gap:6px
}

.voice-speaker-icon{
  font-size:13px;
  opacity:.85
}

.voice-service-icon{
  font-size:13px
}

.voice-channel-name b{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#aeb4dd;
  font:700 10px JetBrains Mono
}

.voice-channel-row.occupied .voice-channel-name b{
  color:#e7e9ff
}

.voice-channel-right{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px
}

.voice-channel-status{
  color:#6f76a3;
  font-size:8px
}

.voice-channel-count{
  min-width:24px;
  height:22px;
  padding:0 6px;
  display:grid;
  place-items:center;
  border-radius:6px;
  background:#171b50;
  color:#99a4ff;
  font:800 8px JetBrains Mono
}

.voice-channel-members{
  padding:0 10px 7px 36px;
  display:grid;
  gap:4px
}

.voice-member-row{
  min-height:34px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr) auto auto;
  align-items:center;
  gap:7px;
  padding:3px 5px;
  border-radius:6px;
  background:transparent;
  transition:.15s ease
}

.voice-member-row:hover{
  background:#171a4c
}

.voice-member-row[draggable="true"]{
  cursor:grab
}

.voice-member-row.dragging{
  opacity:.45
}

.voice-member-avatar{
  width:26px;
  height:26px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#25295c;
  border:1px solid #3a3f74;
  color:#fff;
  font-size:9px;
  font-weight:800
}

.voice-member-avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover
}

.voice-member-info{
  min-width:0
}

.voice-member-info b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#d9dcf9;
  font-size:9px
}

.voice-member-info small{
  margin-top:2px;
  display:flex;
  align-items:center;
  gap:5px;
  color:#737aa6;
  font-size:7px
}

.voice-member-info small span{
  width:6px;
  height:6px;
  flex:0 0 6px;
  border-radius:50%;
  background:#656b91
}

.voice-member-info small.active{
  color:#66d99b
}

.voice-member-info small.active span{
  background:#43d786;
  box-shadow:0 0 6px rgba(67,215,134,.6)
}

.voice-member-info small.muted{
  color:#c27279
}

.voice-member-info small.muted span{
  background:#dc5b65
}

.voice-bot-badge{
  padding:2px 4px;
  border-radius:4px;
  background:#343069;
  color:#b9b4ff;
  font:800 6px JetBrains Mono
}

.voice-member-remove{
  width:21px;
  height:21px;
  border:0;
  border-radius:5px;
  background:transparent;
  color:#777da6;
  cursor:pointer;
  font-size:15px;
  line-height:1
}

.voice-member-remove:hover{
  background:#4a1e2b;
  color:#ff8591
}

.voice-empty-drop{
  min-height:26px;
  display:flex;
  align-items:center;
  color:#4f557e;
  font-size:7px
}

.voice-no-data{
  min-height:180px;
  padding:30px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:6px;
  text-align:center;
  color:#777fa9
}

.voice-no-data>div{
  font-size:28px
}

.voice-no-data b{
  color:#e4e6fa;
  font-size:11px
}

.voice-no-data span{
  max-width:350px;
  font-size:8px;
  line-height:1.5
}

/* Verberg de oude grote kaartstijl in dit paneel */
.discord-voice-board .discord-voice-group,
.discord-voice-board .discord-group-header,
.discord-voice-board .discord-group-channels,
.discord-voice-board .discord-channel,
.discord-voice-board .discord-member,
.discord-voice-board .discord-empty-state{
  all:unset
}

@media(max-width:650px){
  .voice-channel-status{
    display:none
  }

  .voice-service-heading{
    align-items:flex-start
  }

  .voice-channel-members{
    padding-left:25px
  }
}


/* V12 — premium Discord voice-overzicht */
.discord-voice-panel{
  overflow:hidden;
  border:1px solid #223443;
  background:linear-gradient(180deg,#0a1721,#07121a)
}

.discord-voice-panel .panel-head{
  border-bottom:1px solid #20313d;
  background:linear-gradient(90deg,#0c1c27,#0a1720)
}

.discord-voice-message{
  padding:10px 16px;
  border-bottom:1px solid #1c2d38;
  background:#08151d;
  color:#718995;
  font-size:8px
}

.discord-voice-board{
  display:block!important;
  padding:14px!important;
  background:
    radial-gradient(circle at 95% 0%,rgba(88,101,242,.08),transparent 28%),
    linear-gradient(180deg,#08141d,#07121a)
}

.premium-voice-section{
  margin-bottom:18px
}

.premium-voice-section:last-child{
  margin-bottom:0
}

.premium-section-header{
  min-height:30px;
  padding:0 4px 7px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}

.premium-section-title{
  display:flex;
  align-items:center;
  gap:8px
}

.premium-section-accent{
  width:3px;
  height:14px;
  border-radius:999px;
  background:#5865f2
}

.premium-voice-section.politie .premium-section-accent{background:#4ca8ff}
.premium-voice-section.ambulance .premium-section-accent{background:#46d58a}
.premium-voice-section.brandweer .premium-section-accent{background:#f66d6d}
.premium-voice-section.meldkamer .premium-section-accent{background:#a996ff}
.premium-voice-section.incident .premium-section-accent{background:#f5ad4b}

.premium-section-title b{
  color:#9aaab5;
  font:800 9px JetBrains Mono;
  letter-spacing:1.2px
}

.premium-section-header small{
  color:#536975;
  font-size:7px
}

.premium-section-list{
  overflow:hidden;
  border:1px solid #1e303b;
  border-radius:10px;
  background:#091720;
  box-shadow:0 12px 28px rgba(0,0,0,.16)
}

.premium-voice-channel{
  position:relative;
  border-bottom:1px solid #192a34;
  background:#091720;
  transition:background .16s ease,border-color .16s ease
}

.premium-voice-channel:last-child{
  border-bottom:0
}

.premium-voice-channel:hover{
  background:#0d1d27
}

.premium-voice-channel.drag-over{
  background:#111f35;
  box-shadow:inset 3px 0 #5865f2
}

.premium-channel-header{
  min-height:44px;
  padding:8px 11px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}

.premium-channel-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px
}

.premium-channel-icon{
  width:17px;
  height:17px;
  flex:0 0 17px;
  color:#718590
}

.premium-voice-channel.occupied .premium-channel-icon{
  color:#a5b7c0
}

.premium-channel-title{
  min-width:0
}

.premium-channel-title b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#aebdc5;
  font:700 10px JetBrains Mono
}

.premium-voice-channel.occupied .premium-channel-title b{
  color:#e6edf0
}

.premium-channel-title small{
  display:block;
  margin-top:3px;
  color:#526975;
  font-size:7px
}

.premium-channel-count{
  min-width:26px;
  height:24px;
  padding:0 7px;
  display:grid;
  place-items:center;
  border-radius:7px;
  background:#102530;
  border:1px solid #1e3b49;
  color:#86a4b2;
  font:800 8px JetBrains Mono
}

.premium-voice-channel.occupied .premium-channel-count{
  color:#aebdff;
  background:#171d42;
  border-color:#2d356d
}

.premium-channel-members{
  padding:0 10px 8px 37px;
  display:grid;
  gap:3px
}

.premium-voice-member{
  min-height:34px;
  display:grid;
  grid-template-columns:27px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  padding:4px 6px;
  border-radius:7px;
  background:transparent;
  transition:background .15s ease
}

.premium-voice-member:hover{
  background:#12232d
}

.premium-voice-member[draggable="true"]{
  cursor:grab
}

.premium-voice-member.dragging{
  opacity:.42
}

.premium-member-avatar{
  width:26px;
  height:26px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#1a303c;
  border:1px solid #2d4a58;
  color:#dce7ec;
  font-size:8px;
  font-weight:800
}

.premium-member-avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover
}

.premium-member-info{
  min-width:0
}

.premium-member-name-row{
  min-width:0;
  display:flex;
  align-items:center;
  gap:6px
}

.premium-member-name-row b{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#d7e2e7;
  font-size:9px
}

.premium-bot-badge{
  padding:2px 4px;
  border-radius:4px;
  background:#313968;
  color:#c4cbff;
  font:800 6px JetBrains Mono
}

.premium-member-info small{
  margin-top:2px;
  display:flex;
  align-items:center;
  gap:5px;
  color:#687d87;
  font-size:7px
}

.premium-member-dot{
  width:6px;
  height:6px;
  flex:0 0 6px;
  border-radius:50%;
  background:#5d7079
}

.premium-member-info small.active{
  color:#67d89b
}

.premium-member-info small.active .premium-member-dot{
  background:#43d786;
  box-shadow:0 0 7px rgba(67,215,134,.5)
}

.premium-member-info small.muted{
  color:#bd767c
}

.premium-member-info small.muted .premium-member-dot{
  background:#d95d68
}

.premium-member-remove{
  width:22px;
  height:22px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:#657985;
  cursor:pointer;
  font-size:15px;
  line-height:1
}

.premium-member-remove:hover{
  background:#3a1d26;
  color:#ff8b95
}

.premium-empty-channel{
  min-height:25px;
  display:flex;
  align-items:center;
  color:#425a65;
  font-size:7px
}

.premium-voice-empty{
  min-height:210px;
  padding:34px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:8px;
  text-align:center;
  color:#6d838e
}

.premium-empty-ring{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#10232e;
  border:1px solid #25414e;
  color:#8da4af
}

.premium-empty-ring svg{
  width:25px;
  height:25px
}

.premium-empty-ring.error{
  color:#ff7b86;
  background:#2d171d;
  border-color:#60303a;
  font-size:20px;
  font-weight:900
}

.premium-voice-empty b{
  color:#e0e9ed;
  font-size:11px
}

.premium-voice-empty span{
  max-width:370px;
  color:#627984;
  font-size:8px;
  line-height:1.5
}

/* Oude Discord-kaartstijlen uitschakelen */
.discord-voice-board .voice-service-group,
.discord-voice-board .voice-service-heading,
.discord-voice-board .voice-service-channels,
.discord-voice-board .voice-channel-row,
.discord-voice-board .voice-member-row,
.discord-voice-board .discord-voice-group,
.discord-voice-board .discord-channel,
.discord-voice-board .discord-member{
  display:none!important
}

@media(max-width:650px){
  .premium-section-header{
    align-items:flex-start
  }

  .premium-section-header small{
    text-align:right
  }

  .premium-channel-members{
    padding-left:24px
  }

  .premium-channel-title small{
    display:none
  }
}


/* V12.1 — professioneel CAD-radio-overzicht */
.discord-voice-panel{
  border:1px solid #22343f;
  background:#08131a;
  overflow:hidden
}

.discord-voice-panel .panel-head{
  background:#0b1a22;
  border-bottom:1px solid #22343f
}

.discord-voice-message{
  padding:10px 14px;
  background:#09161d;
  border-bottom:1px solid #1b2b34;
  color:#71838c;
  font-size:8px
}

.discord-voice-board{
  display:block!important;
  padding:12px!important;
  background:#071117!important
}

.cad-group{
  margin-bottom:14px;
  border:1px solid #1d3039;
  border-radius:9px;
  overflow:hidden;
  background:#09171e
}

.cad-group:last-child{margin-bottom:0}

.cad-group-head{
  height:34px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #1e3039;
  background:#0c1d25
}

.cad-group-title{
  display:flex;
  align-items:center;
  gap:8px
}

.cad-group-title>span{
  width:3px;
  height:14px;
  border-radius:4px;
  background:#6a7f8b
}

.cad-group.politie .cad-group-title>span{background:#4ca8ff}
.cad-group.ambulance .cad-group-title>span{background:#43d786}
.cad-group.brandweer .cad-group-title>span{background:#f36c6c}
.cad-group.meldkamer .cad-group-title>span{background:#a993ff}
.cad-group.incident .cad-group-title>span{background:#ffad47}

.cad-group-title b{
  color:#9cafb8;
  font:800 8px JetBrains Mono;
  letter-spacing:1.1px
}

.cad-group-head small{
  color:#536a74;
  font-size:7px
}

.cad-group-body{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:1px;
  background:#1a2a32
}

.cad-channel{
  min-height:68px;
  background:#09171e;
  transition:.15s ease
}

.cad-channel:hover{
  background:#0c1d25
}

.cad-channel.drag-over{
  background:#102633;
  box-shadow:inset 3px 0 #4ca8ff
}

.cad-channel-head{
  min-height:44px;
  padding:8px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}

.cad-channel-left{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px
}

.cad-channel-indicator{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#465a63;
  flex:0 0 8px
}

.cad-channel.occupied .cad-channel-indicator{
  background:#42d382;
  box-shadow:0 0 7px rgba(66,211,130,.55)
}

.cad-channel-left>div{
  min-width:0
}

.cad-channel-left b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#dbe4e8;
  font:700 10px JetBrains Mono
}

.cad-channel-left small{
  display:block;
  margin-top:3px;
  color:#526873;
  font-size:7px
}

.cad-channel-right{
  display:flex;
  align-items:center;
  gap:7px
}

.cad-occupancy{
  min-width:24px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:5px;
  background:#132832;
  color:#9ab0bb;
  font:800 8px JetBrains Mono
}

.cad-channel-state{
  min-width:42px;
  text-align:right;
  color:#566c76;
  font:800 7px JetBrains Mono;
  letter-spacing:.6px
}

.cad-channel.occupied .cad-channel-state{
  color:#59d690
}

.cad-members{
  padding:0 10px 8px 27px;
  display:grid;
  gap:4px
}

.cad-member{
  min-height:34px;
  display:grid;
  grid-template-columns:26px minmax(0,1fr) 8px auto;
  align-items:center;
  gap:8px;
  padding:4px 6px;
  border-radius:6px;
  background:#0b1a22;
  border:1px solid #182a33;
  transition:.15s ease
}

.cad-member:hover{
  background:#10232c;
  border-color:#25424e
}

.cad-member[draggable="true"]{cursor:grab}
.cad-member.dragging{opacity:.45}

.cad-member-avatar{
  width:24px;
  height:24px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#18303a;
  border:1px solid #2c4a56;
  color:#dce8ec;
  font-size:7px;
  font-weight:800
}

.cad-member-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block
}

.cad-member-name{
  min-width:0
}

.cad-member-name b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#d8e2e6;
  font-size:9px
}

.cad-member-name small{
  display:block;
  margin-top:2px;
  color:#667b85;
  font-size:7px
}

.cad-member-state{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#687b84
}

.cad-member-state.online{
  background:#43d786;
  box-shadow:0 0 6px rgba(67,215,134,.55)
}

.cad-member-state.muted{
  background:#d95f69
}

.cad-member-remove{
  width:21px;
  height:21px;
  border:0;
  border-radius:5px;
  background:transparent;
  color:#5d737d;
  cursor:pointer;
  font-size:15px;
  line-height:1
}

.cad-member-remove:hover{
  background:#3b1e27;
  color:#ff8994
}

.cad-empty{
  min-height:24px;
  display:flex;
  align-items:center;
  color:#405761;
  font-size:7px
}

.cad-no-data{
  min-height:190px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:7px;
  text-align:center;
  color:#6d818a
}

.cad-no-data-icon{
  min-width:56px;
  height:34px;
  padding:0 12px;
  display:grid;
  place-items:center;
  border-radius:7px;
  background:#10232c;
  border:1px solid #27414c;
  color:#90a6af;
  font:800 8px JetBrains Mono;
  letter-spacing:1px
}

.cad-no-data-icon.error{
  min-width:34px;
  color:#ff7f89;
  background:#2e171d;
  border-color:#5c3039;
  font-size:15px
}

.cad-no-data b{
  color:#e0e8eb;
  font-size:11px
}

.cad-no-data span{
  max-width:360px;
  color:#627782;
  font-size:8px;
  line-height:1.5
}

/* oude voice lay-outs volledig uitschakelen */
.discord-voice-board .premium-voice-section,
.discord-voice-board .voice-service-group,
.discord-voice-board .discord-voice-group{
  display:none!important
}

@media(max-width:760px){
  .cad-group-body{
    grid-template-columns:1fr
  }
}

/* V12.2 — ovale sleepbare personen */
.discord-voice-board{display:block!important;padding:12px!important;background:#071219!important;text-align:left!important}
.oval-group{margin:0 0 16px;text-align:left}.oval-group:last-child{margin-bottom:0}
.oval-group-head{min-height:30px;padding:0 2px 7px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #20313a}
.oval-group-head>div{display:flex;align-items:center;gap:8px}.oval-group-head>div>span{width:3px;height:14px;border-radius:999px;background:#73838c}
.oval-group.politie .oval-group-head>div>span{background:#4ca8ff}.oval-group.ambulance .oval-group-head>div>span{background:#43d786}.oval-group.brandweer .oval-group-head>div>span{background:#f36c6c}.oval-group.meldkamer .oval-group-head>div>span{background:#a993ff}.oval-group.incident .oval-group-head>div>span{background:#ffad47}
.oval-group-head b{color:#a9bac2;font:800 9px JetBrains Mono;letter-spacing:1px}.oval-group-head small{color:#526873;font-size:7px}.oval-group-list{display:grid;gap:6px;padding-top:8px}
.oval-channel{overflow:hidden;border:1px solid #1d3039;border-radius:9px;background:#09171e;transition:.16s ease}.oval-channel:hover{border-color:#294450;background:#0b1c24}.oval-channel.drag-over{border-color:#4ca8ff;background:#102633;box-shadow:0 0 0 2px rgba(76,168,255,.1),inset 3px 0 #4ca8ff}
.oval-channel-head{min-height:42px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px}.oval-channel-left{min-width:0;display:flex;align-items:center;gap:8px}.oval-channel-icon{width:16px;height:16px;color:#718590;flex:0 0 16px}.oval-channel-dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#485e68}.oval-channel.occupied .oval-channel-dot{background:#43d786;box-shadow:0 0 7px rgba(67,215,134,.55)}
.oval-channel-left b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#dce5e9;font:700 10px JetBrains Mono}.oval-channel-meta{display:flex;align-items:center;gap:7px;flex:0 0 auto}.oval-channel-meta>span{min-width:25px;height:23px;padding:0 6px;display:grid;place-items:center;border-radius:999px;background:#122832;border:1px solid #213d48;color:#9eb2bb;font:800 8px JetBrains Mono}.oval-channel-meta small{min-width:38px;color:#526873;font:800 7px JetBrains Mono;letter-spacing:.5px;text-align:right}.oval-channel.occupied .oval-channel-meta small{color:#58d590}
.oval-member-list{padding:0 10px 9px 34px;display:flex;flex-wrap:wrap;align-items:flex-start;gap:7px}
.oval-member{min-height:34px;max-width:100%;display:grid;grid-template-columns:8px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:5px 8px 5px 10px;border:1px solid #233b46;border-radius:999px;background:linear-gradient(180deg,#10232c,#0d1d25);box-shadow:0 4px 12px rgba(0,0,0,.14);transition:transform .15s ease,border-color .15s ease,background .15s ease;text-align:left}
.oval-member:hover{transform:translateY(-1px);border-color:#365969;background:linear-gradient(180deg,#142b35,#10232c)}.oval-member[draggable="true"]{cursor:grab;user-select:none}.oval-member[draggable="true"]:active{cursor:grabbing}.oval-member.dragging{opacity:.45;transform:scale(.97)}
.oval-member-status{width:8px;height:8px;border-radius:50%;background:#677b84}.oval-member.active .oval-member-status{background:#43d786;box-shadow:0 0 7px rgba(67,215,134,.6)}.oval-member.muted .oval-member-status{background:#d95f69}.oval-member.deaf .oval-member-status{background:#f0a640}
.oval-member-copy{min-width:0}.oval-member-copy b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#e2eaed;font-size:9px}.oval-member-copy small{display:block;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#687d87;font-size:7px}
.oval-bot-badge{padding:2px 5px;border-radius:999px;background:#2f3764;color:#c2c9ff;font:800 6px JetBrains Mono}.oval-member-remove{width:21px;height:21px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#60747e;cursor:pointer;font-size:14px;line-height:1}.oval-member-remove:hover{background:#3b1e27;color:#ff8994}
.oval-empty-drop{min-height:29px;display:flex;align-items:center;padding:0 10px;border:1px dashed #223943;border-radius:999px;color:#405761;font-size:7px}
.oval-no-data{min-height:190px;display:grid;place-items:center;align-content:center;gap:7px;text-align:center;color:#6d818a}.oval-no-data-mark{min-width:58px;height:34px;padding:0 12px;display:grid;place-items:center;border-radius:999px;background:#10232c;border:1px solid #27414c;color:#90a6af;font:800 8px JetBrains Mono;letter-spacing:1px}.oval-no-data-mark.error{min-width:34px;padding:0;color:#ff7f89;background:#2e171d;border-color:#5c3039;font-size:15px}.oval-no-data b{color:#e0e8eb;font-size:11px}.oval-no-data span{max-width:360px;color:#627782;font-size:8px;line-height:1.5}
.discord-voice-board .cad-group,.discord-voice-board .premium-voice-section,.discord-voice-board .voice-service-group,.discord-voice-board .discord-voice-group{display:none!important}
@media(max-width:650px){.oval-group-head{align-items:flex-start}.oval-group-head small{text-align:right}.oval-member-list{padding-left:20px}.oval-member{width:100%}.oval-channel-meta small{display:none}}


/* V13 — definitieve links uitgelijnde persoonscapsules */
.discord-voice-panel,
.discord-voice-panel *,
.discord-voice-board,
.oval-group,
.oval-group-list,
.oval-channel,
.oval-channel-head,
.oval-member-list{
  text-align:left!important
}

.discord-voice-board{
  padding:14px!important
}

.oval-group-head{
  justify-content:flex-start!important;
  gap:14px!important
}

.oval-group-head>div{
  flex:0 0 auto
}

.oval-group-head>small{
  margin-left:auto
}

.oval-channel-head{
  justify-content:flex-start!important
}

.oval-channel-left{
  flex:1 1 auto
}

.oval-channel-meta{
  margin-left:auto
}

.oval-member-list{
  width:100%;
  box-sizing:border-box;
  padding:0 12px 11px 34px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:7px!important
}

.oval-member{
  width:min(430px,100%)!important;
  min-height:38px!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  padding:6px 7px 6px 12px!important;
  border:1px solid #2a4653!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#122832,#0d2029)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.025),
    0 5px 14px rgba(0,0,0,.18)!important;
  overflow:hidden!important
}

.oval-member:hover{
  border-color:#426879!important;
  background:linear-gradient(180deg,#17323d,#112731)!important;
  transform:translateX(2px)!important
}

.oval-member.dragging{
  opacity:.48!important;
  transform:scale(.985)!important
}

.oval-member-status{
  width:9px!important;
  height:9px!important;
  flex:0 0 9px!important
}

.oval-member-copy{
  min-width:0!important;
  flex:1 1 auto!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important
}

.oval-member-copy b{
  flex:0 1 auto!important;
  max-width:240px!important;
  color:#eef4f6!important;
  font-size:9px!important
}

.oval-member-copy small{
  flex:0 1 auto!important;
  margin:0!important;
  color:#718790!important;
  font-size:7px!important
}

.oval-bot-badge{
  flex:0 0 auto!important
}

.oval-member-remove{
  position:static!important;
  flex:0 0 28px!important;
  width:28px!important;
  height:28px!important;
  margin-left:3px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #35515d!important;
  border-radius:50%!important;
  background:#10232c!important;
  color:#8ea3ad!important;
  font-size:16px!important;
  line-height:1!important;
  transition:.15s ease!important
}

.oval-member-remove:hover{
  border-color:#87404c!important;
  background:#3b1e27!important;
  color:#ff98a1!important;
  transform:rotate(90deg)!important
}

.oval-empty-drop{
  width:min(430px,100%)!important;
  box-sizing:border-box!important;
  justify-content:flex-start!important;
  padding-left:13px!important
}

@media(max-width:650px){
  .oval-group-head{
    align-items:center!important
  }

  .oval-group-head>small{
    margin-left:auto!important
  }

  .oval-member-list{
    padding-left:16px!important;
    padding-right:10px!important
  }

  .oval-member{
    width:100%!important
  }

  .oval-member-copy{
    display:block!important
  }

  .oval-member-copy small{
    display:block!important;
    margin-top:2px!important
  }
}

/* V13.2 rolkeuze fix */
#unitModal{z-index:1000}
#unitModal .modal-card{max-height:calc(100vh - 40px);overflow-y:auto}
#unitModal .service-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
#unitModal .service-option{position:relative;z-index:3;min-height:62px;pointer-events:auto;cursor:pointer;transition:.18s ease}
#unitModal .service-option:hover{transform:translateY(-2px);border-color:#3d6474;background:#102630}
#unitModal .service-option.selected,
#unitModal .service-option[aria-pressed="true"]{border-color:#39d6e6;background:linear-gradient(180deg,#123944,#0e2c35);color:#7cebf5;box-shadow:0 0 0 2px rgba(57,214,230,.12),0 8px 22px rgba(0,0,0,.2)}
#unitModal .service-option.selected::after,
#unitModal .service-option[aria-pressed="true"]::after{content:'✓';position:absolute;top:6px;right:7px;color:#68e4ef;font-size:10px;font-weight:900}
@media(max-width:720px){#unitModal .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* V13.4 — stabiele eenhedenkoppeling en dienstlabels */
.assign-menu{
  max-height:420px;
  overflow-y:auto;
  overscroll-behavior:contain
}

.assign-menu label,
.assign-unit-label{
  display:flex;
  align-items:center;
  gap:9px
}

.assign-menu label>span,
.assign-unit-label>span{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start
}

.assign-menu label>span b,
.assign-unit-label>span b{
  color:var(--text);
  font-size:9px
}

.assign-menu label>span small,
.assign-unit-label>span small{
  margin-top:2px;
  color:var(--muted);
  font-size:7px
}

.assign-menu input[type="checkbox"]{
  width:16px;
  height:16px;
  flex:0 0 16px;
  accent-color:var(--cyan);
  cursor:pointer
}

.assign-menu input[type="checkbox"]:disabled{
  opacity:.55;
  cursor:wait
}


/* V13.5 — Toezicht */
.service-option[data-service="toezicht"].selected,
.service-option[data-service="toezicht"][aria-pressed="true"]{
  border-color:#d7a84b!important;
  background:linear-gradient(180deg,#40331b,#2d2517)!important;
  color:#f4cb72!important
}

.unit-icon.toezicht,
.group-badge.toezicht{
  background:#44371d!important;
  border-color:#765e2b!important;
  color:#f5cf78!important
}


/* V13.6 — stabiele statuskeuze */
.status-select[data-interacting="1"]{
  border-color:var(--cyan)!important;
  box-shadow:0 0 0 2px rgba(57,214,230,.12)!important
}

.status-select:disabled[data-own="1"]{
  opacity:.72;
  cursor:wait
}


/* V14.0 — gesloten- en banmelding */
.access-state-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top,#17253f 0,#08101e 55%,#050912 100%);color:#eef4ff;font-family:Inter,system-ui,sans-serif}
.access-state-card{width:min(560px,100%);padding:38px;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(9,17,31,.94);box-shadow:0 24px 80px rgba(0,0,0,.45);text-align:center}
.access-state-card.banned{border-color:rgba(255,91,91,.32)}
.access-state-card h1{margin:14px 0;font-size:clamp(28px,5vw,44px)}
.access-state-card p{color:#aebbd1;line-height:1.65}
.access-state-code{display:inline-flex;padding:7px 12px;border-radius:999px;background:#f1b84b;color:#15100a;font-size:12px;font-weight:900;letter-spacing:.16em}
.access-state-card.banned .access-state-code{background:#ff6565;color:white}
.access-state-card .discord-button,.access-state-card .demo-button{display:flex;justify-content:center;margin-top:16px}
.access-state-id{font-size:12px;opacity:.72}
