/* VitaWeb Care · ANTIDISTORSIÓN (23-oct-2026, pedido de Joe: "se distorsiona mucho… cuando hable se
   cambia de tamaño"). Nada cambia de alto o de ancho mientras el asistente escucha o habla:
   cada texto que cambia tiene su espacio fijo y lo que no cabe se recorta o se desplaza por dentro.
   Va DESPUÉS de los estilos de la página: solo fija tamaños, no cambia colores ni diseño. */

/* El navegador del celular no debe agrandar ni achicar la letra por su cuenta (Chrome Android la
   "infla" según el texto que hay en pantalla: al llegar texto nuevo, todo cambiaba de tamaño). */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* Nada puede ensanchar la página (sin esto, la página se reajusta y parece distorsionada). */
html, body { overflow-x: hidden; max-width: 100%; }
img, video, svg { max-width: 100%; }

/* ---- Asistente: la tarjeta de voz no cambia de tamaño y sus ondas no se salen */
.assistant-voice-card { overflow: hidden; contain: layout paint; }
.assistant-orb { flex: none; width: 132px; height: 132px; }
/* Estado ("Escuchando", "Pensando…"): siempre una línea */
.assistant-state { height: 30px; line-height: 30px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Detalle debajo del estado: siempre el alto de 2 líneas */
.assistant-state-detail { height: 42px; min-height: 42px; line-height: 21px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
/* Botón principal y chips: el texto cambia ("Conversar" / "Detener conversación"), el tamaño no */
.assistant-talk { width: 270px; max-width: 100%; height: 72px; min-height: 72px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.assistant-voice-actions { min-height: 96px; align-content: flex-start; }
.assistant-voice-actions .chip { white-space: nowrap; }
.assistant-voice-actions [data-assistant-keyboard] { min-width: 160px; }
.assistant-voice-actions [data-assistant-stop-speech] { min-width: 148px; }

/* Lo que va entendiendo mientras hablas: siempre 2 líneas y se ven las ÚLTIMAS palabras */
.assistant-voice-preview { height: 36px; min-height: 36px; line-height: 18px; white-space: normal; text-overflow: clip; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end; margin: 6px 0 0; }

/* Transcripción: alto fijo; los mensajes nuevos se desplazan por dentro (no empujan la pantalla) */
.assistant-transcript { height: 172px; max-height: 172px; overflow-y: auto; overscroll-behavior: contain; }
.assistant-transcript:not(.collapsed) { height: min(46dvh, 380px); max-height: min(46dvh, 380px); }
.assistant-transcript .assistant-bubble { overflow-wrap: anywhere; }

/* Presionar para hablar (23-oct): el círculo y el botón se mantienen presionados sin que el celular
   seleccione texto, abra menús ni mueva la pantalla. */
[data-assistant-mic] { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; touch-action: none; cursor: pointer; }
.assistant-orb[data-assistant-mic]:active { transform: scale(.96); }
.assistant-talk.vw-ptt-on { background: rgba(185,230,160,.22); border-color: rgba(185,230,160,.6); color: #F1F6EC; }

/* Preguntas sugeridas: una sola fila que se desliza */
.assistant-suggestions { flex-wrap: nowrap; min-height: 50px; }