/* Software ESM WEB216 PASO 20 — Centro de Monitoreo GPS, cambio aislado */
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] {
  background: #020817 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] > .modal-contenido.modal-gps-traslados-live {
  position: absolute !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #020817 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-topbar {
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  transform: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 64px !important;
  min-height: 64px !important;
  padding: 8px 14px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(34, 211, 238, .25) !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, rgba(2, 8, 23, .99), rgba(4, 31, 56, .98), rgba(2, 8, 23, .99)) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .34) !important;
  backdrop-filter: blur(16px) !important;
  z-index: 120 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title {
  position: static !important;
  transform: none !important;
  min-width: 230px !important;
  max-width: 420px !important;
  margin: 0 !important;
  text-align: left !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title .modal-etiqueta {
  color: #38bdf8 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title h2 {
  margin: 2px 0 0 !important;
  color: #f8fafc !important;
  font-size: 17px !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title p {
  margin: 3px 0 0 !important;
  color: #93c5d9 !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-actions {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-clock,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-btn,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top button,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top b,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top span {
  height: 34px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  border-radius: 10px !important;
  white-space: nowrap !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-clock {
  padding: 0 11px !important;
  color: #e0f2fe !important;
  background: rgba(2, 6, 23, .68) !important;
  border: 1px solid rgba(125, 211, 252, .18) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-btn {
  padding: 0 13px !important;
  color: white !important;
  border: 1px solid rgba(56, 189, 248, .5) !important;
  background: linear-gradient(135deg, rgba(2, 132, 199, .9), rgba(14, 165, 233, .7)) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top span {
  padding: 0 9px !important;
  color: #dff9ff !important;
  background: rgba(8, 47, 73, .56) !important;
  border: 1px solid rgba(34, 211, 238, .22) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top span i {
  width: 8px !important;
  height: 8px !important;
  margin-right: 6px !important;
  border-radius: 50% !important;
  background: #22d3ee !important;
  box-shadow: 0 0 12px #22d3ee !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top b {
  padding: 0 8px !important;
  color: #bae6fd !important;
  background: rgba(2, 6, 23, .48) !important;
  border: 1px solid rgba(125, 211, 252, .14) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top button {
  min-width: 34px !important;
  padding: 0 9px !important;
  color: #e0f2fe !important;
  border: 1px solid rgba(34, 211, 238, .30) !important;
  background: rgba(8, 47, 73, .64) !important;
  cursor: pointer !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top button:disabled {
  opacity: .32 !important;
  cursor: default !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] #esmGpsGridView[hidden] {
  display: none !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-layout {
  position: absolute !important;
  inset: 64px 0 0 0 !important;
  width: 100% !important;
  height: calc(100vh - 64px) !important;
  display: block !important;
  overflow: hidden !important;
  background: #020817 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-layout > .gps-live-detail-card,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-layout > .gps-live-map-shell,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-layout > .gps-live-list-card {
  display: none !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitoring-center {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 12% 10%, rgba(14, 165, 233, .12), transparent 28%),
    radial-gradient(circle at 88% 90%, rgba(20, 184, 166, .09), transparent 30%),
    #020817 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-grid {
  width: 100% !important;
  height: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-grid.is-expanded {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-card {
  position: relative !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: 58px minmax(0, 1fr) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid color-mix(in srgb, var(--esm-gps-accent) 76%, white 10%) !important;
  border-radius: 15px !important;
  background: #0b1727 !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.025), 0 15px 36px rgba(0,0,0,.34), 0 0 22px color-mix(in srgb, var(--esm-gps-accent) 18%, transparent) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-head {
  position: relative !important;
  z-index: 15 !important;
  min-width: 0 !important;
  height: 58px !important;
  padding: 8px 10px !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(120px, .8fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  color: #f8fafc !important;
  background: linear-gradient(100deg, rgba(5, 14, 28, .98), rgba(15, 29, 46, .95)) !important;
  border-bottom: 1px solid rgba(125, 211, 252, .16) !important;
  cursor: zoom-in !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-speed {
  min-width: 0 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident strong,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident span {
  display: inline !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident strong {
  color: #f8fafc !important;
  font-size: 14px !important;
  letter-spacing: .02em !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident span {
  margin-left: 8px !important;
  padding-left: 8px !important;
  color: #cbd5e1 !important;
  font-size: 11px !important;
  border-left: 1px solid rgba(148, 163, 184, .42) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident small {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  margin-top: 4px !important;
  color: #5eead4 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident small i {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #2dd4bf !important;
  box-shadow: 0 0 10px #2dd4bf !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-speed strong,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-speed span {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-speed strong {
  color: #f8fafc !important;
  font-size: 13px !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-speed span {
  margin-top: 4px !important;
  color: #94a3b8 !important;
  font-size: 9px !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-actions {
  display: flex !important;
  gap: 5px !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-actions button {
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  color: white !important;
  font-size: 17px !important;
  border: 1px solid rgba(125, 211, 252, .28) !important;
  border-radius: 9px !important;
  background: rgba(15, 23, 42, .84) !important;
  cursor: pointer !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-actions button:hover {
  color: #67e8f9 !important;
  border-color: #22d3ee !important;
  background: rgba(8, 47, 73, .92) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-map {
  position: relative !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  background: #dce8ee !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-map .maplibregl-map,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-map .maplibregl-canvas-container,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-map .maplibregl-canvas {
  width: 100% !important;
  height: 100% !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-route {
  position: absolute !important;
  z-index: 16 !important;
  left: 8px !important;
  right: 8px !important;
  bottom: 8px !important;
  min-width: 0 !important;
  min-height: 29px !important;
  padding: 5px 8px !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(60px, 1fr) auto minmax(60px, 1fr) auto !important;
  align-items: center !important;
  gap: 6px !important;
  color: #e2e8f0 !important;
  border: 1px solid rgba(125, 211, 252, .24) !important;
  border-radius: 9px !important;
  background: rgba(2, 8, 23, .84) !important;
  backdrop-filter: blur(9px) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.24) !important;
  pointer-events: none !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-route span {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 8px !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-route b {
  color: var(--esm-gps-accent) !important;
  font-size: 12px !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-route em {
  padding: 3px 6px !important;
  color: #fde68a !important;
  border-radius: 999px !important;
  background: rgba(120, 53, 15, .48) !important;
  font-size: 8px !important;
  font-style: normal !important;
  white-space: nowrap !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-vehicle-marker {
  width: 74px !important;
  height: 74px !important;
  display: block !important;
  pointer-events: none !important;
  filter: drop-shadow(0 8px 10px rgba(0,0,0,.44)) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-vehicle-model {
  width: 74px !important;
  height: 74px !important;
  display: block !important;
  transform-origin: 50% 50% !important;
  transition: transform .55s linear !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-vehicle-model model-viewer {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  background: transparent !important;
  --poster-color: transparent !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-destination-marker {
  font-size: 27px !important;
  filter: drop-shadow(0 4px 5px rgba(0,0,0,.38)) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-traffic-light {
  width: 12px !important;
  height: 28px !important;
  padding: 2px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: space-around !important;
  border: 1px solid white !important;
  border-radius: 4px !important;
  background: #111827 !important;
  box-shadow: 0 3px 7px rgba(0,0,0,.44) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-traffic-light i {
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-traffic-light i:nth-child(1) { background: #ef4444 !important; }
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-traffic-light i:nth-child(2) { background: #facc15 !important; }
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-traffic-light i:nth-child(3) { background: #22c55e !important; }

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-empty {
  display: grid !important;
  grid-template-rows: 1fr !important;
  place-items: center !important;
  border-style: dashed !important;
  background: linear-gradient(145deg, rgba(8, 25, 43, .78), rgba(2, 8, 23, .92)) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-empty > div,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-waiting-signal,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-map-error,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-load-error {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 18px !important;
  text-align: center !important;
  color: #cbd5e1 !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-empty span { color: var(--esm-gps-accent) !important; font-size: 34px !important; }
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-empty strong,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-waiting-signal b,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-load-error b { color: #f8fafc !important; font-size: 13px !important; }
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-empty small,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-waiting-signal span,
#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-load-error span { max-width: 260px !important; color: #7f9bb3 !important; font-size: 9px !important; line-height: 1.35 !important; }

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-waiting-signal {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(145deg, #102337, #07111f) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-load-error {
  grid-column: 1 / -1 !important;
  grid-row: 1 / -1 !important;
  border: 1px solid rgba(248, 113, 113, .3) !important;
  border-radius: 15px !important;
  background: rgba(69, 10, 10, .22) !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-source-note {
  position: absolute !important;
  right: 15px !important;
  bottom: 3px !important;
  z-index: 30 !important;
  color: rgba(226, 232, 240, .68) !important;
  font-size: 7px !important;
  pointer-events: none !important;
}

#modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .maplibregl-ctrl-attrib {
  max-width: 150px !important;
  font-size: 7px !important;
  opacity: .72 !important;
}

@media (max-width: 1120px) {
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title p { display: none !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title { min-width: 190px !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-pager-top span { display: none !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-btn { padding: 0 9px !important; }
}

@media (max-width: 820px) {
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-topbar { height: 58px !important; min-height: 58px !important; padding: 6px 8px !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title { min-width: 150px !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title h2 { font-size: 13px !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-title .modal-etiqueta { font-size: 8px !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-clock,
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] #btnCentrarGpsTraslados { display: none !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-layout { inset: 58px 0 0 !important; height: calc(100vh - 58px) !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitoring-center { overflow-y: auto !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-grid:not(.is-expanded) {
    height: auto !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(4, minmax(310px, 48vh)) !important;
  }
}

@media (max-height: 720px) and (min-width: 821px) {
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-topbar { height: 56px !important; min-height: 56px !important; padding-top: 5px !important; padding-bottom: 5px !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .gps-live-layout { inset: 56px 0 0 !important; height: calc(100vh - 56px) !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-card { grid-template-rows: 48px minmax(0, 1fr) !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-head { height: 48px !important; padding: 5px 8px !important; }
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-ident small,
  #modalTraslados:not(.oculto)[data-esm-gps-centro="1"] .esm-gps-monitor-speed span { margin-top: 2px !important; }
}