/* Mascota, conversación y formularios del asistente NEXEVO. */
.nx-asis {
  position: fixed;
  inset-block-end: 24px;
  inset-inline-end: 20px;
  z-index: 72;
  display: flex;
  align-items: flex-end;
  gap: 10px;
  pointer-events: none;
}

.nx-asis[data-position="bottom-left"] {
  inset-inline: 20px auto;
  flex-direction: row-reverse;
}

.nx-asis__mascot,
.nx-asis__globe,
.nx-asis__veil {
  pointer-events: auto;
}

.nx-asis__mascot {
  position: relative;
  z-index: 2;
  width: 84px;
  height: 84px;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent center / contain no-repeat;
  cursor: pointer;
  transition: transform 180ms cubic-bezier(.25, .8, .35, 1);
}

.nx-asis__mascot:hover {
  animation: none;
  outline: none;
  transform: translateY(-6px) rotate(-4deg) scale(1.08);
}

.nx-asis__mascot:focus-visible {
  animation: none;
  outline: 3px solid rgba(226, 103, 74, .45);
  outline-offset: 3px;
  transform: translateY(-6px) rotate(-4deg) scale(1.08);
}

.nx-asis__mascot:active {
  transform: translateY(-2px) rotate(-2deg) scale(1.02);
}

.nx-asis__globe {
  position: relative;
  z-index: 2;
  max-width: 220px;
  padding: 10px 14px;
  border: 0;
  border-radius: 12px 12px 2px 12px;
  background: #070707;
  color: #f4f2ec;
  box-shadow: 0 12px 30px rgba(7, 7, 7, .28);
  font: inherit;
  font-size: .875rem;
  line-height: 1.4;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity 220ms ease, transform 220ms ease, visibility 220ms;
}

.nx-asis[data-position="bottom-left"] .nx-asis__globe {
  border-radius: 12px 12px 12px 2px;
}

.nx-asis[data-globe="true"] .nx-asis__globe {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.nx-asis__veil {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 0;
  padding: 0;
  border: 0;
  background: rgba(7, 7, 7, .48);
  cursor: pointer;
}

.nx-asis[data-open="true"] .nx-asis__veil {
  display: none;
}

.nx-asis[data-open="true"] .nx-asis__globe {
  display: none;
}

@media (prefers-reduced-motion: no-preference) {
  .nx-asis:not([data-open="true"]) .nx-asis__mascot {
    animation: nx-asis-float 6s ease-in-out infinite;
  }

  .nx-asis:not([data-open="true"]) .nx-asis__mascot:hover,
  .nx-asis:not([data-open="true"]) .nx-asis__mascot:focus-visible {
    animation: none;
  }

  @keyframes nx-asis-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
  }
}

/* During a conversation, gestures come from the original pose artwork rather
   than a competing float/rotation. Keep the page's cookie layer above us. */
.nx-asis[data-open="true"] .nx-asis__mascot,
body:has(.nx-lead[open]) .nx-asis .nx-asis__mascot { animation: none; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .nx-asis__mascot:hover,
  .nx-asis__mascot:focus-visible {
    transform: scale(1.06);
  }
}

@media (max-width: 560px) {
  .nx-asis {
    inset-block-end: 18px;
    inset-inline-end: 12px;
  }

  .nx-asis[data-position="bottom-left"] {
    inset-inline: 12px auto;
  }

  .nx-asis__mascot {
    width: 62px;
    height: 62px;
  }

  .nx-asis__globe {
    max-width: min(220px, calc(100vw - 98px));
  }
}

body:has(.nx-franja--abierta) .nx-asis {
  visibility: hidden;
  pointer-events: none;
}

