Revertir sistema de paradas: eliminar apertura automática de ETACard y limpieza por falta de buses; restaurar interacción manual con paradas

frontend/src/components/ETACard.vue

@@ -27,8 +27,8 @@
         Desliza hacia abajo para cerrar
       </p>
 
-      <!-- Cabecera de la parada (Ocultar si no hay buses para modo minimalista) -->
+      <!-- Cabecera de la parada -->
-      <div v-if="buses.length > 0" class="mt-4 flex items-start gap-4 pb-4 border-b border-gray-100 dark:border-gray-800">
+      <div v-if="stopName" class="mt-4 flex items-start gap-4 pb-4 border-b border-gray-100 dark:border-gray-800">
         <div class="bg-blue-100 dark:bg-blue-900/40 p-3 rounded-2xl flex-shrink-0">
           <span class="material-icons text-blue-600 dark:text-blue-400 text-3xl">place</span>
         </div>
@@ -54,15 +54,10 @@
           <span class="mt-4 text-gray-500 dark:text-gray-400 font-medium animate-pulse">Calculando satélites...</span>
         </div>
 
-        <!-- Sin servicio (Actualizado según petición) -->
+        <!-- Sin servicio -->
-        <div v-else-if="buses.length === 0" class="bg-gray-50 dark:bg-gray-800/50 rounded-2xl p-8 text-center border-2 border-dashed border-gray-300 dark:border-gray-700 my-4">
+        <div v-else-if="buses.length === 0" class="p-6 text-center">
-          <div class="w-16 h-16 bg-gray-100 dark:bg-gray-800 rounded-full flex items-center justify-center mx-auto mb-4">
+          <span class="material-icons text-4xl text-gray-300 mb-2">event_busy</span>
-            <span class="material-icons text-4xl text-gray-400">no_bus</span>
+          <p class="text-gray-500 dark:text-gray-400 font-medium italic">
-          </div>
-          <h4 class="text-gray-900 dark:text-white font-black text-lg mb-2">
-            {{ t('map.noBusesAvailable') }}
-          </h4>
-          <p class="text-sm text-gray-500 dark:text-gray-400">
             {{ t('schedules.noSchedules') }}
           </p>
         </div>
@@ -131,8 +126,8 @@
         </template>
       </div>
 
-      <!-- Legal Disclaimer Intocable (Solo si hay buses) -->
+      <!-- Legal Disclaimer Intocable -->
-      <div v-if="buses.length > 0" class="mt-2 p-3 bg-yellow-50 dark:bg-yellow-900/20 rounded-xl flex items-start gap-3 border border-yellow-100 dark:border-yellow-900/50">
+      <div v-if="stopName" class="mt-2 p-3 bg-yellow-50 dark:bg-yellow-900/20 rounded-xl flex items-start gap-3 border border-yellow-100 dark:border-yellow-900/50">
         <span class="material-icons text-yellow-600 dark:text-yellow-500 text-lg mt-0.5 shrink-0">info</span>
         <p class="text-[11px] leading-snug text-yellow-800 dark:text-yellow-600/90 font-medium">
           <strong>Aviso:</strong> Este es un tiempo estimado basado en la velocidad promedio de las unidades en la ciudad. No existe rastreo GPS en tiempo real. 

frontend/src/components/map/ArrivalBanner.vue

@@ -13,7 +13,7 @@
           {{ hasActiveBuses ? t('map.arrivalTime') : t('common.notice') }}
         </span>
         <span class="trigger-text-compact truncate leading-tight">
-          {{ hasActiveBuses ? stopName : (isLoading ? t('common.loading') : t('map.noBusesAvailable')) }}
+          {{ isLoading ? t('common.loading') : stopName }}
         </span>
       </div>
  

frontend/src/composables/useFlujoPrincipal.ts

@@ -30,7 +30,8 @@ export const useFlujoPrincipal = () => {
         paradas: BusStop[],
         map: google.maps.Map | undefined,
         addCleanMarker: Function,
-        skipGuidedZoom = false
+        skipGuidedZoom = false,
+        onStopClick?: (stop: BusStop) => void
     ) => {
         if (!map) return
 
@@ -104,7 +105,9 @@ export const useFlujoPrincipal = () => {
                     p.nombre,
                     esCercana ? 'cercana' : (esPasada ? 'pasada' : 'normal'),
                     () => {
-                        console.log(`Click en parada: ${p.nombre}`);
+                        if (onStopClick && paradas[i]) {
+                            onStopClick(paradas[i]);
+                        }
                     }
                 );
             });

frontend/src/views/MapView.vue

@@ -239,7 +239,17 @@ async function updateMapMarkers(skipZoom = false) {
     }
     
     const selectedRouteObj = routeStore.allRoutes.find(r => r.id === currentRequestRouteId) || { id: currentRequestRouteId, short_name: currentRequestRouteId };
-    await procesarSeleccionDeRuta(selectedRouteObj, stops as BusStop[], map.value, addCleanMarker, skipZoom);
+    await procesarSeleccionDeRuta(
+      selectedRouteObj, 
+      stops as BusStop[], 
+      map.value, 
+      addCleanMarker, 
+      skipZoom,
+      (stop: BusStop) => {
+        paradaCercana.value = stop;
+        showETACard.value = true;
+      }
+    );
     reDrawUserMarker();
     
     if (routeStore.selectedRouteId !== currentRequestRouteId) return;
@@ -378,6 +388,8 @@ const sonarHtml = `
 
 // Watch for route selection changes
 // Watch for ETA loading to automatically show ETACard if no buses are available
+// REVERTED: Stop automatic opening and clearing
+/*
 watch([etaCargando, () => busesActivos.value.length], ([loading, count]) => {
   if (!loading && count === 0 && routeStore.selectedRouteId && routeStore.wasSelectedFromMap) {
     showETACard.value = true;
@@ -396,6 +408,7 @@ watch([etaCargando, () => busesActivos.value.length], ([loading, count]) => {
     }, 300);
   }
 });
+*/
 
 // Watch for route selection changes
 watch(() => routeStore.selectedRouteId, (routeId) => {
@@ -492,7 +505,7 @@ watch([() => authStore.userProfile?.auto_location, isLoaded], ([canLocate, loade
         >
           <template #extra-triggers>
             <ArrivalBanner 
-              :is-visible="!!(paradaCercana && routeStore.selectedRouteId && !isBannerClosing && routeStore.wasSelectedFromMap && busesActivos.length > 0)"
+              :is-visible="!!(paradaCercana && routeStore.selectedRouteId && !isBannerClosing && routeStore.wasSelectedFromMap)"
               :stop-name="paradaCercana?.name || ''"
               :is-loading="etaCargando"
               :has-active-buses="busesActivos.length > 0"