/* PhazTrack desktop final polish — desktop only. Mobile is intentionally untouched. */
@media(min-width:901px){
  html body[data-product="phaztrack"] #customerApp.app:not(.hidden){
    display:grid!important;
    grid-template-columns:248px minmax(0,1fr)!important;
    width:100vw!important;height:100dvh!important;overflow:hidden!important;
  }
  html body[data-product="phaztrack"] #customerApp>.side{
    position:relative!important;inset:auto!important;width:auto!important;height:100dvh!important;
    padding:0!important;gap:0!important;display:flex!important;flex-direction:column!important;
    overflow:hidden!important;background:#071827!important;border-right:1px solid #173047!important;
  }
  html body[data-product="phaztrack"] #customerApp>.side>.brand{
    flex:0 0 auto!important;margin:14px 12px 12px!important;padding:12px!important;
  }
  html body[data-product="phaztrack"] #customerApp>.side>nav{
    position:relative!important;display:flex!important;flex-direction:column!important;gap:4px!important;
    flex:1 1 auto!important;min-height:0!important;margin:0!important;padding:6px 10px 14px!important;
    overflow-y:auto!important;overflow-x:hidden!important;scrollbar-width:thin!important;
  }
  html body[data-product="phaztrack"] #customerApp>.side>nav button{
    position:relative!important;inset:auto!important;transform:none!important;z-index:0!important;
    flex:0 0 auto!important;width:100%!important;min-height:46px!important;height:auto!important;
    margin:0!important;padding:9px 12px!important;border-radius:11px!important;
  }
  html body[data-product="phaztrack"] #customerApp>.side>nav button::before{display:none!important}
  html body[data-product="phaztrack"] #customerApp>.side>nav button.active{
    position:relative!important;inset:auto!important;transform:none!important;z-index:1!important;
    margin:0!important;box-shadow:0 8px 22px rgba(184,20,43,.22)!important;
  }

  /* Stable, intentional desktop menu order. */
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="fleet"]{order:1!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="overview"]{order:2!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="alerts"]{order:3!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="history"]{order:4!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="hardware"]{order:5!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="geofences"]{order:6!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="drivers"]{order:7!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="maintenance"]{order:8!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="security"]{order:9!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="reports"]{order:10!important}
  html body[data-product="phaztrack"] #customerApp>.side #phazUserAdminNav{order:11!important}
  html body[data-product="phaztrack"] #customerApp>.side #productSidebarSecurity{order:12!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="roadtest"]{order:13!important}
  html body[data-product="phaztrack"] #customerApp>.side [data-nav="setup"]{order:14!important}

  /* One clean header owner: title + search + compact actions. */
  html body[data-product="phaztrack"] #customerApp>.main{
    position:relative!important;inset:auto!important;margin:0!important;padding:0!important;
    width:auto!important;height:100dvh!important;max-width:none!important;overflow:hidden!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top{
    position:absolute!important;top:0!important;left:0!important;right:0!important;z-index:5000!important;
    height:60px!important;min-height:60px!important;margin:0!important;padding:9px 12px!important;
    display:grid!important;grid-template-columns:180px minmax(260px,1fr) max-content!important;
    align-items:center!important;gap:8px!important;border-radius:0!important;overflow:hidden!important;
    background:#071827!important;border:0!important;border-bottom:1px solid #173047!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top>.pt3-title{
    display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important;width:auto!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top .pt3-live-dot{
    display:block!important;width:8px!important;height:8px!important;min-width:8px!important;
    border-radius:50%!important;background:#df1f3b!important;box-shadow:0 0 0 4px rgba(223,31,59,.16)!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top>.pt3-title strong{
    overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top>.pt3-search{
    display:flex!important;min-width:0!important;width:100%!important;max-width:none!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top>.pt3-actions{
    display:flex!important;visibility:visible!important;opacity:1!important;
    align-items:center!important;justify-content:flex-end!important;gap:5px!important;
    min-width:max-content!important;width:max-content!important;overflow:visible!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top>.pt3-actions button{
    display:inline-flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;
    flex:0 0 auto!important;height:38px!important;min-width:38px!important;padding:0 9px!important;
  }

  /* Remove every legacy/duplicate map overlay from desktop. */
  html body[data-product="phaztrack"] .phaz-fleet-summary,
  html body[data-product="phaztrack"] .phaz-status-strip,
  html body[data-product="phaztrack"] .phaz-mini-legend,
  html body[data-product="phaztrack"] .phaz-map-tools-toggle,
  html body[data-product="phaztrack"] .phaz-map-tools-menu,
  html body[data-product="phaztrack"] .phaz-details-toggle,
  html body[data-product="phaztrack"] .phaz-fullscreen-map,
  html body[data-product="phaztrack"] .phaz-sheet-handle,
  html body[data-product="phaztrack"] .tracking-map-head,
  html body[data-product="phaztrack"] .tracking-tools,
  html body[data-product="phaztrack"] #phazVehicleFilters{
    display:none!important;visibility:hidden!important;pointer-events:none!important;
  }

  /* Clean status + command dock. */
  html body[data-product="phaztrack"] #pt3MapDock{
    position:absolute!important;z-index:2200!important;top:14px!important;left:14px!important;right:auto!important;
    display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:7px!important;
    max-width:calc(100% - 110px)!important;pointer-events:none!important;
  }
  html body[data-product="phaztrack"] #pt3StatusRow,
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row{
    display:flex!important;align-items:center!important;gap:7px!important;pointer-events:auto!important;
    overflow:visible!important;
  }
  html body[data-product="phaztrack"] #pt3StatusRow button{
    height:36px!important;min-height:36px!important;min-width:82px!important;padding:0 13px!important;
    border:1px solid rgba(202,213,222,.96)!important;border-radius:999px!important;
    background:rgba(255,255,255,.96)!important;color:#324657!important;
    box-shadow:0 4px 14px rgba(7,24,39,.12)!important;
    font:850 .69rem/1 system-ui,sans-serif!important;
  }
  html body[data-product="phaztrack"] #pt3StatusRow button.active{
    background:#172635!important;color:#fff!important;border-color:#172635!important;
  }
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row button{
    height:40px!important;min-height:40px!important;padding:0 14px!important;
    border:1px solid rgba(202,213,222,.96)!important;border-radius:10px!important;
    background:rgba(255,255,255,.97)!important;color:#324657!important;
    box-shadow:0 5px 15px rgba(7,24,39,.13)!important;
    font:850 .71rem/1 system-ui,sans-serif!important;
  }
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row button:hover{
    background:#172635!important;color:#fff!important;border-color:#172635!important;
  }
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row button svg{
    width:15px!important;height:15px!important;stroke-width:1.8!important;
  }

  /* Cleaner vehicle icon: compact ring, no heavy pulse or oversized halo. */
  html body[data-product="phaztrack"] .phaz-map-marker{
    width:30px!important;height:30px!important;border:2px solid #fff!important;
    background:#102033!important;box-shadow:0 4px 11px rgba(2,10,18,.25)!important;
    transform:none!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker::before{
    inset:3px!important;border:1px solid var(--marker)!important;box-shadow:none!important;animation:none!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker::after{
    width:6px!important;height:6px!important;right:-1px!important;bottom:-1px!important;
    border:1px solid #fff!important;box-shadow:0 1px 3px rgba(2,6,23,.2)!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker svg{
    width:17px!important;height:17px!important;stroke-width:1.65!important;filter:none!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker.phaz-vehicle-bus svg,
  html body[data-product="phaztrack"] .phaz-map-marker.phaz-vehicle-truck svg,
  html body[data-product="phaztrack"] .phaz-map-marker.phaz-vehicle-van svg,
  html body[data-product="phaztrack"] .phaz-map-marker.phaz-vehicle-motorcycle svg{
    width:18px!important;height:18px!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker.is-selected{
    transform:scale(1.04)!important;
    box-shadow:0 5px 12px rgba(2,10,18,.26),0 0 0 2px #fff,0 0 0 4px color-mix(in srgb,var(--marker) 60%,transparent)!important;
  }
  html body[data-product="phaztrack"] .phaz-marker-moving::before{animation:none!important}
  html body[data-product="phaztrack"] .phaz-marker-alert{
    top:-5px!important;right:-5px!important;min-width:13px!important;height:13px!important;
    padding:0 3px!important;font-size:7px!important;
  }
  html body[data-product="phaztrack"] .leaflet-tooltip.phaz-vehicle-label{
    padding:4px 7px!important;border-radius:7px!important;font-size:10px!important;line-height:1.18!important;
    box-shadow:0 4px 12px rgba(2,6,23,.16)!important;
  }
  html body[data-product="phaztrack"] #phazLiveMap .leaflet-control-zoom a{
    width:36px!important;height:36px!important;line-height:34px!important;font-size:19px!important;
  }
}
@media(min-width:901px) and (max-width:1250px){
  html body[data-product="phaztrack"] #customerApp>.main>.top{
    grid-template-columns:145px minmax(180px,1fr) max-content!important;
  }
  html body[data-product="phaztrack"] #customerApp>.main>.top>.pt3-actions .pt3-action-label{display:none!important}
  html body[data-product="phaztrack"] #pt3StatusRow button{
    min-width:72px!important;padding:0 10px!important;
  }
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row button{
    padding:0 11px!important;
  }
}


