diff --git a/frontend/src/views/MapView.vue b/frontend/src/views/MapView.vue
index 6c34284..a784168 100644
--- a/frontend/src/views/MapView.vue
+++ b/frontend/src/views/MapView.vue
@@ -831,13 +831,14 @@ async function calculateWalkingPath(origin: { lat: number, lng: number }, target
search
-
+
directions_bus
+ ver rutas
@@ -1416,24 +1417,65 @@ async function calculateWalkingPath(origin: { lat: number, lng: number }, target
background: var(--header-bg);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
- height: 56px;
- border-radius: 18px;
+ height: 44px; /* Tamaño compacto ajustado */
+ border-radius: 12px;
display: flex;
align-items: center;
- padding: 0 20px;
+ padding: 0 16px;
box-shadow: var(--shadow);
cursor: pointer;
border: 1px solid var(--border-color);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
- width: 100%; /* Take full width of container */
+ width: 100%;
max-width: 500px;
}
+.uber-search-trigger-compact {
+ background: var(--active-color) !important;
+ color: #101820 !important; /* Texto oscuro para el amarillo SIBU */
+ height: 44px; /* Tamaño del logo / botones header */
+ border-radius: 12px;
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ padding: 0 16px;
+ box-shadow: 0 4px 12px rgba(0,0,0,0.2);
+ cursor: pointer;
+ border: none;
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+ width: fit-content;
+ pointer-events: auto;
+}
+
+/* En modo claro, el botón es azul, usamos texto blanco */
+html.light-theme .uber-search-trigger-compact {
+ color: #ffffff !important;
+}
+
+.uber-search-trigger-compact:hover {
+ transform: translateY(-2px);
+ box-shadow: 0 6px 16px rgba(0,0,0,0.3);
+}
+
+.uber-search-trigger-compact .search-icon {
+ margin: 0;
+ font-size: 20px;
+ color: inherit !important;
+}
+
+.trigger-label {
+ font-size: 0.9rem;
+ font-weight: 800;
+ text-transform: uppercase;
+ letter-spacing: 0.02em;
+ white-space: nowrap;
+}
+
.uber-search-trigger.circular {
- width: 60px;
+ width: 44px; /* Mantener cuadrado */
padding: 0;
justify-content: center;
- border-radius: 20px;
+ border-radius: 12px;
}
.triggers-row {