/* ==========================================================================
   Vista de viaje, versión «vidrio» (v49): corrige solapes y deja el chat, los
   botones flotantes y el código de inicio con la misma línea Apple-like.
   Se carga después de up-pizarra.css; no cambia ninguna lógica.
   ========================================================================== */

/* 1) El contenedor usaba 100vh: en el teléfono quedaba más alto que la pantalla visible
      y el dock inferior tapaba el último texto. */
.client-dashboard-shell, .passenger-operations-dark.mobile-line-dashboard { height: 100dvh !important; max-height: 100dvh; }
.mobile-line-content { padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px)) !important; scroll-padding-bottom: 120px; }

/* 2) Botón de chat flotante duplicado: si ya hay dock inferior (Chat, Llamar, SOS…) sobra. */
body:has(nav.fixed.bottom-3) .up-chat__fab { display: none !important; }
body:has(nav.fixed.bottom-3) .fixed.bottom-24.right-3:not(:has(.up-chat)) { display: none !important; }

/* 3) Botones flotantes (consejos de seguridad y soporte) en vidrio, por encima del dock y sin pisarse. */
.wt-safety-btn {
  width: 46px !important; height: 46px !important; right: 14px !important;
  bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
  background: rgba(20, 32, 45, .62) !important; color: #f6fbe8 !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%);
  box-shadow: 0 10px 28px rgba(5,12,20,.35), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
body:has(nav.fixed.bottom-3) div[style*="2147483000"] { bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important; left: 14px !important; transform: scale(.9); transform-origin: left bottom; }
div[style*="2147483000"] > button {
  background: rgba(20, 32, 45, .62) !important; border: 1px solid rgba(255,255,255,.18) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%);
  box-shadow: 0 10px 28px rgba(5,12,20,.35), inset 0 1px 0 rgba(255,255,255,.22) !important;
}

/* 4) Código de inicio: tarjeta compacta de vidrio al pie del mapa, ya no tapa la ruta. */
.mobile-line-map > .absolute.top-20.left-4.right-4.z-20 { top: auto !important; bottom: 34px; left: 12px !important; right: 12px !important; }
.mobile-line-map > .absolute.top-20.left-4.right-4.z-20 > div {
  padding: 10px 16px !important; border-radius: 22px !important;
  background: linear-gradient(160deg, rgba(255,255,255,.14), rgba(255,255,255,.04) 45%), rgba(16, 26, 38, .7) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  -webkit-backdrop-filter: blur(24px) saturate(170%); backdrop-filter: blur(24px) saturate(170%);
  box-shadow: 0 14px 34px rgba(4,10,18,.4), inset 0 1px 0 rgba(255,255,255,.22) !important;
  display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 14px; row-gap: 2px;
}
.mobile-line-map > .absolute.top-20.left-4.right-4.z-20 p:first-child { grid-column: 1 / -1; color: #b7ef4c !important; margin: 0; }
.mobile-line-map > .absolute.top-20.left-4.right-4.z-20 p:last-child { grid-column: 1 / -1; color: rgba(236,244,250,.7) !important; font-size: 11.5px !important; margin: 0; }
.mobile-line-map > .absolute.top-20.left-4.right-4.z-20 [class*="text-3xl"], .mobile-line-map > .absolute.top-20.left-4.right-4.z-20 [class*="text-4xl"] { font-size: 28px !important; line-height: 1.1 !important; color: #f7fbe9 !important; letter-spacing: .28em; }

/* 5) Chat: hoja inferior de vidrio, a todo el ancho en el teléfono, sin transparencias que dejen ver lo de atrás. */
@media (max-width: 640px) {
  .fixed.z-\[9990\]:has(> .up-chat) { top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important; width: 100vw !important; height: 100dvh !important; margin: 0 !important; padding: 0 !important; display: block !important; pointer-events: none; transform: none !important; }
  .fixed.z-\[9990\]:has(> .up-chat) .up-chat__fab { display: none !important; }
  .fixed.z-\[9990\] > .up-chat {
    position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; width: 100vw !important; max-width: 100vw !important;
    height: min(78dvh, 660px) !important; border-radius: 30px 30px 0 0 !important; pointer-events: auto;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: linear-gradient(170deg, rgba(255,255,255,.1), rgba(255,255,255,.02) 40%), rgba(13, 21, 31, .9) !important;
    -webkit-backdrop-filter: blur(34px) saturate(170%); backdrop-filter: blur(34px) saturate(170%);
    box-shadow: 0 0 0 100vmax rgba(4, 9, 15, .5), 0 -18px 50px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.2) !important;
  }
  .up-chat::before { content: ""; position: absolute; top: 8px; left: 50%; width: 38px; height: 5px; margin-left: -19px; border-radius: 3px; background: rgba(255,255,255,.28); }
  .up-chat .up-chat__head { padding-top: 22px !important; }
  .up-chat .up-chat__bar { padding: 10px 12px 14px !important; background: transparent !important; border-top: 1px solid rgba(255,255,255,.1) !important; }
  .up-chat .up-chat__input { background: rgba(255,255,255,.1) !important; color: #f4f8fb !important; border: 1px solid rgba(255,255,255,.14) !important; min-height: 44px; font-size: 16px !important; }
  .up-chat .up-chat__input::placeholder { color: rgba(236,244,250,.5); }
  .up-chat .up-chat__send { width: 44px !important; height: 44px !important; background: linear-gradient(145deg, #c4f55a, #9fdc2c) !important; }
  .up-chat .up-chat__send:disabled { background: rgba(255,255,255,.14) !important; }
  .up-chat .up-chat__send svg { color: #10200a !important; }
  /* el aviso «Chat seguro abierto» ya no tapa el campo de texto */
  body:has(.up-chat) [data-sonner-toaster] { top: 12px !important; bottom: auto !important; }
}

/* 6) Entrada del botón de verificar OTP y código siempre visibles en pantallas estrechas. */
input[placeholder="Código OTP"] { min-width: 0; }

/* Con el chat abierto, los botones flotantes se esconden para no pisar la hoja. */
body:has(.up-chat) .wt-safety-btn, body:has(.up-chat) div[style*="2147483000"] { display: none !important; }