/* Shared map tools: one Options button plus live-unit follow; all other actions stay inside the panel. */
.workspace, #nativeReports {
  --fleet-map-control-size: 44px;
  --fleet-map-control-inset: 16px;
  --fleet-map-controls-bottom: 16px;
  --fleet-map-control-shadow: 0 2px 12px #26374a1c;
}

/* Hide native stacks until they have moved into the panel. */
.workspace > .map-actions,.fleet-map-controls .map-actions {display:none!important}
:is(.workspace,#nativeReports) .fleet-map-controls .maplibregl-ctrl-top-right:not([data-control-layout='tools']) {visibility:hidden}

:is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right {
  top: var(--fleet-map-control-inset) !important;
  right: var(--fleet-map-control-inset) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: max-content;
  max-width: calc(100% - 2 * var(--fleet-map-control-inset));
  gap: 8px;
  overflow: visible;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  pointer-events: auto;
  padding: 1px;
}

:is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right > .maplibregl-ctrl { float: none; margin: 0; flex-shrink: 0; }
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right .maplibregl-ctrl-group:empty{display:none}
:is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right .maplibregl-ctrl-group {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #e4e9ef;
  border-radius: 12px !important;
  box-shadow: var(--fleet-map-control-shadow) !important;
}

:is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right button,
.workspace > .map-actions > .icon-button {
  width: var(--fleet-map-control-size) !important;
  height: var(--fleet-map-control-size) !important;
  min-height: var(--fleet-map-control-size);
  padding: 0;
  border-radius: 0;
  color: #425466;
}
:is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-group button + button { border-top: 1px solid #e4e9ef; border-left: 0; }
:is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .icon-button[aria-pressed="true"] { color: #245fd8; background: #edf3ff; }
:is(.workspace, #nativeReports) .fleet-map-controls .icon-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* One visual language for native buttons, layers and options. */
:is(.workspace,#nativeReports) .fleet-map-controls {
  --map-tool-ink:#315261; --map-tool-accent:#0f728f; --map-tool-soft:#e8f4f7;
}
:is(.workspace,#nativeReports) .fleet-map-controls .map-tool-icon {
  width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
}
:is(.workspace,#nativeReports) .fleet-map-controls .map-native-icon {
  display:flex;align-items:center;justify-content:center;background-image:none!important;
}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-group button {
  display:flex;align-items:center;justify-content:center;padding:0!important;
  color:var(--map-tool-ink);background-color:#fff;transition:background-color .15s,color .15s;
}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-group button svg {
  width:var(--map-tool-icon-size,20px)!important;height:var(--map-tool-icon-size,20px)!important;
  flex-shrink:0;
}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-group button:hover {
  color:var(--map-tool-accent);background-color:var(--map-tool-soft);
}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .map-follow-button[aria-pressed] {color:#6b7280;background:#fff;--map-tool-accent:#6b7280}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .map-follow-button[aria-pressed]:hover {color:#6b7280;background:#fff}
:is(.workspace,#nativeReports) .fleet-map-controls :is(.map-follow-button,.map-layer-button) {--map-tool-icon-size:22px}
:is(.workspace,#nativeReports) .fleet-map-controls :is(.map-follow-button,.map-layer-button) .map-tool-icon {flex-basis:var(--map-tool-icon-size,20px)}
:is(.workspace,#nativeReports) .fleet-map-controls .map-follow-car {fill:currentColor;stroke:none}
:is(.workspace,#nativeReports) .fleet-map-controls .map-follow-button[aria-pressed='true'] .map-follow-car {fill:#0f728f}
:is(.workspace,#nativeReports) .fleet-map-controls button:focus-visible,
:is(.workspace,#nativeReports) .map-layer-options label:has(input:focus-visible) {
  outline:2px solid var(--map-tool-accent);outline-offset:-3px;
}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .map-layer-button {
  display:flex;align-items:center;justify-content:center;
}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .map-layer-button[aria-expanded='true'] {
  color:var(--map-tool-accent);background:var(--map-tool-soft);
}
:is(.workspace,#nativeReports) .map-layer-options {
  position:fixed;inset:auto;width:292px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow-y:auto;box-sizing:border-box;
  margin:0;padding:14px;border:1px solid #dce6eb;border-radius:18px;
  background:#fff;color:var(--map-tool-ink);box-shadow:0 12px 40px #18374726,0 2px 8px #1837470d;
  font:14px/1.4 var(--fleet-map-font,Roboto,Arial,sans-serif);
}
:is(.workspace,#nativeReports) .map-options-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-4px -4px 10px 2px}
:is(.workspace,#nativeReports) .map-options-heading strong {font-size:16px;font-weight:650;letter-spacing:-.02em}
:is(.workspace,#nativeReports) .map-options-close {display:grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:10px;color:var(--map-tool-ink);background:#f3f7f9;cursor:pointer}
:is(.workspace,#nativeReports) .map-options-close:hover {background:var(--map-tool-soft);color:var(--map-tool-accent)}
:is(.workspace,#nativeReports) .map-layer-options .map-layer-native {display:none}
:is(.workspace,#nativeReports) .map-layer-choices {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
:is(.workspace,#nativeReports) .map-layer-choice {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:70px;padding:10px 4px;border:1px solid #e0e8ed;border-radius:12px;background:#f7fafb;color:var(--map-tool-ink);font-family:inherit;cursor:pointer}
:is(.workspace,#nativeReports) .map-layer-choice span {font:500 12px/1.2 var(--fleet-map-font,Roboto,Arial,sans-serif)}
:is(.workspace,#nativeReports) .map-layer-choice:hover {border-color:#88b7c5;background:#eef6f8}
:is(.workspace,#nativeReports) .map-layer-choice[aria-pressed='true'] {border-color:var(--map-tool-accent);background:var(--map-tool-soft);color:#0b5f78;box-shadow:inset 0 0 0 1px var(--map-tool-accent)}
:is(.workspace,#nativeReports) .map-3d-option {display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;margin:0;padding:0 12px;box-sizing:border-box;border:1px solid #dce6eb;border-radius:11px;cursor:pointer;color:var(--map-tool-ink);background:#f7fafb}
:is(.workspace,#nativeReports) .map-3d-option:has(input:checked) {border-color:#9cc6d1;color:#0b5f78;background:var(--map-tool-soft)}
:is(.workspace,#nativeReports) .map-3d-option {position:relative;width:44px;flex:0 0 44px}
:is(.workspace,#nativeReports) .map-3d-option input {position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
:is(.workspace,#nativeReports) .fleet-map-controls .map-extra-options {display:flex;flex-direction:row;flex-wrap:wrap;gap:7px;float:none;width:100%;box-shadow:none!important;border-radius:0;background:transparent;margin:12px 0 0;padding-top:12px;border-top:1px solid #e4ecef}
:is(.workspace,#nativeReports) .fleet-map-controls .map-extra-options:empty {display:none}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .map-extra-options button {display:flex;align-items:center;justify-content:center;width:44px!important;height:44px!important;min-height:44px;padding:0!important;border:1px solid #dce6eb;border-radius:11px;background:#f7fafb}
:is(.workspace,#nativeReports) .fleet-map-controls .map-extra-options button :is(.maplibregl-ctrl-icon,svg) {width:20px;height:20px;flex:0 0 20px}
:is(.workspace,#nativeReports) .fleet-map-controls .map-extra-options button::after {content:none}
:is(.workspace,#nativeReports) .fleet-map-controls .maplibregl-ctrl-geolocate:disabled {opacity:.4;cursor:not-allowed}
:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-geolocate-active {color:var(--map-tool-accent);background:var(--map-tool-soft)}
@media(prefers-reduced-motion:reduce){:is(.workspace,#nativeReports) .fleet-map-controls.fleet-map-controls button{transition:none}}
/* Main-map credits are available in layers/options, without a floating info icon. */
.workspace > .map-caption,
.workspace #map.fleet-map-controls .maplibregl-ctrl-attrib { display: none !important; }
.workspace #map .map-credits { margin-top: 12px; padding-top: 10px; border-top: 1px solid #e4e9ef; }
.workspace #map .map-credits > strong { display: block; margin-bottom: 6px; font-size: 12px; }
.workspace #map .map-credits .maplibregl-ctrl-attrib-inner { display: block !important; color: #596875; font: 12px/1.5 Arial,sans-serif; white-space: normal; overflow-wrap: anywhere; }
.workspace #map .map-credits a { color: #245f84; text-decoration: underline; }
/* Keep the vertical dock in the visible map area above the existing panels. */
.has-selection .workspace { --fleet-map-controls-bottom: 316px; }
@media (max-width: 960px) {
  #nativeReports { --fleet-map-control-inset: 12px; }
  .workspace { --fleet-map-control-inset: 12px; --fleet-map-controls-bottom: calc(46% + 16px); }
  :is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-bottom-right {
    right: calc(var(--fleet-map-control-size) + var(--fleet-map-control-inset) + 8px) !important;
    max-width: calc(100% - var(--fleet-map-control-size) - var(--fleet-map-control-inset) - 24px);
  }
  body[data-sheet='0'] .workspace { --fleet-map-controls-bottom: 128px; }
  body[data-sheet='2'] .workspace { --fleet-map-controls-bottom: calc(80% + 16px); }
  .has-selection .workspace { --fleet-map-controls-bottom: 316px; }
  .history-open .workspace { --fleet-map-controls-bottom: calc(55% + 16px); }
}
body.map-expanded .workspace { --fleet-map-controls-bottom: 16px; }
/* Landscape phones have more useful space beside the list than above it. */
@media(min-width:600px) and (max-width:960px) and (max-height:450px){
  body:not(.map-expanded) .workspace{--fleet-map-controls-bottom:16px}
  body:not(.map-expanded) .workspace #map.fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right{left:12px;right:auto!important}
  body:not(.map-expanded) .workspace :is(.units-panel,.history-panel){left:auto;right:5px;top:12px;bottom:5px;width:46%;height:auto!important;max-height:none}
  .workspace .units-panel>.mobile-handle{display:none}
}
.map-control-space{position:absolute;top:var(--fleet-map-control-inset);bottom:var(--fleet-map-controls-bottom);width:0;pointer-events:none}

/* Main-map immersive view. The shell stays mounted with its state intact. */
.map-restore-label { display: none; }
.map-expanded:not(.is-module-view) .fleet-shell-host { display: none; }
.map-expanded:not(.is-module-view) .workspace { margin-top: 0; height: 100dvh !important; }
.map-expanded .history-panel, .map-expanded .map-caption { display: none; }
.map-expanded .status-banner { top: 68px; }
.map-immersive-brand {
  position: absolute; z-index: 6;
  top: max(12px, env(safe-area-inset-top)); left: max(16px, env(safe-area-inset-left));
  display: flex; align-items: center; justify-content: center;
  width: 112px; height: 44px; padding: 8px 12px;
  background: #ffffffed; border: 1px solid #cbd5e1;
  border-radius: 11px; box-shadow: 0 2px 8px #172b4d24;
  pointer-events: none;
}
.map-immersive-brand img { display: block; width: 126.5px; height: 50.4px; object-fit: contain; }
/* Expanded mode keeps the same two controls; the return action stays in Options. */
.map-expanded .workspace #map.fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right {top:var(--fleet-map-control-inset)!important}
.map-expanded .workspace #expandButton#expandButton {
  width:44px!important;margin:0;flex-direction:row;border-radius:11px;
}
.map-expanded .workspace #expandButton#expandButton svg {margin:0}
.map-expanded .map-restore-label {display:none}

/* Smaller phone controls; tablet/desktop and labeled options keep their size. */
@media (max-width: 600px), (max-width: 960px) and (max-height: 450px) {
  :is(.workspace,#nativeReports) .fleet-map-controls {--map-tool-icon-size:18px}
  :is(.workspace,#nativeReports) .fleet-map-controls :is(.map-follow-button,.map-layer-button) {--map-tool-icon-size:20px}
  .workspace, #nativeReports { --fleet-map-control-size: 38px; --fleet-map-control-inset: 10px; }
  :is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .maplibregl-ctrl-top-right .maplibregl-ctrl-group {
    border-radius: 10px !important;
  }
  :is(.workspace, #nativeReports) .fleet-map-controls .maplibregl-ctrl-top-right .icon-button svg,
  .workspace > .map-actions > .icon-button svg { width: 18px; height: 18px; }
  :is(.workspace, #nativeReports) .fleet-map-controls .maplibregl-ctrl-top-right .maplibregl-ctrl-icon {
    background-size: 25px 25px;
  }
  :is(.workspace, #nativeReports) .fleet-map-controls.fleet-map-controls .map-layer-button::before { inset: 10px; }
}