/* Chat de la web (14/10/2026). Ver app/chat.php y estatico/chat.js.
   Colores de la marca: lean en tinta, imaGym en magenta. */
.chat-panel {
  --chat-acento: var(--ink, #0E0E0C);
  --chat-sobre: #fff;
  position: fixed; right: 20px; bottom: 92px; z-index: 71;
  /* Más grande y más alto (David, 14/10/2026): antes 380×560. */
  width: min(440px, calc(100vw - 28px)); height: min(760px, calc(100vh - 110px));
  display: flex; flex-direction: column;
  background: #fff; color: #0E0E0C; border-radius: 16px; overflow: hidden;
  box-shadow: 0 18px 48px rgba(0,0,0,.28); font-size: 15px; line-height: 1.4;
}
.chat-panel[hidden] { display: none; }
.marca-imagym .chat-panel { --chat-acento: #FF00AA; --chat-sobre: #000; }
.chat-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 14px 16px; background: var(--chat-acento); color: var(--chat-sobre); }
.chat-cab strong { display: block; font-size: 16px; }
.chat-cab small { display: block; opacity: .85; font-size: 12px; margin-top: 2px; }
.chat-x { background: none; border: 0; color: inherit; font-size: 28px; line-height: 1; cursor: pointer; padding: 0 4px; }
.chat-lista { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 8px; background: #F4F6F7; }
.chat-msg { max-width: 82%; padding: 8px 11px; border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.chat-msg p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-msg small { display: block; margin-top: 3px; font-size: 11px; color: #5C6975; }
.chat-msg.yo { align-self: flex-end; background: var(--chat-acento); color: var(--chat-sobre); border-bottom-right-radius: 4px; }
.chat-msg.yo small { color: inherit; opacity: .75; }
/* imaGym: el texto negro sobre magenta se leía regular (David, 14/10/2026). Lo
   que escribe el visitante va en negro con letra blanca; el magenta se queda
   en la cabecera y el botón. */
.marca-imagym .chat-msg.yo { background: #141414; color: #fff; }
.chat-msg.ellos { align-self: flex-start; border-bottom-left-radius: 4px; }
.chat-escribe p { color: #5C6975; font-style: italic; }
.chat-escribe[hidden] { display: none; }
.chat-aviso { margin: 0; padding: 8px 14px; background: #FFF4E5; color: #7A4B00; font-size: 13px; }
.chat-aviso[hidden] { display: none; }
.chat-form { border-top: 1px solid #E2E6E8; padding: 10px 12px 8px; display: flex; flex-direction: column; gap: 8px; background: #fff; }
.chat-datos { display: grid; gap: 6px; }
.chat-datos[hidden] { display: none; }
.chat-form input, .chat-form textarea { font: inherit; font-size: 15px; width: 100%; min-width: 0; box-sizing: border-box;
  border: 1.5px solid #D3D8DC; border-radius: 10px; padding: 8px 10px; background: #fff; color: #0E0E0C; }
.chat-form textarea { resize: none; }
.chat-form input:focus, .chat-form textarea:focus { outline: 2px solid var(--chat-acento); outline-offset: 0; border-color: transparent; }
.chat-fila { display: flex; gap: 8px; align-items: flex-end; }
.chat-enviar { flex: none; border: 0; border-radius: 10px; padding: 10px 14px; font: inherit; font-weight: 700;
  background: var(--chat-acento); color: var(--chat-sobre); cursor: pointer; }
.chat-enviar:disabled { opacity: .5; cursor: default; }
.chat-legal { margin: 0; font-size: 11px; color: #5C6975; }
.chat-legal a { color: inherit; text-decoration: underline; }
.chat-trampa { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; }
.chat-boton { position: fixed; }
.chat-punto { position: absolute; top: 4px; right: 4px; width: 12px; height: 12px; border-radius: 50%;
  background: #E5322D; border: 2px solid #fff; }
.chat-punto[hidden] { display: none; }
@media (max-width: 760px) {
  .chat-panel { right: 8px; left: 8px; width: auto; bottom: calc(84px + env(safe-area-inset-bottom)); height: calc(100vh - 100px); height: calc(100dvh - 100px - env(safe-area-inset-bottom)); top: auto; }
  .marca-imagym .chat-panel { bottom: calc(142px + env(safe-area-inset-bottom)); height: calc(100vh - 160px); height: calc(100dvh - 160px - env(safe-area-inset-bottom)); }
}