.nx-local{position:fixed;inset:auto 20px 24px auto;margin:0;width:min(420px,calc(100vw - 32px));max-height:calc(100dvh - 40px);box-sizing:border-box;border:1px solid #ddd;border-radius:18px;padding:0;background:#fff;color:#17212b;box-shadow:0 22px 65px #00000038;font:16px/1.5 system-ui,sans-serif}.nx-local::backdrop{background:transparent}.nx-local header{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid #eee}.nx-local button{font:inherit;cursor:pointer;border:1px solid #d9d4e8;border-radius:11px;padding:9px 12px;min-height:40px;background:#f6f2ff;color:#422b85}.nx-local button:focus-visible,.nx-local input:focus-visible{outline:3px solid #6841d9;outline-offset:2px}.nx-local-log{flex:1 1 auto;min-height:180px;overflow:auto;padding:14px 16px;overscroll-behavior:contain}.nx-local-log>.nx-local-agent,.nx-local-log>.nx-local-human{padding:10px 13px;border-radius:15px;white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 10px;max-width:86%}.nx-local-agent{background:#f3f1f8}.nx-local-human{background:#e6defa;margin-left:auto!important}.nx-local-choices{display:flex;gap:7px;flex-wrap:wrap;padding:8px 16px 12px;max-height:160px;overflow:auto;overscroll-behavior:contain}.nx-local form{display:flex;gap:8px;padding:12px;background:color-mix(in srgb,var(--nx-panel-text,#F4F2EC) 3%,transparent);border-top:1px solid #eee}.nx-local input{font:inherit;min-width:0;width:100%;border:1px solid #bbb;border-radius:12px;padding:11px 13px}.nx-local form button{background:#6841d9;color:white;min-width:72px}@media(max-width:560px){.nx-local{right:12px;bottom:12px}}
/* Shared NEXEVO presentation for local replies and the Chlozo connection. */
/* Tema del panel propio.
   Los colores vienen de los ajustes del plugin como variables CSS, no
   escritos aquí: esta hoja la comparten todos los clientes y antes
   cualquiera heredaba la paleta de NEXEVO. Los valores de reserva son los
   de NEXEVO para que su web no cambie al actualizar. */
.nx-local--tema {
  background: var(--nx-panel-bg, #070707);
  color: var(--nx-panel-text, #F4F2EC);
  border-color: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 22%, transparent);
  font-family: inherit;
}
.nx-local--tema header,
.nx-local--tema form {
  border-color: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 16%, transparent);
}
.nx-local-heading{display:flex;align-items:center;gap:10px;min-width:0}
.nx-local-heading>span:last-child{display:flex;flex-direction:column;min-width:0}
.nx-local--tema header strong{font-size:15px;line-height:1.25;letter-spacing:.1px}
.nx-local-heading small{font-size:12px;line-height:1.3;font-weight:400;opacity:.68}
.nx-local-status-dot{width:9px;height:9px;flex:0 0 auto;border-radius:50%;background:var(--nx-panel-accent,#E2674A);box-shadow:0 0 0 4px color-mix(in srgb,var(--nx-panel-accent,#E2674A) 15%,transparent)}
.nx-local header>button{min-height:36px;padding:7px 10px;font-size:13px}

/* Botones de respuesta rápida: antes eran cajas con borde tenue que se
   confundían con el fondo. Ahora tienen superficie propia y área de toque
   suficiente para un dedo. */
.nx-local--tema .nx-local-choices button {
  background: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 9%, transparent);
  color: var(--nx-panel-text, #F4F2EC);
  border-color: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 20%, transparent);
  border-radius: 999px;
  padding: 9px 14px;
  min-height: 40px;
}
.nx-local--tema .nx-local-choices button:hover {
  border-color: var(--nx-panel-accent, #E2674A);
  color: var(--nx-panel-accent, #E2674A);
}
.nx-local--tema button { color: var(--nx-panel-text, #F4F2EC); }
.nx-local--tema header button {
  background: transparent;
  border-color: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 28%, transparent);
}

/* Quién habla se distingue por posición, color y forma de la esquina, no
   sólo por el color de fondo. */
.nx-local--tema .nx-local-agent {
  background: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 8%, transparent);
  border-bottom-left-radius: 4px;
}
.nx-local--tema .nx-local-human,
.nx-local--tema form button {
  background: var(--nx-panel-accent, #E2674A);
  color: var(--nx-panel-on-accent, #111111);
}
.nx-local--tema .nx-local-human { border-bottom-right-radius: 4px; }
.nx-local--tema form button { border-color: transparent; font-weight: 600; }
.nx-local--tema input {
  background: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 6%, transparent);
  border-color: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 28%, transparent);
  color: var(--nx-panel-text, #F4F2EC);
}
.nx-local--tema input::placeholder {
  color: color-mix(in srgb, var(--nx-panel-text, #F4F2EC) 55%, transparent);
}
.nx-local--tema button:focus-visible,
.nx-local--tema input:focus-visible {
  outline-color: var(--nx-panel-accent, #E2674A);
}
.nx-local--tema button:disabled { opacity: .6; cursor: wait; }

/* Variante clara: mismas reglas, distinta superficie. */
.nx-local--claro { box-shadow: 0 20px 60px #0000002e; }

/* La cabecera y el compositor quedan fijos. Sólo se desplazan los mensajes
   y las opciones cuando la pantalla o el teclado dejan poco espacio. */
.nx-local[open]{display:flex;flex-direction:column;overflow:hidden;min-height:0;max-height:calc(100dvh - 28px)}
.nx-local header,.nx-local form{flex-shrink:0}
.nx-local-log{height:auto;max-height:none;min-height:0;flex:1 1 0;overscroll-behavior:contain}
.nx-local-choices{flex:0 1 auto;min-height:0;max-height:32%;overscroll-behavior:contain}
.nx-local-choices:empty{display:none}
.nx-local input{font-size:16px}
@media(max-height:440px){.nx-local header,.nx-local form{padding:8px 12px}.nx-local-choices{max-height:15%;padding:4px 12px}}

.nx-local{outline:none;z-index:71}
.nx-local-log>.nx-local-agent,.nx-local-log>.nx-local-human{font-size:15px;line-height:1.65}
.nx-local-agent p{margin:0 0 12px;padding:0;background:none;border:0;border-radius:0}
.nx-local-agent p:last-child{margin-bottom:0}
.nx-local-agent ol,.nx-local-agent ul{margin:12px 0;padding-left:24px;list-style-position:outside}
.nx-local-agent ol{list-style-type:decimal}.nx-local-agent ul{list-style-type:disc}
.nx-local-agent li{margin:0 0 10px;padding-left:3px}.nx-local-agent li:last-child{margin-bottom:0}
.nx-local-agent strong{font-weight:650;color:inherit}
.nx-local-log{scrollbar-width:thin;scrollbar-color:#777 #171717}

/* Solicitudes de contacto: conservan el formulario restaurado en 1.3.0 y
   usan ahora la misma paleta configurable que el chat. */
.nx-lead{z-index:73}
.nx-lead .nx-lead-form{flex:1;min-height:0;display:flex;flex-direction:column;align-items:stretch;gap:16px;overflow:auto}
.nx-lead-fields{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#777 #171717}
.nx-lead-fields label{display:block;margin:0 0 14px;font-size:16px;line-height:1.5}
.nx-lead-fields input,.nx-lead-fields textarea,.nx-lead-fields select{box-sizing:border-box;width:100%;padding:12px;border:1px solid color-mix(in srgb,var(--nx-panel-text,#F4F2EC) 28%,transparent);background:color-mix(in srgb,var(--nx-panel-text,#F4F2EC) 6%,transparent);color:var(--nx-panel-text,#F4F2EC);border-radius:10px;font:16px/1.5 system-ui,sans-serif}
.nx-lead-fields textarea{min-height:110px;resize:vertical}
.nx-lead-fields textarea:focus-visible,.nx-lead-fields select:focus-visible{outline:3px solid var(--nx-panel-accent,#E2674A);outline-offset:2px}
.nx-lead-fields p,.nx-lead-form>[role=status]{font-size:14px;line-height:1.6}
.nx-lead-fields a{color:var(--nx-panel-text,#F4F2EC);text-decoration:underline}
.nx-lead-actions{display:flex;gap:12px;justify-content:space-between;flex-shrink:0}
.nx-lead [hidden]{display:none!important}
.nx-lead-launch{pointer-events:auto;position:relative;z-index:2;font:inherit;font-size:14px;line-height:1.4;max-width:190px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--nx-panel-text,#F4F2EC) 28%,transparent);border-radius:12px;background:var(--nx-panel-bg,#070707);color:var(--nx-panel-text,#F4F2EC);cursor:pointer}
.nx-asis[data-open=true]>.nx-lead-launch{display:none}
.nx-lead-form>[role=status]{margin:0}

/* El panel no oscurece la web y siempre deja visible la mascota. */
.nx-asis__veil{display:none!important}

@media(max-width:360px){
  .nx-local form{flex-direction:column}
  .nx-local form button{width:100%}
  .nx-local-log{padding:12px}
  .nx-local-choices{padding-inline:12px}
}

/* Un único desplazamiento para mensajes y opciones: sin recortes de acciones
   ni un segundo scroll delante del compositor. Aislado del tema de WordPress. */
.nx-local, .nx-local * { box-sizing: border-box; }
.nx-local .nx-local-body {
  flex: 1 1 0;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb,var(--nx-panel-text,#F4F2EC) 35%,transparent) transparent;
}
.nx-local-body .nx-local-log {
  flex: none;
  overflow: visible;
  padding: 16px 16px 0;
}
.nx-local-body .nx-local-choices {
  flex: none;
  max-height: none;
  overflow: visible;
  gap: 8px;
  padding: 4px 16px 16px;
}
.nx-local .nx-local-choices[hidden] { display: none; }
.nx-local .nx-local-choices button {
  flex: 0 1 auto;
  width: auto;
  max-width: 100%;
  min-width: 0;
  min-height: 40px;
  margin: 0;
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 400;
  text-align: left;
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
  text-transform: none;
  letter-spacing: normal;
}
.nx-local .nx-local-choices button:hover { color: var(--nx-panel-text,#F4F2EC); }
.nx-local .nx-local-composer {
  display: grid;
  grid-template-columns: minmax(0,1fr) max-content;
  align-items: stretch;
  gap: 8px;
  margin: 0;
  padding: 12px;
}
.nx-local .nx-local-composer input {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: auto;
  min-height: 44px;
  margin: 0;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.4;
}
.nx-local .nx-local-composer button {
  width: auto;
  min-width: 76px;
  min-height: 44px;
  margin: 0;
  padding: 10px 14px;
  font-size: 14px;
  line-height: 1.4;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
  text-transform: none;
  letter-spacing: normal;
}
.nx-local header > button {
  flex: 0 0 auto;
  white-space: nowrap;
  margin: 0;
  text-transform: none;
  letter-spacing: normal;
}
.nx-local .nx-local-body:focus-visible {
  outline: 2px solid var(--nx-panel-text,#F4F2EC);
  outline-offset: -3px;
}
.nx-local .nx-lead-chat-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 16px;
}
.nx-local .nx-lead-chat-actions button {
  min-height: 40px;
  max-width: 100%;
  margin: 0;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 1.4;
  text-transform: none;
  letter-spacing: normal;
  white-space: normal;
  word-break: normal;
  color: var(--nx-panel-text,#F4F2EC);
  background: color-mix(in srgb,var(--nx-panel-text,#F4F2EC) 9%,transparent);
  border-color: color-mix(in srgb,var(--nx-panel-text,#F4F2EC) 28%,transparent);
}
.nx-local .nx-lead-chat-actions p { width: 100%; margin: 0; font-size: 12px; line-height: 1.5; }
.nx-local .nx-lead-chat-actions a { color: var(--nx-panel-text,#F4F2EC); font-size: 12px; text-decoration: underline; }
.nx-local button:focus-visible, .nx-local input:focus-visible {
  outline-width: 2px;
  outline-offset: 2px;
}
@media(max-width:360px) {
  .nx-local .nx-local-composer { gap: 6px; padding: 10px; }
  .nx-local .nx-local-composer button { min-width: 64px; padding-inline: 10px; }
  .nx-local-body .nx-local-log { padding-inline: 12px; }
  .nx-local-body .nx-local-choices { padding-inline: 12px; }
}
