/* ==========================================================================
   IRON ROUTE — FLOTA EN EL MAPA (M2.1 / M3.1)

   Dos estados y nada más: reportando (verde) y sin señal (gris). Un tablero
   de despacho con seis colores no se lee de un vistazo, y el vistazo es todo
   lo que un dispatcher le dedica entre llamada y llamada.
   ========================================================================== */

.fm-icono { background: none; border: 0; }

.fm-pin {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--fm, #10B981);
  border: 2px solid #FFFFFF;
  box-shadow: 0 2px 6px rgba(3, 13, 28, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
}
.fm-pin__u {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px;               /* el mínimo del sistema; no baja de aquí */
  font-weight: 700;
  color: #04121F;
  line-height: 1;
  letter-spacing: -0.02em;
}
/* Apagada: gris y con el borde punteado, para que se distinga también sin
   color — un 8% de los conductores no distingue verde de gris. */
.fm-pin--off {
  border-style: dashed;
  opacity: 0.85;
}
.fm-pin--off .fm-pin__u { color: #22303F; }

/* ── El globo ───────────────────────────────────────────────────────────── */
.fm-pop {
  font-family: 'DM Sans', system-ui, sans-serif;
  min-width: 190px;
  line-height: 1.35;
}
.fm-pop strong { font-size: 15px; display: block; margin-bottom: 2px; }
.fm-pop__l { font-size: 13px; color: var(--text-muted, #5A6B80); }
.fm-pop__edad {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px;
  color: #0E7C5A;
  margin-top: 4px;
}
.fm-pop__edad--off { color: #B4531A; }
.fm-pop__sep {
  height: 1px;
  background: var(--line, #D8DEE7);
  margin: 8px 0 6px;
}
.fm-pop__carga { font-size: 14px; font-weight: 600; }
.fm-pop__dinero {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 14px;
  font-weight: 700;
  color: #0A6E4F;
  margin-top: 4px;
}

/* ── La barra de resumen ────────────────────────────────────────────────── */
.fm-resumen {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  top: calc(env(safe-area-inset-top, 0px) + 10px);
  z-index: 1200;
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(10, 27, 51, 0.92);
  border: 1px solid var(--line, #1E3A5F);
  box-shadow: 0 4px 14px rgba(3, 13, 28, 0.35);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px;
  color: var(--text, #F5F7FA);
  max-width: calc(100vw - 24px);
  flex-wrap: wrap;
  justify-content: center;
}
.fm-resumen[hidden] { display: none; }
.fm-resumen__ok  { color: #34D399; }
.fm-resumen__off { color: #F5A623; }
.fm-resumen__u   { color: var(--text-muted, #9FB0C3); }

.fm-resumen--aviso {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 13px;
  color: var(--text, #F5F7FA);
  text-align: center;
  line-height: 1.4;
}

/* Teléfono: se aprieta el espaciado, NO el tamaño de letra. La regla del
   sistema es 12px de suelo absoluto y no se rompe por caber. */
@media (max-width: 480px) {
  .fm-resumen { gap: 10px; padding: 7px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .fm-pin { transition: none; }
}