/* District Zaanstad Meldkamer v4.2 - persoonlijke modulaire indeling */
.dashboard-edit-toggle{font:inherit;cursor:pointer}
body.dispatch-body{--dash-bg:#07111d;--dash-panel:#132238;--dash-panel-2:#0d192a;--dash-border:#30455f;--dash-accent:#3b82f6;--dash-text:#eef6ff;--dash-muted:#9fb0c5}
body.dashboard-theme-dark-blue{--dash-bg:#06111f;--dash-panel:#132238;--dash-panel-2:#0c1829;--dash-border:#304760;--dash-accent:#3b82f6}
body.dashboard-theme-tactical-green{--dash-bg:#07120e;--dash-panel:#10251b;--dash-panel-2:#0a1912;--dash-border:#27543e;--dash-accent:#22c55e}
body.dashboard-theme-alert-red{--dash-bg:#110b0d;--dash-panel:#241416;--dash-panel-2:#180d10;--dash-border:#5a3036;--dash-accent:#ef4444}
body.dashboard-theme-neon-cyan{--dash-bg:#031217;--dash-panel:#09222a;--dash-panel-2:#06191f;--dash-border:#1d5661;--dash-accent:#06b6d4}
body.dispatch-body[class*="dashboard-theme-"]{background:var(--dash-bg)!important}
body.dispatch-body[class*="dashboard-theme-"] .dispatch-panel{background:linear-gradient(180deg,color-mix(in srgb,var(--dash-panel) 95%,transparent),var(--dash-panel-2))!important;border-color:var(--dash-border)!important}
body.dispatch-body[class*="dashboard-theme-"] .dispatch-topbar{background:color-mix(in srgb,var(--dash-bg) 92%,#000)!important;border-color:var(--dash-border)!important}

@media(min-width:1101px){
  body.dispatch-body .dashboard-custom-grid{
    display:grid!important;
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    grid-template-areas:none!important;
    grid-auto-flow:dense!important;
    grid-auto-rows:58px!important;
    gap:8px!important;
    align-items:stretch!important;
    height:calc(100vh - 58px)!important;
    min-height:0!important;
    overflow:auto!important;
    padding:8px!important;
  }
  body.dispatch-body .dashboard-custom-grid>.dispatch-panel{
    grid-area:auto!important;
    grid-column:span var(--panel-cols,3)!important;
    grid-row:span var(--panel-rows,8)!important;
    min-width:0!important;
    min-height:0!important;
    max-height:none!important;
    height:auto!important;
    overflow:hidden!important;
  }
  body.dispatch-body .dashboard-custom-grid>.dispatch-panel .panel-content.scroll-area{min-height:0!important;height:auto!important;overflow:auto!important}
  body.dispatch-body .dashboard-custom-grid>.p-livemap .map-box{height:calc(100% - 34px)!important;min-height:0!important}
  body.dispatch-body .dashboard-custom-grid>.p-livemap .map-box iframe{height:100%!important;min-height:0!important}
  body.dispatch-body.hide-livemap .dashboard-custom-grid{grid-template-columns:repeat(12,minmax(0,1fr))!important;grid-template-areas:none!important}
}

.dispatch-panel[data-accent="red"]{--panel-accent:#ef4444}.dispatch-panel[data-accent="orange"]{--panel-accent:#f97316}.dispatch-panel[data-accent="yellow"]{--panel-accent:#eab308}.dispatch-panel[data-accent="green"]{--panel-accent:#22c55e}.dispatch-panel[data-accent="cyan"]{--panel-accent:#06b6d4}.dispatch-panel[data-accent="blue"]{--panel-accent:#3b82f6}.dispatch-panel[data-accent="purple"]{--panel-accent:#a855f7}.dispatch-panel[data-accent="slate"]{--panel-accent:#64748b}
.dispatch-panel[data-dashboard-panel]{box-shadow:inset 3px 0 0 color-mix(in srgb,var(--panel-accent,#64748b) 72%,transparent),0 8px 28px #0002;transition:border-color .16s,box-shadow .16s,opacity .16s}
.dispatch-panel[data-dashboard-panel]>.panel-title{position:relative;border-bottom-color:color-mix(in srgb,var(--panel-accent,#64748b) 35%,var(--dash-border))!important}
.dispatch-panel[data-dashboard-panel]>.panel-title strong{color:color-mix(in srgb,var(--panel-accent,#93c5fd) 35%,#fff)}
.dashboard-hidden,.dashboard-solo-hidden{display:none!important}
.dashboard-collapsed>*:not(.panel-title):not(.dashboard-resizer){display:none!important}
.dashboard-collapsed{min-height:42px!important}
.dashboard-pinned>.panel-title strong:after{content:' •';color:var(--panel-accent,#fbbf24)}

.dashboard-panel-tools{margin-left:auto;display:flex;gap:3px;align-items:center}
.dashboard-panel-tools button{width:23px;height:23px;padding:0;border:1px solid #334960;background:#0a1524;color:#9fb1c7;border-radius:5px;cursor:pointer;font:700 12px/1 Arial;opacity:.82}
.dashboard-panel-tools button:hover{color:#fff;border-color:var(--panel-accent,#4b73a0);opacity:1}
.dashboard-resizer{display:none;position:absolute;right:2px;bottom:2px;width:18px;height:18px;cursor:nwse-resize;z-index:22;border-right:3px solid var(--panel-accent,#60a5fa);border-bottom:3px solid var(--panel-accent,#60a5fa);border-radius:0 0 4px 0;opacity:.8}
.dashboard-editing .dashboard-resizer{display:block}
.dashboard-editing [data-dashboard-panel]{outline:1px dashed color-mix(in srgb,var(--panel-accent,#60a5fa) 70%,transparent);outline-offset:-3px}
.dashboard-editing [data-dashboard-panel] .grip{cursor:grab;color:var(--panel-accent,#60a5fa)!important;user-select:none}
.dashboard-editing [data-dashboard-panel] .grip[draggable="true"]{cursor:grab}
.dashboard-dragging{opacity:.48!important;box-shadow:0 0 0 2px var(--panel-accent,#60a5fa)!important}
.dashboard-resizing{cursor:nwse-resize!important;user-select:none!important}
.dashboard-resizing iframe{pointer-events:none!important}

.dashboard-fullscreen{position:fixed!important;inset:8px!important;z-index:9995!important;width:auto!important;height:auto!important;max-height:none!important;grid-column:auto!important;grid-row:auto!important;background:var(--dash-panel,#132238)!important;box-shadow:0 24px 80px #000c!important}
.dashboard-fullscreen .map-box{height:calc(100% - 34px)!important}
.dashboard-fullscreen .panel-content{height:calc(100% - 36px)!important;max-height:none!important}

.dashboard-editor{display:none;position:fixed;top:55px;left:50%;transform:translateX(-50%);z-index:9000;width:min(1160px,96vw);padding:7px;border:1px solid #38536f;border-radius:10px;background:#071321ee;box-shadow:0 18px 55px #0009;backdrop-filter:blur(12px)}
.dashboard-editor.show{display:block}
.dashboard-editor-main{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.dashboard-editor-main>b{margin-right:4px;color:#eaf3ff}
.dashboard-editor-main button,.dashboard-editor-main select{border:1px solid #35516e;background:#0b1a2c;color:#eaf3ff;border-radius:7px;padding:6px 8px;font:inherit;font-size:11px}
.dashboard-editor-main button{cursor:pointer;font-weight:750}.dashboard-editor-main button:hover{border-color:#4d7ba8}.dashboard-editor-main button.primary{background:#2563eb;border-color:#3b82f6}.dashboard-editor-main button:disabled{opacity:.4;cursor:not-allowed}
.dashboard-editor-main label{display:flex;gap:5px;align-items:center;color:#9fb1c7;font-size:11px}
#dashSaveState{margin-left:auto;color:#86efac;font-size:10px;min-width:58px;text-align:right}#dashSaveState.error{color:#fca5a5}

.dashboard-widget-drawer{position:fixed;right:10px;top:66px;z-index:9010;width:min(430px,94vw);max-height:calc(100vh - 80px);overflow:auto;border:1px solid #38536f;border-radius:12px;background:#081522f5;color:#eaf3ff;box-shadow:0 20px 70px #000b;backdrop-filter:blur(14px);padding:10px}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:3px 2px 9px}.drawer-head button{border:0;background:transparent;color:#fff;font-size:22px;cursor:pointer}
.dashboard-widget-row{display:grid;grid-template-columns:1fr 1fr;gap:7px;border:1px solid #243b52;border-radius:9px;background:#0b1928;padding:9px;margin-bottom:8px}
.dashboard-widget-row .widget-title{grid-column:1/-1;display:flex;gap:7px;align-items:center}.dashboard-widget-row label{display:flex;align-items:center;gap:5px;color:#b8c7d8;font-size:10px}.dashboard-widget-row select,.dashboard-widget-row button{min-width:0;border:1px solid #314b66;background:#071320;color:#eaf3ff;border-radius:6px;padding:5px;font-size:10px}.dashboard-widget-row button{cursor:pointer}.drawer-section{border-top:1px solid #253c53;padding:10px 3px 3px;display:grid;gap:6px}.drawer-section>b{font-size:11px}.drawer-check{display:flex;align-items:center;gap:7px;color:#bdccdc;font-size:10px}

.dispatch-panel[data-density="compact"] .dispatch-card{padding:6px!important;margin-bottom:4px!important}.dispatch-panel[data-density="compact"] .dispatch-card p{margin:3px 0!important;font-size:10px!important}.dispatch-panel[data-density="compact"] .incident-meta{gap:3px!important}.dispatch-panel[data-density="compact"] .status-btn{padding:3px 5px!important;min-width:27px!important}
.dispatch-panel[data-density="roomy"] .dispatch-card{padding:13px!important;margin-bottom:10px!important}.dispatch-panel[data-density="roomy"] .dispatch-card p{margin:8px 0!important}.dispatch-panel[data-density="roomy"] .status-strip{gap:7px!important}

.hide-unit-field-crew .unit-field-crew,.hide-unit-field-assignment .unit-field-assignment,.hide-unit-field-location .unit-field-location,.hide-unit-field-note .unit-field-note,.hide-unit-field-channel .unit-field-channel{display:none!important}

body.dashboard-solo .dispatch-topbar{position:fixed;top:0;left:0;right:0;z-index:40}
body.dashboard-solo .dashboard-custom-grid{padding-top:8px!important}
body.dashboard-solo [data-dashboard-panel]{grid-column:1/-1!important;grid-row:span 16!important;min-height:calc(100vh - 78px)!important}
body.dashboard-solo .dashboard-edit-toggle{display:none!important}

/* Extra visuele prioriteit, zonder de inhoud te veranderen. */
.dispatch-card.incident .prio.p1,.dispatch-card.incident .prio.p1z,.dispatch-card.incident .prio.p1t{box-shadow:0 0 0 1px #ef444455,0 0 14px #ef444426}
body.nood-active [data-dashboard-panel="requests"]{border-color:#ef4444!important;box-shadow:inset 3px 0 #ef4444,0 0 24px #ef444433!important}

@media(max-width:1100px){
  .dashboard-editor{top:58px;max-height:42vh;overflow:auto}.dashboard-panel-tools{display:flex}.dashboard-resizer{display:none!important}
  .dashboard-widget-drawer{top:62px}.dashboard-custom-grid>.dispatch-panel{--panel-cols:1!important;--panel-rows:1!important}
  body.dashboard-solo [data-dashboard-panel]{min-height:calc(100vh - 74px)!important;max-height:none!important}
}
@media(max-width:720px){
  .dashboard-panel-tools button[data-panel-action="pin"]{display:none}.dashboard-editor{width:96vw}.dashboard-editor-main{gap:5px}.dashboard-editor-main>b{width:100%}
  .dashboard-widget-row{grid-template-columns:1fr}.dashboard-widget-row .widget-title{grid-column:1}.dashboard-widget-drawer{right:2.5vw;width:95vw}
}


/* v4.2.1 - dashboard drag/intake hotfix
   v4.2 zette .panel-title op position:relative. Daardoor werd het absolute
   intakeformulier aan de 34px hoge titelbalk gekoppeld en leek het formulier
   vrijwel volledig weg te vallen. Incidenten gebruikt weer het paneel zelf
   als positioneringsvlak. */
body.dispatch-body .p-meldingen{position:relative!important}
body.dispatch-body .p-meldingen>.panel-title{position:static!important}
body.dispatch-body .p-meldingen .popup-form{z-index:80!important;pointer-events:auto!important}
body.dashboard-editing .p-meldingen .popup-form,
body.dashboard-editing .p-meldingen .popup-form *{pointer-events:auto!important}
body.dashboard-editing [data-dashboard-panel]{user-select:auto}
body.dashboard-editing [data-dashboard-panel] .grip{user-select:none;-webkit-user-drag:element}


/* v4.2.2 - groter intakevenster + ruimer Overige
   Het intakeformulier opent als een vaste, scrollbare overlay op viewport-niveau.
   Daardoor wordt het niet meer samengedrukt door de persoonlijke widgethoogte. */
body.dispatch-body .p-meldingen.intake-open{z-index:9500!important;overflow:visible!important}
body.dispatch-body .p-meldingen.intake-open>.panel-title{z-index:9502!important}
body.dispatch-body .p-meldingen .panel-title>details[open]>.popup-form{
  position:fixed!important;
  left:var(--intake-left,12px)!important;
  top:var(--intake-top,64px)!important;
  right:auto!important;
  bottom:auto!important;
  width:var(--intake-width,min(560px,calc(100vw - 24px)))!important;
  min-width:min(360px,calc(100vw - 24px))!important;
  height:auto!important;
  min-height:0!important;
  max-height:var(--intake-max-height,calc(100vh - 80px))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  z-index:9600!important;
  border:1px solid #3c5877!important;
  border-radius:11px!important;
  box-shadow:0 24px 80px #000d!important;
  padding:12px!important;
  background:#0b1727!important;
}
body.dispatch-body .p-meldingen .panel-title>details[open]>.popup-form>button:last-child{
  position:sticky!important;
  bottom:0!important;
  z-index:3!important;
  margin-top:8px!important;
}
/* De 'Overige'-widget heeft in v4.2.2 standaard 7 rasterrijen. Deze fallback
   voorkomt dat oudere browsers/ongepatchte layouts hem extreem laag tekenen. */
@media(min-width:1101px){
  body.dispatch-body .dashboard-custom-grid>.p-overige:not(.dashboard-collapsed){min-height:300px!important}
}
@media(max-width:720px){
  body.dispatch-body .p-meldingen .panel-title>details[open]>.popup-form{
    left:8px!important;right:8px!important;top:58px!important;width:auto!important;
    max-height:calc(100vh - 70px)!important;border-radius:10px!important;
  }
}


/* v4.3 - betrouwbare persoonlijke dashboardbewerking */
body.dashboard-editing [data-dashboard-panel]>.panel-title>.grip{
  display:inline-flex!important;align-items:center;justify-content:center;min-width:26px;min-height:26px;
  border:1px dashed color-mix(in srgb,var(--panel-accent,#60a5fa) 70%,transparent);border-radius:5px;
  touch-action:none!important;cursor:grab!important;user-select:none!important;
}
body.dashboard-editing [data-dashboard-panel]>.panel-title>.grip:active{cursor:grabbing!important;background:#ffffff12}
body.dashboard-editing .dashboard-resizer{touch-action:none!important;width:24px!important;height:24px!important}

/* v4.4.2 - TeamSpeak sleepknoppen voor status 6/7/noodknop */
.ts-link-settings{margin:10px 0;padding:12px;border:1px solid #294563;border-radius:10px;background:#0b1727}
.ts-link-settings h3{margin:0 0 5px}.ts-link-settings p{margin:0 0 10px;line-height:1.45}
.request-by{margin:7px 0;color:#b9c9dc;font-size:12px}.request-by strong{color:#f5f9ff}
.ts-request-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:10px 0 6px}
.ts-request-actions button{min-height:34px;border:1px solid #385573;border-radius:8px;background:#15283d;color:#eaf4ff;font-weight:800;cursor:pointer;padding:7px 9px}
.ts-request-actions button:hover{filter:brightness(1.12)}.ts-request-actions button:disabled{opacity:.55;cursor:wait}
.ts-request-actions .ts-move-primary{background:#15426c;border-color:#2b75ad}
.dispatch-card.request.s0 .ts-request-actions .ts-move-primary{background:#711b25;border-color:#d74252;box-shadow:0 0 16px #ef44442e}
.ts-move-result{min-height:18px;margin:0 0 8px;font-size:11px;color:#91a6bc}
.ts-move-result.working{color:#93c5fd}.ts-move-result.ok{color:#86efac}.ts-move-result.error{color:#fca5a5}
@media(max-width:720px){.ts-request-actions{grid-template-columns:1fr}}

/* v4.4.3 - TeamSpeak Koppel mij via Kantine */
.ts-auto-link-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0}
.ts-link-me-btn,.ts-choice-btn{border:1px solid #2f6f9f;border-radius:8px;background:#15426c;color:#f2f8ff;font-weight:800;padding:9px 13px;cursor:pointer}
.ts-link-me-btn:hover,.ts-choice-btn:hover{filter:brightness(1.12)}.ts-link-me-btn:disabled{opacity:.55;cursor:wait}
.ts-link-state{font-size:12px;color:#a9bdd2}.ts-link-state.working{color:#93c5fd}.ts-link-state.ok{color:#86efac}.ts-link-state.warn{color:#fde68a}.ts-link-state.error{color:#fca5a5}
.ts-link-choices{display:flex;gap:7px;flex-wrap:wrap;margin:8px 0 12px}.ts-choice-btn{background:#172b40;border-color:#3f5f80}
.ts-manual-link{margin-top:8px;border-top:1px solid #243c57;padding-top:8px}.ts-manual-link summary{cursor:pointer;color:#a9bdd2;font-size:12px;font-weight:700}.ts-manual-link label{margin-top:8px}
