/* La pantalla de un lead (#/lead/<id>): una oportunidad, una pantalla.
   Todo va con el prefijo .lw para no tocar ninguna otra pantalla del portal.
   Orden de atención: quién es → la conversación → la respuesta → qué toca → lo demás. */

/* ---------- El portal cede el sitio ---------- */
body.en-lead .contenido { padding: .65rem .85rem 0; }
body.en-lead .disposicion { min-height: 0; }
/* La barra del portal, más fina en esta pantalla: cada línea que sobra arriba es una menos de conversación. */
body.en-lead .cabecera { padding-top: .32rem; padding-bottom: .32rem; }
body.en-lead .cabecera .marca span { display: none; }
body.en-lead.menu-plegado .lateral { width: 56px; padding-left: .4rem; padding-right: .4rem; }
body.en-lead.menu-plegado .lateral a { justify-content: center; padding-left: 0; padding-right: 0; }
body.en-lead.menu-plegado .lateral .texto-nav,
body.en-lead.menu-plegado .lateral .contador { display: none; }

.lw {
  --lw-linea: var(--borde-suave);
  --lw-cliente: var(--panel);
  --lw-nosotros: #e6f3f1;
  --lw-nosotros-borde: #cfe6e2;
  display: grid; grid-template-rows: auto minmax(0, 1fr); gap: .6rem;
  min-height: 360px; min-width: 0;
}
@media (prefers-color-scheme: dark) {
  .lw { --lw-nosotros: #143139; --lw-nosotros-borde: #1f4650; }
}

/* ---------- Cabecera: una sola línea ---------- */
.lw-cab { display: flex; align-items: center; gap: .75rem; min-width: 0; min-height: 3.1rem; }
.lw-icono {
  flex: none; width: 2.1rem; height: 2.1rem; display: grid; place-items: center;
  border: 1px solid var(--borde); border-radius: 10px; background: var(--panel); color: var(--texto-suave);
  font: inherit; font-weight: 650; cursor: pointer;
}
.lw-icono:hover { color: var(--marino); border-color: var(--marino-claro); }
.lw-icono.pequeno { width: 1.6rem; height: 1.6rem; border-radius: 8px; border-color: transparent; background: none; }
.lw-volver {
  flex: none; display: inline-flex; align-items: center; gap: .35rem; text-decoration: none;
  color: var(--texto-suave); font-size: .84rem; padding: .3rem .55rem .3rem .3rem; border-radius: 10px;
}
.lw-volver:hover { background: var(--arena); color: var(--marino); }
.lw-volver strong { display: block; font-weight: 600; color: var(--texto); line-height: 1.2; }
.lw-volver .lw-columna { display: block; font-size: .74rem; line-height: 1.2; }
.lw-quien { flex: 1 1 auto; min-width: 0; padding-left: .75rem; border-left: 1px solid var(--borde); }
.lw-nombre-fila { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.lw-quien h1 { margin: 0; font-size: 1.28rem; font-weight: 680; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lw-resumen { display: flex; flex-wrap: wrap; gap: 0 .55rem; font-size: .9rem; color: var(--texto); margin-top: .05rem; }
.lw-resumen span + span::before { content: "·"; margin-right: .55rem; color: var(--texto-suave); }
.lw-resumen span:first-child { font-weight: 600; }

/* La etapa, al lado del nombre */
.lw-desplegable { position: relative; flex: none; }
.lw-etapa {
  display: inline-flex; align-items: center; gap: .4rem; font: inherit; font-size: .82rem; font-weight: 600;
  padding: .26rem .6rem; border-radius: 999px; border: 1px solid var(--borde); background: var(--panel); color: var(--texto); cursor: pointer;
  white-space: nowrap;
}
.lw-etapa:hover:not(:disabled) { border-color: var(--marino-claro); }
.lw-etapa .cuna { color: var(--texto-suave); font-size: .7rem; }
.lw .punto { width: .55rem; height: .55rem; border-radius: 50%; flex: none; background: #b9ad94; display: inline-block; }
.lw .color-turquesa .punto, .lw .punto.color-turquesa { background: var(--turquesa); }
.lw .color-azul .punto, .lw .punto.color-azul { background: #3f7fbf; }
.lw .color-ambar .punto, .lw .punto.color-ambar { background: #d39a2f; }
.lw .color-verde .punto, .lw .punto.color-verde { background: var(--verde); }
.lw .color-gris .punto, .lw .punto.color-gris { background: #9aa3ab; }

.lw-menu {
  position: absolute; z-index: 30; top: calc(100% + .35rem); left: 0; min-width: 17rem; max-width: min(22rem, 90vw);
  background: var(--panel); border: 1px solid var(--borde); border-radius: 12px; box-shadow: var(--sombra); padding: .3rem;
  max-height: min(70vh, 30rem); overflow-y: auto;
}
.lw-menu .opcion {
  display: flex; align-items: flex-start; gap: .5rem; width: 100%; text-align: left; font: inherit; font-size: .88rem; color: var(--texto);
  background: none; border: none; border-radius: 8px; padding: .42rem .5rem; cursor: pointer;
}
.lw-menu .opcion .punto { margin-top: .42rem; }
.lw-menu button.opcion:hover { background: var(--turquesa-suave); }
.lw-menu .opcion .texto { flex: 1; min-width: 0; }
.lw-menu .opcion small { display: block; color: var(--texto-suave); font-size: .74rem; line-height: 1.3; font-weight: 400; }
.lw-menu .opcion small.aviso-envio { color: #9a5b00; font-weight: 600; }
.lw-menu .opcion.actual { font-weight: 650; cursor: default; align-items: center; }
.lw-menu .opcion.actual .punto { margin-top: 0; }
.lw-menu .opcion.actual .marca { margin-left: auto; font-size: .72rem; font-weight: 500; color: var(--texto-suave); }
.lw-menu .opcion.apagada { cursor: default; color: var(--texto-suave); }
.lw-menu .opcion.apagada .punto { opacity: .45; }
.lw-motivo { padding: .5rem; display: grid; gap: .45rem; }
.lw-motivo p { margin: 0; font-size: .8rem; color: var(--texto-suave); }
.lw-motivo .acciones { display: flex; gap: .4rem; }

/* Anterior · 4 / 17 · Siguiente */
.lw-nav { flex: none; display: flex; align-items: center; gap: .35rem; }
.lw-pos { font-size: .82rem; color: var(--texto-suave); font-variant-numeric: tabular-nums; min-width: 3.2rem; text-align: center; white-space: nowrap; }
a.lw-paso { text-decoration: none; }
.lw-paso {
  display: inline-flex; align-items: center; gap: .3rem; height: 2.1rem; padding: 0 .55rem; font: inherit; font-size: .86rem; font-weight: 600;
  border: 1px solid var(--borde); border-radius: 10px; background: var(--panel); color: var(--texto); cursor: pointer;
}
.lw-paso.sig { background: var(--marino); border-color: var(--marino); color: #fff; padding: 0 .6rem 0 .8rem; }
.lw-paso.sig:hover:not(:disabled) { background: var(--marino-claro); border-color: var(--marino-claro); }
.lw-paso.ant:hover:not(:disabled) { border-color: var(--marino-claro); color: var(--marino); }
.lw-paso:disabled { opacity: .38; cursor: default; }
.lw-atajos { left: auto; right: 0; min-width: 15rem; padding: .7rem .8rem; display: grid; gap: .3rem; font-size: .84rem; }
.lw-atajos .fila { display: flex; align-items: center; gap: .6rem; }
.lw-atajos kbd {
  min-width: 1.9rem; text-align: center; font: inherit; font-size: .76rem; font-weight: 650; padding: .08rem .35rem;
  border: 1px solid var(--borde); border-bottom-width: 2px; border-radius: 6px; background: var(--fondo);
}
.lw-atajos .nota { margin: .2rem 0 0; font-size: .75rem; color: var(--texto-suave); }

/* ---------- Cuerpo: datos a la izquierda, conversación a la derecha ---------- */
.lw-cuerpo { display: grid; grid-template-columns: 19.5rem minmax(0, 1fr); gap: .7rem; min-height: 0; }
.lw-telon, .lw-cerrar-datos, .lw-ver-datos { display: none; }

.lw-datos {
  min-height: 0; overflow-y: auto; background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radio);
  padding: .8rem .95rem 1rem; display: flex; flex-direction: column; gap: .15rem; scrollbar-width: thin;
}
/* Las acciones, en una sola fila: icono y una palabra debajo, como en la ficha de un contacto del móvil.
   Cada una ocupa lo que pide su palabra (no se cortan) y el sitio que sobra se reparte. */
.lw-acciones { display: flex; flex-wrap: wrap; gap: .22rem; margin-bottom: .45rem; }
.lw-accion {
  flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; gap: .18rem; font: inherit; font-size: .68rem; font-weight: 600; text-decoration: none;
  padding: .42rem .28rem .34rem; border-radius: 10px; border: 1px solid transparent; background: var(--fondo); color: var(--marino); cursor: pointer; white-space: nowrap;
}
.lw-accion:hover { background: var(--turquesa-suave); border-color: var(--turquesa); }
.lw-accion:focus-visible { outline: 2px solid var(--turquesa); outline-offset: 1px; }
.lw-bloque { padding: .6rem 0 .5rem; border-top: 1px solid var(--lw-linea); }
.lw-acciones + .lw-bloque { border-top: none; padding-top: .15rem; }
.lw-bloque h2 {
  margin: 0 0 .3rem; font-size: .7rem; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; color: var(--texto-suave);
  display: flex; align-items: baseline; justify-content: space-between; gap: .5rem;
}
.lw-bloque h2 .cuando { font-weight: 500; letter-spacing: 0; text-transform: none; font-size: .74rem; }
.lw-vacio { margin: 0; font-size: .84rem; color: var(--texto-suave); }
.lw-vacio.centro { text-align: center; margin: auto; }
.lw-enlace {
  align-self: flex-start; background: none; border: none; padding: .15rem 0; font: inherit; font-size: .8rem; color: var(--marino-claro); cursor: pointer;
}
.lw-enlace:hover { text-decoration: underline; }

/* Cada dato: etiqueta pequeña a la izquierda, valor a la derecha; se edita pulsándolo. */
.lw-campos .dato-editable {
  display: grid; grid-template-columns: 4.4rem minmax(0, 1fr); align-items: baseline; gap: 0 .5rem;
  padding: .08rem 0; border: none;
}
.lw-campos .dato-editable .k { font-size: .76rem; text-transform: none; letter-spacing: 0; color: var(--texto-suave); }
.lw-campos .dato-editable .v { font-size: .88rem; font-weight: 600; min-height: 1.5rem; overflow-wrap: anywhere; }
.lw-campos .dato-editable .v > span { min-width: 0; }
.lw-campos .dato-editable .v.editable { padding: .08rem .25rem; margin-left: -.25rem; }
.lw-campos .dato-editable .v.editable:hover { background: var(--turquesa-suave); }
.lw-campos .dato-editable .v.editando { grid-column: 1 / -1; padding-top: .2rem; }
.lw-campos .dato-editable .aviso-campo { grid-column: 1 / -1; }
.lw-campos.lw-notas .dato-editable { grid-template-columns: minmax(0, 1fr); }
.lw-campos.lw-notas .dato-editable .k { display: none; }
.lw-campos.lw-notas .dato-editable .v { font-weight: 400; font-size: .86rem; white-space: pre-wrap; align-items: flex-start; }

/* Seguimiento */
.lw-proxima { display: flex; gap: .45rem; align-items: flex-start; font-size: .9rem; margin-bottom: .4rem; color: var(--marino); }
.lw-proxima .icono-svg { margin-top: .2rem; flex: none; }
.lw-proxima strong { color: var(--texto); }
.lw-proxima .que { font-size: .84rem; color: var(--texto-suave); }
.lw-proxima .marca { margin-left: .4rem; font-size: .72rem; font-weight: 650; color: var(--rojo); }
.lw-proxima.vencida { color: var(--rojo); }
.lw-rapidos { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .35rem; }
.lw-rapidos .chip { font-size: .77rem; padding: .2rem .55rem; }
.lw-rapidos .chip.quitar { border-style: dashed; }
.lw-seguimiento .nota, .lw-solicitud .nota, .lw-elegir .nota { margin: .4rem 0 0; font-size: .75rem; color: var(--texto-suave); }
.lw-elegir { display: grid; gap: .4rem; }
.lw-elegir .acciones { display: flex; gap: .4rem; }

/* Solicitud del formulario: se lee en la conversación; aquí, solo cómo llegar a ella */
.lw .burbuja.del-formulario { max-width: min(86%, 36rem); }
.lw .burbuja.senalada { box-shadow: 0 0 0 3px var(--turquesa-suave), 0 0 0 4px var(--turquesa); transition: box-shadow .2s ease; }
@media (prefers-reduced-motion: reduce) { .lw .burbuja.senalada { transition: none; } }

/* Lo secundario, en segundo plano */
.lw-estado .par { display: grid; grid-template-columns: 6.6rem minmax(0, 1fr); gap: 0 .5rem; font-size: .8rem; padding: .1rem 0; align-items: center; }
.lw-estado .k { color: var(--texto-suave); font-size: .76rem; }
.lw-estado .v { color: var(--texto); }
.lw-ia-chip {
  font: inherit; font-size: .74rem; font-weight: 650; padding: .12rem .5rem; border-radius: 999px;
  border: 1px solid var(--borde); background: var(--panel); color: var(--texto-suave); white-space: nowrap;
}
.lw-ia-chip.on { background: var(--verde-suave); border-color: transparent; color: var(--verde); }
.lw-ia-contacto { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .55rem; justify-self: start; }
.lw-ia-contacto .lw-enlace { font-size: .76rem; padding: 0; }
.lw-pie { display: flex; flex-wrap: wrap; gap: .1rem .9rem; padding-top: .5rem; border-top: 1px solid var(--lw-linea); margin-top: auto; }

/* ---------- Centro: conversación, copiloto y respuesta ---------- */
.lw-centro {
  display: flex; flex-direction: column; min-height: 0; min-width: 0;
  background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radio); overflow: hidden;
}
.lw-barra { display: flex; align-items: center; gap: .6rem; padding: .4rem .9rem; border-bottom: 1px solid var(--lw-linea); min-height: 2.5rem; }
.lw-barra.vacia { display: none; }
.lw-filtros { display: flex; gap: .3rem; flex-wrap: wrap; flex: 1; }
.lw-filtro {
  font: inherit; font-size: .78rem; font-weight: 600; padding: .2rem .6rem; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--borde); background: var(--panel); color: var(--texto-suave);
}
.lw-filtro:hover { color: var(--marino); border-color: var(--marino-claro); }
.lw-filtro.activo { background: var(--texto); border-color: var(--texto); color: var(--panel); }

.lw-centro > * { flex: none; }
.lw-hilo {
  flex: 1 1 auto !important; min-height: 5rem; overflow-y: auto; background: var(--fondo);
  padding: 1rem max(1rem, calc((100% - 54rem) / 2)) 1.1rem; display: flex; flex-direction: column; gap: .6rem;
}
.lw-dia { display: flex; justify-content: center; margin: .35rem 0 .1rem; }
.lw-dia span { font-size: .72rem; font-weight: 600; color: var(--texto-suave); background: var(--arena-honda); padding: .12rem .6rem; border-radius: 999px; }
@media (prefers-color-scheme: dark) { .lw-dia span { background: #1f2b36; } }

/* Cliente a la izquierda, Cap Cana Charters a la derecha: se distingue sin leer. */
.lw .burbuja {
  max-width: min(78%, 40rem); font-size: .95rem; line-height: 1.5; padding: .6rem .85rem .7rem; border-radius: 16px;
  background: var(--lw-cliente); border: 1px solid var(--borde); white-space: pre-wrap; word-break: break-word;
}
.lw .burbuja.entrante { align-self: flex-start; border-top-left-radius: 5px; border-left-width: 1px; }
.lw .burbuja.saliente { align-self: flex-end; background: var(--lw-nosotros); border-color: var(--lw-nosotros-borde); border-top-right-radius: 5px; border-left-width: 1px; }
.lw .burbuja.borrador { background: var(--panel); border: 1.5px dashed var(--turquesa); }
.lw .burbuja.interna { align-self: center; max-width: 34rem; font-size: .86rem; border-radius: 12px; }
.lw .burbuja .meta { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; margin-bottom: .3rem; font-size: .72rem; color: var(--texto-suave); white-space: normal; }
.lw .burbuja .texto-burbuja { white-space: pre-wrap; }

/* Copiloto: sin línea propia. El botón va junto a «Enviar»; la propuesta, solo cuando se pide */
.lw-ia { border-top: 1px solid var(--lw-linea); padding: .5rem .95rem; background: var(--panel); }
.lw-ia:empty { display: none; }
.lw-propuesta { border: 1px solid var(--borde); border-radius: 12px; padding: .5rem .7rem .6rem; background: var(--fondo); display: grid; gap: .35rem; }
.lw-propuesta-cab { display: flex; align-items: center; gap: .5rem; font-size: .8rem; }
.lw-propuesta-cab .motor { color: var(--texto-suave); font-size: .74rem; flex: 1; text-align: right; }
.lw-propuesta-texto { margin: 0; font-size: .92rem; white-space: pre-wrap; max-height: 7.2rem; overflow-y: auto; }
.lw-propuesta-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }

/* Respuesta: canal, un cuadro grande y Enviar */
.lw .lw-redactor {
  position: static; border-top: 1px solid var(--lw-linea); background: var(--panel);
  padding: .5rem .95rem .65rem; display: grid; gap: .4rem; max-height: 46vh; overflow-y: auto;
}
.lw .lw-redactor textarea { width: 100%; min-height: 3.3rem; max-height: 30vh; font-size: .95rem; line-height: 1.5; border-radius: 12px; padding: .6rem .75rem; resize: none; }
/* En ordenador el cuadro ocupa lo justo: dos líneas que crecen al escribir, con «Enviar» a su lado.
   La conversación es lo que se lee; el cuadro no puede comerse media pantalla. */
@media (min-width: 901px) {
  .lw .lw-redactor { grid-template-columns: minmax(0, 1fr) auto; column-gap: .6rem; }
  .lw .lw-redactor > * { grid-column: 1 / -1; }
  .lw .lw-redactor > textarea { grid-column: 1; }
  .lw .lw-redactor > .redactor-pie { grid-column: 2; align-self: end; }
  .lw .lw-redactor .redactor-pie .enlace { display: none; }
  .lw .lw-redactor .redactor-pie { flex-wrap: nowrap; gap: .5rem; }
  .lw .lw-redactor .redactor-pie .boton { min-width: 8.5rem; margin: 0; }
}
.lw .lw-redactor input[type="text"] { border-radius: 10px; }
.lw .lw-redactor .elegir-canal .rotulo { font-size: .68rem; font-weight: 650; letter-spacing: .07em; }
.lw .lw-redactor .responder-por { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .9rem; }
.lw .lw-redactor .opcion-canal { padding: .24rem .65rem; }
/* El aviso del modo de pruebas: una línea discreta al lado del canal, no un cartel. */
.lw .lw-redactor .nota-pruebas, .lw .lw-redactor .sin-conectar { margin-left: auto; }
.lw .lw-redactor .responder-por > p { margin: 0; }
.lw .lw-redactor .redactor-pie { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; }
.lw .lw-redactor .redactor-pie .boton { order: 3; margin-left: auto; min-width: 9rem; padding: .5rem 1rem; }
.lw .lw-redactor .redactor-pie .enlace { font-size: .78rem; color: var(--texto-suave); }
.lw .lw-redactor .redactor-pie button.lw-preparar {
  order: 2; min-width: 0; margin: 0; padding: .5rem .8rem; display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap;
}
@media (min-width: 901px) { .lw .lw-redactor .redactor-pie button.boton[type="submit"] { margin-left: 0; } }
.lw .lw-redactor .nota-pruebas, .lw .lw-redactor .sin-conectar { font-size: .78rem; font-weight: 500; }
.lw .lw-redactor .sin-conectar .nota-pequena { font-size: inherit; }
.lw .lw-redactor .nota-pruebas::before { content: "⚠ "; }
.lw-sin-contacto { margin: 0; padding: 1rem; color: var(--texto-suave); }

/* ---------- Pantallas medianas ---------- */
@media (max-width: 1180px) {
  .lw-cuerpo { grid-template-columns: 17.8rem minmax(0, 1fr); }
  .lw-datos { padding-left: .75rem; padding-right: .75rem; }
  .lw-accion { font-size: .66rem; padding-left: .2rem; padding-right: .2rem; }
  .lw-volver .lw-columna { display: none; }
}

/* ---------- Móvil: la conversación ocupa la pantalla; los datos, en un cajón ---------- */
@media (max-width: 900px) {
  body.en-lead .pestanas-movil { display: none; }
  body.en-lead .contenido { padding: .45rem .5rem 0; }
  .lw { gap: .45rem; }
  .lw-solo-pc { display: none !important; }
  .lw-cab { flex-wrap: wrap; gap: .35rem .5rem; min-height: 0; }
  .lw-volver { order: 1; padding-left: 0; }
  .lw-volver .lw-columna { display: block; }
  .lw-nav { order: 2; margin-left: auto; }
  .lw-paso { width: 2.3rem; padding: 0; justify-content: center; }
  .lw-paso.sig { padding: 0; }
  .lw-quien { order: 3; flex: 1 1 100%; border-left: none; padding-left: 0; }
  .lw-quien h1 { font-size: 1.15rem; }
  .lw-menu { left: auto; right: 0; }
  .lw-cuerpo { grid-template-columns: minmax(0, 1fr); }
  .lw-ver-datos {
    display: inline-flex; align-items: center; gap: .3rem; font: inherit; font-size: .8rem; font-weight: 600; cursor: pointer;
    padding: .25rem .6rem; border-radius: 999px; border: 1px solid var(--borde); background: var(--panel); color: var(--marino);
  }
  .lw-barra.vacia { display: flex; }
  .lw-datos {
    position: fixed; z-index: 70; top: 0; bottom: 0; left: 0; width: min(88vw, 21rem); border-radius: 0; border: none; border-right: 1px solid var(--borde);
    transform: translateX(-104%); transition: transform .18s ease; padding-top: .6rem;
  }
  .lw.con-datos .lw-datos { transform: none; box-shadow: var(--sombra); }
  .lw.con-datos .lw-telon { display: block; position: fixed; inset: 0; z-index: 65; background: rgba(20, 30, 36, .38); border: none; padding: 0; }
  .lw-cerrar-datos {
    display: inline-flex; align-items: center; gap: .3rem; align-self: flex-end; font: inherit; font-size: .8rem; cursor: pointer;
    background: none; border: none; color: var(--texto-suave); padding: .2rem 0 .4rem;
  }
  .lw .burbuja { max-width: 90%; }
  .lw-hilo { padding: .8rem .7rem; }
  .lw-barra { padding: .35rem .5rem; gap: .35rem; }
  .lw-filtros { flex-wrap: nowrap; gap: .22rem; }
  .lw-filtro { padding: .2rem .5rem; white-space: nowrap; }
  .lw-ver-datos { white-space: nowrap; flex: none; }
  .lw .lw-redactor .nota-pruebas, .lw .lw-redactor .sin-conectar { margin-left: 0; }
  .lw-ia { padding: .45rem .7rem; }
  .lw .lw-redactor { padding: .5rem .7rem .65rem; max-height: 52vh; }
  .lw .lw-redactor textarea { min-height: 4.4rem; font-size: 1rem; }
  .lw .lw-redactor .redactor-pie .boton { min-width: 0; flex: 1 1 100%; order: 0; margin-left: 0; }
  .lw .lw-redactor .redactor-pie button.lw-preparar { flex: 0 0 auto; order: 0; }
  .lw .lw-redactor .redactor-pie button.boton[type="submit"] { flex: 1 1 0; }
}
@media (prefers-reduced-motion: reduce) { .lw-datos { transition: none; } }

/* Seguimientos por correo (secuencia FU1–FU5) */
.lw-secuencia-estado { font-size: .85rem; font-weight: 600; margin: .1rem 0 .35rem; }
.lw-secuencia-estado.tono-ambar { color: #8a6a1f; }
.lw-secuencia-estado.tono-azul { color: #2c5d8a; }
.lw-secuencia-estado.tono-rojo { color: #b23b3b; }
.lw-secuencia .nota.aviso { color: #8a6a1f; }
.lw-secuencia .nota.error, .lw-secuencia .detalle.error { color: #b23b3b; }
.lw-secuencia-historial { list-style: none; margin: .4rem 0; padding: 0; font-size: .78rem; display: grid; gap: .3rem; }
.lw-secuencia-historial .cuando { color: var(--texto-suave, #6b6b6b); white-space: nowrap; }
.lw-secuencia-historial .detalle { color: var(--texto-suave, #6b6b6b); font-size: .74rem; overflow-wrap: anywhere; }
.lw-secuencia-historial .ev-respuesta .que, .lw-secuencia-historial .ev-fallo .que { font-weight: 600; }

/* 1.17 · Quién habla y qué toca */
.lw .lw-estado-conv { font-size: .8rem; color: var(--texto-suave); margin-right: auto; }
.lw .lw-estado-conv strong { font-weight: 600; color: var(--texto); }

/* 1.20 · Canales del lead: pequeño, una línea por canal */
.lw-canales .lw-estado { margin-top: .1rem; }
.lw-canal { font-size: .74rem; font-weight: 650; padding: .08rem .45rem; border-radius: 999px; background: var(--panel); border: 1px solid var(--borde); color: var(--texto-suave); display: inline-block; max-width: 100%; overflow-wrap: anywhere; }
.lw-canal.tono-verde { background: var(--verde-suave); border-color: transparent; color: var(--verde); }
.lw-canal.tono-ambar { background: var(--ambar-suave); border-color: transparent; color: var(--ambar); }
.lw-canal.tono-rojo { background: var(--rojo-suave); border-color: transparent; color: var(--rojo); }
.lw-canal.tono-azul { background: var(--azul-suave); border-color: transparent; color: var(--marino); }
.lw-canales .nota { font-size: .74rem; margin: .3rem 0 0; }
.lw-canales .nota.aviso { color: var(--ambar); }

/* ---------- 1.22 · IA ACTIVADA / DESACTIVADA en la cabecera y bloque «Seguimientos» ---------- */
.lw-ia-grande { display: inline-flex; align-items: center; gap: .45rem; flex: none; min-width: 0; }
.lw-ia-boton {
  display: inline-flex; align-items: center; gap: .4rem; font: inherit; font-size: .8rem; font-weight: 750; letter-spacing: .02em;
  padding: .3rem .7rem; border-radius: 999px; border: 1.5px solid var(--borde); background: var(--panel); color: var(--texto-suave);
  cursor: pointer; white-space: nowrap;
}
.lw-ia-boton:disabled { cursor: default; opacity: .8; }
.lw-ia-boton .punto { background: #b9ad94; }
.lw-ia-boton.on { background: var(--verde-suave); border-color: var(--verde); color: var(--verde); }
.lw-ia-boton.on .punto { background: var(--verde); }
.lw-ia-boton.pausa { background: var(--ambar-suave); border-color: var(--ambar); color: var(--ambar); }
.lw-ia-boton.pausa .punto { background: var(--ambar); }
.lw-ia-boton.prueba { background: #efecfd; border-color: #6a58c9; color: #4b3a9c; }
.lw-ia-boton.prueba .punto { background: #6a58c9; }
.lw-ia-motivo { font-size: .74rem; color: var(--texto-suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 16rem; }
.lw-fu-estado { margin: .1rem 0 .35rem; }
.lw-fu-historial { margin: .5rem 0 0; padding-left: 1.1rem; font-size: .8rem; color: var(--texto); display: grid; gap: .15rem; }
.lw-prueba { margin-top: .6rem; padding: .5rem .55rem; border-radius: 10px; background: #f4f2fd; display: grid; gap: .35rem; }
.lw-prueba input { font-size: .82rem; }
.lw-rapidos .chip.principal { background: var(--marino); color: #fff; border-color: var(--marino); }
@media (max-width: 900px) { .lw-ia-motivo { display: none; } .lw-nombre-fila { flex-wrap: wrap; } }