:root{
  --bg:#0f1216; --panel:#171b21; --panel2:#1d222a; --linea:#2a313b;
  --txt:#e6e9ee; --txt2:#9aa4b2; --acc:#4f8cff; --acc2:#3a6fd8;
  --ok:#3ecf8e; --err:#ff6b6b; --warn:#f0b429;
  --r:10px; --f:14px;
}
/* `hidden` TIENE QUE GANAR SIEMPRE, y por eso lleva !important.
 *
 * El navegador esconde un elemento con atributo `hidden` desde su hoja de
 * estilos propia, que pierde contra CUALQUIER regla nuestra. Así que un
 * `.panel{display:flex}` escrito para maquetar el panel lo vuelve visible
 * aunque el HTML diga `hidden` y aunque el JS nunca lo haya mostrado.
 *
 * Pasó, y se comió una pantalla entera: en Operar, el panel de cierre de
 * escalada aparecía en TODA conversación —incluida una recién creada, sin
 * ninguna escalada— y tapaba el lugar donde se escribe la orden. La API decía
 * `{"escalada": null}`, el JS nunca lo mostró, y el elemento estaba ahí igual.
 * Ningún chequeo de los que había podía verlo: el JS era correcto, los ids
 * existían y el HTML era válido. Lo roto era la CASCADA.
 *
 * Va acá, global, y no como parche en cada pantalla: el que escribe el próximo
 * panel no tiene por qué acordarse de esto. */
[hidden]{display:none !important}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);
  font:var(--f)/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--acc);text-decoration:none}
h1{font-size:22px;margin:0 0 18px}
h2{font-size:17px;margin:0 0 14px}

/* --- topbar --- */
.top{display:flex;align-items:center;gap:24px;padding:0 22px;height:56px;
  background:var(--panel);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:20}
.marca{font-weight:600;letter-spacing:-.2px}
.marca span{color:var(--acc)}
.marca.grande{font-size:22px;text-align:center;margin-bottom:2px}
.top nav{display:flex;gap:4px;flex:1}
.top nav a{padding:7px 13px;border-radius:8px;color:var(--txt2);font-weight:500}
.top nav a:hover{background:var(--panel2);color:var(--txt)}
.top nav a.on{background:var(--acc);color:#fff}
.yo{display:flex;align-items:center;gap:14px}
.quien{color:var(--txt2);font-size:13px}
.quien i{display:block;font-style:normal;font-size:11px;color:var(--acc);text-transform:uppercase;letter-spacing:.5px}
.salir{color:var(--txt2);font-size:13px}

/* --- layout --- */
main{min-height:calc(100vh - 56px)}
.pagina{max-width:1180px;margin:0 auto;padding:26px 22px 60px}
.centrado{display:flex;align-items:center;justify-content:center;min-height:100vh}
.tarjeta{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);padding:26px}
.login{width:340px;display:flex;flex-direction:column;gap:14px}
.login .sub{margin:0 0 8px;text-align:center;color:var(--txt2);font-size:13px}

/* --- formularios --- */
label{display:block;font-size:12px;color:var(--txt2);font-weight:500}
input,select,textarea{width:100%;margin-top:5px;padding:9px 11px;border-radius:8px;
  border:1px solid var(--linea);background:var(--panel2);color:var(--txt);font:inherit}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--acc)}
input[type=checkbox]{width:auto;margin:0 7px 0 0;vertical-align:middle}
button{cursor:pointer;font:inherit}
.btn{padding:9px 15px;border-radius:8px;border:1px solid var(--linea);
  background:var(--panel2);color:var(--txt);font-weight:500}
.btn:hover{border-color:var(--acc)}
.btn.primario{background:var(--acc);border-color:var(--acc);color:#fff}
.btn.primario:hover{background:var(--acc2)}
.btn.chico{padding:5px 10px;font-size:12px}
.btn.peligro{color:var(--err)}
.login button{padding:11px;border-radius:8px;border:0;background:var(--acc);color:#fff;font-weight:600;margin-top:6px}
.alerta{background:#3a1d1d;border:1px solid #6b2b2b;color:#ffb3b3;padding:9px 12px;border-radius:8px;font-size:13px}

/* --- tabs --- */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--linea);margin-bottom:20px}
.tab{padding:10px 16px;border:0;background:none;color:var(--txt2);font-weight:500;
  border-bottom:2px solid transparent;margin-bottom:-1px}
.tab:hover{color:var(--txt)}
.tab.on{color:var(--acc);border-bottom-color:var(--acc)}
/* utilidad: gana siempre, sin importar el orden de definicion de las reglas */
.oculto{display:none!important}
.barra{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}
.ayuda{margin:0;color:var(--txt2);font-size:12.5px;max-width:70ch}
.ayuda b{color:var(--txt)}

/* --- tablas --- */
.tabla{width:100%;border-collapse:collapse;background:var(--panel);
  border:1px solid var(--linea);border-radius:var(--r);overflow:hidden}
.tabla th{text-align:left;padding:11px 13px;font-size:11.5px;text-transform:uppercase;
  letter-spacing:.4px;color:var(--txt2);background:var(--panel2);border-bottom:1px solid var(--linea)}
.tabla td{padding:11px 13px;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabla tr:last-child td{border-bottom:0}
.tabla tr:hover td{background:var(--panel2)}
.acciones{display:flex;gap:6px;justify-content:flex-end}
.vacio{padding:30px;text-align:center;color:var(--txt2)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}

/* --- chips de estado --- */
.chip{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11.5px;font-weight:600}
.chip.ok{background:rgba(62,207,142,.14);color:var(--ok)}
.chip.error{background:rgba(255,107,107,.14);color:var(--err)}
.chip.sin_probar{background:rgba(154,164,178,.14);color:var(--txt2)}
.chip.si{background:rgba(62,207,142,.14);color:var(--ok)}
.chip.no{background:rgba(154,164,178,.14);color:var(--txt2)}

/* --- modal --- */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;
  align-items:center;justify-content:center;z-index:50;padding:20px}
.modal-caja{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);
  padding:24px;width:520px;max-width:100%;max-height:90vh;overflow:auto}
