Fix UI overlapping, transport load error handling, and schedule filtering bugs

frontend/src/composables/useGoogleMaps.ts

@@ -16,7 +16,9 @@ export function useGoogleMaps() {
     const error = ref<string | null>(null)
     const {
         registrarMarker,
+        registrarRenderer,
         registrarPolyline,
+        registrarCallbackLimpieza,
         limpiarMapa: limpiarTodoCentralizado
     } = useMapState()
 
@@ -121,6 +123,13 @@ export function useGoogleMaps() {
         if (map.value && !globalOverlays.has(map.value)) {
             globalOverlays.set(map.value, new Set())
         }
+
+        // Registrar callback para limpiar globalOverlays cuando useMapState.limpiarMapa() sea llamado
+        registrarCallbackLimpieza(() => {
+            if (map.value && globalOverlays.has(map.value)) {
+                clearAllOverlaysForMap(map.value)
+            }
+        })
     }
 
     function addMarker(
@@ -420,6 +429,12 @@ export function useGoogleMaps() {
             return []
         }
 
+        // Limpiar antes de dibujar una nueva ruta para evitar acumulación
+        limpiarTodoCentralizado()
+        if (map.value && globalOverlays.has(map.value)) {
+            clearAllOverlaysForMap(map.value)
+        }
+
         const directionsService = new google.maps.DirectionsService();
         const renderizadoresActivos: google.maps.DirectionsRenderer[] = [];
         const tamañoChunk = 25;
@@ -453,14 +468,15 @@ export function useGoogleMaps() {
                     suppressMarkers: true,
                     preserveViewport: true, // Siempre conservar la vista ya que trazamos fragmentos
                     polylineOptions: {
-                        strokeColor: '#0057FF', // Azul
-                        strokeWeight: 4,
-                        strokeOpacity: 0.8
+                        strokeColor: '#FBBF24', // Amarillo consistente con paradas
+                        strokeWeight: 5,
+                        strokeOpacity: 0.95
                     }
                 });
 
                 renderer.setDirections(response);
                 renderizadoresActivos.push(renderer);
+                registrarRenderer(renderer); // Registrar para limpieza centralizada
 
                 // Registrar en global overlays para limpiarlos después
                 if (!globalOverlays.has(map.value)) {

frontend/src/composables/useMapState.ts

@@ -39,6 +39,13 @@ export const useMapState = () => {
         return infoWindow
     }
 
+    // Callback para sincronización externa (ej. useGoogleMaps globalOverlays)
+    const onLimpiarCallback = ref<(() => void) | null>(null)
+
+    const registrarCallbackLimpieza = (fn: () => void) => {
+        onLimpiarCallback.value = fn
+    }
+
     // ⚠️ FUNCIÓN CRÍTICA: limpiar ABSOLUTAMENTE TODO del mapa
     const limpiarMapa = () => {
         // Eliminar markers
@@ -97,6 +104,13 @@ export const useMapState = () => {
         })
         circles.value = []
 
+        // Ejecutar callback de limpieza externa si existe
+        if (onLimpiarCallback.value) {
+            try { onLimpiarCallback.value() } catch (e) {
+                console.warn('Error en callback de limpieza externa', e)
+            }
+        }
+
         console.log('SIBU | Mapa limpiado completamente ✓')
     }
 
@@ -111,6 +125,7 @@ export const useMapState = () => {
         registrarPolyline,
         registrarCircle,
         registrarInfoWindow,
+        registrarCallbackLimpieza,
         limpiarMapa
     }
 }