/* desktop map cleanup pass 2 */
@media(min-width:901px){
  /* The live map card has one visual owner. Hide every direct legacy overlay. */
  html body[data-product="phaztrack"] .tracking-map-card > *:not(#phazLiveMap):not(#pt3MapDock):not(#pt3ToolsMenu):not(#phazMapEmpty){
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  /* Keep the genuine empty-state only when the live-map engine explicitly shows it. */
  html body[data-product="phaztrack"] #phazMapEmpty[hidden]{
    display:none!important;
  }

  /* Clean, opaque control rows so no map text or stale UI bleeds through. */
  html body[data-product="phaztrack"] #pt3MapDock{
    top:16px!important;
    left:16px!important;
    gap:8px!important;
    max-width:calc(100% - 150px)!important;
  }
  html body[data-product="phaztrack"] #pt3StatusRow,
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row{
    gap:8px!important;
    padding:0!important;
    margin:0!important;
    background:transparent!important;
  }
  html body[data-product="phaztrack"] #pt3StatusRow button{
    height:38px!important;
    min-height:38px!important;
    min-width:88px!important;
    padding:0 14px!important;
    background:#ffffff!important;
    border:1px solid #d7e0e8!important;
    border-radius:19px!important;
    color:#33475a!important;
    box-shadow:0 4px 12px rgba(7,24,39,.14)!important;
    backdrop-filter:none!important;
  }
  html body[data-product="phaztrack"] #pt3StatusRow button.active{
    background:#172635!important;
    color:#fff!important;
    border-color:#172635!important;
  }
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row button{
    height:42px!important;
    min-height:42px!important;
    padding:0 15px!important;
    background:#ffffff!important;
    border:1px solid #d7e0e8!important;
    border-radius:10px!important;
    color:#33475a!important;
    box-shadow:0 5px 14px rgba(7,24,39,.14)!important;
    backdrop-filter:none!important;
  }
  html body[data-product="phaztrack"] #pt3MapDock .pt3-action-row button:hover{
    background:#172635!important;
    color:#fff!important;
    border-color:#172635!important;
  }

  /* Map tools menu stays directly below the approved controls. */
  html body[data-product="phaztrack"] #pt3ToolsMenu{
    top:112px!important;
    left:16px!important;
  }

  /* Keep + / - fully visible and clearly separated from the Windows taskbar. */
  html body[data-product="phaztrack"] #phazLiveMap .leaflet-top.leaflet-left{
    top:auto!important;
    left:auto!important;
    right:18px!important;
    bottom:84px!important;
    z-index:2400!important;
  }
  html body[data-product="phaztrack"] #phazLiveMap .leaflet-control-zoom{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    margin:0!important;
    border:1px solid #d8e1e8!important;
    border-radius:11px!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:0 8px 22px rgba(7,24,39,.22)!important;
  }
  html body[data-product="phaztrack"] #phazLiveMap .leaflet-control-zoom a{
    display:block!important;
    width:42px!important;
    height:42px!important;
    line-height:40px!important;
    background:#fff!important;
    color:#193047!important;
    font-size:24px!important;
    font-weight:500!important;
    text-align:center!important;
    border-bottom:1px solid #e1e7ec!important;
  }
  html body[data-product="phaztrack"] #phazLiveMap .leaflet-control-zoom a:last-child{
    border-bottom:0!important;
  }
  html body[data-product="phaztrack"] #phazLiveMap .leaflet-control-zoom a:hover{
    background:#f3f6f8!important;
    color:#df1f3b!important;
  }

  /* Final compact vehicle marker. */
  html body[data-product="phaztrack"] .phaz-map-marker{
    width:28px!important;
    height:28px!important;
    border:2px solid #fff!important;
    background:#102b45!important;
    box-shadow:0 3px 10px rgba(2,10,18,.28)!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker::before{
    inset:2px!important;
    border:1px solid var(--marker)!important;
    opacity:1!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker::after{
    width:6px!important;
    height:6px!important;
    right:-2px!important;
    bottom:-2px!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker svg{
    width:16px!important;
    height:16px!important;
    stroke-width:1.6!important;
  }
  html body[data-product="phaztrack"] .phaz-map-marker.is-selected{
    transform:scale(1.03)!important;
    box-shadow:0 4px 11px rgba(2,10,18,.28),0 0 0 2px #fff,0 0 0 3px var(--marker)!important;
  }
  html body[data-product="phaztrack"] .leaflet-tooltip.phaz-vehicle-label{
    margin-top:-2px!important;
    padding:4px 7px!important;
    background:rgba(255,255,255,.96)!important;
    color:#26394b!important;
    border:1px solid #d8e1e8!important;
    border-radius:7px!important;
    box-shadow:0 4px 12px rgba(7,24,39,.16)!important;
    font-size:10px!important;
    line-height:1.2!important;
    backdrop-filter:none!important;
  }
  html body[data-product="phaztrack"] .leaflet-tooltip-top.phaz-vehicle-label::before{
    border-top-color:rgba(255,255,255,.96)!important;
  }
}