#modal-form{display:grid;gap:13px}
.fila2{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.modal-pie{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}
.nota{color:var(--txt2);font-size:12px;margin:-4px 0 0}
.lista-check{max-height:190px;overflow:auto;border:1px solid var(--linea);
  border-radius:8px;padding:9px;background:var(--panel2)}
.lista-check label{display:flex;align-items:center;color:var(--txt);font-size:13px;padding:3px 0}
.salida.res-ok{border-color:rgba(62,207,142,.45)}
.salida.res-error{border-color:rgba(255,107,107,.45)}
.salida{background:#0b0e12;border:1px solid var(--linea);border-radius:8px;padding:14px;
  font-family:ui-monospace,Menlo,monospace;font-size:12.5px;white-space:pre-wrap;
  word-break:break-word;max-height:52vh;overflow:auto;margin:0}

/* ------------------------------------------------------------------ chat */
.chat-layout{display:grid;grid-template-columns:290px 1fr;gap:0;height:calc(100vh - 56px)}
.lateral{border-right:1px solid var(--linea);background:var(--panel);padding:18px;
  display:flex;flex-direction:column;gap:14px;overflow:auto}
.ancho{width:100%}
.ficha{background:var(--panel2);border:1px solid var(--linea);border-radius:8px;padding:11px;font-size:12.5px}
.ficha div{display:flex;justify-content:space-between;gap:10px;padding:2px 0}
.ficha span{color:var(--txt2)}
.ficha b{font-family:ui-monospace,Menlo,monospace;font-weight:500}
.lista-conv{flex:1;min-height:0;display:flex;flex-direction:column}
.lista-conv h3{font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;
  color:var(--txt2);margin:6px 0 8px;font-weight:600}
#lista-conv{overflow:auto;display:flex;flex-direction:column;gap:5px}
.conv{padding:9px 11px;border-radius:8px;border:1px solid transparent;cursor:pointer;font-size:13px}
.conv:hover{background:var(--panel2)}
.conv.on{background:var(--panel2);border-color:var(--acc)}
.conv .t{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conv .m{color:var(--txt2);font-size:11.5px}

.conversacion{display:flex;flex-direction:column;min-width:0}
.hilo{flex:1;overflow:auto;padding:24px 26px;display:flex;flex-direction:column;gap:16px}
.placeholder{margin:auto;color:var(--txt2)}
.burbuja{max-width:82%;padding:13px 16px;border-radius:12px;white-space:pre-wrap;
  word-wrap:break-word;overflow-wrap:anywhere}
.burbuja .meta{font-size:11px;color:var(--txt2);margin-bottom:6px;display:flex;gap:9px;align-items:center}
.b-tecnico{align-self:flex-end;background:var(--acc);color:#fff;border-bottom-right-radius:3px}
.b-tecnico .meta{color:rgba(255,255,255,.75)}
.b-agente{align-self:flex-start;background:var(--panel);border:1px solid var(--linea);
  border-bottom-left-radius:3px}
.b-sistema{align-self:center;max-width:92%;background:#3a1d1d;border:1px solid #6b2b2b;color:#ffc9c9;font-size:13px}
.burbuja img{max-width:280px;border-radius:8px;margin-top:9px;display:block;border:1px solid var(--linea)}
.burbuja h2,.burbuja h3{font-size:13px;text-transform:uppercase;letter-spacing:.4px;
  color:var(--acc);margin:14px 0 4px;font-weight:700}
.burbuja h2:first-child{margin-top:0}
.veredicto{display:inline-block;margin-top:8px;padding:4px 12px;border-radius:20px;
  font-weight:700;font-size:12px;letter-spacing:.3px}
.v-bug{background:rgba(255,107,107,.16);color:var(--err)}
.v-uso{background:rgba(240,180,41,.16);color:var(--warn)}
.v-ok{background:rgba(62,207,142,.16);color:var(--ok)}

.trabajando{align-self:flex-start;display:flex;align-items:center;gap:11px;
  background:var(--panel);border:1px solid var(--linea);border-radius:12px;padding:13px 17px;color:var(--txt2)}
.puntos{display:inline-flex;gap:4px}
.puntos i{width:6px;height:6px;border-radius:50%;background:var(--acc);animation:lat 1.3s infinite}
.puntos i:nth-child(2){animation-delay:.18s}.puntos i:nth-child(3){animation-delay:.36s}
@keyframes lat{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}
.cronometro{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--acc)}

.redactor{border-top:1px solid var(--linea);background:var(--panel);padding:14px 20px}
.redactor textarea{resize:vertical;min-height:62px}
.redactor-pie{display:flex;align-items:center;gap:11px;margin-top:10px}
.empuje{flex:1}
.previa{margin-bottom:9px}
.previa img{max-height:110px;border-radius:8px;border:1px solid var(--linea)}

/* ------------------------------------------------- respuesta del agente */
.seccion{margin:0 0 18px}
.seccion:last-child{margin-bottom:0}
.seccion-cab{display:flex;align-items:center;gap:12px;margin:0 0 7px}
.seccion-cab h2{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.5px;
  color:var(--acc);font-weight:700}
.seccion-wa .seccion-cab h2{color:var(--ok)}
.copiar{padding:3px 9px;font-size:11.5px;white-space:nowrap}
.copiar.copiado{border-color:var(--ok);color:var(--ok)}
.seccion-wa{background:rgba(62,207,142,.05);border-left:2px solid rgba(62,207,142,.35);
  padding:11px 13px;border-radius:0 8px 8px 0}

/* markdown renderizado */
.burbuja p{margin:0 0 9px}
.burbuja p:last-child{margin-bottom:0}
.burbuja ul,.burbuja ol{margin:0 0 9px;padding-left:22px}
.burbuja li{margin:2px 0}
.burbuja h3,.burbuja h4,.burbuja h5,.burbuja h6{font-size:13px;margin:12px 0 5px;color:var(--txt)}
.burbuja code{background:var(--panel2);border:1px solid var(--linea);border-radius:4px;
  padding:1px 5px;font-family:ui-monospace,Menlo,monospace;font-size:12.5px}
.burbuja pre.cod{background:#0b0e12;border:1px solid var(--linea);border-radius:8px;
  padding:11px 13px;overflow-x:auto;font-family:ui-monospace,Menlo,monospace;
  font-size:12.5px;margin:0 0 9px;white-space:pre}
.burbuja blockquote{margin:0 0 9px;padding-left:11px;border-left:2px solid var(--linea);color:var(--txt2)}
.burbuja hr{border:0;border-top:1px solid var(--linea);margin:12px 0}
.burbuja a{text-decoration:underline}
.tabla-wrap{overflow-x:auto;margin:0 0 9px}
.md-tabla{border-collapse:collapse;font-size:12.5px;min-width:100%}
.md-tabla th,.md-tabla td{border:1px solid var(--linea);padding:6px 10px;text-align:left;
  vertical-align:top;white-space:pre-wrap}
.md-tabla th{background:var(--panel2);font-weight:600;color:var(--txt2);
  text-transform:none;letter-spacing:0;font-size:12px}
.b-agente{max-width:88%}

/* -------------------------------------------------------------- historial */
.pagina.ancha{max-width:1400px}
.filtros{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:16px;
  background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);padding:14px 16px}
.filtros label{min-width:150px}
.filtros label.crece{flex:1;min-width:220px}
.resumen{color:var(--txt2);font-size:12.5px;margin-bottom:10px}
.paginado{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:16px}
.modal-caja.ancho{width:960px}
.hilo-detalle{max-height:58vh;padding:16px 4px 4px;gap:14px}
.det-crudo{margin-left:8px;font-size:11px}
.linea-error{color:var(--err);font-size:12px;margin-top:6px}
.tabla td.recorte{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* borrado suave */
.conv{display:flex;align-items:center;gap:6px}
.conv-txt{flex:1;min-width:0;cursor:pointer}
.conv-borrar{background:none;border:0;color:var(--txt2);font-size:14px;padding:3px 5px;
  border-radius:6px;opacity:0;transition:opacity .12s}
.conv:hover .conv-borrar{opacity:1}
.conv-borrar:hover{background:rgba(255,107,107,.14);color:var(--err)}
tr.fila-borrada td{opacity:.55}
.chip.borrada{background:rgba(255,107,107,.14);color:var(--err)}
.aviso-borrada{background:rgba(255,107,107,.10);border:1px solid rgba(255,107,107,.35);
  border-radius:8px;padding:9px 12px;margin-bottom:12px;font-size:13px;color:#ffb3b3;
  display:flex;align-items:center;gap:12px}
.aviso-borrada .empuje{flex:1}

/* cliente sin credencial de solo lectura */
.aviso-bloqueo{margin:auto;max-width:560px;background:rgba(240,180,41,.07);
  border:1px solid rgba(240,180,41,.35);border-radius:var(--r);padding:20px 22px}
.aviso-bloqueo b{color:var(--warn)}
.aviso-bloqueo p{margin:9px 0 0;color:var(--txt2);font-size:13px}
.aviso-bloqueo code{background:var(--panel2);padding:1px 5px;border-radius:4px}
.meta .ip{font-family:ui-monospace,Menlo,monospace;color:var(--acc);opacity:.85}
.chip.operativa{background:rgba(240,180,41,.16);color:var(--warn)}

/* ------------------------------------------------------------- operativo */
.chk{display:flex;align-items:center;gap:6px;color:var(--txt);font-size:12.5px}
#panel-operativo{display:flex;flex-direction:column;gap:11px}
.op-cab{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.op-estado{padding:3px 11px;border-radius:20px;font-size:11.5px;font-weight:700}
.op-plan_listo{background:rgba(62,207,142,.16);color:var(--ok)}
.op-bloqueada{background:rgba(255,107,107,.16);color:var(--err)}
.op-error{background:rgba(255,107,107,.16);color:var(--err)}
.op-cancelada{background:rgba(154,164,178,.16);color:var(--txt2)}
.guarda{border-radius:8px;padding:11px 13px;margin:10px 0;font-size:13px;white-space:pre-wrap}
.guarda-bloqueo{background:rgba(255,107,107,.09);border:1px solid rgba(255,107,107,.4);color:#ffc9c9}
.guarda-ok{background:rgba(62,207,142,.07);border:1px solid rgba(62,207,142,.3);color:var(--txt2)}
.op-acciones{display:flex;gap:9px;margin-top:16px;align-items:center;flex-wrap:wrap}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.plan-vps{font-size:11.5px;color:var(--txt2);margin-bottom:5px}

/* ------------------------------ captura pegada / arrastrada / elegida */
.miniatura{position:relative;display:inline-flex;flex-direction:column;gap:4px}
.miniatura img{max-height:110px;max-width:260px;border-radius:8px;
  border:1px solid var(--linea);display:block}
.miniatura .quitar{position:absolute;top:-7px;right:-7px;width:22px;height:22px;
  border-radius:50%;border:1px solid var(--linea);background:var(--panel);
  color:var(--txt2);font-size:15px;line-height:1;display:flex;align-items:center;
  justify-content:center;padding:0}
.miniatura .quitar:hover{background:var(--err);border-color:var(--err);color:#fff}
.mini-nombre{font-size:11px;color:var(--txt2);font-family:ui-monospace,Menlo,monospace}
.redactor.arrastrando{outline:2px dashed var(--acc);outline-offset:-6px;
  background:rgba(79,140,255,.06)}
.redactor.arrastrando textarea{border-color:var(--acc)}

/* ------------------------------------------------------------- escaladas */
.badge{display:inline-block;min-width:18px;padding:1px 6px;margin-left:7px;border-radius:10px;
  background:var(--err);color:#fff;font-size:11px;font-weight:700;text-align:center;line-height:16px}
.chip.pendiente{background:rgba(255,107,107,.16);color:var(--err)}
.chip.en_curso{background:rgba(240,180,41,.16);color:var(--warn)}
.chip.resuelta{background:rgba(62,207,142,.16);color:var(--ok)}
.b-admin{align-self:flex-start;background:rgba(240,180,41,.09);
  border:1px solid rgba(240,180,41,.4);border-bottom-left-radius:3px}
.b-admin .meta{color:var(--warn)}
.aviso-escalada{background:rgba(240,180,41,.08);border:1px solid rgba(240,180,41,.35);
  border-radius:8px;padding:9px 12px;margin-bottom:12px;font-size:12.5px;
  display:flex;align-items:center;gap:10px}
.aviso-escalada b{color:var(--warn)}
.conv .esc{font-size:10.5px;padding:0 5px;border-radius:8px;margin-left:5px}
.esc-detalle{display:grid;gap:14px}
.esc-acciones{display:flex;gap:9px;flex-wrap:wrap;margin-top:4px}
.grupo-dest{font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--txt2);
  margin:8px 0 3px;font-weight:600}
.grupo-dest:first-child{margin-top:0}
.op-estado.op-informe{background:rgba(79,140,255,.16);color:var(--acc)}
.aviso-encurso{display:flex;align-items:center;gap:13px;align-self:stretch;
  background:rgba(79,140,255,.07);border:1px solid rgba(79,140,255,.35);
  border-radius:var(--r);padding:13px 16px}
.aviso-encurso b{color:var(--acc)}
.aviso-encurso p{margin:4px 0 0}
.ficha-archivo{display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:96px;height:96px;border:1px solid var(--linea);border-radius:8px;background:var(--panel2)}
.ficha-archivo .ico{font-size:30px;line-height:1}
.ficha-archivo .ext{font-size:10.5px;color:var(--txt2);letter-spacing:.5px;margin-top:3px}
.adj-chip{display:inline-flex;align-items:center;gap:7px;margin-top:9px;padding:6px 11px;
  border:1px solid var(--linea);border-radius:8px;background:var(--panel2);
  font-size:12.5px;color:var(--txt);text-decoration:none}
a.adj-chip:hover{border-color:var(--acc)}
.op-estado.op-respuesta{background:rgba(62,207,142,.16);color:var(--ok)}
.nota-modo{margin:0 0 10px;font-size:12px}

/* ------------------------------------------------- selector de destinos */
.sel{display:flex;flex-direction:column;gap:7px;min-width:0}
.sel-chips{display:flex;flex-wrap:wrap;gap:5px}
.sel-chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;
  background:var(--acc);color:#fff;border-radius:14px;padding:3px 6px 3px 11px;
  font-size:12px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sel-x{border:0;background:rgba(255,255,255,.22);color:#fff;border-radius:50%;
  width:16px;height:16px;line-height:14px;font-size:13px;padding:0;flex:none}
.sel-x:hover{background:rgba(0,0,0,.35)}
.sel-buscar{margin-top:0}
.sel-lista{max-height:290px;overflow:auto;border:1px solid var(--linea);
  border-radius:8px;background:var(--panel2)}
.sel-grupo{display:flex;align-items:center;gap:7px;padding:7px 10px;
  background:var(--panel);border-bottom:1px solid var(--linea);
  position:sticky;top:0;font-size:12px;color:var(--txt)}
.sel-grupo b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sel-grupo-clic{cursor:pointer}
.sel-grupo-clic:hover,.sel-grupo.activo{background:var(--acc);color:#fff}
.sel-grupo-clic:hover .sel-host,.sel-grupo.activo .sel-host{color:rgba(255,255,255,.8)}
.sel-host{font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--txt2)}
.sel-infra{margin-left:auto;font-size:10px;text-transform:uppercase;letter-spacing:.4px;
  color:var(--txt2);border:1px solid var(--linea);border-radius:10px;padding:0 6px}
.sel-recientes{color:var(--txt2);text-transform:uppercase;font-size:10.5px;letter-spacing:.5px}
.sel-fila{display:flex;align-items:center;gap:7px;padding:6px 10px;cursor:pointer;
  font-size:13px;white-space:nowrap;overflow:hidden}
.sel-hijo{padding-left:20px}
.sel-fila:hover,.sel-fila.activo{background:var(--acc);color:#fff}
.sel-fila.puesto{color:var(--acc)}
.sel-fila.puesto:hover,.sel-fila.puesto.activo{color:#fff}
.sel-tic{width:12px;flex:none;font-size:11px}
.sel-txt{overflow:hidden;text-overflow:ellipsis}
.sel-extra{margin-left:auto;font-size:10.5px;color:var(--err);flex:none}
.sel-fila.activo .sel-extra,.sel-fila:hover .sel-extra{color:#ffd7d7}
.sel-vacio{padding:16px;text-align:center;color:var(--txt2);font-size:12.5px}
@media (max-width:820px){
  .chat-layout{grid-template-columns:1fr}
  .lateral{border-right:0;border-bottom:1px solid var(--linea)}
  .sel-lista{max-height:200px}
}

/* ---------- Matriz de módulos (wiki) ---------- */
.wiki h2{margin:26px 0 10px;font-size:15px}
.wiki .bajada{color:var(--txt2);font-size:13px;margin:2px 0 16px;max-width:820px}
.wiki .miga{font-size:12px;color:var(--txt2);margin:0 0 8px}
.wiki .miga a{color:var(--txt2)}
.tarjetas{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 18px}
.tarjeta-num{background:var(--panel2);border:1px solid var(--linea);border-radius:8px;
  padding:12px 16px;min-width:118px;display:flex;flex-direction:column;gap:2px}
.tarjeta-num b{font-size:23px;line-height:1.1;font-weight:600}
.tarjeta-num span{font-size:11.5px;color:var(--txt2)}
.tarjeta-num.alerta{border-color:#b34a4a}
.tarjeta-num.alerta b{color:#e08a8a}
.tarjeta-num.aviso{border-color:#8a7132}
.tarjeta-num.aviso b{color:#d9b25a}
.wiki-barra{flex-wrap:wrap;row-gap:10px}
.wiki-barra .acciones{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wiki-barra select{max-width:230px}
.alertas{display:flex;flex-direction:column;gap:6px}
.alerta-fila{display:flex;align-items:center;gap:10px;flex-wrap:wrap;text-decoration:none;
  background:var(--panel2);border:1px solid var(--linea);border-left:3px solid #b34a4a;
  border-radius:6px;padding:9px 12px;color:inherit}
.alerta-fila:hover{border-color:var(--acento);border-left-color:#b34a4a}
.buscar-wiki{width:100%;max-width:420px;margin:0 0 10px}
.fila-descalce{background:rgba(179,74,74,.10)}
.rutas{margin:0;padding-left:18px;font-size:12.5px;color:var(--txt2)}
.rutas li{margin:2px 0}
.wiki .mono{font-family:ui-monospace,Menlo,monospace;font-size:12.5px}

/* Origen de una operación abierta desde una escalada */
.aviso-escalada.origen{border-left:3px solid var(--acento);align-items:flex-start}
.aviso-escalada.origen a{color:var(--acento);text-decoration:underline}

/* ---------- Modo operativo: el plan se lee en castellano ---------- */
.op-barra{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px;
  padding:9px 12px;border:1px solid var(--linea);border-radius:8px;background:var(--panel2);
  position:sticky;top:0;z-index:5}
.op-punto{width:9px;height:9px;border-radius:50%;background:var(--txt2);flex:none}
.op-barra.est-esperando .op-punto{background:#8a8a8a;animation:lat 1.2s infinite}
.op-barra.est-listo .op-punto{background:#4a9d5f}
.op-barra.est-corriendo .op-punto{background:#d9b25a;animation:lat 1s infinite}
.op-barra.est-ok .op-punto{background:#4a9d5f}
.op-barra.est-malo .op-punto{background:#c25b5b}
@keyframes lat{0%,100%{opacity:1}50%{opacity:.25}}
.op-estado-txt{font-weight:600}
.op-barra.est-malo .op-estado-txt{color:#e08a8a}
.op-barra.est-listo .op-estado-txt,.op-barra.est-ok .op-estado-txt{color:#7fc493}
.op-motivo{color:var(--txt2);font-size:12px;flex:1 1 100%}

.resumen{font-size:14.5px;line-height:1.6}
.resumen p{margin:.45em 0}
.pliegue{margin-top:10px;border-top:1px solid var(--linea);padding-top:6px}
.pliegue>summary{cursor:pointer;color:var(--txt2);font-size:12.5px;list-style:none;
  padding:3px 0;user-select:none}
.pliegue>summary::-webkit-details-marker{display:none}
.pliegue>summary::before{content:'▸ '}
.pliegue[open]>summary::before{content:'▾ '}
.pliegue>summary:hover{color:var(--txt)}
.pliegue-cuerpo{font-size:12.5px;padding:4px 0 2px}
.pliegue-cuerpo pre.revision{white-space:pre-wrap;font-size:11.5px;color:var(--txt2);margin:0}

.avisos,.bloqueos{display:flex;flex-direction:column;gap:6px;margin-top:11px}
.aviso-item,.bloqueo-item{display:flex;flex-direction:column;gap:2px;padding:8px 10px;
  border-radius:6px;font-size:12.5px}
.aviso-item{background:rgba(240,180,41,.10);border-left:3px solid #d9b25a}
.bloqueo-item{background:rgba(194,91,91,.12);border-left:3px solid #c25b5b}
.aviso-item b,.bloqueo-item b{font-size:13px}
.aviso-item span,.bloqueo-item span{color:var(--txt2)}
.aviso-item code,.bloqueo-item code{font-size:11.5px;color:var(--txt2);word-break:break-all}

.ejec{border:1px solid var(--linea);border-radius:8px;padding:10px 12px;background:var(--panel2)}
.ejec-cab{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.ejec-cab .cronometro{margin-left:auto}
.ejec-fila{display:flex;align-items:center;gap:9px;padding:3px 0;font-size:12.5px}
.ejec-fila.cola{color:var(--txt2)}
.ejec-fila.hecho .ejec-ico{color:#7fc493}
.ejec-ico{width:14px;text-align:center}
.ejec-t{margin-left:auto;color:var(--txt2);font-variant-numeric:tabular-nums}
.pliegue-viejo{opacity:.72}
.pliegue-viejo>summary{font-style:italic}

/* ---------- Entregables: lo que produjo el agente, para bajar ---------- */
.entregables{display:flex;flex-direction:column;gap:6px;margin-top:11px}
.entregable{display:flex;align-items:center;gap:11px;padding:9px 11px;text-decoration:none;
  border:1px solid var(--linea);border-radius:8px;background:var(--panel2);color:inherit}
.entregable:hover{border-color:var(--acento);background:var(--panel)}
.ent-ico{font-size:22px;line-height:1;flex:none}
.ent-txt{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.ent-txt b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ent-sub{font-size:11.5px;color:var(--txt2)}
.ent-btn{flex:none;font-size:12px;padding:4px 10px;border-radius:6px;
  border:1px solid var(--linea);color:var(--txt2)}
.entregable:hover .ent-btn{border-color:var(--acento);color:var(--acento)}
.chk-linea{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--txt2);
  white-space:nowrap;cursor:pointer}
.chk-linea input{margin:0}

/* La ejecución frenó a preguntar: es lo único que hay que leer */
.confirmacion{border:1px solid #d9a441;border-left:4px solid #d9a441;border-radius:8px;
  background:rgba(240,180,41,.10);padding:12px 14px;margin:0 0 14px}
.conf-cab{font-weight:600;margin-bottom:7px}
.conf-cuerpo{font-size:14.5px;line-height:1.6}
.conf-pie{margin-top:9px;font-size:12px;color:var(--txt2)}
.imprevistos{margin-top:11px;padding:9px 11px;border-radius:6px;background:var(--panel2);
  border-left:3px solid var(--linea);font-size:12.5px}
.imprevistos b{display:block;margin-bottom:3px;font-size:12px;color:var(--txt2);
  text-transform:uppercase;letter-spacing:.4px}

/* El estado también al pie, junto al botón: mirar el final del hilo y no saber
   qué está pasando es lo que dejaba a la admin frente a un botón gris y mudo. */
.op-acciones{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;
  padding:11px 12px;border:1px solid var(--linea);border-radius:8px;background:var(--panel2)}
.op-acciones .op-aqui{font-weight:600}
.op-acciones.est-malo .op-aqui{color:#e08a8a}
.op-acciones.est-corriendo .op-aqui{color:#d9b25a}
.op-acciones.est-listo .op-aqui,.op-acciones.est-ok .op-aqui{color:#7fc493}
.op-acciones .nota{flex:1 1 100%;color:var(--txt2);font-size:12.5px;margin:0}

/* Lista de operaciones: encontrar de un vistazo la que estás mirando */
.conv.abierta{border-left:3px solid var(--acento);background:var(--panel)}
.chip-estado{display:inline-block;padding:1px 7px;border-radius:10px;font-size:10.5px;
  border:1px solid var(--linea);color:var(--txt2);white-space:nowrap}
.chip-estado.est-listo{border-color:#4a9d5f;color:#7fc493}
.chip-estado.est-ok{border-color:#3f7d52;color:#7fc493}
.chip-estado.est-malo{border-color:#b34a4a;color:#e08a8a}
.chip-estado.est-corriendo{border-color:#8a7132;color:#d9b25a}
.chip-estado.est-esperando{border-color:#8a7132;color:#d9b25a}
.lista-rescate{display:flex;flex-direction:column;gap:5px;margin-top:12px}
.lista-rescate a{display:block;padding:8px 11px;border:1px solid var(--linea);border-radius:6px;
  text-decoration:none;color:inherit;font-size:12.5px}
.lista-rescate a:hover{border-color:var(--acento)}
.aviso-item{flex-direction:row;align-items:center;gap:8px;cursor:help}
.aviso-item b{font-weight:600;font-size:12.5px}
.aviso-ico{flex:none}

/* Estado de envío de mis mensajes: enviado / entregado / error, en el momento */
.envio{font-size:11px}
.envio.pendiente{color:var(--txt2)}
.envio.pendiente::before{content:'◌ '}
.envio.ok{color:#7fc493}
.envio.ok::before{content:'✓ '}
.envio.malo{color:#e08a8a;font-weight:600}
.envio.malo::before{content:'✕ '}

/* --- ayuda de los modos (panel operativo) --- */
/* Los tres modos, siempre a la vista: el nombre solo no dice qué hace cada uno,
   y confundir Directo con Con plan es caro. */
.modos-ayuda{list-style:none;margin:9px 0 0;padding:0;display:flex;flex-direction:column;gap:5px}
.modos-ayuda li{font-size:12px;color:var(--txt2);line-height:1.45;
  padding-left:10px;border-left:2px solid var(--linea)}
.modos-ayuda b{color:var(--txt);font-weight:600}
.chk .sub{display:block;font-size:11px;color:var(--txt2);margin-left:24px;font-weight:400}

/* --- puerta WhatsApp (Configuración) --- */
.wa-gw{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);
  padding:11px 15px;margin-bottom:16px;font-size:13px;color:var(--txt2);
  display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.wa-gw.mal{background:#3a1d1d;border-color:#6b2b2b;color:#ffd0d0}
.wa-gw b{color:var(--txt)}
.wa-numeros{display:flex;flex-direction:column;gap:10px}
.wa-num{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);
  padding:13px 16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.wa-num .idn{font-weight:600}
.wa-num .tel{font-family:ui-monospace,monospace;color:var(--txt2);font-size:12.5px}
.wa-num .det{color:var(--txt2);font-size:12.5px;flex:1;min-width:200px}
.wa-num .acc{display:flex;gap:7px}
.wa-chip{font-size:11px;padding:3px 10px;border-radius:20px;border:1px solid var(--linea);
  color:var(--txt2);white-space:nowrap}
.wa-chip.ok{border-color:var(--ok);color:var(--ok)}
.wa-chip.qr{border-color:var(--warn);color:var(--warn)}
.wa-chip.mal{border-color:var(--err);color:var(--err)}
.wa-qr-cuerpo{text-align:center}
.wa-qr-cuerpo img{width:320px;height:320px;background:#fff;padding:10px;border-radius:8px}
.wa-vacio{color:var(--txt2);padding:14px}
.wa-tipo{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);
  padding:11px 15px;margin-bottom:9px}
.wa-tipo-cab{display:flex;align-items:center;gap:10px;margin-bottom:7px}
.wa-dest{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:13px;
  border-top:1px solid var(--linea)}
.wa-dest .tel{color:var(--txt2);font-size:12px}
.sin-dest{padding:4px 0;border-top:1px solid var(--linea)}

/* ───────────────────────── Secretaría: plan y alta de contacto ─────────────
   Reemplazan a seis prompt() nativos. La regla es la de siempre: lo único que
   hay que leer es castellano, y el error aparece DONDE está el problema. */
.modal.ancho .modal-caja{max-width:860px;width:94vw}
.wa-buscar{width:100%;margin:0 0 10px;padding:8px 11px;font-size:13px;
  background:var(--panel2);border:1px solid var(--linea);border-radius:var(--r);
  color:var(--txt)}
.wa-tabla-caja{max-height:52vh;overflow:auto;border:1px solid var(--linea);
  border-radius:var(--r)}
.wa-tabla{width:100%;border-collapse:collapse;font-size:13px}
.wa-tabla th{position:sticky;top:0;background:var(--panel2);text-align:left;
  padding:8px 11px;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;
  color:var(--txt2);border-bottom:1px solid var(--linea);z-index:1}
.wa-tabla td{padding:7px 11px;border-bottom:1px solid var(--linea);vertical-align:middle}
.wa-tabla tr:last-child td{border-bottom:0}
.wa-tabla td.num{text-align:right;font-variant-numeric:tabular-nums;width:74px}
.wa-tabla td.num.agotado{color:var(--warn);font-weight:600}
.wa-tabla td.mono,.mono{font-family:ui-monospace,monospace;font-size:12.5px}
.wa-tabla select{width:auto;margin:0;padding:4px 8px;font-size:12.5px}
.wa-plan-estado{font-size:12px;color:var(--txt2);max-width:270px}
.wa-plan-estado.ok{color:var(--ok)}
.wa-plan-estado.mal{color:var(--err)}

/* Contra qué base consulta el contacto. Va fijo bajo el selector: si no se ve,
   se da de alta un contacto que después no sabe contra qué preguntar. */
.wa-destino{background:var(--panel2);border:1px solid var(--linea);
  border-left:3px solid var(--acc);border-radius:var(--r);padding:9px 12px;
  font-size:12.5px;color:var(--txt2);margin:-4px 0 12px}
.wa-destino b{color:var(--txt)}
.wa-destino .mal{color:var(--err)}
.wa-tel-norm{font-size:12px;color:var(--txt2);margin:-6px 0 12px;min-height:1.1em;
  font-family:ui-monospace,monospace}
.wa-tel-norm.mal{color:var(--err);font-family:inherit}
.wa-niveles{display:flex;flex-direction:column;gap:7px;margin:2px 0 12px}
.wa-niveles .chk{display:flex;align-items:flex-start;gap:8px;font-size:13px}
.wa-niveles .chk .sub{display:block;color:var(--txt2);font-size:12px}

.pie-version{text-align:center;color:var(--txt2);font-size:11.5px;opacity:.75;
  padding:22px 12px 16px;letter-spacing:.3px}

/* La caja de «pedir un texto», que reemplaza al prompt() nativo. */
.pedir{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;
  align-items:center;justify-content:center;z-index:100;padding:20px}
.pedir.oculto{display:none}
.pedir-caja{background:var(--panel);border:1px solid var(--linea);
  border-radius:var(--r);padding:20px 22px;max-width:520px;width:100%;
  display:flex;flex-direction:column;gap:10px}
.pedir-caja h2{margin:0;font-size:17px}
.pedir-caja .nota{margin:0;color:var(--txt2);font-size:13px}
.pedir-caja textarea{margin:0;resize:vertical;width:100%}
.pedir-pie{display:flex;gap:10px;justify-content:flex-end;margin-top:4px}

/* El estado del mapa de datos en la tabla de clientes. */
.celda-mapa{min-width:230px;max-width:340px}
.celda-mapa .nota{font-size:11.5px;line-height:1.35;margin-top:3px}
.celda-mapa .mapa-curso{color:var(--acc)}
.celda-mapa .mapa-fallo{color:var(--err);opacity:.85}


/* Un contacto dado de baja se ve, pero apagado: si no se viera, la baja
   lógica sería una baja a secas con pasos de más. */
.wa-dest.apagado { opacity: .55; }
.wa-dest.apagado b { text-decoration: line-through; }