/* =====================================================================
   FUNNELLAB · ASISTENTE DE LA WEB (el chat)                    24-sep-2026
   Botón flotante abajo a la IZQUIERDA (la derecha es del botón «Agenda
   tu diagnóstico») y un panel de chat. Colores escritos a mano: esta hoja
   no depende de las variables de cada página (sirve en la v6 y en la v7).
   Navy #0A2540 · celeste #00B0C0 · celeste profundo #006C82 (texto sobre claro).
   ===================================================================== */
.fla-btn {
  position: fixed; left: max(18px, env(safe-area-inset-left)); bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 96; width: 56px; height: 56px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35);
  background: #0A2540; color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 30px -10px rgba(10,37,64,.75), 0 4px 14px -6px rgba(6,26,46,.45);
  transition: transform 220ms cubic-bezier(.23,1,.32,1), background 220ms;
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
.fla-btn svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fla-btn__punto { position: absolute; top: 4px; right: 4px; width: 11px; height: 11px; border-radius: 999px; background: #00B0C0; border: 2px solid #fff; }
.fla-btn__eti { position: absolute; left: 66px; bottom: 12px; white-space: nowrap; background: #fff; color: #0A2540; border: 1px solid rgba(10,37,64,.12);
  border-radius: 999px; padding: 7px 12px; font-size: 13px; font-weight: 600; box-shadow: 0 8px 22px -12px rgba(10,37,64,.5);
  opacity: 0; transform: translateX(-6px); pointer-events: none; transition: opacity 260ms, transform 260ms; }
.fla-btn.fla-btn--eti .fla-btn__eti { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) { .fla-btn:hover { transform: translateY(-2px); background: #11365C; } }
.fla-btn:focus-visible { outline: 2px solid #00B0C0; outline-offset: 3px; }
body.fla-abierto .fla-btn { display: none; }

.fla {
  position: fixed; left: max(18px, env(safe-area-inset-left)); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 97;
  width: 384px; max-width: calc(100vw - 36px); height: 620px; max-height: calc(100vh - 36px - env(safe-area-inset-bottom));
  display: none; flex-direction: column; overflow: hidden;
  background: #fff; color: #0A2540; border-radius: 18px; border: 1px solid rgba(10,37,64,.12);
  box-shadow: 0 30px 70px -30px rgba(10,37,64,.55), 0 10px 30px -18px rgba(6,26,46,.4);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size: 15px; line-height: 1.45;
  transform-origin: bottom left; animation: fla-abrir 220ms cubic-bezier(.23,1,.32,1);
}
.fla[data-abierto="1"] { display: flex; }
@keyframes fla-abrir { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.fla * { box-sizing: border-box; }
.fla__cab { display: flex; align-items: center; gap: 11px; padding: 14px 14px 12px; background: #0A2540; color: #fff; flex: none; }
.fla__marca { width: 38px; height: 38px; border-radius: 12px; background: #00B0C0; color: #0A2540; display: grid; place-items: center; font-weight: 800; font-size: 14px; letter-spacing: -.02em; flex: none; }
.fla__tit { font-weight: 600; font-size: 15px; line-height: 1.2; }
.fla__sub { font-size: 12px; color: #b9c7d6; margin-top: 2px; }
.fla__sub b { color: #5FD0DC; font-weight: 600; }
.fla__cerrar { margin-left: auto; width: 34px; height: 34px; border-radius: 999px; border: 0; background: rgba(255,255,255,.1); color: #fff; cursor: pointer; font-size: 20px; line-height: 1; display: grid; place-items: center; }
.fla__cerrar:hover { background: rgba(255,255,255,.2); }
.fla__cuerpo { flex: 1; overflow-y: auto; padding: 14px 14px 6px; background: #F5F7FA; scroll-behavior: smooth; }
.fla__msg { max-width: 88%; padding: 10px 13px; border-radius: 14px; margin: 0 0 8px; white-space: pre-wrap; word-wrap: break-word; }
.fla__msg--a { background: #fff; border: 1px solid rgba(10,37,64,.1); border-bottom-left-radius: 5px; }
.fla__msg--u { background: #0A2540; color: #fff; margin-left: auto; border-bottom-right-radius: 5px; }
.fla__msg--e { background: #FFF4E5; color: #7a4a00; border: 1px solid #f3d9a8; font-size: 14px; }
.fla__msg a { color: #006C82; text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.fla__msg--u a { color: #5FD0DC; }
.fla__msg b { font-weight: 600; }
.fla__cita { margin: 2px 0 12px; max-width: 88%; }
.fla__cita-btn { display: inline-flex; align-items: center; gap: 8px; background: #00B0C0; color: #0A2540; text-decoration: none; font-weight: 600; font-size: 14px; padding: 11px 16px; border-radius: 999px; box-shadow: 0 10px 24px -12px rgba(0,176,192,.8); }
.fla__cita-btn:hover { background: #14C3D2; }
.fla__cita-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fla__cita-nota { font-size: 12.5px; color: #55555f; margin: 6px 2px 0; }
.fla__sug { display: flex; flex-wrap: wrap; gap: 7px; margin: 4px 0 10px; }
.fla__sug button { border: 1px solid rgba(0,108,130,.35); background: #fff; color: #006C82; border-radius: 999px; padding: 7px 12px; font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; }
.fla__sug button:hover { background: #E4F5F8; }
.fla__esc { display: inline-flex; gap: 4px; padding: 12px 14px; background: #fff; border: 1px solid rgba(10,37,64,.1); border-radius: 14px; border-bottom-left-radius: 5px; margin-bottom: 8px; }
.fla__esc i { width: 7px; height: 7px; border-radius: 999px; background: #8499AC; animation: fla-punto 1s infinite ease-in-out; }
.fla__esc i:nth-child(2) { animation-delay: .15s; } .fla__esc i:nth-child(3) { animation-delay: .3s; }
@keyframes fla-punto { 0%,80%,100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-4px); opacity: 1; } }
.fla__pie { flex: none; border-top: 1px solid rgba(10,37,64,.1); background: #fff; padding: 10px 12px 8px; }
.fla__form { display: flex; align-items: flex-end; gap: 8px; }
.fla__form textarea { flex: 1; resize: none; border: 1px solid rgba(10,37,64,.18); border-radius: 12px; padding: 10px 12px; font: inherit; font-size: 15px; line-height: 1.4; min-height: 42px; max-height: 120px; color: #0A2540; background: #fff; }
.fla__form textarea:focus { outline: 2px solid #00B0C0; outline-offset: 0; border-color: transparent; }
.fla__form button { width: 42px; height: 42px; border-radius: 12px; border: 0; background: #00B0C0; color: #0A2540; cursor: pointer; display: grid; place-items: center; flex: none; }
.fla__form button:disabled { opacity: .45; cursor: default; }
.fla__form button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.fla__nota { font-size: 11.5px; color: #55555f; margin: 7px 2px 0; }
.fla__nota a { color: #006C82; font-weight: 500; }

@media (max-width: 560px) {
  .fla { left: 0; right: 0; bottom: 0; width: 100%; max-width: none; height: 100%; max-height: 100dvh; border-radius: 0; border: 0; transform-origin: bottom center; }
  .fla__cab { padding-top: max(14px, env(safe-area-inset-top)); }
  .fla__pie { padding-bottom: max(8px, env(safe-area-inset-bottom)); }
  .fla-btn { left: max(14px, env(safe-area-inset-left)); bottom: max(14px, env(safe-area-inset-bottom)); width: 52px; height: 52px; }
  .fla-btn__eti { display: none; }
}
/* si el recorrido automático muestra su píldora abajo al centro, el botón sube igual que el de agenda */
body:has(.auto-pill:not([hidden])) .fla-btn { bottom: calc(max(18px, env(safe-area-inset-bottom)) + 52px); }
@media print { .fla, .fla-btn { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .fla, .fla-btn, .fla-btn__eti { animation: none; transition: none; } }