/*
 * v80.27.1 option 3 – v70.10 classic visual shell
 * Alleen presentatie/layout. De v80 backend, modules, rechten, alarmen,
 * Route Player, centrale debuglog en protocolcode blijven leidend.
 */

body.legacy-v70-option3 {
    --legacy-bg: #020617;
    --legacy-panel: #0f172a;
    --legacy-box: #1e293b;
    --legacy-box-hover: #25334a;
    --legacy-border: #1e293b;
    --legacy-blue: #2563eb;
    --legacy-blue-soft: #3b82f6;
    --legacy-green: #22c55e;
    --legacy-red: #ef4444;
    --legacy-orange: #f59e0b;
    --legacy-muted: #94a3b8;
    --legacy-sidebar-width: 240px;
    --legacy-topbar-height: 46px;
    margin: 0;
    overflow: hidden;
    background: var(--legacy-bg);
    color: #fff;
}

body.legacy-v70-option3 .legacy-v70-shell {
    width: 100vw;
    height: 100vh;
    display: grid;
    grid-template-columns: var(--legacy-sidebar-width) minmax(0, 1fr);
    grid-template-rows: var(--legacy-topbar-height) minmax(0, 1fr);
    overflow: hidden;
    background: var(--legacy-bg);
}

body.legacy-v70-option3 .legacy-v70-sidebar {
    grid-column: 1;
    grid-row: 1 / 3;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--legacy-panel);
    border-right: 1px solid var(--legacy-border);
    z-index: 30;
}

body.legacy-v70-option3 .legacy-v70-brand {
    min-height: 46px;
    padding: 7px 9px;
    border-bottom: 1px solid var(--legacy-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

body.legacy-v70-option3 .legacy-v70-brand-name {
    font-size: 15px;
    line-height: .95;
    font-weight: 900;
    letter-spacing: -.25px;
}

body.legacy-v70-option3 .legacy-v70-version {
    margin: 0;
    max-width: 122px;
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--legacy-blue);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
    overflow-wrap: anywhere;
}

body.legacy-v70-option3 .legacy-v70-connection {
    margin: 9px 8px 5px;
    min-height: 34px;
    padding: 7px 9px;
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto auto;
    gap: 6px;
    align-items: center;
    background: rgba(2, 6, 23, .84);
    border: 1px solid rgba(34, 197, 94, .52);
    border-radius: 10px;
    color: #d1fae5;
    font-size: 10px;
}

body.legacy-v70-option3 .legacy-v70-connection strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.legacy-v70-option3 .legacy-v70-connection-dot,
body.legacy-v70-option3 .legacy-v70-io-chip i,
body.legacy-v70-option3 .legacy-v70-device-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #64748b;
    box-shadow: none;
}

body.legacy-v70-option3 .legacy-v70-connection-dot.online,
body.legacy-v70-option3 .legacy-v70-io-chip.active i,
body.legacy-v70-option3 .legacy-v70-device-dot.online {
    background: var(--legacy-green);
    box-shadow: 0 0 10px rgba(34, 197, 94, .46);
}

body.legacy-v70-option3 .legacy-v70-connection-dot.warn,
body.legacy-v70-option3 .legacy-v70-device-dot.recent {
    background: var(--legacy-orange);
}

body.legacy-v70-option3 .legacy-v70-connection-dot.error,
body.legacy-v70-option3 .legacy-v70-device-dot.alarm {
    background: var(--legacy-red);
}

body.legacy-v70-option3 .legacy-v70-io-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 6px;
    border-radius: 999px;
    background: #111827;
    color: var(--legacy-muted);
    font-size: 9px;
    font-weight: 800;
}

body.legacy-v70-option3 .legacy-v70-io-chip i {
    width: 7px;
    height: 7px;
}

body.legacy-v70-option3 .legacy-v70-map-row {
    margin: 2px 8px 6px;
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 6px;
    align-items: center;
    color: var(--legacy-muted);
    font-size: 10px;
}

body.legacy-v70-option3 .legacy-v70-map-row select {
    margin: 0;
    min-height: 30px;
    padding: 5px 9px;
    border-radius: 8px;
    background: var(--legacy-box);
    border: 1px solid transparent;
    color: #fff;
    opacity: 1;
}

body.legacy-v70-option3 .legacy-v70-search {
    padding: 5px 8px 3px;
}

body.legacy-v70-option3 .legacy-v70-search input {
    margin: 0;
    padding: 9px 11px;
    min-height: 34px;
    border-radius: 10px;
    border: 1px solid transparent;
    background: var(--legacy-box);
    color: #fff;
    font-size: 11px;
}

body.legacy-v70-option3 .legacy-v70-filter-row {
    padding: 4px 8px 6px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

body.legacy-v70-option3 .legacy-v70-filter-row button {
    width: 100%;
    margin: 0;
    padding: 7px 6px;
    min-height: 30px;
    border: 0;
    border-radius: 10px;
    background: #334155;
    color: #fff;
    font-size: 10px;
    box-shadow: none;
}

body.legacy-v70-option3 .legacy-v70-filter-row button.active {
    box-shadow: inset 0 0 0 2px var(--legacy-blue-soft);
}

body.legacy-v70-option3 .legacy-v70-filter-row .legacy-v70-filter-sos { background: #dc2626; }
body.legacy-v70-option3 .legacy-v70-filter-row .legacy-v70-filter-online { background: #16a34a; }

body.legacy-v70-option3 .legacy-v70-stat-grid {
    padding: 0 8px 7px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
}

body.legacy-v70-option3 .legacy-v70-stat {
    min-width: 0;
    padding: 9px 8px;
    border-radius: 12px;
    background: var(--legacy-box);
    text-align: center;
}

body.legacy-v70-option3 .legacy-v70-stat span {
    display: block;
    color: #e2e8f0;
    font-size: 10px;
}

body.legacy-v70-option3 .legacy-v70-stat strong {
    display: block;
    margin-top: 3px;
    font-size: 18px;
    line-height: 1;
}

body.legacy-v70-option3 .legacy-v70-device-list {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 7px 8px 12px;
    scrollbar-width: thin;
    scrollbar-color: #64748b transparent;
}

body.legacy-v70-option3 .legacy-v70-device-card {
    position: relative;
    margin: 0 0 8px;
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 13px;
    background: var(--legacy-box);
    cursor: pointer;
    color: #fff;
    transition: border-color .14s ease, background .14s ease;
}

body.legacy-v70-option3 .legacy-v70-device-card:hover { background: var(--legacy-box-hover); }
body.legacy-v70-option3 .legacy-v70-device-card.selected { border-color: var(--legacy-blue-soft); }
body.legacy-v70-option3 .legacy-v70-device-card.alarm { border-color: var(--legacy-red); background: rgba(127, 29, 29, .28); }

body.legacy-v70-option3 .legacy-v70-device-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 7px;
}

body.legacy-v70-option3 .legacy-v70-device-head strong {
    display: block;
    font-size: 12px;
    overflow-wrap: anywhere;
}

body.legacy-v70-option3 .legacy-v70-device-head small,
body.legacy-v70-option3 .legacy-v70-device-meta {
    color: var(--legacy-muted);
    font-size: 9px;
}

body.legacy-v70-option3 .legacy-v70-alarm-label {
    margin: 0 0 7px;
    padding: 6px 8px;
    border-radius: 8px;
    background: rgba(220, 38, 38, .72);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    overflow-wrap: anywhere;
}

body.legacy-v70-option3 .legacy-v70-device-row {
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
}

body.legacy-v70-option3 .legacy-v70-signal-bars {
    display: inline-flex;
    align-items: end;
    gap: 2px;
    width: 22px;
    height: 13px;
}

body.legacy-v70-option3 .legacy-v70-signal-bars i {
    width: 3px;
    border-radius: 2px;
    background: #475569;
}
body.legacy-v70-option3 .legacy-v70-signal-bars i:nth-child(1) { height: 4px; }
body.legacy-v70-option3 .legacy-v70-signal-bars i:nth-child(2) { height: 7px; }
body.legacy-v70-option3 .legacy-v70-signal-bars i:nth-child(3) { height: 10px; }
body.legacy-v70-option3 .legacy-v70-signal-bars i:nth-child(4) { height: 13px; }
body.legacy-v70-option3 .legacy-v70-signal-bars.level-1 i:nth-child(1),
body.legacy-v70-option3 .legacy-v70-signal-bars.level-2 i:nth-child(-n+2),
body.legacy-v70-option3 .legacy-v70-signal-bars.level-3 i:nth-child(-n+3),
body.legacy-v70-option3 .legacy-v70-signal-bars.level-4 i { background: var(--legacy-green); }

body.legacy-v70-option3 .legacy-v70-battery-track {
    height: 5px;
    margin-top: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #0f172a;
}

body.legacy-v70-option3 .legacy-v70-battery-fill {
    height: 100%;
    border-radius: inherit;
    background: var(--legacy-green);
}
body.legacy-v70-option3 .legacy-v70-battery-fill.medium { background: var(--legacy-orange); }
body.legacy-v70-option3 .legacy-v70-battery-fill.low { background: var(--legacy-red); }

body.legacy-v70-option3 .legacy-v70-device-badges {
    margin-top: 7px;
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

body.legacy-v70-option3 .legacy-v70-device-badge {
    padding: 3px 6px;
    border-radius: 999px;
    background: #334155;
    color: #e2e8f0;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}
body.legacy-v70-option3 .legacy-v70-device-badge.online { background: #16a34a; color: #fff; }
body.legacy-v70-option3 .legacy-v70-device-badge.offline { background: #dc2626; color: #fff; }
body.legacy-v70-option3 .legacy-v70-device-badge.alarm { background: #dc2626; color: #fff; }

body.legacy-v70-option3 .legacy-v70-topbar {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    height: var(--legacy-topbar-height);
    padding: 0 8px 0 10px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    background: var(--legacy-panel);
    border-bottom: 1px solid var(--legacy-border);
    overflow: hidden;
    z-index: 25;
}

body.legacy-v70-option3 .legacy-v70-main-nav.sidebar {
    min-width: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 5px;
    overflow-x: auto;
    overflow-y: hidden;
    background: transparent;
    border: 0;
    scrollbar-width: none;
}
body.legacy-v70-option3 .legacy-v70-main-nav::-webkit-scrollbar { display: none; }

body.legacy-v70-option3 .legacy-v70-main-nav button {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    min-height: 29px;
    padding: 6px 10px;
    border: 0;
    border-radius: 9px;
    outline: 0;
    background: var(--legacy-box);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: none;
}

body.legacy-v70-option3 .legacy-v70-main-nav button.active {
    background: var(--legacy-blue);
    color: #fff;
    outline: 0;
}

body.legacy-v70-option3 .legacy-v70-userbar {
    min-width: 0;
    gap: 7px;
    font-size: 10px;
    white-space: nowrap;
}

body.legacy-v70-option3 .legacy-v70-userbar #globalRealtimeStatus,
body.legacy-v70-option3 .legacy-v70-userbar #globalAlarmStatus { display: none; }

body.legacy-v70-option3 .legacy-v70-userbar #welcome {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #e2e8f0;
}

body.legacy-v70-option3 .legacy-v70-userbar #logoutBtn {
    margin: 0;
    padding: 6px 8px;
    min-height: 28px;
    border-radius: 8px;
    font-size: 10px;
}

body.legacy-v70-option3 .legacy-v70-main {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    min-height: 0;
    display: block;
    overflow: hidden;
    background: var(--legacy-bg);
}

body.legacy-v70-option3 .legacy-v70-main .content {
    position: relative;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: auto;
    padding: 10px;
    background: #0b1323;
}

body.legacy-v70-option3 .status-line {
    position: sticky;
    top: 0;
    z-index: 20;
    margin: 0 0 8px;
    min-height: 0;
    padding: 7px 9px;
    border-radius: 8px;
    background: rgba(2, 6, 23, .92);
    font-size: 10px;
    backdrop-filter: blur(8px);
}
body.legacy-v70-option3 .status-line.ok { display: none; }

/* Algemene v70.10 componentstijl zonder de v80-functionaliteit te vervangen. */
body.legacy-v70-option3 .card,
body.legacy-v70-option3 .login-card,
body.legacy-v70-option3 .setup-card {
    margin: 9px 0;
    padding: 13px;
    border: 1px solid var(--legacy-border);
    border-radius: 14px;
    background: var(--legacy-panel);
    box-shadow: none;
}

body.legacy-v70-option3 input,
body.legacy-v70-option3 select,
body.legacy-v70-option3 textarea {
    border: 1px solid transparent;
    border-radius: 11px;
    background: var(--legacy-box);
    color: #fff;
}

body.legacy-v70-option3 input:focus,
body.legacy-v70-option3 select:focus,
body.legacy-v70-option3 textarea:focus {
    outline: none;
    border-color: var(--legacy-blue-soft);
}

body.legacy-v70-option3 button,
body.legacy-v70-option3 .button-link {
    border-radius: 10px;
    background: var(--legacy-blue);
    color: #fff;
    box-shadow: none;
}
body.legacy-v70-option3 button.secondary { background: #334155; color: #fff; }
body.legacy-v70-option3 button.danger { background: #dc2626; color: #fff; }
body.legacy-v70-option3 button:hover { filter: brightness(1.08); }

body.legacy-v70-option3 .pill,
body.legacy-v70-option3 .realtime-status-pill {
    background: #334155;
    color: #e2e8f0;
}

body.legacy-v70-option3 h1 { font-size: 22px; margin: 3px 0 10px; }
body.legacy-v70-option3 h2 { font-size: 18px; }
body.legacy-v70-option3 h3 { font-size: 14px; }
body.legacy-v70-option3 .muted { color: var(--legacy-muted); }

/* Tracker Overzicht: persistent trackerrail vervangt de dubbele interne trackerlijst. */
body.legacy-v70-option3 #trackerOverviewPage { gap: 8px; }
body.legacy-v70-option3 .content > h1:has(+ #trackerOverviewPage) { display: none; }
body.legacy-v70-option3 .overview-player-hero {
    min-height: 0;
    margin: 0 0 6px;
    padding: 5px 8px;
    border: 0;
    background: transparent;
    display: flex;
    justify-content: flex-end;
}
body.legacy-v70-option3 .overview-player-hero > div:first-child,
body.legacy-v70-option3 .overview-mode-switch { display: none; }
body.legacy-v70-option3 .overview-hero-tools { margin-left: auto; }
body.legacy-v70-option3 .overview-user-filter { min-width: 240px; }
body.legacy-v70-option3 .overview-user-filter label { margin: 0; }
body.legacy-v70-option3 .overview-kpi-grid { display: none; }
body.legacy-v70-option3 .overview-window { gap: 8px; }
body.legacy-v70-option3 .overview-window-title {
    margin: 0 0 7px;
    padding: 0 2px;
    align-items: center;
}
body.legacy-v70-option3 .overview-window-title h2 { margin: 0; font-size: 15px; }
body.legacy-v70-option3 .overview-window-title p { display: none; }
body.legacy-v70-option3 .overview-list-card { display: none; }
body.legacy-v70-option3 .overview-layout { display: block; }
body.legacy-v70-option3 .overview-map-card {
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-radius: 14px;
}
body.legacy-v70-option3 .overview-map-card > h3 { display: none; }
body.legacy-v70-option3 .overview-map {
    height: calc(100vh - 125px);
    min-height: 540px;
    border-radius: 0;
}
body.legacy-v70-option3 .overview-map-card > .muted { margin: 0; padding: 7px 10px; background: #0f172a; }
body.legacy-v70-option3 .overview-latest-events-card { margin-top: 8px; }
body.legacy-v70-option3 .overview-alarm-row { background: var(--legacy-box); border-radius: 10px; }

/* Live kaart: de linker rail is al permanent zichtbaar, dus dubbele lijst verbergen. */
body.legacy-v70-option3 .content > h1:has(+ .live-monitor-card) { display: none; }
body.legacy-v70-option3 .live-monitor-card { margin-top: 0; }
body.legacy-v70-option3 .live-monitor-header { padding: 0 2px; }
body.legacy-v70-option3 .live-monitor-header p { display: none; }
body.legacy-v70-option3 .live-status-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.legacy-v70-option3 .live-map-layout { grid-template-columns: 1fr; }
body.legacy-v70-option3 .live-device-list { display: none; }
body.legacy-v70-option3 .live-map {
    height: calc(100vh - 230px);
    min-height: 520px;
}

/* Route Player in v70-stijl: compact, donker en kaartgericht. */
body.legacy-v70-option3 .route-player-workspace { gap: 8px; }
body.legacy-v70-option3 .route-player-toolbar-card {
    margin: 0;
    padding: 10px;
    border-radius: 12px;
}
body.legacy-v70-option3 .route-player-toolbar-heading h2 { font-size: 16px; }
body.legacy-v70-option3 .route-player-toolbar-heading p { display: none; }
body.legacy-v70-option3 .route-player-toolbar-badge {
    background: var(--legacy-blue);
    color: #fff;
    border: 0;
    font-size: 9px;
}
body.legacy-v70-option3 .route-player-filter-bar {
    grid-template-columns: minmax(170px, 1fr) repeat(2, minmax(150px, .8fr)) auto;
    gap: 7px;
}
body.legacy-v70-option3 .route-player-filter-bar label span { font-size: 10px; }
body.legacy-v70-option3 .route-player-toolbar-meta { margin-top: 7px; }
body.legacy-v70-option3 .route-player-stage { gap: 8px; }
body.legacy-v70-option3 .route-player-grid { grid-template-columns: minmax(0, 1fr) 330px; gap: 8px; }
body.legacy-v70-option3 .route-player-map-card,
body.legacy-v70-option3 .route-player-events-card,
body.legacy-v70-option3 .route-player-timeline-card,
body.legacy-v70-option3 .route-player-debug-card {
    border-radius: 14px;
    background: var(--legacy-panel);
}
body.legacy-v70-option3 .route-player-map { height: calc(100vh - 275px); min-height: 480px; }
body.legacy-v70-option3 .route-player-controls {
    gap: 6px;
    background: rgba(2, 6, 23, .72);
    border-radius: 10px;
}
body.legacy-v70-option3 .route-player-controls button { padding: 8px 10px; }
body.legacy-v70-option3 .route-player-clock { background: var(--legacy-box); border-radius: 9px; padding: 7px 10px; }
body.legacy-v70-option3 .route-player-speed { background: var(--legacy-box); border-radius: 9px; padding: 6px 8px; }
body.legacy-v70-option3 .route-player-events-card { max-height: calc(100vh - 275px); }
body.legacy-v70-option3 .route-event-row { border-radius: 10px; background: var(--legacy-box); }
body.legacy-v70-option3 .route-player-timeline-card { margin-top: 0; }
body.legacy-v70-option3 .route-player-timeline-track { background: #020617; }

/* Debug en beheer dichter bij de compacte v70 werkbank. */
body.legacy-v70-option3 .debug-terminal-card,
body.legacy-v70-option3 .debug-summary-grid div,
body.legacy-v70-option3 .status-grid div,
body.legacy-v70-option3 .permission-item {
    background: var(--legacy-box);
    border-color: var(--legacy-border);
    box-shadow: none;
}

body.legacy-v70-option3 table { font-size: 11px; }
body.legacy-v70-option3 th,
body.legacy-v70-option3 td { padding: 8px; }

@media (max-width: 1280px) {
    body.legacy-v70-option3 { --legacy-sidebar-width: 220px; }
    body.legacy-v70-option3 .route-player-grid { grid-template-columns: minmax(0, 1fr) 300px; }
    body.legacy-v70-option3 .legacy-v70-main-nav button { padding-inline: 8px; }
    body.legacy-v70-option3 .legacy-v70-userbar #welcome { max-width: 150px; }
}

@media (max-width: 980px) {
    body.legacy-v70-option3 { overflow: auto; }
    body.legacy-v70-option3 .legacy-v70-shell {
        height: auto;
        min-height: 100vh;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto minmax(0, 1fr);
        overflow: visible;
    }
    body.legacy-v70-option3 .legacy-v70-sidebar {
        grid-column: 1;
        grid-row: 1;
        height: 300px;
        border-right: 0;
        border-bottom: 1px solid var(--legacy-border);
    }
    body.legacy-v70-option3 .legacy-v70-topbar {
        grid-column: 1;
        grid-row: 2;
        position: sticky;
        top: 0;
    }
    body.legacy-v70-option3 .legacy-v70-main {
        grid-column: 1;
        grid-row: 3;
        overflow: visible;
    }
    body.legacy-v70-option3 .legacy-v70-main .content { height: auto; min-height: 70vh; overflow: visible; }
    body.legacy-v70-option3 .route-player-grid { grid-template-columns: 1fr; }
    body.legacy-v70-option3 .overview-map,
    body.legacy-v70-option3 .live-map,
    body.legacy-v70-option3 .route-player-map { height: 520px; min-height: 420px; }
}

@media (max-width: 680px) {
    body.legacy-v70-option3 .legacy-v70-topbar { grid-template-columns: 1fr; height: auto; padding-block: 6px; }
    body.legacy-v70-option3 .legacy-v70-userbar { display: none; }
    body.legacy-v70-option3 .route-player-filter-bar,
    body.legacy-v70-option3 .live-status-strip { grid-template-columns: 1fr; }
    body.legacy-v70-option3 .overview-map,
    body.legacy-v70-option3 .live-map,
    body.legacy-v70-option3 .route-player-map { height: 400px; min-height: 340px; }
}

/* ==========================================================
   v80.27.1 option 3 complete – echte v70.10 werkindeling
   ========================================================== */
body.legacy-v70-option3 {
    --legacy-detail-width: 286px;
}

body.legacy-v70-option3 .legacy-v70-shell {
    grid-template-columns: var(--legacy-sidebar-width) minmax(0, 1fr) var(--legacy-detail-width);
}

body.legacy-v70-option3 .legacy-v70-topbar {
    grid-column: 2 / 4;
}

body.legacy-v70-option3 .legacy-v70-main {
    grid-column: 2;
}

body.legacy-v70-option3 .legacy-v70-context {
    grid-column: 3;
    grid-row: 2;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
    padding: 16px 14px 24px;
    background: var(--legacy-panel);
    border-left: 1px solid var(--legacy-border);
    color: #fff;
    scrollbar-width: thin;
    scrollbar-color: #64748b transparent;
}

body.legacy-v70-option3 .legacy-v70-context::-webkit-scrollbar { width: 8px; }
body.legacy-v70-option3 .legacy-v70-context::-webkit-scrollbar-thumb { background: #475569; border-radius: 999px; }

body.legacy-v70-option3.legacy-context-hidden .legacy-v70-shell {
    grid-template-columns: var(--legacy-sidebar-width) minmax(0, 1fr);
}
body.legacy-v70-option3.legacy-context-hidden .legacy-v70-topbar { grid-column: 2; }
body.legacy-v70-option3.legacy-context-hidden .legacy-v70-main { grid-column: 2; }
body.legacy-v70-option3.legacy-context-hidden .legacy-v70-context { display: none; }

body.legacy-v70-option3 .legacy-v70-context-empty {
    color: var(--legacy-muted);
    font-size: 11px;
    line-height: 1.5;
}

body.legacy-v70-option3 .legacy-context-section {
    margin: 0 0 24px;
}
body.legacy-v70-option3 .legacy-context-section:last-child { margin-bottom: 0; }
body.legacy-v70-option3 .legacy-context-section h3 {
    margin: 0 0 11px;
    color: #93c5fd;
    font-size: 13px;
}
body.legacy-v70-option3 .legacy-context-section p {
    margin: 0 0 10px;
    color: var(--legacy-muted);
    font-size: 10px;
    line-height: 1.45;
}

body.legacy-v70-option3 .legacy-context-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
body.legacy-v70-option3 .legacy-context-box {
    min-width: 0;
    padding: 10px;
    border-radius: 10px;
    background: var(--legacy-box);
}
body.legacy-v70-option3 .legacy-context-box .label {
    display: block;
    margin-bottom: 4px;
    color: var(--legacy-muted);
    font-size: 9px;
}
body.legacy-v70-option3 .legacy-context-box strong,
body.legacy-v70-option3 .legacy-context-box span.value {
    display: block;
    color: #fff;
    font-size: 11px;
    line-height: 1.3;
    overflow-wrap: anywhere;
}
body.legacy-v70-option3 .legacy-context-box .ok-text { color: #22c55e; }
body.legacy-v70-option3 .legacy-context-box .warn-text { color: #f59e0b; }
body.legacy-v70-option3 .legacy-context-box .danger-text { color: #ef4444; }

body.legacy-v70-option3 .legacy-context-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}
body.legacy-v70-option3 .legacy-context-actions button,
body.legacy-v70-option3 .legacy-context-actions .button-link {
    width: 100%;
    min-height: 34px;
    padding: 8px 7px;
    font-size: 10px;
    text-align: center;
}

body.legacy-v70-option3 .legacy-context-note {
    padding: 10px;
    border-radius: 10px;
    background: #111827;
    color: #cbd5e1;
    font-size: 10px;
    line-height: 1.45;
}

body.legacy-v70-option3 .legacy-context-list {
    display: grid;
    gap: 7px;
}
body.legacy-v70-option3 .legacy-context-list-item {
    padding: 9px 10px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: var(--legacy-box);
    cursor: pointer;
}
body.legacy-v70-option3 .legacy-context-list-item:hover,
body.legacy-v70-option3 .legacy-context-list-item.active {
    border-color: var(--legacy-blue-soft);
    background: var(--legacy-box-hover);
}
body.legacy-v70-option3 .legacy-context-list-item strong {
    display: block;
    font-size: 11px;
}
body.legacy-v70-option3 .legacy-context-list-item small {
    display: block;
    margin-top: 3px;
    color: var(--legacy-muted);
    font-size: 9px;
}

/* RX/TX gedraagt zich weer als v70.10: kort oplichten per activiteit. */
body.legacy-v70-option3 .legacy-v70-io-chip.active i {
    animation: legacy-v70-io-pulse .72s ease-in-out infinite alternate;
}
body.legacy-v70-option3 .legacy-v70-io-chip.rx.active i,
body.legacy-v70-option3 #legacyRxChip.active i {
    background: #22c55e;
    box-shadow: 0 0 10px rgba(34,197,94,.58);
}
body.legacy-v70-option3 .legacy-v70-io-chip.tx.active i,
body.legacy-v70-option3 #legacyTxChip.active i {
    background: #ef4444;
    box-shadow: 0 0 10px rgba(239,68,68,.58);
}
@keyframes legacy-v70-io-pulse {
    from { transform: scale(.78); opacity: .72; }
    to { transform: scale(1.18); opacity: 1; }
}

/* Beheer/Track: kaart is het hoofdvlak, detailinformatie staat rechts. */
body.legacy-v70-option3.legacy-context-device #trackerOverviewPage .overview-player-hero,
body.legacy-v70-option3.legacy-context-device #trackerOverviewPage .overview-kpi-grid,
body.legacy-v70-option3.legacy-context-device #trackerOverviewPage .overview-latest-events-card {
    display: none !important;
}
body.legacy-v70-option3.legacy-context-device #trackerOverviewPage,
body.legacy-v70-option3.legacy-context-device #overviewLiveWindow,
body.legacy-v70-option3.legacy-context-device #overviewLiveWindow .overview-layout,
body.legacy-v70-option3.legacy-context-device #overviewLiveWindow .overview-map-card {
    height: 100%;
    min-height: 0;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-device .overview-map {
    height: calc(100vh - var(--legacy-topbar-height) - 20px);
    min-height: 520px;
}

/* Route Player: kaart midden, alle bediening en events rechts zoals v70.10. */
body.legacy-v70-option3.legacy-context-route .route-player-workspace,
body.legacy-v70-option3.legacy-context-route .route-player-stage,
body.legacy-v70-option3.legacy-context-route .route-player-grid,
body.legacy-v70-option3.legacy-context-route .route-player-map-card {
    height: 100%;
    min-height: 0;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-route .route-player-toolbar-card,
body.legacy-v70-option3.legacy-context-route .route-player-events-card,
body.legacy-v70-option3.legacy-context-route .route-player-timeline-card,
body.legacy-v70-option3.legacy-context-route .route-player-debug-card,
body.legacy-v70-option3.legacy-context-route .route-player-controls,
body.legacy-v70-option3.legacy-context-route .route-player-detail-strip {
    width: 100%;
    margin: 0 0 16px;
}
body.legacy-v70-option3.legacy-context-route .route-player-grid { grid-template-columns: 1fr; }
body.legacy-v70-option3.legacy-context-route .route-player-map-card {
    padding: 0;
    overflow: hidden;
    border-radius: 14px;
}
body.legacy-v70-option3.legacy-context-route .route-player-map-header,
body.legacy-v70-option3.legacy-context-route .route-player-map-status {
    display: none;
}
body.legacy-v70-option3.legacy-context-route .route-player-map {
    height: calc(100vh - var(--legacy-topbar-height) - 20px);
    min-height: 520px;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-toolbar-card,
body.legacy-v70-option3 .legacy-v70-context .route-player-events-card,
body.legacy-v70-option3 .legacy-v70-context .route-player-timeline-card,
body.legacy-v70-option3 .legacy-v70-context .route-player-debug-card {
    padding: 0;
    border: 0;
    background: transparent;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-toolbar-heading p,
body.legacy-v70-option3 .legacy-v70-context .route-player-toolbar-badge,
body.legacy-v70-option3 .legacy-v70-context .route-player-events-card > p,
body.legacy-v70-option3 .legacy-v70-context .route-timeline-legend {
    display: none;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-filter-bar {
    grid-template-columns: 1fr;
    gap: 7px;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-filter-bar .button-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0;
    background: transparent;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-clock,
body.legacy-v70-option3 .legacy-v70-context .route-player-speed {
    grid-column: span 2;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-events-card {
    max-height: none;
    overflow: visible;
}
body.legacy-v70-option3 .legacy-v70-context .route-event-list {
    max-height: 380px;
    overflow: auto;
}
body.legacy-v70-option3 .legacy-v70-context .route-player-timeline-header {
    align-items: flex-start;
    gap: 8px;
}
body.legacy-v70-option3 .legacy-v70-context .route-follow-check { display: none; }

/* Track: dubbele interne lijst, statusstrook en tabel verdwijnen; contextpaneel neemt details over. */
body.legacy-v70-option3.legacy-context-track .live-monitor-header,
body.legacy-v70-option3.legacy-context-track .live-status-strip,
body.legacy-v70-option3.legacy-context-track .live-device-list,
body.legacy-v70-option3.legacy-context-track #activeDevicePanel,
body.legacy-v70-option3.legacy-context-track .live-monitor-card + .card,
body.legacy-v70-option3.legacy-context-track .content > h1 {
    display: none !important;
}
body.legacy-v70-option3.legacy-context-track .live-monitor-card,
body.legacy-v70-option3.legacy-context-track .live-map-layout,
body.legacy-v70-option3.legacy-context-track .live-map-panel {
    height: 100%;
    min-height: 0;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-track .live-map {
    height: calc(100vh - var(--legacy-topbar-height) - 20px);
    min-height: 520px;
}

@media (max-width: 1360px) {
    body.legacy-v70-option3 { --legacy-detail-width: 270px; }
}

@media (max-width: 1120px) {
    body.legacy-v70-option3 .legacy-v70-shell,
    body.legacy-v70-option3.legacy-context-hidden .legacy-v70-shell {
        grid-template-columns: var(--legacy-sidebar-width) minmax(0, 1fr);
    }
    body.legacy-v70-option3 .legacy-v70-topbar,
    body.legacy-v70-option3.legacy-context-hidden .legacy-v70-topbar { grid-column: 2; }
    body.legacy-v70-option3 .legacy-v70-main { grid-column: 2; }
    body.legacy-v70-option3 .legacy-v70-context { display: none; }
}

/* Virtuele v70.10 kaartvensters: Device Config, Alarmen en Traccar gebruiken de kaart als middenvlak. */
body.legacy-v70-option3.legacy-context-config .live-monitor-header,
body.legacy-v70-option3.legacy-context-config .live-status-strip,
body.legacy-v70-option3.legacy-context-config .live-device-list,
body.legacy-v70-option3.legacy-context-config #activeDevicePanel,
body.legacy-v70-option3.legacy-context-config .live-monitor-card + .card,
body.legacy-v70-option3.legacy-context-config .content > h1,
body.legacy-v70-option3.legacy-context-traccar .live-monitor-header,
body.legacy-v70-option3.legacy-context-traccar .live-status-strip,
body.legacy-v70-option3.legacy-context-traccar .live-device-list,
body.legacy-v70-option3.legacy-context-traccar #activeDevicePanel,
body.legacy-v70-option3.legacy-context-traccar .live-monitor-card + .card,
body.legacy-v70-option3.legacy-context-traccar .content > h1 {
    display: none !important;
}
body.legacy-v70-option3.legacy-context-config .live-monitor-card,
body.legacy-v70-option3.legacy-context-config .live-map-layout,
body.legacy-v70-option3.legacy-context-config .live-map-panel,
body.legacy-v70-option3.legacy-context-traccar .live-monitor-card,
body.legacy-v70-option3.legacy-context-traccar .live-map-layout,
body.legacy-v70-option3.legacy-context-traccar .live-map-panel {
    height: 100%;
    min-height: 0;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-config .live-map,
body.legacy-v70-option3.legacy-context-traccar .live-map {
    height: calc(100vh - var(--legacy-topbar-height) - 20px);
    min-height: 520px;
}

body.legacy-v70-option3.legacy-context-alarms #trackerOverviewPage .overview-player-hero,
body.legacy-v70-option3.legacy-context-alarms #trackerOverviewPage .overview-kpi-grid,
body.legacy-v70-option3.legacy-context-alarms #trackerOverviewPage .overview-window-title,
body.legacy-v70-option3.legacy-context-alarms #trackerOverviewPage .overview-latest-events-card {
    display: none !important;
}
body.legacy-v70-option3.legacy-context-alarms #trackerOverviewPage,
body.legacy-v70-option3.legacy-context-alarms #overviewLiveWindow,
body.legacy-v70-option3.legacy-context-alarms #overviewLiveWindow .overview-layout,
body.legacy-v70-option3.legacy-context-alarms #overviewLiveWindow .overview-map-card {
    height: 100%;
    min-height: 0;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-alarms .overview-map {
    height: calc(100vh - var(--legacy-topbar-height) - 20px);
    min-height: 520px;
}

/* Alarmcontext vollediger teruggebracht richting v70.10: contacten en opvolging in vaste rechterkolom. */
body.legacy-v70-option3 .legacy-alarm-contacts {
    display: grid;
    gap: 8px;
}
body.legacy-v70-option3 .legacy-alarm-contact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 9px 10px;
    border-left: 3px solid #10b981;
    border-radius: 10px;
    background: var(--legacy-box);
}
body.legacy-v70-option3 .legacy-alarm-contact strong,
body.legacy-v70-option3 .legacy-alarm-contact small {
    display: block;
    overflow-wrap: anywhere;
}
body.legacy-v70-option3 .legacy-alarm-contact strong { font-size: 10px; }
body.legacy-v70-option3 .legacy-alarm-contact small {
    margin-top: 3px;
    color: var(--legacy-muted);
    font-size: 9px;
}
body.legacy-v70-option3 .legacy-alarm-contact-actions {
    display: flex;
    gap: 5px;
}
body.legacy-v70-option3 .legacy-alarm-contact-actions .button-link {
    min-width: 38px;
    padding: 6px 7px;
    border-radius: 8px;
    font-size: 9px;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
}
body.legacy-v70-option3 .legacy-alarm-contact-actions .button-link.ok { background: #16a34a; }
body.legacy-v70-option3 .legacy-v70-context textarea {
    width: 100%;
    margin: 0;
    resize: vertical;
    min-height: 84px;
    padding: 10px;
    font-size: 10px;
}
body.legacy-v70-option3 .legacy-context-list button.legacy-context-list-item {
    width: 100%;
    margin: 0;
    min-height: 0;
    text-align: left;
    color: #fff;
    box-shadow: none;
}

/* ==========================================================
   v80.27.2 – definitieve programmaschil en navigatiefundament
   ========================================================== */
body.legacy-v70-option3 {
    --legacy-topbar-height: 43px;
    --legacy-detail-width: 302px;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.legacy-v70-option3 .legacy-v70-main .content {
    padding: 8px;
    overflow: hidden;
}
body.legacy-v70-option3 #contentArea {
    height: 100%;
    min-height: 0;
    overflow: auto;
}
body.legacy-v70-option3.legacy-context-overview #contentArea,
body.legacy-v70-option3.legacy-context-device #contentArea,
body.legacy-v70-option3.legacy-context-track #contentArea,
body.legacy-v70-option3.legacy-context-route #contentArea {
    overflow: hidden;
}
body.legacy-v70-option3 .legacy-v70-main-nav.sidebar {
    gap: 4px;
}
body.legacy-v70-option3 .legacy-v70-main-nav button {
    min-height: 28px;
    padding: 5px 9px;
    border-radius: 8px;
    background: #172033;
    color: #dbeafe;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: -.05px;
    border: 1px solid rgba(148, 163, 184, .08);
}
body.legacy-v70-option3 .legacy-v70-main-nav button:hover {
    background: #22304a;
    filter: none;
}
body.legacy-v70-option3 .legacy-v70-main-nav button.active {
    background: linear-gradient(180deg, #2563eb, #1d4ed8);
    color: #fff;
    border-color: rgba(147, 197, 253, .38);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}
body.legacy-v70-option3 .legacy-v70-map-row select:not(:disabled) {
    cursor: pointer;
    border-color: rgba(59, 130, 246, .25);
}
body.legacy-v70-option3 .legacy-v70-io-chip {
    min-width: 39px;
    justify-content: center;
    background: #0b1220;
    border: 1px solid rgba(148, 163, 184, .13);
}
body.legacy-v70-option3 .legacy-v70-io-chip.active {
    color: #fff;
    border-color: rgba(255,255,255,.20);
}
body.legacy-v70-option3 .legacy-v70-context {
    padding: 13px 12px 18px;
}
body.legacy-v70-option3 .legacy-context-section {
    margin-bottom: 18px;
}
body.legacy-v70-option3 .legacy-context-section h3 {
    margin-bottom: 8px;
    font-size: 12px;
    color: #93c5fd;
}
body.legacy-v70-option3 .legacy-context-grid {
    gap: 6px;
}
body.legacy-v70-option3 .legacy-context-box {
    padding: 8px;
    border-radius: 9px;
}
body.legacy-v70-option3 .legacy-context-note {
    padding: 8px;
    border-radius: 9px;
}
body.legacy-v70-option3 .content > h1 {
    margin: 0 0 8px;
    font-size: 18px;
}
body.legacy-v70-option3 .card {
    margin: 7px 0;
    padding: 11px;
}
body.legacy-v70-option3.legacy-context-settings .device-config-shell,
body.legacy-v70-option3.legacy-context-settings .eview-settings-shell,
body.legacy-v70-option3.legacy-context-settings .card:first-child {
    margin-top: 0;
}
body.legacy-v70-option3.legacy-context-settings #contentArea,
body.legacy-v70-option3.legacy-context-alarms #contentArea,
body.legacy-v70-option3.legacy-context-traccar #contentArea,
body.legacy-v70-option3.legacy-context-generic #contentArea {
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #64748b transparent;
}
body.legacy-v70-option3.legacy-context-alarms .alarm-center-layout,
body.legacy-v70-option3.legacy-context-alarms .alarm-workspace,
body.legacy-v70-option3.legacy-context-traccar .webapp-settings-grid,
body.legacy-v70-option3.legacy-context-traccar .settings-grid {
    max-height: calc(100vh - var(--legacy-topbar-height) - 34px);
    overflow: auto;
}
/* Vanaf v80.27.2 tonen alleen Tracker Overview, Live en Route History een kaart. */
body.legacy-v70-option3.legacy-context-config .live-map,
body.legacy-v70-option3.legacy-context-traccar .live-map {
    height: auto;
    min-height: 0;
}
body.legacy-v70-option3.legacy-context-traccar .live-monitor-card,
body.legacy-v70-option3.legacy-context-config .live-monitor-card {
    display: block;
}
body.legacy-v70-option3.legacy-context-generic .legacy-v70-context,
body.legacy-v70-option3.legacy-context-settings .legacy-v70-context,
body.legacy-v70-option3.legacy-context-traccar .legacy-v70-context,
body.legacy-v70-option3.legacy-context-alarms .legacy-v70-context {
    display: block;
}
@media (max-width: 1360px) {
    body.legacy-v70-option3 { --legacy-detail-width: 285px; }
    body.legacy-v70-option3 .legacy-v70-main-nav button { padding-inline: 7px; font-size: 10px; }
}

/* ==========================================================
   v80.27.2.1 – programmafocus, logo, losse kaartpagina's
   ========================================================== */
body.legacy-v70-option3 .legacy-v70-brand {
    min-height: 58px;
    padding: 8px 12px;
    justify-content: center;
}
body.legacy-v70-option3 .legacy-v70-brand-logo {
    display: block;
    width: min(205px, 100%);
    max-height: 48px;
    object-fit: contain;
}

/* Tracker Overview = hele vloot. Geen routeplayer en geen dubbele trackerlijst in het midden. */
body.legacy-v70-option3.legacy-context-device .overview-fleet-shell {
    height: calc(100% - 2px);
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-device .overview-fleet-shell > .overview-kpi-grid,
body.legacy-v70-option3.legacy-context-device .overview-fleet-shell > .overview-latest-events-card {
    display: none !important;
}
body.legacy-v70-option3.legacy-context-device .overview-fleet-map-card {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 14px;
}
body.legacy-v70-option3.legacy-context-device .overview-fleet-map-card .overview-window-title {
    display: flex !important;
    flex: 0 0 auto;
    padding: 8px 10px 6px;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-device .overview-fleet-map-card .overview-window-title p {
    display: none;
}
body.legacy-v70-option3.legacy-context-device .overview-fleet-map {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    border-radius: 0;
}
body.legacy-v70-option3.legacy-context-device .overview-fleet-map-card > .muted {
    flex: 0 0 auto;
    margin: 0;
    padding: 6px 10px;
    background: #0f172a;
}

/* Live = één geselecteerde tracker realtime volgen. */
body.legacy-v70-option3.legacy-context-track .live-focus-shell {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    gap: 8px;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-track .live-focus-toolbar {
    margin: 0;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
body.legacy-v70-option3.legacy-context-track .live-focus-toolbar h2 {
    margin: 2px 0 0;
    font-size: 16px;
}
body.legacy-v70-option3.legacy-context-track .live-focus-toolbar p {
    display: none;
}
body.legacy-v70-option3 .live-focus-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 6px;
}
body.legacy-v70-option3 .live-focus-actions button {
    margin: 0;
    min-height: 30px;
    padding: 6px 9px;
}
body.legacy-v70-option3 .live-follow-toggle {
    margin: 0 5px 0 0;
    white-space: nowrap;
}
body.legacy-v70-option3.legacy-context-track .live-status-strip-compact {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-track .live-focus-map-card {
    min-height: 0;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 14px;
}
body.legacy-v70-option3.legacy-context-track .live-focus-map {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    border-radius: 0;
}
body.legacy-v70-option3.legacy-context-track .live-focus-map-card > .muted {
    flex: 0 0 auto;
    margin: 0;
    padding: 6px 10px;
    background: #0f172a;
}
body.legacy-v70-option3 .live-admin-access {
    margin: 0;
    padding: 7px 10px;
    max-height: 260px;
    overflow: auto;
}
body.legacy-v70-option3 .live-admin-access summary {
    cursor: pointer;
    font-weight: 800;
}

/* Route History is een aparte pagina; kaart midden, bediening/context rechts. */
body.legacy-v70-option3.legacy-context-route .route-history-program-page {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-route .route-history-program-page > .route-player-workspace {
    height: 100%;
    min-height: 0;
}

/* Navigatie dichter bij v70.10: compacte donkere tabs, één duidelijke blauwe actieve tab. */
body.legacy-v70-option3 .legacy-v70-main-nav button {
    background: #182235 !important;
    color: #dbeafe !important;
    border: 1px solid rgba(148, 163, 184, .10) !important;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 10.5px;
    font-weight: 800;
}
body.legacy-v70-option3 .legacy-v70-main-nav button:hover {
    background: #25344d !important;
}
body.legacy-v70-option3 .legacy-v70-main-nav button.active {
    background: linear-gradient(180deg, #2f6df6, #2559d8) !important;
    color: #fff !important;
    outline: 0 !important;
    border-color: rgba(147, 197, 253, .42) !important;
}

@media (max-width: 1480px) {
    body.legacy-v70-option3 .live-focus-actions .live-follow-toggle { display: none; }
}


/* ==========================================================
   v80.27.2.2 – Route History workspace + harde logobegrenzing
   ========================================================== */
body.legacy-v70-option3 .legacy-v70-brand {
    flex: 0 0 56px !important;
    width: 100%;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding: 6px 10px !important;
    overflow: hidden !important;
    box-sizing: border-box;
}
body.legacy-v70-option3 .legacy-v70-brand-logo {
    display: block !important;
    width: auto !important;
    height: 42px !important;
    max-width: calc(100% - 8px) !important;
    max-height: 42px !important;
    object-fit: contain !important;
    object-position: center !important;
    flex: 0 0 auto !important;
}
body.legacy-v70-option3.legacy-context-route .route-history-program-page,
body.legacy-v70-option3.legacy-context-route .route-history-program-workspace,
body.legacy-v70-option3.legacy-context-route .route-history-program-result {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-route .route-history-map-only-card {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-radius: 14px;
}
body.legacy-v70-option3.legacy-context-route .route-history-map-only-card .route-player-map {
    height: 100%;
    min-height: 0;
}
body.legacy-v70-option3.legacy-context-route .route-history-map-only-card .route-player-map-status {
    position: absolute;
    left: 12px;
    bottom: 10px;
    z-index: 500;
    margin: 0;
    padding: 5px 8px;
    border-radius: 8px;
    background: rgba(2, 6, 23, .82);
    color: #cbd5e1;
    pointer-events: none;
}
body.legacy-v70-option3.legacy-context-route .route-history-empty-stage {
    height: 100%;
    min-height: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed rgba(56, 189, 248, .32);
    background: radial-gradient(circle at center, rgba(37, 99, 235, .08), rgba(2, 6, 23, .2));
}
body.legacy-v70-option3 .route-history-context-loader {
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--legacy-panel);
}
body.legacy-v70-option3 .route-history-context-form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 7px;
}
body.legacy-v70-option3 .route-history-context-form label {
    margin: 0;
    font-size: 10px;
    color: var(--legacy-muted);
}
body.legacy-v70-option3 .route-history-context-form select,
body.legacy-v70-option3 .route-history-context-form input,
body.legacy-v70-option3 .route-history-context-form button {
    width: 100%;
    margin: 3px 0 0;
}
body.legacy-v70-option3 .route-history-context-form .route-custom-window {
    display: none;
}
body.legacy-v70-option3 .route-history-context-form .route-custom-window.is-active {
    display: block;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context {
    overflow-y: auto;
    overscroll-behavior: contain;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-clock,
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-speed {
    grid-column: 1 / -1;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card,
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-timeline-card,
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-debug-card {
    width: auto;
    margin: 0;
}

/* =========================================================
   v80.27.2.3 – Google legacy maplagen + Single Locating status
   ========================================================= */
.location-refresh-status {
    margin: 8px 0 0;
    min-height: 20px;
    font-size: 13px;
    line-height: 1.35;
}
.location-refresh-status.ok {
    color: var(--ok, #34d399);
}
.location-refresh-status.warn {
    color: #fbbf24;
}
.live-focus-actions button:disabled,
.live-monitor-actions button:disabled {
    opacity: .58;
    cursor: wait;
}

/* =========================================================
   v80.27.2.4 – Route History Workstation + BAG huisnummers
   ========================================================= */
body.legacy-v70-option3 .legacy-v70-map-overlay-row {
    margin: 0 8px 6px;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 6px;
    align-items: center;
    color: var(--legacy-muted);
    font-size: 10px;
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle {
    min-height: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 5px 9px;
    border: 1px solid rgba(59,130,246,.22);
    border-radius: 8px;
    background: var(--legacy-box);
    color: #e2e8f0;
    cursor: pointer;
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input {
    appearance: none;
    width: 28px;
    height: 16px;
    margin: 0;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #475569;
    border: 1px solid rgba(148,163,184,.45);
    position: relative;
    cursor: pointer;
    transition: background .16s ease, border-color .16s ease;
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input::after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    left: 2px;
    top: 2px;
    border-radius: 50%;
    background: #e2e8f0;
    transition: transform .16s ease;
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input:checked {
    background: #2563eb;
    border-color: #60a5fa;
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input:checked::after { transform: translateX(12px); }
body.legacy-v70-option3 .legacy-v70-overlay-toggle input:focus-visible { outline: 2px solid #38bdf8; outline-offset: 2px; }

body.legacy-v70-option3.legacy-context-route #contentArea > h1 { display: none; }
body.legacy-v70-option3.legacy-context-route .route-history-program-page,
body.legacy-v70-option3.legacy-context-route .route-history-program-workspace,
body.legacy-v70-option3.legacy-context-route .route-history-program-result {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-route .route-history-program-page { padding: 0; }
body.legacy-v70-option3.legacy-context-route .route-history-workstation {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) 52px 118px;
    overflow: hidden;
    border: 1px solid #28364d;
    border-radius: 8px;
    background: #030712;
    box-shadow: 0 10px 30px rgba(0,0,0,.24);
}
body.legacy-v70-option3.legacy-context-route .route-workstation-viewport {
    position: relative;
    min-height: 0;
    overflow: hidden;
    background: #292929;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-map {
    width: 100%;
    height: 100%;
    min-height: 0;
    border-radius: 0;
    background: #292929;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-headup {
    position: absolute;
    top: 9px;
    left: 10px;
    z-index: 550;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 9px;
    border: 1px solid rgba(148,163,184,.28);
    border-radius: 7px;
    background: rgba(2,6,23,.86);
    color: #e2e8f0;
    pointer-events: none;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-headup span { color: #93c5fd; font-size: 10px; font-weight: 800; }
body.legacy-v70-option3.legacy-context-route .route-workstation-headup strong { font-size: 11px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-map-status {
    left: 10px;
    right: auto;
    bottom: 8px;
    max-width: min(720px, calc(100% - 20px));
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-player {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(330px, auto) minmax(220px, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 5px 9px;
    background: #f8fafc;
    border-top: 1px solid #cbd5e1;
    border-bottom: 1px solid #cbd5e1;
    color: #334155;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-player-buttons {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-player button {
    min-height: 34px;
    margin: 0;
    padding: 6px 9px;
    border-radius: 6px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #334155;
    box-shadow: none;
    font-size: 11px;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-player button:hover:not(:disabled) { background: #e2e8f0; }
body.legacy-v70-option3.legacy-context-route .route-workstation-player .route-play-toggle {
    min-width: 88px;
    background: #334155;
    border-color: #334155;
    color: #fff;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-player .icon-button { min-width: 36px; padding-inline: 7px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-clock {
    min-width: 0;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-clock strong { color: #0f172a; font-size: 14px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-clock span { color: #64748b; font-size: 10px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-speed {
    margin: 0;
    display: grid;
    grid-template-columns: auto 74px;
    gap: 6px;
    align-items: center;
    color: #475569;
    font-size: 10px;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-speed select {
    min-height: 32px;
    margin: 0;
    padding: 4px 6px;
    border-radius: 6px;
    background: #fff;
    color: #0f172a;
    border-color: #cbd5e1;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-follow {
    margin: 0;
    color: #475569;
    white-space: nowrap;
    font-size: 10px;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline {
    position: relative;
    min-height: 0;
    padding: 6px 10px 7px;
    background: #050505;
    color: #e2e8f0;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-header {
    height: 18px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    color: #94a3b8;
    font-size: 9px;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-header strong { color: #f8fafc; letter-spacing: .06em; }
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell {
    --route-progress: 0%;
    position: relative;
    height: 46px;
    margin-top: 2px;
    overflow: visible;
    border-top: 1px solid #262626;
    border-bottom: 1px solid #262626;
    background: #0a0a0a;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell::after {
    content: '';
    position: absolute;
    z-index: 12;
    top: -5px;
    bottom: -5px;
    left: var(--route-progress);
    width: 2px;
    transform: translateX(-1px);
    background: #facc15;
    box-shadow: 0 0 8px rgba(250,204,21,.55);
    pointer-events: none;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-track {
    position: absolute;
    left: 0;
    right: 0;
    top: 21px;
    height: 4px;
    border-radius: 0;
    background: #1f2937;
}
body.legacy-v70-option3.legacy-context-route .route-activity-segments {
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    top: 27px;
    height: 12px;
    pointer-events: none;
}
body.legacy-v70-option3.legacy-context-route .route-activity-segment {
    position: absolute;
    top: 0;
    height: 8px;
    min-width: 2px;
    border-radius: 1px;
    opacity: .92;
}
body.legacy-v70-option3.legacy-context-route .route-activity-segment.moving { background: #10b981; }
body.legacy-v70-option3.legacy-context-route .route-activity-segment.stopped { background: #f59e0b; }
body.legacy-v70-option3.legacy-context-route .route-activity-segment.gap,
body.legacy-v70-option3.legacy-context-route .route-activity-segment.unknown { background: #475569; opacity: .45; }
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-event-markers {
    position: absolute;
    inset: 0;
    z-index: 8;
    pointer-events: none;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-marker {
    top: 4px;
    bottom: auto;
    width: 5px;
    height: 16px;
    border: 0;
    border-radius: 1px;
    transform: translateX(-50%);
    pointer-events: auto;
    box-shadow: none;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-cluster {
    width: 22px;
    height: 20px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 8px;
    font-weight: 900;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-cluster span { pointer-events: none; }
body.legacy-v70-option3.legacy-context-route .route-timeline-slider {
    z-index: 11;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: .02;
    cursor: ew-resize;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-ticks {
    position: relative;
    height: 16px;
    margin-top: 1px;
    color: #94a3b8;
    font-size: 8px;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-ticks span {
    position: absolute;
    top: 1px;
    transform: translateX(-50%);
    white-space: nowrap;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-ticks span:first-child { transform: none; }
body.legacy-v70-option3.legacy-context-route .route-workstation-ticks span:last-child { transform: translateX(-100%); }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend {
    position: absolute;
    right: 10px;
    bottom: 4px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    color: #cbd5e1;
    font-size: 8px;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-legend span { display: inline-flex; align-items: center; gap: 4px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i { width: 8px; height: 8px; display: inline-block; border-radius: 1px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.moving { background: #10b981; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.stopped { background: #f59e0b; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.sos { background: #dc2626; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.alarm { background: #fb7185; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.motion { background: #f59e0b; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.command { background: #14b8a6; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.device { background: #6366f1; }
body.legacy-v70-option3.legacy-context-route .route-timeline-cluster-popover {
    position: absolute;
    z-index: 30;
    bottom: 43px;
    width: 220px;
    max-height: 210px;
    overflow: auto;
    transform: translateX(-50%);
    padding: 7px;
    border: 1px solid #475569;
    border-radius: 8px;
    background: rgba(15,23,42,.98);
    box-shadow: 0 14px 28px rgba(0,0,0,.45);
}
body.legacy-v70-option3.legacy-context-route .route-timeline-cluster-popover[hidden] { display: none; }
body.legacy-v70-option3.legacy-context-route .route-timeline-cluster-popover > strong { display: block; padding: 3px 5px 6px; font-size: 10px; }
body.legacy-v70-option3.legacy-context-route .route-timeline-cluster-popover button {
    width: 100%;
    margin: 2px 0;
    padding: 6px;
    display: grid;
    grid-template-columns: 58px 1fr;
    gap: 6px;
    text-align: left;
    background: #1e293b;
    color: #e2e8f0;
    border: 0;
    border-radius: 5px;
    font-size: 9px;
}
body.legacy-v70-option3.legacy-context-route .route-timeline-cluster-popover button span { color: #94a3b8; }
body.legacy-v70-option3.legacy-context-route .route-workstation-empty-content {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 8px;
    padding: 24px;
    text-align: center;
    color: #cbd5e1;
    background: radial-gradient(circle at center, rgba(37,99,235,.13), rgba(39,39,42,.96));
}
body.legacy-v70-option3.legacy-context-route .route-workstation-empty-content h2,
body.legacy-v70-option3.legacy-context-route .route-workstation-empty-content p { margin: 0; }
body.legacy-v70-option3.legacy-context-route .route-workstation-empty-content p { color: #94a3b8; max-width: 540px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-empty-icon { font-size: 34px; color: #38bdf8; }
body.legacy-v70-option3.legacy-context-route .route-workstation-loading-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid #334155;
    border-top-color: #38bdf8;
    border-radius: 50%;
    animation: route-workstation-spin .8s linear infinite;
}
@keyframes route-workstation-spin { to { transform: rotate(360deg); } }
body.legacy-v70-option3.legacy-context-route .route-workstation-player-disabled { min-height: 52px; }
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-empty { display: grid; align-content: center; }
body.legacy-v70-option3.legacy-context-route .route-workstation-empty-track { height: 7px; background: #1f2937; }

body.legacy-v70-option3 .route-history-quick-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}
body.legacy-v70-option3 .route-history-quick-row button,
body.legacy-v70-option3 .route-history-form-actions button { margin: 0; min-height: 30px; padding: 6px 7px; font-size: 9px; }
body.legacy-v70-option3 .route-history-quick-row button.active { background: #2563eb; color: #fff; }
body.legacy-v70-option3 .route-history-form-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
body.legacy-v70-option3 .route-summary-grid { grid-template-columns: 1fr 1fr; }
body.legacy-v70-option3 .route-selected-moment-time {
    margin-bottom: 7px;
    padding: 7px 8px;
    border-radius: 7px;
    background: #020617;
    color: #f8fafc;
    font-size: 12px;
    font-weight: 900;
}
body.legacy-v70-option3 .route-selected-moment-grid { grid-template-columns: 1fr 1fr; }
body.legacy-v70-option3 .route-selected-moment-grid .legacy-context-box { min-width: 0; }
body.legacy-v70-option3 .route-event-filter-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    margin-bottom: 7px;
}
body.legacy-v70-option3 .route-event-filter-row button { margin: 0; min-height: 29px; padding: 5px 6px; font-size: 9px; }
body.legacy-v70-option3 .route-event-filter-row button:first-child { grid-column: 1 / -1; }
body.legacy-v70-option3 .route-event-filter-row button.active { background: #2563eb; color: #fff; }
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card { max-height: none; }
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-event-list { max-height: 300px; overflow: auto; }
body.legacy-v70-option3.legacy-context-route .route-event-row { grid-template-columns: 8px minmax(0,1fr); }
body.legacy-v70-option3.legacy-context-route .route-event-row time { grid-column: 2; font-size: 9px; }

body.legacy-v70-option3 .route-event-row.sos .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.sos { background: #dc2626; }
body.legacy-v70-option3 .route-event-row.alarm .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.alarm { background: #fb7185; }
body.legacy-v70-option3 .route-event-row.motion .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.motion { background: #f59e0b; }
body.legacy-v70-option3 .route-event-row.command .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.command { background: #14b8a6; }
body.legacy-v70-option3 .route-event-row.device .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.device { background: #6366f1; }

@media (max-width: 1320px) {
    body.legacy-v70-option3.legacy-context-route .route-workstation-player { grid-template-columns: minmax(300px, auto) 1fr auto; }
    body.legacy-v70-option3.legacy-context-route .route-workstation-follow { display: none; }
    body.legacy-v70-option3.legacy-context-route .route-workstation-legend span:nth-child(n+6) { display: none; }
}

/* =========================================================
   v80.27.2.5 – Route History playback polish + BAG labels
   ========================================================= */
body.legacy-v70-option3 .eview-house-number-label {
    background: transparent;
    border: 0;
    pointer-events: none;
}
body.legacy-v70-option3 .eview-house-number-label span {
    display: inline-block;
    transform: translate(-50%, -50%);
    padding: 1px 3px;
    border-radius: 3px;
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(15,23,42,.16);
    color: #0f172a;
    font-size: 10px;
    line-height: 1.15;
    font-weight: 800;
    white-space: nowrap;
    text-shadow: 0 1px 0 rgba(255,255,255,.9);
    box-shadow: 0 1px 2px rgba(15,23,42,.14);
}
body.legacy-v70-option3.legacy-context-route .route-workstation-headup {
    left: auto;
    right: 10px;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card {
    padding-top: 7px;
    padding-bottom: 7px;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-header {
    gap: 8px;
    margin-bottom: 4px;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-header h3 {
    margin: 0;
    font-size: 11px;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-header > strong {
    min-width: 26px;
    width: 26px;
    height: 26px;
    font-size: 11px;
    border-radius: 999px;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-event-list {
    max-height: 220px;
    gap: 3px;
    padding-right: 2px;
}
body.legacy-v70-option3.legacy-context-route .route-event-row {
    min-height: 40px;
    grid-template-columns: 6px minmax(0,1fr) auto;
    gap: 6px;
    padding: 5px 7px;
    border-radius: 6px;
    background: #17243a;
    border-color: rgba(148,163,184,.16);
    box-shadow: none;
}
body.legacy-v70-option3.legacy-context-route .route-event-row:hover,
body.legacy-v70-option3.legacy-context-route .route-event-row:focus-visible {
    background: #1e304d;
    border-color: rgba(96,165,250,.46);
}
body.legacy-v70-option3.legacy-context-route .route-event-row.active {
    background: rgba(37,99,235,.18);
    border-color: #3b82f6;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-dot {
    width: 6px;
    height: 6px;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main strong {
    font-size: 10px;
    line-height: 1.2;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main small {
    margin-top: 1px;
    font-size: 8px;
    line-height: 1.2;
}
body.legacy-v70-option3.legacy-context-route .route-event-row time {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    font-size: 8px;
    color: #94a3b8;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-marker.sos {
    background: #ef4444;
    box-shadow: 0 0 0 1px rgba(254,202,202,.35), 0 0 7px rgba(239,68,68,.55);
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-marker.alarm {
    background: #f97316;
    box-shadow: 0 0 0 1px rgba(254,215,170,.30), 0 0 6px rgba(249,115,22,.45);
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-marker.motion {
    background: #38bdf8;
    box-shadow: 0 0 0 1px rgba(186,230,253,.25);
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-marker.command {
    background: #06b6d4;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-marker.device {
    background: #8b5cf6;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.sos { background: #ef4444; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.alarm { background: #f97316; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.motion { background: #38bdf8; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.command { background: #06b6d4; }
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.device { background: #8b5cf6; }


/* =========================================================
   v80.27.2.6 – Timeline event lines + speed range + BAG zoom
   ========================================================= */
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-marker {
    top: 25px;
    bottom: auto;
    width: 2px;
    min-width: 2px;
    height: 12px;
    border: 0;
    border-radius: 0;
    transform: translateX(-1px);
    pointer-events: auto;
    box-shadow: 0 0 0 1px rgba(15,23,42,.18);
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-cluster {
    width: 2px;
    min-width: 2px;
    height: 12px;
    border-radius: 0;
    display: block;
    color: transparent;
    font-size: 0;
}
body.legacy-v70-option3.legacy-context-route .route-workstation-timeline-shell .route-timeline-cluster span { display: none; }
body.legacy-v70-option3 .route-event-row.sos .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.sos { background: #ef4444; }
body.legacy-v70-option3 .route-event-row.alarm .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.alarm { background: #dc2626; }
body.legacy-v70-option3 .route-event-row.motion .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.motion { background: #38bdf8; }
body.legacy-v70-option3 .route-event-row.command .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.command { background: #14b8a6; }
body.legacy-v70-option3 .route-event-row.device .route-event-row-dot,
body.legacy-v70-option3 .route-timeline-marker.device { background: #8b5cf6; }

/* =========================================================
   v80.27.2.7 – UI polish, BAG object highlight & readability
   ========================================================= */

/* BAG-bediening: duidelijk pill-model met tekst in de schakelaar. */
body.legacy-v70-option3 .legacy-v70-overlay-toggle input {
    width: 58px;
    height: 26px;
    border: 1px solid rgba(248,113,113,.55);
    background: rgba(185,28,28,.72);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.22);
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input::before {
    content: 'UIT';
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
    color: #fee2e2;
    font-size: 8px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .04em;
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input::after {
    width: 20px;
    height: 20px;
    left: 2px;
    top: 2px;
    background: #f8fafc;
    box-shadow: 0 1px 4px rgba(0,0,0,.38);
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input:checked {
    background: rgba(22,163,74,.82);
    border-color: rgba(74,222,128,.72);
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input:checked::before {
    content: 'AAN';
    left: 7px;
    right: auto;
    color: #dcfce7;
}
body.legacy-v70-option3 .legacy-v70-overlay-toggle input:checked::after { transform: translateX(32px); }

/* BAG-labels zijn klikbaar; het gekozen pand krijgt een contour in de objectlaag. */
body.legacy-v70-option3 .eview-house-number-label { pointer-events: auto; cursor: pointer; }
body.legacy-v70-option3 .eview-house-number-label span:hover,
body.legacy-v70-option3 .eview-house-number-label:focus span {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37,99,235,.18), 0 1px 3px rgba(15,23,42,.2);
}

/* Trackerstatus: offline is direct herkenbaar. */
body.legacy-v70-option3 .legacy-v70-device-badge.offline {
    background: #b91c1c;
    color: #fff;
}

/* Kaartstatus onder Overview blijft volledig binnen het werkvlak. */
body.legacy-v70-option3.legacy-context-device #overviewLiveWindow .overview-map-card {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-device .overview-map {
    height: 100%;
    min-height: 0;
}
body.legacy-v70-option3.legacy-context-device .overview-map-card > .muted {
    min-height: 30px;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    line-height: 1.25;
    overflow: visible;
    flex: 0 0 auto;
}

/* Route History: filterknoppen volgen de subtiele topnavigatie-stijl. */
body.legacy-v70-option3 .route-event-filter-row button {
    min-height: 27px;
    padding: 4px 7px;
    border: 1px solid #2a3950;
    border-radius: 8px;
    background: #18243a;
    color: #dbeafe;
    font-size: 9px;
    font-weight: 800;
    box-shadow: none;
}
body.legacy-v70-option3 .route-event-filter-row button:hover,
body.legacy-v70-option3 .route-event-filter-row button:focus-visible {
    background: #21314c;
    border-color: #3b82f6;
    color: #fff;
}
body.legacy-v70-option3 .route-event-filter-row button.active {
    background: #2563eb;
    border-color: #60a5fa;
    color: #fff;
}

/* Eventregels: rustigere knoppen en duidelijkere teksthiërarchie. */
body.legacy-v70-option3.legacy-context-route .route-event-row {
    min-height: 38px;
    background: #18243a;
    border: 1px solid #26364e;
    color: #e5edf8;
}
body.legacy-v70-option3.legacy-context-route .route-event-row:hover,
body.legacy-v70-option3.legacy-context-route .route-event-row:focus-visible {
    background: #202f48;
    border-color: #3b82f6;
}
body.legacy-v70-option3.legacy-context-route .route-event-row.active {
    background: #223a63;
    border-color: #60a5fa;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main strong {
    color: #f8fafc;
    font-family: inherit;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .005em;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main small {
    color: #9fb0c6;
    font-family: inherit;
    font-size: 8px;
    font-weight: 650;
}
body.legacy-v70-option3.legacy-context-route .route-event-row time {
    color: #b8c6d9;
    font-family: inherit;
    font-weight: 700;
}

/* Debug laadstatus: geen smalle verticale tegels, maar duidelijke label-waarde regels. */
body.legacy-v70-option3 .route-player-debug-card > summary {
    font-family: inherit;
    font-size: 11px;
    font-weight: 850;
    color: #f8fafc;
    cursor: pointer;
}
body.legacy-v70-option3 .route-player-debug-list {
    margin-top: 8px;
    display: grid;
    gap: 4px;
}
body.legacy-v70-option3 .route-player-debug-list > div {
    min-width: 0;
    min-height: 31px;
    padding: 6px 8px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    border: 1px solid #26364e;
    border-radius: 7px;
    background: #111c2f;
}
body.legacy-v70-option3 .route-player-debug-list span {
    min-width: 0;
    color: #aebed1;
    font-family: inherit;
    font-size: 9px;
    font-weight: 700;
    line-height: 1.2;
}
body.legacy-v70-option3 .route-player-debug-list strong {
    color: #f8fafc;
    font-family: inherit;
    font-size: 10px;
    font-weight: 900;
    line-height: 1.2;
    text-align: right;
    white-space: nowrap;
}

/* =========================================================
   v80.27.2.8 – Esri Satelliet + Route History event panel restyle
   ========================================================= */
/* Eventlijst volgt dezelfde rustige visuele taal als de compacte topnavigatie. */
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card {
    background: transparent;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-event-list {
    gap: 4px;
}
body.legacy-v70-option3.legacy-context-route .route-event-row {
    min-height: 38px;
    padding: 5px 8px;
    grid-template-columns: 3px minmax(0,1fr) auto;
    gap: 7px;
    border-radius: 8px;
    background: #162238;
    border: 1px solid #27364d;
    color: #dbeafe;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}
body.legacy-v70-option3.legacy-context-route .route-event-row:hover,
body.legacy-v70-option3.legacy-context-route .route-event-row:focus-visible {
    background: #1c2a42;
    border-color: #385174;
    color: #fff;
}
body.legacy-v70-option3.legacy-context-route .route-event-row.active {
    background: #1d2d48;
    border-color: #4c78b8;
    box-shadow: inset 3px 0 0 #3b82f6;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-dot {
    width: 3px;
    height: 100%;
    min-height: 24px;
    border-radius: 999px;
    align-self: stretch;
    margin: 0;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1px;
    text-align: left;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main strong {
    color: #f3f7fd;
    font-size: 9px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main small {
    color: #8fa2bb;
    font-size: 7.5px;
    font-weight: 650;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.legacy-v70-option3.legacy-context-route .route-event-row time {
    grid-column: 3;
    grid-row: 1;
    align-self: center;
    color: #9caec3;
    font-size: 7.5px;
    font-weight: 700;
    white-space: nowrap;
}
/* Eventteller rustiger, gelijk aan een compacte statuschip. */
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-header > strong {
    width: auto;
    min-width: 24px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    background: #162238;
    border: 1px solid #2c4667;
    color: #7dd3fc;
    font-size: 9px;
    box-shadow: none;
}


/* =========================================================
   v80.27.2.9 – Event Panel Final Restyle + v70.1 meter colours
   ========================================================= */
/* Definitieve Event-paneelstijl: voorkom dat algemene button-regels de eventregels cyaan/blauw maken. */
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card .route-event-list button.route-event-row {
    background-color: #162238 !important;
    background-image: none !important;
    border: 1px solid #2a3950 !important;
    color: #e5edf8 !important;
    filter: none !important;
    box-shadow: none !important;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card .route-event-list button.route-event-row:hover,
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card .route-event-list button.route-event-row:focus-visible {
    background-color: #1d2a40 !important;
    border-color: #415b7e !important;
    color: #fff !important;
    filter: none !important;
}
body.legacy-v70-option3.legacy-context-route .legacy-v70-context .route-player-events-card .route-event-list button.route-event-row.active {
    background-color: #1b2940 !important;
    border-color: #4f77aa !important;
    box-shadow: inset 3px 0 0 #3b82f6 !important;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main strong {
    color: #f8fafc !important;
    text-shadow: none !important;
}
body.legacy-v70-option3.legacy-context-route .route-event-row-main small {
    color: #a9b8ca !important;
    text-shadow: none !important;
}
body.legacy-v70-option3.legacy-context-route .route-event-row time {
    color: #b9c7d8 !important;
    text-shadow: none !important;
}

/* v70.1-signaalkleuren: kwaliteit bepaalt zowel actieve balkjes als de dBm/kwaliteitswaarde. */
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-excellent i { background: #22c55e !important; }
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-good i { background: #64748b !important; }
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-good i:nth-child(-n+3) { background: #eab308 !important; }
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-ok i { background: #64748b !important; }
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-ok i:nth-child(-n+2) { background: #f59e0b !important; }
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-bad i { background: #64748b !important; }
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-bad i:nth-child(1) { background: #ef4444 !important; }
body.legacy-v70-option3 .legacy-v70-signal-bars.quality-unknown i { background: #64748b !important; opacity: .45; }
body.legacy-v70-option3 .legacy-v70-signal-value.quality-excellent { color: #22c55e; }
body.legacy-v70-option3 .legacy-v70-signal-value.quality-good { color: #eab308; }
body.legacy-v70-option3 .legacy-v70-signal-value.quality-ok { color: #f59e0b; }
body.legacy-v70-option3 .legacy-v70-signal-value.quality-bad { color: #ef4444; }
body.legacy-v70-option3 .legacy-v70-signal-value.quality-unknown { color: var(--legacy-muted); }

/* v80.27.2.14 – Batterijtab passend in de v70.10 werkstijl */
body.legacy-v70-option3 .battery-overview-header,
body.legacy-v70-option3 .battery-overview-chart-card,
body.legacy-v70-option3 #contentArea > .card:has(.battery-overview-point-list) {
    margin-top: 8px;
    margin-bottom: 8px;
}
body.legacy-v70-option3 .battery-overview-metrics {
    margin: 8px 0;
    gap: 7px;
}
body.legacy-v70-option3 .battery-overview-metric {
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--legacy-box);
    border-color: var(--legacy-border);
    box-shadow: none;
}
body.legacy-v70-option3 .battery-overview-metric strong { font-size: 20px; }
body.legacy-v70-option3 .battery-overview-chart-box {
    min-height: 260px;
    background: #020617;
    border-color: var(--legacy-border);
    border-radius: 10px;
}
body.legacy-v70-option3 .battery-overview-empty { min-height: 250px; }
body.legacy-v70-option3 .battery-overview-point-list { max-height: 300px; }

/* ==========================================================
   v80.27.4.0 – compacte hoofdnavigatie met uitklapmenu's
   ========================================================== */
body.legacy-v70-option3 .legacy-v70-topbar {
    overflow: visible;
}

body.legacy-v70-option3 .legacy-v70-main-nav.sidebar {
    overflow: visible;
}

body.legacy-v70-option3 .legacy-nav-menu {
    position: relative;
    flex: 0 0 auto;
}

body.legacy-v70-option3 .legacy-nav-menu > .legacy-nav-trigger,
body.legacy-v70-option3 .legacy-v70-main-nav > .legacy-nav-direct {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

body.legacy-v70-option3 .legacy-nav-dropdown {
    position: absolute;
    top: calc(100% + 7px);
    left: 0;
    z-index: 120;
    min-width: 210px;
    max-height: min(70vh, 520px);
    overflow-y: auto;
    padding: 7px;
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 10px;
    background: #101827;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .34);
    display: none;
}

body.legacy-v70-option3 .legacy-nav-menu.open .legacy-nav-dropdown {
    display: grid;
    gap: 4px;
}

body.legacy-v70-option3 .legacy-v70-main-nav .legacy-nav-dropdown-item {
    width: 100%;
    min-height: 31px;
    justify-content: flex-start;
    text-align: left;
    padding: 7px 9px;
    border-radius: 7px;
    background: transparent !important;
    border-color: transparent !important;
    color: #dbeafe !important;
}

body.legacy-v70-option3 .legacy-v70-main-nav .legacy-nav-dropdown-item:hover {
    background: #22304a !important;
}

body.legacy-v70-option3 .legacy-v70-main-nav .legacy-nav-dropdown-item.active {
    background: rgba(47, 109, 246, .22) !important;
    border-color: rgba(96, 165, 250, .32) !important;
    color: #fff !important;
    box-shadow: none;
}

body.legacy-v70-option3 .legacy-nav-section-label {
    padding: 7px 8px 4px;
    color: #7f8da5;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .08em;
}

body.legacy-v70-option3 .legacy-nav-section-label:not(:first-child) {
    margin-top: 4px;
    padding-top: 9px;
    border-top: 1px solid rgba(148, 163, 184, .14);
}

body.legacy-v70-option3 .legacy-v70-all-trackers {
    width: 100%;
    margin: 0 0 7px;
    padding: 8px 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-radius: 9px;
    border: 1px solid rgba(148, 163, 184, .13);
    background: #111b2b;
    color: #dbeafe;
    text-align: left;
}

body.legacy-v70-option3 .legacy-v70-all-trackers:hover {
    background: #1c2a40;
}

body.legacy-v70-option3 .legacy-v70-all-trackers.active {
    background: linear-gradient(180deg, #2f6df6, #2559d8);
    border-color: rgba(147, 197, 253, .42);
    color: #fff;
}

body.legacy-v70-option3 .legacy-v70-all-trackers strong {
    font-size: 10.5px;
}

body.legacy-v70-option3 .legacy-v70-all-trackers span {
    color: #94a3b8;
    font-size: 9px;
}

body.legacy-v70-option3 .legacy-v70-all-trackers.active span {
    color: #dbeafe;
}

body.legacy-v70-option3 .overview-focus-toolbar {
    align-items: flex-start;
}

body.legacy-v70-option3 .overview-live-actions {
    align-items: center;
}


@media (max-width: 1180px) {
    body.legacy-v70-option3 .legacy-nav-dropdown {
        min-width: 190px;
    }
}

/* ==========================================================
   v80.27.5.0 – beheer-dropdown boven kaartlagen + trackerbeheer
   ========================================================== */
body.legacy-v70-option3 .legacy-v70-topbar {
    position: relative;
    z-index: 2000;
}

body.legacy-v70-option3 .legacy-v70-main-nav.sidebar {
    position: relative;
    z-index: 2001;
}

body.legacy-v70-option3 .legacy-nav-menu.open {
    z-index: 2002;
}

body.legacy-v70-option3 .legacy-nav-dropdown {
    z-index: 2003;
}

body.legacy-v70-option3 .tracker-visibility-summary,
body.legacy-v70-option3 .tracker-management-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

body.legacy-v70-option3 .tracker-visibility-summary h2,
body.legacy-v70-option3 .tracker-management-heading h2 {
    margin-bottom: 4px;
}

body.legacy-v70-option3 .tracker-visibility-summary p,
body.legacy-v70-option3 .tracker-management-heading p {
    margin: 0;
}

body.legacy-v70-option3 .tracker-visibility-kpis {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

body.legacy-v70-option3 .tracker-visibility-kpis span {
    min-width: 92px;
    padding: 8px 10px;
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 9px;
    background: var(--legacy-box);
    text-align: center;
    font-size: 10px;
}

body.legacy-v70-option3 .tracker-visibility-kpis strong {
    display: block;
    font-size: 16px;
    line-height: 1.1;
}

body.legacy-v70-option3 .tracker-management-table-wrap {
    margin-top: 10px;
}

body.legacy-v70-option3 .tracker-management-table tr.tracker-hidden-row td {
    background: rgba(245, 158, 11, .035);
}

body.legacy-v70-option3 .tracker-visibility-switch {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    font-weight: 800;
    white-space: nowrap;
}

body.legacy-v70-option3 .tracker-visibility-switch input {
    width: 16px;
    height: 16px;
    margin: 0;
}

body.legacy-v70-option3 .tracker-user-access-card code {
    color: #93c5fd;
}

@media (max-width: 1050px) {
    body.legacy-v70-option3 .tracker-visibility-summary,
    body.legacy-v70-option3 .tracker-management-heading {
        align-items: stretch;
        flex-direction: column;
    }

    body.legacy-v70-option3 .tracker-visibility-kpis {
        justify-content: flex-start;
    }
}

/* ==========================================================
   v80.27.7.0 – compacte alarmverwerking per tracker
   ========================================================== */
body.legacy-v70-option3 .tracker-alarm-processing-card {
    overflow: hidden;
}

body.legacy-v70-option3 .tracker-alarm-processing-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
}

body.legacy-v70-option3 .tracker-alarm-processing-summary::-webkit-details-marker {
    display: none;
}

body.legacy-v70-option3 .tracker-alarm-processing-summary::after {
    content: '▾';
    color: var(--legacy-muted);
    font-size: 15px;
    transition: transform .16s ease;
}

body.legacy-v70-option3 .tracker-alarm-processing-card[open] .tracker-alarm-processing-summary::after {
    transform: rotate(180deg);
}

body.legacy-v70-option3 .tracker-alarm-processing-summary h2 {
    margin: 0 0 2px;
}

body.legacy-v70-option3 .tracker-alarm-processing-summary p {
    margin: 0;
}

body.legacy-v70-option3 .tracker-alarm-processing-summary-status {
    margin-left: auto;
    white-space: nowrap;
    font-size: 10px;
    font-weight: 800;
}

body.legacy-v70-option3 .tracker-alarm-processing-body {
    padding: 0 14px 14px;
    border-top: 1px solid rgba(148, 163, 184, .14);
}

body.legacy-v70-option3 .tracker-alarm-processing-toolbar,
body.legacy-v70-option3 .tracker-alarm-processing-footer {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}

body.legacy-v70-option3 .tracker-alarm-processing-toolbar {
    padding: 10px 0;
}

body.legacy-v70-option3 .tracker-alarm-processing-toolbar label {
    min-width: 240px;
    margin: 0;
}

body.legacy-v70-option3 .tracker-alarm-processing-bulk-actions {
    margin: 0;
}

body.legacy-v70-option3 .tracker-alarm-processing-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

body.legacy-v70-option3 .tracker-alarm-processing-item {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    margin: 0;
    padding: 7px 9px;
    border: 1px solid rgba(148, 163, 184, .15);
    border-left: 3px solid rgba(96, 165, 250, .72);
    border-radius: 8px;
    background: var(--legacy-box);
    cursor: pointer;
}

body.legacy-v70-option3 .tracker-alarm-processing-item.severity-critical {
    border-left-color: rgba(248, 113, 113, .9);
}

body.legacy-v70-option3 .tracker-alarm-processing-item.severity-warning {
    border-left-color: rgba(251, 191, 36, .9);
}

body.legacy-v70-option3 .tracker-alarm-processing-item.is-disabled {
    opacity: .62;
}

body.legacy-v70-option3 .tracker-alarm-processing-item input {
    width: 15px;
    height: 15px;
    margin: 0;
}

body.legacy-v70-option3 .tracker-alarm-processing-copy {
    min-width: 0;
}

body.legacy-v70-option3 .tracker-alarm-processing-copy strong,
body.legacy-v70-option3 .tracker-alarm-processing-copy small {
    display: block;
}

body.legacy-v70-option3 .tracker-alarm-processing-copy strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10.5px;
}

body.legacy-v70-option3 .tracker-alarm-processing-copy small {
    color: var(--legacy-muted);
    font-size: 8.5px;
}

body.legacy-v70-option3 .tracker-alarm-processing-state {
    white-space: nowrap;
    color: var(--legacy-muted);
    font-size: 8.5px;
    font-weight: 800;
}

body.legacy-v70-option3 .tracker-alarm-processing-footer {
    margin-top: 10px;
}

body.legacy-v70-option3 .tracker-alarm-processing-footer p {
    max-width: 760px;
    margin: 0;
}

@media (max-width: 1220px) {
    body.legacy-v70-option3 .tracker-alarm-processing-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    body.legacy-v70-option3 .tracker-alarm-processing-summary,
    body.legacy-v70-option3 .tracker-alarm-processing-toolbar,
    body.legacy-v70-option3 .tracker-alarm-processing-footer {
        align-items: stretch;
        flex-direction: column;
    }

    body.legacy-v70-option3 .tracker-alarm-processing-summary-status {
        margin-left: 0;
    }

    body.legacy-v70-option3 .tracker-alarm-processing-toolbar label {
        min-width: 0;
    }

    body.legacy-v70-option3 .tracker-alarm-processing-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================
   v80.27.8.0 – compacte Gebruikers & rechten werkruimte
   ========================================================== */
body.legacy-v70-option3 .access-management-workspace {
    display: grid;
    gap: 8px;
    min-height: 0;
}
body.legacy-v70-option3 .access-management-section {
    margin: 0;
    border: 1px solid #24324a;
    border-radius: 12px;
    background: #0f172a;
    overflow: hidden;
}
body.legacy-v70-option3 .access-management-section > summary {
    min-height: 42px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    cursor: pointer;
    list-style: none;
    background: #111c31;
    border-bottom: 1px solid transparent;
}
body.legacy-v70-option3 .access-management-section[open] > summary {
    border-bottom-color: #24324a;
}
body.legacy-v70-option3 .access-management-section > summary::-webkit-details-marker { display: none; }
body.legacy-v70-option3 .access-management-section > summary::before {
    content: '▸';
    color: #60a5fa;
    font-size: 12px;
    font-weight: 900;
}
body.legacy-v70-option3 .access-management-section[open] > summary::before { content: '▾'; }
body.legacy-v70-option3 .access-management-section > summary > span:first-of-type {
    min-width: 0;
    flex: 1;
}
body.legacy-v70-option3 .access-management-section > summary strong,
body.legacy-v70-option3 .access-management-section > summary small { display: block; }
body.legacy-v70-option3 .access-management-section > summary strong { font-size: 13px; }
body.legacy-v70-option3 .access-management-section > summary small {
    margin-top: 2px;
    color: #94a3b8;
    font-size: 9px;
}
body.legacy-v70-option3 .access-summary-meta {
    flex: 0 0 auto;
    color: #cbd5e1;
    font-size: 9px;
    font-weight: 800;
}
body.legacy-v70-option3 .access-management-section-body { padding: 8px; }
body.legacy-v70-option3 .access-split {
    height: min(560px, calc(100vh - 190px));
    min-height: 390px;
    display: grid;
    grid-template-columns: minmax(235px, 30%) minmax(0, 1fr);
    gap: 8px;
    overflow: hidden;
}
body.legacy-v70-option3 .access-role-split { height: min(620px, calc(100vh - 190px)); }
body.legacy-v70-option3 .access-list-pane,
body.legacy-v70-option3 .access-editor-pane {
    min-width: 0;
    min-height: 0;
    border: 1px solid #24324a;
    border-radius: 10px;
    background: #0b1323;
    overflow: hidden;
}
body.legacy-v70-option3 .access-list-pane {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}
body.legacy-v70-option3 .access-editor-pane {
    display: block;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
}
body.legacy-v70-option3 .access-list-toolbar {
    padding: 7px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
    border-bottom: 1px solid #24324a;
    background: #101a2d;
}
body.legacy-v70-option3 .access-list-toolbar input,
body.legacy-v70-option3 .access-list-toolbar select,
body.legacy-v70-option3 .access-list-toolbar button {
    min-height: 30px;
    margin: 0;
    padding: 5px 8px;
    font-size: 10px;
}
body.legacy-v70-option3 .access-list-toolbar input { grid-column: 1 / -1; }
body.legacy-v70-option3 .access-list-toolbar-role { grid-template-columns: minmax(0, 1fr) auto; }
body.legacy-v70-option3 .access-list-toolbar-role input { grid-column: auto; }
body.legacy-v70-option3 .access-entity-list {
    min-height: 0;
    overflow: auto;
    padding: 5px;
    display: grid;
    align-content: start;
    gap: 4px;
    scrollbar-width: thin;
}
body.legacy-v70-option3 .access-entity-row {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    margin: 0;
    padding: 7px 8px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #18243a;
    color: #fff;
    text-align: left;
    box-shadow: none;
}
body.legacy-v70-option3 .access-entity-row:hover { background: #202f48; }
body.legacy-v70-option3 .access-entity-row.selected {
    border-color: #3b82f6;
    background: #1d3152;
    box-shadow: inset 3px 0 0 #3b82f6;
}
body.legacy-v70-option3 .access-entity-main,
body.legacy-v70-option3 .access-entity-side { min-width: 0; }
body.legacy-v70-option3 .access-entity-main strong,
body.legacy-v70-option3 .access-entity-main small,
body.legacy-v70-option3 .access-entity-side span,
body.legacy-v70-option3 .access-entity-side em { display: block; }
body.legacy-v70-option3 .access-entity-main strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
}
body.legacy-v70-option3 .access-entity-main small {
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #94a3b8;
    font-size: 8.5px;
}
body.legacy-v70-option3 .access-entity-side { text-align: right; }
body.legacy-v70-option3 .access-entity-side span,
body.legacy-v70-option3 .access-entity-side em { font-size: 8.5px; }
body.legacy-v70-option3 .access-entity-side span { color: #cbd5e1; }
body.legacy-v70-option3 .access-entity-side em { margin-top: 2px; color: #94a3b8; font-style: normal; }
body.legacy-v70-option3 .access-status-active { color: #4ade80 !important; }
body.legacy-v70-option3 .access-status-inactive { color: #fbbf24 !important; }
body.legacy-v70-option3 .access-status-archived { color: #94a3b8 !important; }
body.legacy-v70-option3 .access-editor-header {
    min-height: 58px;
    padding: 8px 10px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #24324a;
    background: #101a2d;
}
body.legacy-v70-option3 .access-editor-header h2 { margin: 1px 0 2px; font-size: 15px; }
body.legacy-v70-option3 .access-editor-header p { margin: 0; color: #94a3b8; font-size: 9px; }
body.legacy-v70-option3 .access-eyebrow {
    color: #60a5fa;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}
body.legacy-v70-option3 .access-compact-form,
body.legacy-v70-option3 .access-role-header-form {
    padding: 8px 10px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}
body.legacy-v70-option3 .access-compact-form label,
body.legacy-v70-option3 .access-role-header-form label,
body.legacy-v70-option3 .access-reset-password-form label {
    margin: 0;
    color: #cbd5e1;
    font-size: 9px;
}
body.legacy-v70-option3 .access-compact-form input,
body.legacy-v70-option3 .access-compact-form select,
body.legacy-v70-option3 .access-role-header-form input,
body.legacy-v70-option3 .access-reset-password-form input {
    min-height: 30px;
    margin: 3px 0 0;
    padding: 5px 7px;
    font-size: 10px;
}
body.legacy-v70-option3 .access-field-help {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 8px;
    line-height: 1.25;
}
body.legacy-v70-option3 .access-compact-form input[aria-invalid="true"],
body.legacy-v70-option3 .access-compact-form select[aria-invalid="true"] {
    border-color: #f87171;
    box-shadow: 0 0 0 2px rgba(248,113,113,.16);
}
body.legacy-v70-option3 .access-form-feedback {
    grid-column: 1 / -1;
    padding: 7px 8px;
    border: 1px solid rgba(248,113,113,.52);
    border-radius: 8px;
    background: rgba(127,29,29,.18);
    color: #fecaca;
    font-size: 9px;
    line-height: 1.4;
}
body.legacy-v70-option3 .access-inline-check {
    min-height: 30px;
    padding: 5px 7px;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #24324a;
    border-radius: 8px;
    background: #111827;
}
body.legacy-v70-option3 .access-inline-check input { min-height: auto; margin: 0; }
body.legacy-v70-option3 .access-form-spacer { min-height: 1px; }
body.legacy-v70-option3 .access-editor-subsection {
    margin: 0 8px 7px;
    border: 1px solid #24324a;
    border-radius: 9px;
    overflow: hidden;
    background: #0f172a;
}
body.legacy-v70-option3 .access-editor-subsection > summary {
    min-height: 34px;
    padding: 6px 8px;
    display: flex;
    align-items: center;
    cursor: pointer;
    list-style: none;
    background: #131f34;
}
body.legacy-v70-option3 .access-editor-subsection > summary::-webkit-details-marker { display: none; }
body.legacy-v70-option3 .access-editor-subsection > summary::before { content: '▸'; margin-right: 7px; color: #60a5fa; }
body.legacy-v70-option3 .access-editor-subsection[open] > summary::before { content: '▾'; }
body.legacy-v70-option3 .access-editor-subsection > summary strong,
body.legacy-v70-option3 .access-editor-subsection > summary small { display: block; }
body.legacy-v70-option3 .access-editor-subsection > summary strong { font-size: 10px; }
body.legacy-v70-option3 .access-editor-subsection > summary small { margin-top: 1px; color: #94a3b8; font-size: 8px; }
body.legacy-v70-option3 .access-editor-subsection-body { padding: 7px; }
body.legacy-v70-option3 .access-tracker-assignment-toolbar {
    margin-bottom: 6px;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    font-size: 9px;
}
body.legacy-v70-option3 .access-tracker-assignment-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
}
body.legacy-v70-option3 .access-tracker-assignment-row {
    min-width: 0;
    margin: 0;
    padding: 6px 7px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(92px, 32%);
    gap: 7px;
    align-items: center;
    border: 1px solid #24324a;
    border-radius: 8px;
    background: #111827;
}
body.legacy-v70-option3 .access-tracker-assignment-row.is-hidden { border-color: rgba(245,158,11,.46); }
body.legacy-v70-option3 .access-tracker-assignment-row span { min-width: 0; }
body.legacy-v70-option3 .access-tracker-assignment-row strong,
body.legacy-v70-option3 .access-tracker-assignment-row small { display: block; }
body.legacy-v70-option3 .access-tracker-assignment-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 9px;
}
body.legacy-v70-option3 .access-tracker-assignment-row small { color: #94a3b8; font-size: 7.5px; }
body.legacy-v70-option3 .access-tracker-assignment-row select { min-height: 27px; margin: 0; padding: 4px 5px; font-size: 9px; }
body.legacy-v70-option3 .access-reset-password-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto auto auto;
    gap: 7px;
    align-items: end;
}
body.legacy-v70-option3 .access-editor-actions {
    position: sticky;
    bottom: 0;
    z-index: 4;
    min-height: 44px;
    padding: 7px 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-top: 1px solid #24324a;
    background: rgba(11,19,35,.97);
    backdrop-filter: blur(8px);
}
body.legacy-v70-option3 .access-editor-actions button { min-height: 30px; margin: 0; padding: 5px 9px; font-size: 10px; }
body.legacy-v70-option3 .access-note,
body.legacy-v70-option3 .access-empty {
    padding: 8px;
    border-radius: 8px;
    background: #111827;
    color: #94a3b8;
    font-size: 9px;
}
body.legacy-v70-option3 .access-note.ok { color: #86efac; }
body.legacy-v70-option3 .access-empty.large { margin: 10px; min-height: 90px; display: grid; place-items: center; text-align: center; }
body.legacy-v70-option3 .access-role-header-form { grid-template-columns: minmax(180px, 32%) minmax(0, 1fr); }
body.legacy-v70-option3 .access-permission-toolbar {
    padding: 7px 10px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 34%);
    gap: 10px;
    align-items: center;
    border-top: 1px solid #24324a;
    border-bottom: 1px solid #24324a;
    background: #0e1829;
}
body.legacy-v70-option3 .access-permission-toolbar strong,
body.legacy-v70-option3 .access-permission-toolbar span { display: block; }
body.legacy-v70-option3 .access-permission-toolbar strong { font-size: 10px; }
body.legacy-v70-option3 .access-permission-toolbar span { margin-top: 2px; color: #94a3b8; font-size: 8px; }
body.legacy-v70-option3 .access-permission-toolbar input { min-height: 29px; margin: 0; padding: 5px 7px; font-size: 9px; }
body.legacy-v70-option3 .access-permission-pages {
    padding: 7px;
    display: grid;
    gap: 5px;
}
body.legacy-v70-option3 .access-page-permission {
    border: 1px solid #24324a;
    border-radius: 8px;
    background: #111827;
    overflow: hidden;
}
body.legacy-v70-option3 .access-page-permission > summary {
    min-height: 38px;
    padding: 5px 7px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: center;
    cursor: pointer;
    list-style: none;
}
body.legacy-v70-option3 .access-page-permission > summary::-webkit-details-marker { display: none; }
body.legacy-v70-option3 .access-page-summary-title strong,
body.legacy-v70-option3 .access-page-summary-title small { display: block; }
body.legacy-v70-option3 .access-page-summary-title strong { font-size: 10px; }
body.legacy-v70-option3 .access-page-summary-title small { margin-top: 1px; color: #94a3b8; font-size: 7.5px; }
body.legacy-v70-option3 .access-page-summary-count { color: #cbd5e1; font-size: 8px; font-weight: 800; }
body.legacy-v70-option3 .access-page-gate {
    min-width: 78px;
    min-height: 25px;
    margin: 0;
    padding: 3px 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid #475569;
    border-radius: 999px;
    background: #1e293b;
    color: #cbd5e1;
    font-size: 8px;
    font-weight: 900;
}
body.legacy-v70-option3 .access-page-gate input { margin: 0; }
body.legacy-v70-option3 .access-page-gate.on { border-color: rgba(74,222,128,.5); color: #86efac; background: rgba(22,163,74,.13); }
body.legacy-v70-option3 .access-page-gate.off { border-color: rgba(248,113,113,.42); color: #fca5a5; background: rgba(185,28,28,.12); }
body.legacy-v70-option3 .access-page-gate.neutral { min-width: 118px; color: #94a3b8; }
body.legacy-v70-option3 .access-page-permission-body { padding: 6px; border-top: 1px solid #24324a; }
body.legacy-v70-option3 .access-page-permission-body.page-disabled { opacity: .58; }
body.legacy-v70-option3 .access-page-permission-actions {
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #94a3b8;
    font-size: 8px;
}
body.legacy-v70-option3 .access-page-permission-actions button { min-height: 25px; margin: 0; padding: 3px 6px; font-size: 8px; }
body.legacy-v70-option3 .access-page-rights-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
}
body.legacy-v70-option3 .access-permission-row {
    min-width: 0;
    min-height: 43px;
    margin: 0;
    padding: 5px 6px;
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: 6px;
    align-items: center;
    border: 1px solid #24324a;
    border-radius: 7px;
    background: #0c1526;
}
body.legacy-v70-option3 .access-permission-row.active { border-color: rgba(74,222,128,.32); background: rgba(22,163,74,.055); }
body.legacy-v70-option3 .access-permission-row > input { position: absolute; opacity: 0; pointer-events: none; }
body.legacy-v70-option3 .access-mini-switch {
    width: 31px;
    height: 18px;
    padding: 2px;
    border: 1px solid #475569;
    border-radius: 999px;
    background: #1e293b;
}
body.legacy-v70-option3 .access-mini-switch i {
    display: block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #94a3b8;
    transition: transform .14s ease, background .14s ease;
}
body.legacy-v70-option3 .access-permission-row input:checked + .access-mini-switch { border-color: #22c55e; background: rgba(22,163,74,.18); }
body.legacy-v70-option3 .access-permission-row input:checked + .access-mini-switch i { transform: translateX(13px); background: #4ade80; }
body.legacy-v70-option3 .access-permission-row span:nth-of-type(2) { min-width: 0; }
body.legacy-v70-option3 .access-permission-row strong,
body.legacy-v70-option3 .access-permission-row small { display: block; }
body.legacy-v70-option3 .access-permission-row strong { font-size: 8.5px; }
body.legacy-v70-option3 .access-permission-row small { margin-top: 1px; color: #94a3b8; font-size: 7px; line-height: 1.2; }
body.legacy-v70-option3 .access-permission-row code { display: none; }

/* De bestaande oude selector richtte zich nog op #overviewLiveWindow/.overview-map-card.
   Het huidige Overzicht gebruikt #trackerOverviewPage/.overview-fleet-map-card. Door
   titel + werkvlak expliciet in de beschikbare contenthoogte te plaatsen blijft de
   kaartstatus onderaan volledig leesbaar zonder de titel of kaartlayout te wijzigen. */
body.legacy-v70-option3.legacy-context-device #contentArea:has(> #trackerOverviewPage) {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 8px;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-device #contentArea:has(> #trackerOverviewPage) > h1 {
    margin: 0;
}
body.legacy-v70-option3.legacy-context-device #contentArea:has(> #trackerOverviewPage) > #trackerOverviewPage {
    height: 100%;
    min-height: 0;
}
body.legacy-v70-option3.legacy-context-device .overview-fleet-map-card > #overviewMapStatus,
body.legacy-v70-option3.legacy-context-device .overview-fleet-map-card > #overviewLocationRefreshStatus {
    min-height: 28px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    line-height: 1.25;
    overflow: visible;
}

@media (max-width: 1180px) {
    body.legacy-v70-option3 .access-split {
        height: auto;
        min-height: 0;
        grid-template-columns: 1fr;
        overflow: visible;
    }
    body.legacy-v70-option3 .access-list-pane { max-height: 280px; }
    body.legacy-v70-option3 .access-editor-pane { max-height: none; }
    body.legacy-v70-option3 .access-tracker-assignment-grid,
    body.legacy-v70-option3 .access-page-rights-grid { grid-template-columns: 1fr; }
    body.legacy-v70-option3 .access-compact-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ==========================================================
   v80.27.9.3 – Platform & Verbindingen tabs volgen exact de
   visuele taal van de compacte hoofdnavigatie.
   ========================================================== */
body.legacy-v70-option3 .platform-settings-tabbar {
    gap: 4px;
    margin: 8px 0 10px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

body.legacy-v70-option3 .platform-settings-tabbar .settings-tab {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    min-height: 28px;
    padding: 5px 9px;
    border-radius: 8px;
    background: #182235 !important;
    color: #dbeafe !important;
    border: 1px solid rgba(148, 163, 184, .10) !important;
    outline: 0;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: -.05px;
    white-space: nowrap;
    box-shadow: none;
    filter: none;
}

body.legacy-v70-option3 .platform-settings-tabbar .settings-tab:hover,
body.legacy-v70-option3 .platform-settings-tabbar .settings-tab:focus-visible {
    background: #25344d !important;
    color: #dbeafe !important;
    border-color: rgba(148, 163, 184, .10) !important;
    filter: none;
}

body.legacy-v70-option3 .platform-settings-tabbar .settings-tab.active,
body.legacy-v70-option3 .platform-settings-tabbar .settings-tab.active:hover,
body.legacy-v70-option3 .platform-settings-tabbar .settings-tab.active:focus-visible {
    background: linear-gradient(180deg, #2f6df6, #2559d8) !important;
    color: #fff !important;
    border-color: rgba(147, 197, 253, .42) !important;
    outline: 0 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
    filter: none;
}

/* v80.27.11.0 - compacte lokale systeemanalyse en incidentvoorbereiding */
body.legacy-v70-option3 .system-analysis-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
body.legacy-v70-option3 .system-analysis-heading h3 { margin: 0; }
body.legacy-v70-option3 .system-analysis-engine {
    color: var(--legacy-muted);
    font-size: 8px;
    line-height: 1.2;
    text-align: right;
}
body.legacy-v70-option3 .system-analysis-state {
    display: grid;
    gap: 5px;
    padding: 10px;
    border: 1px solid #334155;
    border-radius: 10px;
    background: #111827;
}
body.legacy-v70-option3 .system-analysis-state strong {
    color: #e5e7eb;
    font-size: 11px;
}
body.legacy-v70-option3 .system-analysis-state span {
    color: #cbd5e1;
    font-size: 10px;
    line-height: 1.45;
}
body.legacy-v70-option3 .system-analysis-state.ok { border-color: rgba(34,197,94,.42); }
body.legacy-v70-option3 .system-analysis-state.warn { border-color: rgba(245,158,11,.48); }
body.legacy-v70-option3 .system-analysis-state.error { border-color: rgba(239,68,68,.52); }
body.legacy-v70-option3 .system-analysis-item {
    display: grid;
    gap: 3px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(148,163,184,.12);
}
body.legacy-v70-option3 .system-analysis-item small {
    color: var(--legacy-muted);
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: .04em;
}
body.legacy-v70-option3 .system-analysis-item strong,
body.legacy-v70-option3 .system-analysis-item span {
    color: #dbeafe;
    font-size: 10px;
    line-height: 1.4;
}
body.legacy-v70-option3 .system-analysis-confidence {
    margin-top: 8px;
    color: var(--legacy-muted);
    font-size: 9px;
}
body.legacy-v70-option3 .system-analysis-confidence strong { color: #e5e7eb; }
body.legacy-v70-option3 .system-incident-section {
    padding-top: 15px;
    border-top: 1px solid rgba(148,163,184,.18);
}
body.legacy-v70-option3 .system-incident-id {
    margin-bottom: 7px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .02em;
}
body.legacy-v70-option3 .system-incident-preparation {
    margin-top: 8px;
    padding: 8px 9px;
    border-radius: 8px;
    background: #111827;
    color: #cbd5e1;
    font-size: 9px;
    line-height: 1.35;
}
body.legacy-v70-option3 .system-incident-preparation.ready { color: #22c55e; }
body.legacy-v70-option3 .system-incident-preparation.error { color: #ef4444; }
body.legacy-v70-option3 .system-incident-actions { grid-template-columns: 1fr; }

/* v80.27.12.0 - handmatige AI-overdracht zonder API of automatische datatransfer */
body.legacy-v70-option3 .system-ai-handoff {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    padding: 10px;
    border: 1px solid rgba(96,165,250,.24);
    border-radius: 10px;
    background: rgba(15,23,42,.62);
}
body.legacy-v70-option3 .system-ai-handoff-head {
    display: grid;
    gap: 2px;
}
body.legacy-v70-option3 .system-ai-handoff-head strong {
    color: #e5e7eb;
    font-size: 10px;
}
body.legacy-v70-option3 .system-ai-handoff-head span {
    color: var(--legacy-muted);
    font-size: 8px;
    line-height: 1.3;
}
body.legacy-v70-option3 .system-ai-destination-label {
    color: var(--legacy-muted);
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: .04em;
}
body.legacy-v70-option3 .system-ai-destination-select {
    width: 100%;
    min-height: 34px;
    padding: 7px 9px;
    border: 1px solid #334155;
    border-radius: 8px;
    background: #111827;
    color: #e5e7eb;
    font-size: 10px;
}
body.legacy-v70-option3 .system-ai-open-button {
    width: 100%;
    min-height: 36px;
    padding: 8px 9px;
    font-size: 10px;
}
body.legacy-v70-option3 .system-ai-privacy-note {
    padding: 8px;
    font-size: 8px;
}


/* ==========================================================
   v80.27.12.1 – Overzicht consistent, viewercontext rechts en
   dezelfde compacte visuele taal als Platform & Verbindingen.
   ========================================================== */
body.legacy-v70-option3.legacy-context-overview .overview-fleet-shell {
    height: calc(100% - 2px);
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-overview .overview-fleet-shell > .overview-kpi-grid,
body.legacy-v70-option3.legacy-context-overview .overview-fleet-shell > .overview-latest-events-card {
    display: none !important;
}
body.legacy-v70-option3.legacy-context-overview .overview-fleet-map-card {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-context-overview .overview-fleet-map {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    border-radius: 0;
}
body.legacy-v70-option3.legacy-context-overview .overview-fleet-map-card > .muted {
    flex: 0 0 auto;
    margin: 0;
    padding: 6px 10px;
    background: #0f172a;
}

body.legacy-v70-option3 #trackerOverviewPage .overview-fleet-map-card {
    border: 1px solid #24324a;
    border-radius: 10px;
    background: #0f172a;
    box-shadow: none;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-focus-toolbar {
    display: flex !important;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0;
    padding: 7px 8px;
    border-bottom: 1px solid #24324a;
    background: #0e1829;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-focus-toolbar > div:first-child {
    min-width: 120px;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-focus-toolbar .overview-eyebrow {
    font-size: 8px;
    letter-spacing: .08em;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-focus-toolbar h2 {
    margin: 1px 0 0;
    font-size: 12px;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px;
    margin: 0;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions button,
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions .live-follow-toggle {
    width: auto;
    min-height: 28px;
    margin: 0;
    padding: 5px 9px;
    border: 1px solid rgba(148,163,184,.10) !important;
    border-radius: 8px;
    background: #182235 !important;
    color: #dbeafe !important;
    box-shadow: none;
    filter: none;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions button:hover:not(:disabled),
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions .live-follow-toggle:hover {
    background: #25344d !important;
    color: #dbeafe !important;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions button:disabled,
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions .live-follow-toggle:has(input:disabled) {
    opacity: .42;
    cursor: default;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions .live-follow-toggle {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions .live-follow-toggle:has(input:checked:not(:disabled)) {
    background: linear-gradient(180deg, #2f6df6, #2559d8) !important;
    color: #fff !important;
    border-color: rgba(147,197,253,.42) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}
body.legacy-v70-option3 #trackerOverviewPage .overview-live-actions .live-follow-toggle input {
    width: 13px;
    height: 13px;
    min-height: 0;
    margin: 0;
}

body.legacy-v70-option3 .overview-viewer-status-grid {
    grid-template-columns: 1fr 1fr;
}
body.legacy-v70-option3 .overview-viewer-status-wide {
    grid-column: 1 / -1;
}
body.legacy-v70-option3 .overview-viewer-context .legacy-context-box {
    border: 1px solid rgba(148,163,184,.08);
    background: #182235;
    box-shadow: none;
}
body.legacy-v70-option3 .overview-viewer-context .legacy-context-box .value {
    font-size: 10px;
}

/* v80.27.14.0 - compacte systeemincident-pushstatus */
body.legacy-v70-option3 .system-push-section {
    padding-top: 13px;
    border-top: 1px solid rgba(148,163,184,.18);
}
body.legacy-v70-option3 .system-push-meta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 10px;
    margin-top: 9px;
    padding: 8px 9px;
    border: 1px solid rgba(148,163,184,.14);
    border-radius: 8px;
    background: rgba(15,23,42,.52);
}
body.legacy-v70-option3 .system-push-meta span {
    color: var(--legacy-muted);
    font-size: 8px;
}
body.legacy-v70-option3 .system-push-meta strong {
    color: #dbeafe;
    font-size: 9px;
    text-align: right;
    overflow-wrap: anywhere;
}
body.legacy-v70-option3 .system-push-actions {
    grid-template-columns: 1fr;
    margin-top: 9px;
}
body.legacy-v70-option3 .system-push-actions button {
    width: 100%;
    min-height: 34px;
    padding: 7px 9px;
    font-size: 9px;
}

/* v80.27.14.1 - blijvende end-to-end pushdiagnose */
body.legacy-v70-option3 .system-push-test-result {
    margin-top: 9px;
    padding: 9px;
    border: 1px solid rgba(148,163,184,.18);
    border-radius: 8px;
    background: rgba(15,23,42,.58);
}
body.legacy-v70-option3 .system-push-test-result.ok {
    border-color: rgba(34,197,94,.35);
    background: rgba(20,83,45,.18);
}
body.legacy-v70-option3 .system-push-test-result.warn {
    border-color: rgba(245,158,11,.38);
    background: rgba(120,53,15,.16);
}
body.legacy-v70-option3 .system-push-test-result.error {
    border-color: rgba(239,68,68,.4);
    background: rgba(127,29,29,.17);
}
body.legacy-v70-option3 .system-push-test-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}
body.legacy-v70-option3 .system-push-test-head strong {
    color: #e2e8f0;
    font-size: 9px;
}
body.legacy-v70-option3 .system-push-test-head span {
    max-width: 45%;
    color: var(--legacy-muted);
    font-size: 7px;
    text-align: right;
    overflow-wrap: anywhere;
}
body.legacy-v70-option3 .system-push-test-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 10px;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1px solid rgba(148,163,184,.12);
}
body.legacy-v70-option3 .system-push-test-grid span {
    color: var(--legacy-muted);
    font-size: 8px;
}
body.legacy-v70-option3 .system-push-test-grid strong {
    color: #dbeafe;
    font-size: 8px;
    text-align: right;
}

/* v80.28.0.24 — beheergroepen en ARC-contactpersonen */
body.legacy-v70-option3 .access-wide-field{grid-column:1/-1}
body.legacy-v70-option3 .access-group-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
body.legacy-v70-option3 .access-group-columns>section{min-width:0}
body.legacy-v70-option3 .access-group-columns h3{margin:0 0 5px;font-size:9px;color:#cbd5e1}
body.legacy-v70-option3 .access-group-check-list{display:grid;gap:4px;max-height:250px;overflow:auto;scrollbar-width:thin}
body.legacy-v70-option3 .access-group-check-row{min-width:0;margin:0;padding:6px 7px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px;align-items:center;border:1px solid #24324a;border-radius:8px;background:#111827}
body.legacy-v70-option3 .access-group-check-row input{margin:0}
body.legacy-v70-option3 .access-group-check-row strong,body.legacy-v70-option3 .access-group-check-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.legacy-v70-option3 .access-group-check-row strong{font-size:9px}
body.legacy-v70-option3 .access-group-check-row small{margin-top:2px;color:#94a3b8;font-size:7.5px}
body.legacy-v70-option3 .access-group-read-list{display:grid;gap:4px;max-height:220px;overflow:auto}
body.legacy-v70-option3 .access-group-read-list>div{padding:6px 7px;border:1px solid #24324a;border-radius:8px;background:#111827}
body.legacy-v70-option3 .access-group-read-list strong,body.legacy-v70-option3 .access-group-read-list small{display:block}
body.legacy-v70-option3 .access-group-read-list strong{font-size:9px}
body.legacy-v70-option3 .access-group-read-list small{margin-top:2px;color:#94a3b8;font-size:7.5px}
body.legacy-v70-option3 .access-arc-contact-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:8px}
body.legacy-v70-option3 .access-arc-contact-card{min-width:0;padding:8px;display:flex;align-items:flex-start;justify-content:space-between;gap:8px;border:1px solid #24324a;border-radius:9px;background:#111827}
body.legacy-v70-option3 .access-arc-contact-card.is-inactive{opacity:.58}
body.legacy-v70-option3 .access-arc-contact-card h3{margin:2px 0;font-size:11px}
body.legacy-v70-option3 .access-arc-contact-card p{margin:2px 0;color:#94a3b8;font-size:8px}
body.legacy-v70-option3 .access-arc-contact-card small{color:#cbd5e1;font-size:8px}
body.legacy-v70-option3 .access-arc-contact-card .button-row{margin:0;flex:0 0 auto}
body.legacy-v70-option3 .access-arc-contact-form{padding-top:8px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;border-top:1px solid #24324a}
body.legacy-v70-option3 .access-arc-contact-form label{margin:0;color:#cbd5e1;font-size:9px}
body.legacy-v70-option3 .access-arc-contact-form input,body.legacy-v70-option3 .access-arc-contact-form textarea{min-height:30px;margin:3px 0 0;padding:5px 7px;font-size:10px}
body.legacy-v70-option3 .access-arc-contact-form textarea{resize:vertical}
@media(max-width:900px){body.legacy-v70-option3 .access-group-columns,body.legacy-v70-option3 .access-arc-contact-form{grid-template-columns:1fr}body.legacy-v70-option3 .access-arc-contact-list{grid-template-columns:1fr}}
body.legacy-v70-option3 .alarm-arc-contacts-panel{margin-top:7px;padding:7px;border:1px solid #24324a;border-radius:8px;background:#0c1526}
body.legacy-v70-option3 .alarm-arc-contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
body.legacy-v70-option3 .alarm-arc-contact-grid article{padding:7px;border:1px solid #24324a;border-radius:8px;background:#111827}
body.legacy-v70-option3 .alarm-arc-contact-grid span,body.legacy-v70-option3 .alarm-arc-contact-grid strong,body.legacy-v70-option3 .alarm-arc-contact-grid small{display:block}
body.legacy-v70-option3 .alarm-arc-contact-grid span{color:#60a5fa;font-size:8px;font-weight:800}
body.legacy-v70-option3 .alarm-arc-contact-grid strong{margin-top:2px;font-size:10px}
body.legacy-v70-option3 .alarm-arc-contact-grid small,body.legacy-v70-option3 .alarm-arc-contact-grid p{color:#94a3b8;font-size:8px}
@media(max-width:760px){body.legacy-v70-option3 .alarm-arc-contact-grid{grid-template-columns:1fr}}

/* v80.28.0.26 — zichtbare ARC-contactworkflow per tracker */
body.legacy-v70-option3 .tracker-arc-contact-guide{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 8px;padding:7px 8px;border:1px solid #24324a;border-radius:9px;background:#0c1526}
body.legacy-v70-option3 .tracker-arc-contact-guide strong{width:100%;font-size:10px}body.legacy-v70-option3 .tracker-arc-contact-guide span{font-size:8px;color:#94a3b8}
body.legacy-v70-option3 .tracker-arc-selected-status{display:flex;flex-direction:column;gap:1px;min-width:130px;padding:6px 8px;border:1px solid #24324a;border-radius:8px;background:#111827}
body.legacy-v70-option3 .tracker-arc-selected-status span{font-size:7px;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8}body.legacy-v70-option3 .tracker-arc-selected-status strong{font-size:10px}
body.legacy-v70-option3 .tracker-arc-empty{display:flex;flex-direction:column;gap:3px}body.legacy-v70-option3 .tracker-arc-empty strong{color:#e5e7eb}body.legacy-v70-option3 .tracker-arc-empty span{color:#94a3b8}


/* ==========================================================
   v80.28.0.26.1 – Trackerbeheer scroll- en contextrecovery
   ========================================================== */
body.legacy-v70-option3.legacy-page-trackers .legacy-v70-main {
    overflow-y: auto !important;
    overflow-x: hidden;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: #64748b transparent;
}
body.legacy-v70-option3.legacy-page-trackers .legacy-v70-main .content {
    height: auto;
    min-height: 100%;
    overflow: visible;
}
body.legacy-v70-option3.legacy-page-trackers #contentArea {
    height: auto;
    min-height: 100%;
    overflow: visible !important;
}

/* v80.28.0.29 — klikbare Signaal-contextkaart als ingang naar historie */
body.legacy-v70-option3 button.legacy-context-action-box{position:relative;width:100%;border:0;text-align:left;color:inherit;cursor:pointer;font:inherit}
body.legacy-v70-option3 button.legacy-context-action-box:hover{outline:1px solid #2563eb;background:color-mix(in srgb,var(--legacy-box) 84%,#2563eb 16%)}
body.legacy-v70-option3 .legacy-context-action-chevron{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:#60a5fa;font-size:18px}


/* v80.28.1.1 – Alarm Operations visueel gelijk aan trackerkaarten.
 * KPI's zijn technisch buttons, maar mogen niet door de algemene blauwe buttonstijl worden gevuld. */
body.legacy-v70-option3 .alarm-operations-filter-form {
    border-color: var(--legacy-border);
    background: var(--legacy-panel);
}
body.legacy-v70-option3 .alarm-operation-kpi {
    border: 1px solid transparent;
    border-radius: 13px;
    background: var(--legacy-box);
    color: #fff;
    box-shadow: none;
    filter: none;
}
body.legacy-v70-option3 .alarm-operation-kpi:hover,
body.legacy-v70-option3 .alarm-operation-kpi:focus-visible {
    border-color: var(--legacy-blue-soft);
    background: var(--legacy-box-hover);
    color: #fff;
    outline: none;
    filter: none;
}
body.legacy-v70-option3 .alarm-operation-kpi span,
body.legacy-v70-option3 .alarm-operation-kpi small { color: var(--legacy-muted); }
body.legacy-v70-option3 .alarm-operation-kpi strong { color: #fff; }
body.legacy-v70-option3 .alarm-operation-kpi.ok { border-left: 4px solid var(--legacy-green); }
body.legacy-v70-option3 .alarm-operation-kpi.active { border-left: 4px solid var(--legacy-blue-soft); }
body.legacy-v70-option3 .alarm-operation-kpi.warn { border-left: 4px solid var(--legacy-orange); }
body.legacy-v70-option3 .alarm-operation-kpi.danger { border-left: 4px solid var(--legacy-red); }
body.legacy-v70-option3 .alarm-operations-insights > div {
    border: 1px solid transparent;
    border-radius: 13px;
    background: var(--legacy-box);
}
body.legacy-v70-option3 .alarm-operations-insights span,
body.legacy-v70-option3 .alarm-operations-insights small { color: var(--legacy-muted); }
body.legacy-v70-option3 .alarm-operations-insights strong { color: #fff; }
body.legacy-v70-option3 #alarmOperationsFilterForm button[type="submit"] {
    background: var(--legacy-blue);
    color: #fff;
}
body.legacy-v70-option3 #alarmOperationsFilterForm button.secondary {
    background: #334155;
    color: #fff;
}

/* ==========================================================
   v80.28.1.2 – rechterpaneel themaconsistentie in alle views
   Informatie blijft donker zoals trackerkaarten; alleen echte
   acties gebruiken primaire, waarschuwing- of gevaaraccenten.
   ========================================================== */
body.legacy-v70-option3 .legacy-v70-context {
    background: #0d1729;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-section + .legacy-context-section {
    padding-top: 16px;
    border-top: 1px solid rgba(148, 163, 184, .12);
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-section h3 {
    color: #93c5fd;
    font-weight: 800;
    letter-spacing: -.01em;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-box,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-note,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-list-item,
body.legacy-v70-option3 .legacy-v70-context .legacy-alarm-contact {
    border: 1px solid rgba(148, 163, 184, .10);
    background: #182235;
    box-shadow: none;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-box {
    min-height: 52px;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-box .label,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-list-item small,
body.legacy-v70-option3 .legacy-v70-context .legacy-alarm-contact small {
    color: #94a3b8;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-box strong,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-box .value,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-list-item strong,
body.legacy-v70-option3 .legacy-v70-context .legacy-alarm-contact strong {
    color: #f8fafc;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-note {
    color: #cbd5e1;
    line-height: 1.55;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-note strong {
    color: #f8fafc;
}

/* Buttons die informatie presenteren mogen nooit de algemene volle blauwe knopstijl erven. */
body.legacy-v70-option3 .legacy-v70-context .legacy-context-list button.legacy-context-list-item,
body.legacy-v70-option3 .legacy-v70-context button.legacy-context-action-box {
    width: 100%;
    margin: 0;
    border: 1px solid rgba(148, 163, 184, .10) !important;
    background: #182235 !important;
    color: #f8fafc !important;
    box-shadow: none !important;
    filter: none !important;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-list button.legacy-context-list-item:hover,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-list button.legacy-context-list-item:focus-visible,
body.legacy-v70-option3 .legacy-v70-context button.legacy-context-action-box:hover,
body.legacy-v70-option3 .legacy-v70-context button.legacy-context-action-box:focus-visible {
    border-color: rgba(59, 130, 246, .55) !important;
    background: #22304a !important;
    color: #fff !important;
    outline: none;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-list button.legacy-context-list-item.active {
    border-color: rgba(59, 130, 246, .48) !important;
    border-left: 4px solid #3b82f6 !important;
    background: #202e46 !important;
    color: #fff !important;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-list button.legacy-context-list-item.active small {
    color: #bfdbfe;
}

/* Echte acties volgen dezelfde hiërarchie als Ververs in het hoofdwerkvlak. */
body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions button,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions .button-link,
body.legacy-v70-option3 .legacy-v70-context .route-history-form-actions button,
body.legacy-v70-option3 .legacy-v70-context .system-ai-open-button {
    border: 1px solid rgba(147, 197, 253, .28);
    background: linear-gradient(180deg, #2f6df6, #2559d8);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10);
    filter: none;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions button:hover:not(:disabled),
body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions .button-link:hover,
body.legacy-v70-option3 .legacy-v70-context .route-history-form-actions button:hover:not(:disabled),
body.legacy-v70-option3 .legacy-v70-context .system-ai-open-button:hover:not(:disabled) {
    background: linear-gradient(180deg, #3b78ff, #2b63ea);
    color: #fff;
    filter: none;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions button.secondary,
body.legacy-v70-option3 .legacy-v70-context .route-history-form-actions button.secondary,
body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions .button-link.secondary {
    border-color: rgba(148, 163, 184, .16);
    background: #253249;
    color: #e2e8f0;
    box-shadow: none;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions button.secondary:hover:not(:disabled),
body.legacy-v70-option3 .legacy-v70-context .route-history-form-actions button.secondary:hover:not(:disabled) {
    background: #334155;
    color: #fff;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions button.danger {
    border-color: rgba(248, 113, 113, .35);
    background: linear-gradient(180deg, #ef4444, #dc2626);
    color: #fff;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions button.orange {
    border-color: rgba(251, 191, 36, .34);
    background: linear-gradient(180deg, #f59e0b, #d97706);
    color: #fff;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-context-actions button:disabled,
body.legacy-v70-option3 .legacy-v70-context .route-history-form-actions button:disabled,
body.legacy-v70-option3 .legacy-v70-context .system-ai-open-button:disabled {
    border-color: rgba(148, 163, 184, .10);
    background: #1e293b;
    color: #64748b;
    box-shadow: none;
    opacity: .72;
    cursor: default;
}

/* Filter- en lijstknoppen in Route History blijven donkere controls; actief is blauw geaccentueerd. */
body.legacy-v70-option3 .legacy-v70-context .route-event-filter-row button {
    border: 1px solid rgba(148, 163, 184, .14);
    background: #182235;
    color: #cbd5e1;
    box-shadow: none;
    filter: none;
}

body.legacy-v70-option3 .legacy-v70-context .route-event-filter-row button:hover,
body.legacy-v70-option3 .legacy-v70-context .route-event-filter-row button:focus-visible {
    border-color: rgba(59, 130, 246, .50);
    background: #22304a;
    color: #fff;
    filter: none;
}

body.legacy-v70-option3 .legacy-v70-context .route-event-filter-row button.active {
    border-color: rgba(147, 197, 253, .38);
    background: linear-gradient(180deg, #2f6df6, #2559d8);
    color: #fff;
}

/* Alarmcontacten en invoervelden volgen dezelfde donkere kaarttaal. */
body.legacy-v70-option3 .legacy-v70-context .legacy-alarm-contact {
    border-left: 4px solid #10b981;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-alarm-contact-actions .button-link {
    border: 1px solid rgba(147, 197, 253, .28);
    background: linear-gradient(180deg, #2f6df6, #2559d8);
    color: #fff;
}

body.legacy-v70-option3 .legacy-v70-context .legacy-alarm-contact-actions .button-link.ok {
    border-color: rgba(74, 222, 128, .28);
    background: linear-gradient(180deg, #22c55e, #16a34a);
    color: #fff;
}

body.legacy-v70-option3 .legacy-v70-context textarea,
body.legacy-v70-option3 .legacy-v70-context input,
body.legacy-v70-option3 .legacy-v70-context select {
    border: 1px solid rgba(148, 163, 184, .14);
    background: #182235;
    color: #f8fafc;
}

body.legacy-v70-option3 .legacy-v70-context textarea::placeholder,
body.legacy-v70-option3 .legacy-v70-context input::placeholder {
    color: #64748b;
}

/* Systeemstatus gebruikt dezelfde kaartbasis zonder statusinformatie weg te drukken. */
body.legacy-v70-option3 .legacy-v70-context .system-analysis-state,
body.legacy-v70-option3 .legacy-v70-context .system-analysis-item,
body.legacy-v70-option3 .legacy-v70-context .system-ai-handoff,
body.legacy-v70-option3 .legacy-v70-context .system-push-meta,
body.legacy-v70-option3 .legacy-v70-context .system-push-test-result {
    background: #182235;
    border-color: rgba(148, 163, 184, .14);
    box-shadow: none;
}

/* Rechterpaneel-scroll blijft compact en zichtbaar in alle contextviews. */
body.legacy-v70-option3 .legacy-v70-context {
    scrollbar-color: #475569 transparent;
}
body.legacy-v70-option3 .legacy-v70-context::-webkit-scrollbar-thumb {
    background: #475569;
}

/* v80.28.1.2 – functionele statusaccenten blijven zichtbaar boven de gedeelde kaartbasis. */
body.legacy-v70-option3 .legacy-v70-context .legacy-context-note.danger-text {
    border-color: rgba(239, 68, 68, .28);
    border-left: 4px solid #ef4444;
    color: #fecaca;
}
body.legacy-v70-option3 .legacy-v70-context .legacy-context-note.warn-text {
    border-color: rgba(245, 158, 11, .28);
    border-left: 4px solid #f59e0b;
    color: #fde68a;
}
body.legacy-v70-option3 .legacy-v70-context .legacy-context-note.ok-text {
    border-color: rgba(34, 197, 94, .24);
    border-left: 4px solid #22c55e;
    color: #bbf7d0;
}
body.legacy-v70-option3 .legacy-v70-context .system-analysis-state.ok {
    border-color: rgba(34, 197, 94, .42);
}
body.legacy-v70-option3 .legacy-v70-context .system-analysis-state.warn {
    border-color: rgba(245, 158, 11, .48);
}
body.legacy-v70-option3 .legacy-v70-context .system-analysis-state.error {
    border-color: rgba(239, 68, 68, .52);
}
body.legacy-v70-option3 .legacy-v70-context .system-push-test-result.ok {
    border-color: rgba(34, 197, 94, .35);
    background: rgba(20, 83, 45, .18);
}
body.legacy-v70-option3 .legacy-v70-context .system-push-test-result.warn {
    border-color: rgba(245, 158, 11, .38);
    background: rgba(120, 53, 15, .16);
}
body.legacy-v70-option3 .legacy-v70-context .system-push-test-result.error {
    border-color: rgba(239, 68, 68, .40);
    background: rgba(127, 29, 29, .17);
}

/* ==========================================================
   v80.28.1.3 – professioneel incidentrapport en historie
   ========================================================== */
body.legacy-v70-option3 .alarm-incident-report-panel{
    margin-top:7px;
    padding:7px;
    border:1px solid #263752;
    border-radius:9px;
    background:#0b1424;
}
body.legacy-v70-option3 .alarm-incident-report-card{display:grid;gap:8px}
body.legacy-v70-option3 .alarm-incident-report-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
    padding:8px 9px;
    border:1px solid #2a3b58;
    border-left:3px solid #3b82f6;
    border-radius:9px;
    background:#111c30;
}
body.legacy-v70-option3 .alarm-incident-report-head>div{min-width:0}
body.legacy-v70-option3 .alarm-incident-report-head span,
body.legacy-v70-option3 .alarm-incident-report-head strong,
body.legacy-v70-option3 .alarm-incident-report-head small{display:block}
body.legacy-v70-option3 .alarm-incident-report-head>div>span{
    color:#38bdf8;
    font-size:7px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}
body.legacy-v70-option3 .alarm-incident-report-head strong{margin-top:2px;color:#f8fafc;font-size:11px}
body.legacy-v70-option3 .alarm-incident-report-head small{margin-top:2px;color:#94a3b8;font-size:8px}
body.legacy-v70-option3 .alarm-incident-report-metrics{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:6px;
}
body.legacy-v70-option3 .alarm-incident-report-metric{
    min-width:0;
    padding:8px;
    border:1px solid #263752;
    border-radius:9px;
    background:#172238;
}
body.legacy-v70-option3 .alarm-incident-report-metric span,
body.legacy-v70-option3 .alarm-incident-report-metric strong,
body.legacy-v70-option3 .alarm-incident-report-metric small{display:block}
body.legacy-v70-option3 .alarm-incident-report-metric span{color:#94a3b8;font-size:7.5px;font-weight:700}
body.legacy-v70-option3 .alarm-incident-report-metric strong{margin-top:3px;color:#f8fafc;font-size:12px}
body.legacy-v70-option3 .alarm-incident-report-metric small{margin-top:2px;color:#64748b;font-size:7px}
body.legacy-v70-option3 .alarm-incident-report-facts{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
}
body.legacy-v70-option3 .alarm-incident-report-facts>div{
    min-width:0;
    padding:7px 8px;
    border:1px solid #24324a;
    border-radius:8px;
    background:#111827;
}
body.legacy-v70-option3 .alarm-incident-report-facts span,
body.legacy-v70-option3 .alarm-incident-report-facts strong{display:block}
body.legacy-v70-option3 .alarm-incident-report-facts span{color:#64748b;font-size:7px;text-transform:uppercase;letter-spacing:.05em}
body.legacy-v70-option3 .alarm-incident-report-facts strong{margin-top:2px;color:#e5e7eb;font-size:9px;overflow-wrap:anywhere}
body.legacy-v70-option3 .alarm-incident-report-section{
    padding:8px;
    border:1px solid #24324a;
    border-radius:9px;
    background:#0f192b;
}
body.legacy-v70-option3 .alarm-incident-report-section>strong{display:block;margin-bottom:6px;color:#dbeafe;font-size:9px}
body.legacy-v70-option3 .alarm-incident-report-participants{display:flex;flex-wrap:wrap;gap:5px}
body.legacy-v70-option3 .alarm-incident-report-participants span{
    padding:4px 7px;
    border:1px solid #334766;
    border-radius:999px;
    background:#172238;
    color:#cbd5e1;
    font-size:8px;
}
body.legacy-v70-option3 .alarm-incident-report-segments{display:grid;gap:5px}
body.legacy-v70-option3 .alarm-incident-report-segments>div{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:2px 8px;
    padding:6px 7px;
    border:1px solid #24324a;
    border-radius:8px;
    background:#111827;
}
body.legacy-v70-option3 .alarm-incident-report-segments span{color:#e2e8f0;font-size:8.5px;font-weight:700}
body.legacy-v70-option3 .alarm-incident-report-segments b{color:#7dd3fc;font-size:8.5px}
body.legacy-v70-option3 .alarm-incident-report-segments small{grid-column:1/-1;color:#64748b;font-size:7px}
body.legacy-v70-option3 .alarm-incident-report-note{border-left:3px solid #3b82f6}
body.legacy-v70-option3 .alarm-incident-report-note p{margin:0;color:#cbd5e1;font-size:8.5px;white-space:pre-wrap;overflow-wrap:anywhere}
body.legacy-v70-option3 .alarm-incident-report-timeline{display:grid;gap:4px}
body.legacy-v70-option3 .alarm-incident-report-timeline>div{
    display:grid;
    grid-template-columns:100px 64px minmax(0,1fr);
    gap:7px;
    align-items:center;
    padding:6px 7px;
    border-left:2px solid #3b82f6;
    border-radius:0 7px 7px 0;
    background:#111827;
}
body.legacy-v70-option3 .alarm-incident-report-timeline span{color:#94a3b8;font-size:7.5px}
body.legacy-v70-option3 .alarm-incident-report-timeline small{color:#38bdf8;font-size:7.5px;font-weight:800}
body.legacy-v70-option3 .alarm-incident-report-timeline b{color:#e5e7eb;font-size:8.5px}
@media(max-width:1180px){
    body.legacy-v70-option3 .alarm-incident-report-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
    body.legacy-v70-option3 .alarm-incident-report-metrics,
    body.legacy-v70-option3 .alarm-incident-report-facts{grid-template-columns:1fr}
    body.legacy-v70-option3 .alarm-incident-report-timeline>div{grid-template-columns:1fr;gap:2px}
}

/* v80.28.2.0 – Tracker Team tekstkanaal in de gedeelde rechtercontext. */
.legacy-v70-device-badge.team {
    border-color: rgba(47, 122, 255, .65);
    background: rgba(47, 122, 255, .16);
    color: #a9c9ff;
}

.tracker-team-context {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 118px);
}

.tracker-team-context-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.tracker-team-context-head h3 {
    margin-bottom: 4px;
}

.tracker-team-context-head p {
    margin: 0;
}

.tracker-team-message-list {
    display: flex;
    flex: 1 1 auto;
    min-height: 260px;
    max-height: calc(100vh - 360px);
    overflow-y: auto;
    flex-direction: column;
    gap: 9px;
    margin-top: 12px;
    padding: 3px 2px 8px;
}

.tracker-team-message {
    align-self: flex-start;
    width: min(92%, 380px);
    padding: 9px 11px;
    border: 1px solid var(--legacy-border);
    border-radius: 12px 12px 12px 4px;
    background: var(--panel-light);
}

.tracker-team-message.own {
    align-self: flex-end;
    border-color: rgba(47, 122, 255, .5);
    border-radius: 12px 12px 4px 12px;
    background: rgba(47, 122, 255, .13);
}

.tracker-team-message > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 4px;
}

.tracker-team-message strong {
    color: #fff;
    font-size: .82rem;
}

.tracker-team-message small {
    color: var(--legacy-muted);
    font-size: .68rem;
    white-space: nowrap;
}

.tracker-team-message p {
    margin: 0;
    color: #fff;
    line-height: 1.42;
    overflow-wrap: anywhere;
}

.tracker-team-compose {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--legacy-border);
}

.tracker-team-compose textarea {
    width: 100%;
    resize: vertical;
    min-height: 72px;
    max-height: 180px;
}

.tracker-team-compose > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.tracker-team-compose small {
    color: var(--legacy-muted);
    line-height: 1.25;
}

/* v80.28.2.1 Tracker Team media, locatie en server-gebufferde PTT */
.tracker-team-tool-row{display:flex;flex-wrap:wrap;justify-content:flex-start!important;gap:8px;margin:0 0 8px}
.tracker-team-tool-row button{min-height:34px}
.tracker-team-tool-row button.recording{border-color:var(--legacy-red);background:color-mix(in srgb,var(--legacy-red) 16%,var(--legacy-panel));color:var(--legacy-red)}
.tracker-team-photo{display:block;margin-top:7px;border-radius:10px;overflow:hidden;background:#09121d}
.tracker-team-photo img{display:block;width:100%;max-height:320px;object-fit:cover}
.tracker-team-location-card{display:flex;flex-direction:column;gap:3px;margin-top:7px;padding:10px 11px;border:1px solid color-mix(in srgb,var(--legacy-blue-soft) 38%,var(--legacy-border));border-radius:10px;background:color-mix(in srgb,var(--legacy-blue-soft) 7%,var(--legacy-panel));color:#fff;text-decoration:none}
.tracker-team-location-card strong{color:var(--legacy-blue-soft)}.tracker-team-location-card span{font-weight:800}.tracker-team-location-card small{color:var(--legacy-muted)}
.tracker-team-voice{display:flex;flex-direction:column;gap:7px;margin-top:7px}.tracker-team-voice audio{width:100%;max-width:320px;height:36px}
.tracker-team-media-note{margin-top:7px;padding:8px 10px;border:1px solid var(--legacy-border);border-radius:9px;color:var(--legacy-muted)}

/* v80.28.2.2 Tracker Team beheeracties */
.tracker-team-head-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.tracker-team-message-head>span{display:flex;align-items:center;gap:6px}
.tracker-team-message-delete{border:0!important;background:transparent!important;color:var(--muted,#94a3b8)!important;box-shadow:none!important;padding:2px 4px!important;min-width:0!important;min-height:0!important;font-size:12px!important;line-height:1!important}
.tracker-team-message-delete:hover{color:var(--danger,#ef4444)!important;background:transparent!important}

/* v80.28.2.4 — echte desktopwebcam voor Tracker Team. */
.tracker-team-camera-modal[hidden]{display:none!important}
.tracker-team-camera-modal{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(2,8,18,.86);backdrop-filter:blur(4px)}
.tracker-team-camera-dialog{display:grid;gap:10px;width:min(100%,520px);padding:12px;border:1px solid color-mix(in srgb,var(--legacy-blue-soft) 45%,var(--legacy-border));border-radius:14px;background:var(--legacy-panel);box-shadow:0 20px 60px rgba(0,0,0,.5)}
.tracker-team-camera-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tracker-team-camera-head strong{color:#fff}
.tracker-team-camera-dialog video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;background:#020712;border:1px solid var(--legacy-border)}
.tracker-team-camera-dialog>small{color:var(--legacy-muted)}
.tracker-team-camera-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.tracker-team-tool-row button.sending,.tracker-team-tool-row button:disabled{opacity:.72}
.tracker-team-context{position:relative}

/* v80.28.3.0 — Tracker Team Incident Focus, rapportselectie en zelfstandige Teamkanaalpagina. */
.tracker-team-incident-banner{display:grid;gap:4px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--legacy-orange,#f59e0b) 45%,var(--legacy-border));border-radius:11px;background:color-mix(in srgb,var(--legacy-orange,#f59e0b) 10%,var(--legacy-panel))}
.tracker-team-incident-banner>div{display:grid;gap:3px}.tracker-team-incident-banner strong{color:#fff}.tracker-team-incident-banner span,.tracker-team-incident-banner small{color:var(--legacy-muted);font-size:12px;line-height:1.4}
.tracker-team-message.incident-selected{border-color:color-mix(in srgb,var(--legacy-orange,#f59e0b) 55%,var(--legacy-border));box-shadow:inset 3px 0 0 color-mix(in srgb,var(--legacy-orange,#f59e0b) 80%,transparent)}
.tracker-team-report-toggle{width:100%;margin-top:8px;padding:6px 9px!important;min-height:30px!important;border:1px solid var(--legacy-border)!important;border-radius:8px!important;background:transparent!important;color:var(--legacy-muted)!important;font-size:11px!important;font-weight:800!important;text-align:left}
.tracker-team-report-toggle.selected{border-color:color-mix(in srgb,var(--legacy-orange,#f59e0b) 55%,var(--legacy-border))!important;background:color-mix(in srgb,var(--legacy-orange,#f59e0b) 11%,var(--legacy-panel))!important;color:#fff!important}
.tracker-team-page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.tracker-team-page-header h2{margin:0 0 4px}.tracker-team-page-header p{margin:0;color:var(--muted)}
.tracker-team-page-controls label{display:grid;gap:5px;font-weight:800}.tracker-team-page-controls select{min-width:220px}
/* v80.28.3.1 — compact gecombineerd tracker-/incidentoverzicht en ingebed incidentrapport. */
.tracker-team-page-overview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;margin-top:12px;padding:0!important;overflow:hidden}.tracker-team-page-overview.incident-active{border-color:color-mix(in srgb,var(--warning,#f59e0b) 46%,var(--border))}
.tracker-team-page-overview-tracker,.tracker-team-page-overview-incident{min-width:0;padding:12px 14px}.tracker-team-page-overview-tracker{border-right:1px solid var(--border)}
.tracker-team-page-overview-title{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.tracker-team-page-overview-title>div{min-width:0}.tracker-team-page-overview-title h2{margin:4px 0 0;overflow-wrap:anywhere}.tracker-team-page-overview-title .pill{flex:0 0 auto}
.tracker-team-page-overview-incident p{margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.45}
.tracker-team-page-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:10px}.tracker-team-page-facts>div{display:grid;gap:2px;min-width:0;padding:7px 9px;border:1px solid var(--border);border-radius:8px;background:color-mix(in srgb,var(--panel) 85%,transparent)}.tracker-team-page-facts span{font-size:10px;color:var(--muted)}.tracker-team-page-facts strong{font-size:12px;overflow-wrap:anywhere}
.tracker-team-page-overview-note{grid-column:1/-1;display:flex;align-items:baseline;gap:10px;padding:9px 14px;border-top:1px solid var(--border);background:color-mix(in srgb,var(--panel) 90%,transparent)}.tracker-team-page-overview-note strong{flex:0 0 auto;font-size:11px}.tracker-team-page-overview-note span{min-width:0;color:var(--muted);font-size:11px;line-height:1.4}
body.legacy-v70-option3 .tracker-team-page-report-panel{margin-top:12px}.tracker-team-page-report-loading{padding:12px;color:var(--muted);font-size:12px}.tracker-team-page-report-empty{margin-top:12px}.tracker-team-page-report-empty h2{margin:5px 0 6px}.tracker-team-page-report-empty p{margin:0;color:var(--muted)}
@media(max-width:900px){.tracker-team-page-header{align-items:stretch;flex-direction:column}.tracker-team-page-overview{grid-template-columns:1fr}.tracker-team-page-overview-tracker{border-right:0;border-bottom:1px solid var(--border)}.tracker-team-page-overview-note{display:grid;gap:3px}.tracker-team-page-facts{grid-template-columns:1fr}.tracker-team-page-controls select{width:100%;min-width:0}}


/* v80.28.3.1 — opvallende unread-indicator voor Tracker Team in de hoofdnavigatie. */
body.legacy-v70-option3 .legacy-nav-unread-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    border: 1px solid rgba(191, 219, 254, .72);
    border-radius: 999px;
    background: #2563eb;
    color: #fff;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .16);
}
body.legacy-v70-option3 .legacy-nav-unread-badge[hidden] { display: none !important; }
body.legacy-v70-option3 .legacy-nav-trigger.has-team-unread {
    border-color: rgba(96, 165, 250, .58) !important;
    box-shadow: inset 0 0 0 1px rgba(96, 165, 250, .16), 0 0 0 2px rgba(37, 99, 235, .08);
}
body.legacy-v70-option3 .legacy-v70-main-nav .legacy-nav-dropdown-item.has-team-unread {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: rgba(37, 99, 235, .12) !important;
    border-color: rgba(96, 165, 250, .20) !important;
}
body.legacy-v70-option3 .legacy-nav-dropdown-label { min-width: 0; }

/* v80.28.3.2 — volledige alarmbediening in het middelste Teamkanaalvenster. */
body.legacy-v70-option3 .tracker-team-alarm-workspace {
    margin-top: 12px;
}
body.legacy-v70-option3 .tracker-team-alarm-workspace .tracker-team-alarm-row {
    margin: 0;
    padding: 12px 14px;
}
body.legacy-v70-option3 .tracker-team-alarm-workspace .tracker-team-alarm-row > label {
    display: grid;
    gap: 6px;
    margin-top: 10px;
    color: var(--legacy-muted);
    font-size: 12px;
}
body.legacy-v70-option3 .tracker-team-alarm-workspace .tracker-team-alarm-row textarea {
    width: 100%;
    min-height: 72px;
    resize: vertical;
}
body.legacy-v70-option3 .tracker-team-alarm-workspace .tracker-team-page-report-panel {
    margin-top: 12px;
}
body.legacy-v70-option3 .tracker-team-alarm-workspace .alarm-raw {
    max-height: 360px;
    overflow: auto;
}

/* v80.28.3.3 — Teamkanaal desktop-scrollherstel. */
body.legacy-v70-option3.legacy-page-team #contentArea {
    overflow-y: auto !important;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #64748b transparent;
}
body.legacy-v70-option3.legacy-page-team #contentArea::-webkit-scrollbar { width: 8px; }
body.legacy-v70-option3.legacy-page-team #contentArea::-webkit-scrollbar-thumb { background: #475569; border-radius: 999px; }


/* v80.28.3.4 — Teamchat centraal, compact incidentpaneel rechts en één chatscrollbar. */
body.legacy-v70-option3.legacy-page-team {
    --legacy-detail-width: 350px;
}
body.legacy-v70-option3.legacy-page-team .legacy-v70-main .content {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-page-team #contentArea {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
    overflow: hidden !important;
    overscroll-behavior: none;
}
body.legacy-v70-option3.legacy-page-team #contentArea > h1,
body.legacy-v70-option3.legacy-page-team .tracker-team-page-header {
    flex: 0 0 auto;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-page-header {
    align-items: center;
    margin: 0 0 9px;
    padding: 10px 12px;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-page-header h2 {
    font-size: 15px;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-page-header p {
    font-size: 11px;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-chat-workspace {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    margin: 0;
    padding: 12px 14px;
    overflow: hidden;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-context-head,
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-incident-banner,
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-compose {
    flex: 0 0 auto;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-message-list {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: #64748b transparent;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-message-list::-webkit-scrollbar { width: 8px; }
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-message-list::-webkit-scrollbar-thumb { background: #475569; border-radius: 999px; }
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-message {
    width: min(80%, 720px);
}
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-photo img {
    max-height: 460px;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-voice audio {
    max-width: 520px;
}
body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-compose {
    margin-top: 8px;
    padding-top: 8px;
}
body.legacy-v70-option3 .tracker-team-recorder-status {
    display: block;
    margin-top: 5px;
    color: #86efac;
    font-size: 10px;
    line-height: 1.3;
}
body.legacy-v70-option3 .tracker-team-recorder-status.fallback {
    color: #fbbf24;
}
body.legacy-v70-option3.legacy-page-team .legacy-v70-context {
    overflow-y: auto;
    overflow-x: hidden;
}
body.legacy-v70-option3 .tracker-team-side-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}
body.legacy-v70-option3 .tracker-team-side-heading h3 {
    margin: 3px 0 0;
    overflow-wrap: anywhere;
}
body.legacy-v70-option3 .tracker-team-side-summary .legacy-context-grid {
    margin-top: 9px;
}
body.legacy-v70-option3 .tracker-team-side-summary .legacy-context-box {
    min-width: 0;
    padding: 7px 8px;
}
body.legacy-v70-option3 .tracker-team-side-summary .legacy-context-box .label {
    font-size: 9px;
}
body.legacy-v70-option3 .tracker-team-side-summary .legacy-context-box .value {
    font-size: 11px;
    overflow-wrap: anywhere;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace {
    margin: 0;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace > .card,
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .tracker-team-alarm-row {
    margin: 0;
    border-radius: 11px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .tracker-team-alarm-row {
    padding: 10px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-row-main,
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-row-details {
    gap: 5px 7px;
    font-size: 10px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-row-main strong {
    font-size: 13px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-row-details {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 7px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .tracker-team-alarm-row > label {
    margin-top: 8px;
    font-size: 10px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .tracker-team-alarm-row textarea {
    min-height: 58px;
    max-height: 120px;
    padding: 8px;
    font-size: 11px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .button-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-top: 8px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .button-row button {
    min-width: 0;
    padding: 7px 6px;
    font-size: 9px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-incident-report-panel {
    margin-top: 9px;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-incident-report-metrics,
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-incident-report-facts {
    grid-template-columns: 1fr;
}
body.legacy-v70-option3 .tracker-team-side-alarm-workspace .alarm-incident-report-timeline > div {
    grid-template-columns: 1fr;
    gap: 2px;
}
@media (max-width: 1180px) {
    body.legacy-v70-option3.legacy-page-team { --legacy-detail-width: 315px; }
    body.legacy-v70-option3.legacy-page-team .tracker-team-centered-chat .tracker-team-message { width: min(90%, 620px); }
}


/* v80.28.3.6.5 — websitecomposer gelijk aan de compacte PWA-composer. */
body.legacy-v70-option3 .tracker-team-compose-compact{
    position:relative;
    display:block;
    width:100%;
    margin-top:8px;
    padding-top:8px;
    border-top:1px solid var(--legacy-border);
}
body.legacy-v70-option3 .tracker-team-compose-shell{
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    gap:0;
    width:100%;
}
body.legacy-v70-option3 .tracker-team-compose-shell textarea{
    flex:1 1 auto;
    width:auto;
    min-width:0;
    min-height:42px;
    max-height:112px;
    resize:none;
    overflow-y:hidden;
    box-sizing:border-box;
    border:1px solid var(--legacy-border);
    border-left:0;
    border-right:0;
    border-radius:0;
    outline:0;
    background:var(--legacy-panel-strong,var(--legacy-panel));
    color:#fff;
    padding:10px 8px;
    font:inherit;
    line-height:1.35;
}
body.legacy-v70-option3 .tracker-team-compose-shell textarea::placeholder{color:var(--legacy-muted)}
body.legacy-v70-option3 .tracker-team-compose-shell textarea:focus{border-color:var(--legacy-blue-soft)}
body.legacy-v70-option3 .tracker-team-composer-icon{
    flex:0 0 42px;
    width:42px;
    height:42px;
    min-width:42px;
    min-height:42px;
    border:1px solid var(--legacy-border)!important;
    border-radius:0!important;
    background:var(--legacy-panel-strong,var(--legacy-panel))!important;
    color:var(--legacy-muted)!important;
    padding:0!important;
    font-size:18px!important;
    line-height:1!important;
    box-shadow:none!important;
}
body.legacy-v70-option3 .tracker-team-composer-icon.secondary{
    border-radius:22px 0 0 22px!important;
    color:var(--legacy-blue-soft)!important;
    font-size:25px!important;
}
body.legacy-v70-option3 .tracker-team-composer-icon.camera{
    border-radius:0 22px 22px 0!important;
    font-size:18px!important;
}
body.legacy-v70-option3 .tracker-team-compose-shell:not(:has(.tracker-team-composer-icon.secondary)) textarea{
    border-left:1px solid var(--legacy-border);
    border-radius:22px 0 0 22px;
    padding-left:14px;
}
body.legacy-v70-option3 .tracker-team-compose-shell:not(:has(.tracker-team-composer-icon.camera)) textarea{
    border-right:1px solid var(--legacy-border);
    border-radius:0 22px 22px 0;
    padding-right:14px;
}
body.legacy-v70-option3 .tracker-team-compose-shell:not(:has(.tracker-team-composer-icon.secondary)):not(:has(.tracker-team-composer-icon.camera)) textarea{border-radius:22px}
body.legacy-v70-option3 .tracker-team-composer-icon.primary{
    flex-basis:46px;
    width:46px;
    height:46px;
    min-width:46px;
    min-height:46px;
    margin-left:8px;
    border:0!important;
    border-radius:50%!important;
    background:var(--legacy-blue-soft)!important;
    color:#fff!important;
    font-size:19px!important;
    font-weight:900!important;
    box-shadow:0 4px 12px rgba(15,120,178,.28)!important;
}
body.legacy-v70-option3 .tracker-team-composer-icon.primary.recording{background:var(--legacy-red)!important;animation:tracker-team-recording-pulse 1.1s ease-in-out infinite}
body.legacy-v70-option3 .tracker-team-composer-icon.primary.sending{opacity:.72}
body.legacy-v70-option3 .tracker-team-composer-icon:disabled{opacity:.45}
@keyframes tracker-team-recording-pulse{50%{transform:scale(.94);box-shadow:0 0 0 7px rgba(220,38,38,.15)!important}}
body.legacy-v70-option3 .tracker-team-compact-tool-menu{
    position:absolute;
    z-index:36;
    left:0;
    bottom:56px;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px!important;
    width:min(300px,calc(100% - 54px));
    padding:8px;
    border:1px solid var(--legacy-border);
    border-radius:14px;
    background:var(--legacy-panel);
    box-shadow:0 16px 38px rgba(0,0,0,.34);
}
body.legacy-v70-option3 .tracker-team-compact-tool-menu[hidden]{display:none!important}
body.legacy-v70-option3 .tracker-team-compact-tool-menu button{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:42px;
    border:1px solid var(--legacy-border);
    border-radius:10px;
    background:color-mix(in srgb,var(--legacy-panel) 88%,#0b1722);
    color:#fff;
    padding:0 10px;
    text-align:left;
}
body.legacy-v70-option3 .tracker-team-compact-tool-menu button span{font-size:17px}
body.legacy-v70-option3 .tracker-team-compact-tool-menu button strong{font-size:11px}


/* v80.28.3.6.5.1 — voorkom Windows/Chrome-scrollpijlen in een lege composer. */
body.legacy-v70-option3 .tracker-team-compose-shell textarea{scrollbar-width:thin}
body.legacy-v70-option3 .tracker-team-compose-shell textarea:not([data-composer-overflow="true"]){scrollbar-width:none}
body.legacy-v70-option3 .tracker-team-compose-shell textarea:not([data-composer-overflow="true"])::-webkit-scrollbar{display:none}

/* v80.28.3.6.5.2 — vaste websitecomposer-iconen; geen OS-afhankelijke emoji. */
body.legacy-v70-option3 .tracker-team-composer-svg{
    display:block;
    width:20px;
    height:20px;
    margin:auto;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
    pointer-events:none;
}
body.legacy-v70-option3 .tracker-team-composer-icon.secondary .tracker-team-composer-svg{width:22px;height:22px}
body.legacy-v70-option3 .tracker-team-composer-icon.primary .tracker-team-composer-svg{width:21px;height:21px;stroke-width:2}
body.legacy-v70-option3 .tracker-team-composer-spinner{
    display:block;
    width:18px;
    height:18px;
    margin:auto;
    border:2px solid rgba(255,255,255,.42);
    border-top-color:currentColor;
    border-radius:50%;
    animation:tracker-team-composer-spin .72s linear infinite;
}
@keyframes tracker-team-composer-spin{to{transform:rotate(360deg)}}

/* v80.28.3.6.5.4 — expliciete desktopcontent-typografie.
 * Alleen de gewone website gebruikt body.legacy-v70-option3.
 * De PWA laadt mobile-app.css en wordt hierdoor niet gewijzigd.
 * De eerdere bodyverhoging werkte niet door bij componenten met vaste px/rem-maten.
 * Daarom worden uitsluitend leesinhoud en gegevensweergave gericht één stap vergroot.
 */
body.legacy-v70-option3 {
    --legacy-reading-text-size: 16px;
    --legacy-reading-small-size: 13px;
    --legacy-reading-table-size: 13px;
    --legacy-reading-line-height: 1.5;
}

/* Normale leesinhoud in het centrale desktopwerkgebied. */
body.legacy-v70-option3 .legacy-v70-main .content :where(p, li, dd, .message, .status-line) {
    font-size: var(--legacy-reading-text-size);
    line-height: var(--legacy-reading-line-height);
}
body.legacy-v70-option3 .legacy-v70-main .content .muted:not(.pill):not(.realtime-status-pill) {
    font-size: 14px;
    line-height: 1.48;
}
body.legacy-v70-option3 .legacy-v70-main .content table {
    font-size: var(--legacy-reading-table-size);
    line-height: 1.42;
}

/* Tracker Team: berichtinhoud duidelijk leesbaar, metadata compact houden. */
body.legacy-v70-option3 .tracker-team-message p {
    font-size: 16px;
    line-height: 1.5;
}
body.legacy-v70-option3 .tracker-team-message strong {
    font-size: 14px;
}
body.legacy-v70-option3 .tracker-team-message small {
    font-size: 12px;
}
body.legacy-v70-option3 .tracker-team-location-card strong {
    font-size: 15px;
}
body.legacy-v70-option3 .tracker-team-location-card span {
    font-size: 16px;
    line-height: 1.42;
}
body.legacy-v70-option3 .tracker-team-location-card small,
body.legacy-v70-option3 .tracker-team-media-note {
    font-size: 13px;
    line-height: 1.45;
}
body.legacy-v70-option3 .tracker-team-context-head p,
body.legacy-v70-option3.legacy-page-team .tracker-team-page-header p {
    font-size: 14px;
    line-height: 1.45;
}

/* Rechter desktopcontext: waarden en toelichting leesbaar, knoppen/badges ongemoeid. */
body.legacy-v70-option3 .legacy-v70-context-empty {
    font-size: 13px;
}
body.legacy-v70-option3 .legacy-context-section p {
    font-size: 12px;
    line-height: 1.5;
}
body.legacy-v70-option3 .legacy-context-box .label {
    font-size: 10px;
}
body.legacy-v70-option3 .legacy-context-box .value {
    font-size: 12px;
    line-height: 1.4;
}

/* Permanente trackerrail: alleen normale trackerdata één stap groter. */
body.legacy-v70-option3 .legacy-v70-device-head strong {
    font-size: 13px;
}
body.legacy-v70-option3 .legacy-v70-device-head small,
body.legacy-v70-option3 .legacy-v70-device-meta {
    font-size: 10px;
}
body.legacy-v70-option3 .legacy-v70-device-row {
    font-size: 11px;
}
body.legacy-v70-option3 .legacy-v70-alarm-label {
    font-size: 11px;
}

/* v80.28.5.1.1 - compacte profielknop in desktopkop */
body.legacy-v70-option3 .legacy-v70-userbar .desktop-profile-trigger{
    min-height:30px;max-width:250px;padding:3px 8px 3px 4px;gap:6px;border-color:rgba(255,255,255,.15);
    border-radius:9px;background:rgba(255,255,255,.055);color:#e2e8f0;font-size:10px;
}
body.legacy-v70-option3 .legacy-v70-userbar .desktop-profile-trigger:hover:not(:disabled){background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.28)}
body.legacy-v70-option3 .legacy-v70-userbar .desktop-profile-trigger-avatar{width:24px;height:24px;flex-basis:24px;font-size:9px}
body.legacy-v70-option3 .legacy-v70-userbar #welcome{max-width:205px;color:inherit}
body.legacy-v70-option3.legacy-page-profile .legacy-v70-context{display:none}
body.legacy-v70-option3.legacy-page-profile .legacy-v70-main{grid-column:2 / 4}
@media(max-width:1280px){body.legacy-v70-option3 .legacy-v70-userbar .desktop-profile-trigger{max-width:170px}body.legacy-v70-option3 .legacy-v70-userbar #welcome{max-width:135px}}
@media(max-width:1120px){body.legacy-v70-option3.legacy-page-profile .legacy-v70-main{grid-column:2}}
@media(max-width:980px){body.legacy-v70-option3.legacy-page-profile .legacy-v70-main{grid-column:1}}

/* v80.28.5.4.1 — compacte laadstatusbalk in de routeworkstation. */
body.legacy-v70-option3.legacy-context-route .route-charging-segments {
    position: absolute;
    z-index: 4;
    left: 0;
    right: 0;
    top: 37px;
    height: 4px;
    overflow: hidden;
    pointer-events: none;
}
body.legacy-v70-option3.legacy-context-route .route-charging-segment {
    position: absolute;
    top: 0;
    height: 4px;
    min-width: 2px;
    opacity: .95;
}
body.legacy-v70-option3.legacy-context-route .route-charging-segment.charging,
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.charging { background: #22c55e; }
body.legacy-v70-option3.legacy-context-route .route-charging-segment.fully_charged,
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.fully-charged { background: #38bdf8; }
body.legacy-v70-option3.legacy-context-route .route-charging-segment.not_charging,
body.legacy-v70-option3.legacy-context-route .route-workstation-legend i.not-charging { background: #64748b; }
body.legacy-v70-option3.legacy-context-route .route-charging-segment.unknown { background: repeating-linear-gradient(135deg, #475569 0 3px, transparent 3px 6px); opacity: .55; }

/* ==========================================================
   v80.28.5.4.9 — geordend Device Info-paneel rechts
   ========================================================== */
body.legacy-v70-option3 .device-info-identity-section {
    padding: 14px;
    border: 1px solid rgba(96, 165, 250, .20);
    border-radius: 15px;
    background: linear-gradient(145deg, rgba(30, 64, 175, .16), rgba(24, 34, 53, .94));
}
body.legacy-v70-option3 .legacy-v70-context .device-info-identity-section + .legacy-context-section {
    border-top: 0;
}
body.legacy-v70-option3 .device-info-identity-row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
body.legacy-v70-option3 .device-info-avatar {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 2px solid rgba(147, 197, 253, .50);
    border-radius: 15px;
    background: #25324a;
    color: #dbeafe;
    font-size: 20px;
    font-weight: 800;
}
body.legacy-v70-option3 .device-info-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
body.legacy-v70-option3 .device-info-identity-copy {
    min-width: 0;
    flex: 1;
}
body.legacy-v70-option3 .device-info-eyebrow {
    display: block;
    margin-bottom: 3px;
    color: #93c5fd;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
body.legacy-v70-option3 .legacy-v70-context .device-info-identity-copy h3 {
    margin: 0;
    overflow: hidden;
    color: #f8fafc;
    font-size: 17px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.legacy-v70-option3 .legacy-v70-context .device-info-identity-copy p {
    margin: 5px 0 0;
    color: #cbd5e1;
    font-size: 11px;
}
body.legacy-v70-option3 .device-info-summary-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}
body.legacy-v70-option3 .device-info-summary-chip {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 10px;
    background: rgba(15, 23, 42, .54);
}
body.legacy-v70-option3 .device-info-summary-chip small,
body.legacy-v70-option3 .device-info-summary-chip strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.legacy-v70-option3 .device-info-summary-chip small {
    color: #94a3b8;
    font-size: 9px;
}
body.legacy-v70-option3 .device-info-summary-chip strong {
    margin-top: 2px;
    color: #f8fafc;
    font-size: 11px;
}
body.legacy-v70-option3 .device-info-summary-chip.ok-text strong { color: #86efac; }
body.legacy-v70-option3 .device-info-summary-chip.warn-text strong { color: #fde68a; }
body.legacy-v70-option3 .device-info-summary-chip.danger-text strong { color: #fecaca; }
body.legacy-v70-option3 .device-info-address-card {
    margin-bottom: 8px;
    padding: 10px 11px;
    border: 1px solid rgba(148, 163, 184, .10);
    border-left: 3px solid #3b82f6;
    border-radius: 10px;
    background: #182235;
}
body.legacy-v70-option3 .device-info-address-card span,
body.legacy-v70-option3 .device-info-address-card strong {
    display: block;
}
body.legacy-v70-option3 .device-info-address-card span {
    color: #94a3b8;
    font-size: 9px;
}
body.legacy-v70-option3 .device-info-address-card strong {
    margin-top: 3px;
    color: #f8fafc;
    font-size: 12px;
    line-height: 1.4;
}
body.legacy-v70-option3 .device-info-location-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
body.legacy-v70-option3 .device-info-source-section {
    padding: 12px;
    border: 1px solid rgba(56, 189, 248, .16);
    border-radius: 13px;
    background: rgba(14, 116, 144, .055);
}
body.legacy-v70-option3 .legacy-v70-context .device-info-source-section + .legacy-context-section {
    border-top: 0;
}
body.legacy-v70-option3 .device-info-inline-details {
    margin-top: 9px;
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 10px;
    background: #111a2b;
}
body.legacy-v70-option3 .device-info-inline-details > summary {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 10px;
    color: #dbeafe;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
}
body.legacy-v70-option3 .device-info-inline-details > summary::-webkit-details-marker { display: none; }
body.legacy-v70-option3 .device-info-inline-details > summary span { color: #93c5fd; }
body.legacy-v70-option3 .device-info-inline-details .legacy-context-list { padding: 0 8px 8px; }
body.legacy-v70-option3 .device-info-details {
    margin-top: 10px;
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 12px;
    background: #151f31;
    overflow: hidden;
}
body.legacy-v70-option3 .device-info-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 52px;
    padding: 10px 12px;
    cursor: pointer;
    list-style: none;
}
body.legacy-v70-option3 .device-info-details > summary::-webkit-details-marker { display: none; }
body.legacy-v70-option3 .device-info-details > summary > span:first-child { min-width: 0; }
body.legacy-v70-option3 .device-info-details > summary strong,
body.legacy-v70-option3 .device-info-details > summary small {
    display: block;
}
body.legacy-v70-option3 .device-info-details > summary strong {
    color: #e2e8f0;
    font-size: 11px;
}
body.legacy-v70-option3 .device-info-details > summary small {
    margin-top: 3px;
    color: #94a3b8;
    font-size: 9px;
    line-height: 1.35;
}
body.legacy-v70-option3 .device-info-details-chevron {
    flex: 0 0 auto;
    color: #93c5fd;
    font-size: 22px;
    line-height: 1;
    transition: transform .18s ease;
}
body.legacy-v70-option3 .device-info-details[open] .device-info-details-chevron { transform: rotate(90deg); }
body.legacy-v70-option3 .device-info-details-body {
    padding: 0 10px 10px;
    border-top: 1px solid rgba(148, 163, 184, .09);
}
body.legacy-v70-option3 .device-info-details-body.legacy-context-grid,
body.legacy-v70-option3 .device-info-details-body.legacy-context-list { padding-top: 10px; }
body.legacy-v70-option3 .device-info-raw-attributes {
    max-height: 340px;
    margin: 10px 0 0;
    padding: 10px;
    overflow: auto;
    border: 1px solid rgba(148, 163, 184, .10);
    border-radius: 9px;
    background: #0b1220;
    color: #cbd5e1;
    font: 10px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
body.legacy-v70-option3 .device-info-events-details { margin-bottom: 4px; }


/* v80.28.5.4.11 — ARC-contextpaneel naast het Alarm Command Center */
body.legacy-v70-option3 .legacy-v70-context .alarm-context-summary .legacy-context-note {
    border-left: 4px solid var(--legacy-blue-soft);
}
body.legacy-v70-option3 .legacy-v70-main .alarm-command-header,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-queue,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-workspace,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-analysis {
    border-color: rgba(148, 163, 184, .14);
    background: #0f1a2e;
}
body.legacy-v70-option3 .legacy-v70-main .alarm-command-status,
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-queue-card,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-facts > div,
body.legacy-v70-option3 .legacy-v70-main .alarm-operation-kpi,
body.legacy-v70-option3 .legacy-v70-main .alarm-history-row {
    background: #182235;
    border-color: rgba(148, 163, 184, .12);
}
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-queue-card,
body.legacy-v70-option3 .legacy-v70-main button.alarm-history-row {
    background: #182235 !important;
    color: #f8fafc !important;
    border-color: rgba(148, 163, 184, .12) !important;
}
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-queue-card:hover,
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-queue-card:focus-visible,
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-queue-card.active,
body.legacy-v70-option3 .legacy-v70-main button.alarm-history-row:hover,
body.legacy-v70-option3 .legacy-v70-main button.alarm-history-row:focus-visible {
    background: #202d43 !important;
    color: #f8fafc !important;
    border-color: #3b82f6 !important;
}

body.legacy-v70-option3 .legacy-v70-main .alarm-command-queue-card:hover,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-queue-card.active,
body.legacy-v70-option3 .legacy-v70-main .alarm-history-row:hover {
    background: #202d43;
    border-color: #3b82f6;
}
body.legacy-v70-option3 .legacy-v70-main .alarm-command-note-panel,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-treatment,
body.legacy-v70-option3 .legacy-v70-main .alarm-analysis-section {
    background: #111d31;
    border-color: rgba(148, 163, 184, .12);
}


/* v80.28.5.4.13 — operationele queuecontinuïteit */
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-new-alert {
    background: rgba(37, 99, 235, .14) !important;
    border-color: rgba(56, 189, 248, .42) !important;
    color: #f8fafc !important;
}
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-new-alert:hover,
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-new-alert:focus-visible {
    background: rgba(37, 99, 235, .22) !important;
    border-color: #38bdf8 !important;
}


/* v80.28.5.4.14 — incidentworkflow en controleerbare tijdlijn */
body.legacy-v70-option3 .legacy-v70-main .alarm-command-resolution,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-owner-summary,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-lifecycle>div,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-timeline p { background:#111b2b; border-color:rgba(148,163,184,.16); }
body.legacy-v70-option3 .legacy-v70-main .alarm-command-resolution.closed { background:rgba(34,197,94,.055); }
body.legacy-v70-option3 .legacy-v70-main .alarm-command-owner-summary p,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-resolution-check { background:#0c1524; }
body.legacy-v70-option3 .legacy-v70-main .alarm-command-note-state.saved { color:#86efac; }
body.legacy-v70-option3 .legacy-v70-main .alarm-command-note-state.dirty { color:#fbbf24; }


/* v80.28.5.4.15 ARC-operations dark-theme continuity */
body.legacy-v70-option3 .legacy-v70-main .alarm-command-supervisor,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-sla,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-contact-attempt,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-shortcuts-card { background:#111b2b; border-color:rgba(148,163,184,.18); }
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-supervisor-focus,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-supervisor-workload button { background:#0e1726; color:#e6edf7; border-color:rgba(148,163,184,.18); }


/* v80.28.5.4.16 — supervisor-wallboard en visuele close-out */
body.legacy-v70-option3 .legacy-v70-main .alarm-command-status-legend { color:#94a3b8; }
body.legacy-v70-option3 .legacy-v70-main .alarm-command-workspace-head { background:linear-gradient(#0f1a2e 78%,transparent); }
body.legacy-v70-option3 .legacy-v70-main .alarm-command-wallboard { background:radial-gradient(circle at 10% 0%,rgba(37,99,235,.18),transparent 34%),linear-gradient(145deg,#06101d 0%,#081525 56%,#07111e 100%); color:#eef6ff; }
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-wallboard-row { background:#101f35 !important; color:#f8fafc !important; border-color:rgba(148,163,184,.16) !important; }
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-wallboard-row:hover,
body.legacy-v70-option3 .legacy-v70-main button.alarm-command-wallboard-row:focus-visible { background:#152a47 !important; color:#f8fafc !important; border-color:#60a5fa !important; }
body.legacy-v70-option3 .legacy-v70-main .alarm-command-wallboard-header button,
body.legacy-v70-option3 .legacy-v70-main .alarm-command-wallboard-pagination button { background:#12213a !important; color:#f8fafc !important; border-color:rgba(148,163,184,.28) !important; }
