/* el atributo hidden SIEMPRE gana (.app/.kb-main ponen display:flex/block) */
[hidden] { display:none !important; }
:root { --bg:#f6f5fb; --card:#fff; --tx:#1f1b2d; --mu:#6b6780; --pr:#7c3aed; --pr2:#ede9fe; --bd:#e4e1ee; --ok:#15803d; --ko:#b91c1c; --warn:#b45309; }
* { box-sizing: border-box; }
html, body { margin:0; height:100%; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color:var(--tx); background:var(--bg); }
button { font:inherit; border:1px solid var(--bd); background:#fff; border-radius:10px; padding:.5rem .8rem; cursor:pointer; color:var(--tx); }
button:hover { border-color:var(--pr); }
button.primary { background:var(--pr); color:#fff; border-color:var(--pr); }
button.danger { color:var(--ko); }
button.small { padding:.3rem .6rem; font-size:.9rem; }
button:disabled { opacity:.5; cursor:default; }
input, select, textarea { max-width:100%; min-width:0; font:inherit; border:1px solid var(--bd); border-radius:10px; padding:.5rem .65rem; background:#fff; color:var(--tx); width:100%; }
textarea { resize:none; }
.muted { color:var(--mu); font-size:.88rem; }
.ok-text { color:var(--ok); font-size:.8rem; } .warn-text { color:var(--warn); font-size:.8rem; }
.app { display:flex; flex-direction:column; height:100dvh; max-width:1200px; margin:0 auto; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:.5rem; padding:.6rem .8rem; background:var(--card); border-bottom:1px solid var(--bd); }
.brand { display:flex; align-items:center; gap:.55rem; } .brand div { display:flex; flex-direction:column; line-height:1.15; }
.topbar nav { display:flex; gap:.35rem; }
.identidad { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; padding:.45rem .8rem; background:#faf9ff; border-bottom:1px solid var(--bd); }
.identidad select, .identidad input { width:auto; flex:1 1 140px; padding:.35rem .5rem; font-size:.9rem; }
.main { flex:1; display:flex; min-height:0; }
.chat { flex:1; display:flex; flex-direction:column; min-width:0; }
.mensajes { flex:1; overflow-y:auto; padding:1rem .8rem; display:flex; flex-direction:column; gap:.5rem; }
.msg { max-width:80%; padding:.6rem .8rem; border-radius:16px; line-height:1.4; white-space:pre-wrap; word-wrap:break-word; box-shadow:0 1px 1px rgba(0,0,0,.04); }
.msg.bot { background:var(--card); border:1px solid var(--bd); align-self:flex-start; border-bottom-left-radius:4px; }
.msg.yo { background:var(--pr); color:#fff; align-self:flex-end; border-bottom-right-radius:4px; }
.msg.yo a { color:#fff; }
.msg.typing { color:var(--mu); font-style:italic; }
.botones { display:flex; gap:.4rem; margin-top:.5rem; flex-wrap:wrap; }
.composer { display:flex; gap:.5rem; padding:.6rem .8rem calc(.6rem + env(safe-area-inset-bottom)); background:var(--card); border-top:1px solid var(--bd); }
.debug { width:min(420px, 45%); border-left:1px solid var(--bd); background:#fbfbfd; display:flex; flex-direction:column; min-height:0; }
.debug-head { display:flex; justify-content:space-between; align-items:center; padding:.5rem .7rem; border-bottom:1px solid var(--bd); }
.debug-lista { overflow-y:auto; padding:.5rem; font-size:.82rem; }
.debug details { border:1px solid var(--bd); border-radius:8px; background:#fff; margin-bottom:.4rem; }
.debug details.ko { border-color:#fecaca; }
.debug summary { cursor:pointer; padding:.35rem .5rem; font-family: ui-monospace, monospace; }
.debug pre { margin:0; padding:.5rem; overflow-x:auto; max-height:320px; font-size:.75rem; background:#f8f8fb; }
dialog { border:none; border-radius:16px; padding:0; width:min(640px, 96vw); max-height:92dvh; }
dialog::backdrop { background:rgba(20,10,40,.35); }
.dlg-head { display:flex; justify-content:space-between; align-items:center; padding:.8rem 1rem; border-bottom:1px solid var(--bd); position:sticky; top:0; background:#fff; }
.dlg-head h2 { margin:0; font-size:1.15rem; }
.dlg-body { padding:0 1rem 1rem; overflow-y:auto; }
.dlg-body section { padding:.6rem 0 .9rem; border-bottom:1px solid var(--bd); }
.dlg-body h3 { margin:.4rem 0; font-size:1rem; }
.dlg-body label { display:block; margin:.45rem 0; font-size:.9rem; }
.dlg-body label.check { display:flex; gap:.5rem; align-items:center; } .dlg-body label.check input { width:auto; }
fieldset { border:1px solid var(--bd); border-radius:10px; margin:.5rem 0; }
.row { display:flex; gap:.4rem; flex-wrap:wrap; margin-top:.5rem; }
.msg.ok, p.msg.ok { color:var(--ok); } p.msg.ko { color:var(--ko); }
p.msg { background:none; box-shadow:none; padding:0; max-width:none; font-size:.9rem; }
code { background:var(--pr2); padding:.05rem .3rem; border-radius:5px; }
.login-body { display:grid; place-items:center; padding:1rem; }
.login-card { background:#fff; padding:1.6rem; border-radius:18px; width:min(360px, 100%); display:flex; flex-direction:column; gap:.6rem; box-shadow:0 8px 30px rgba(60,30,120,.12); text-align:center; }
.login-card h1 { margin:0; } .login-card label { text-align:left; font-size:.9rem; }
.error { color:var(--ko); min-height:1.2em; margin:0; }
.demo-form { display:flex; gap:.6rem; flex-wrap:wrap; align-items:flex-end; margin:.6rem 0; }
.demo-nuevo { background:#ecfdf5; border:1px solid #a7f3d0; border-radius:10px; padding:.7rem; margin:.4rem 0; }
.demo-nuevo code { font-size:1.1rem; letter-spacing:.05em; user-select:all; }
.tabla-scroll { overflow-x:auto; } .tabla { border-collapse:collapse; width:100%; font-size:.9rem; }
.tabla th, .tabla td { text-align:left; padding:.35rem .5rem; border-bottom:1px solid #eee; white-space:nowrap; }
.demo-transcripcion { border:1px solid #e5e7eb; border-radius:10px; padding:.7rem; margin-top:.6rem; max-height:60vh; overflow:auto; }
.demo-transcripcion .m { margin:.3rem 0; white-space:pre-wrap; } .demo-transcripcion .m.user { color:var(--pr); }
@media (max-width: 720px) {
  .msg { max-width:90%; }
  .debug { position:fixed; inset:auto 0 0 0; width:100%; height:55dvh; border-left:none; border-top:1px solid var(--bd); box-shadow:0 -6px 20px rgba(0,0,0,.12); z-index:5; }
  .topbar nav button { padding:.4rem .5rem; font-size:.85rem; }
}

.lim-tabla { width:100%; border-collapse:collapse; font-size:.8rem; } .lim-tabla th, .lim-tabla td { text-align:left; padding:.2rem .4rem; border-bottom:1px solid var(--bd); } .lim-tabla td:nth-child(2) { font-family:monospace; font-size:.7rem; }

/* ---- conocimiento ---- */
dialog.ancho { width:min(860px, 98vw); }
.badge { display:inline-block; min-width:1.2em; padding:0 .35em; border-radius:999px; background:var(--ko); color:#fff; font-size:.72rem; line-height:1.4; text-align:center; }
.tabs { display:flex; gap:.3rem; padding:.6rem 0 .2rem; position:sticky; top:0; background:#fff; z-index:1; }
.tab.activa { background:var(--pr2); border-color:var(--pr); }
.kb-item { border:1px solid var(--bd); border-radius:10px; padding:.55rem .7rem; margin:.45rem 0; background:#fff; }
.kb-item h4 { margin:0 0 .2rem; font-size:.97rem; display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
.kb-item ul { margin:.3rem 0; padding-left:1.1rem; font-size:.85rem; color:var(--mu); }
.kb-item .resp { white-space:pre-wrap; font-size:.88rem; margin:.25rem 0; }
.chip { font-size:.72rem; padding:.05rem .45rem; border-radius:999px; background:var(--pr2); color:var(--pr); font-weight:500; }
.chip.revisar { background:#fee2e2; color:var(--ko); font-weight:600; } .kb-item.revisar { border-color:var(--ko); background:#fff7f7; }
.kb-aviso { border:1px solid var(--ko); background:#fff1f1; color:var(--ko); border-radius:8px; padding:.45rem .6rem; font-size:.88rem; margin:.4rem 0; }
.kb-campo { margin:.35rem 0; font-size:.9rem; } .kb-campo > span { display:block; margin-bottom:.2rem; }
.kb-sel-trat { border:1px solid var(--bd); border-radius:8px; padding:.4rem; background:#fff; }
.kb-sel-trat input, .kb-sel-trat select { width:100%; box-sizing:border-box; } .kb-sel-trat select { margin-top:.3rem; }
.kb-trat-actual { margin:.1rem 0 .3rem; font-weight:500; } .kb-trat-actual.falta { color:var(--ko); }
.chip.borrador { background:#fef3c7; color:var(--warn); } .chip.archivada { background:#eee; color:var(--mu); } .chip.publicada { background:#dcfce7; color:var(--ok); }
.kb-form { border-top:1px dashed var(--bd); margin-top:.5rem; padding-top:.4rem; }
.kb-prueba { border:1px solid var(--bd); border-radius:10px; background:#faf9ff; padding:.55rem .7rem; margin-top:.6rem; white-space:pre-wrap; font-size:.9rem; }
/* versión Spring: cabecera y panel a página completa */
.topbar { display:flex; gap:.6rem; align-items:center; padding:.55rem 1rem; border-bottom:1px solid var(--bd); background:#fff; position:sticky; top:0; z-index:2; flex-wrap:wrap; }
.topbar .spacer { flex:1; }
.topbar select { width:auto; min-width:12rem; }
.kb-main { max-width:900px; margin:1rem auto; background:#fff; border-radius:16px; padding:0 1rem 1rem; }
.login-card label.secundaria { margin-top:.5rem; }
.vistas { display:flex; gap:.3rem; }
#chat.app { height:calc(100vh - 3.2rem); height:calc(100dvh - 3.2rem); }
#chat .topbar { position:static; }

/* ---- ajustes ---- */
.hint { color:var(--mu); font-size:.82rem; margin:.3rem 0; }
#ajustes .row input, #ajustes .row select { flex:1 1 140px; width:auto; }
#ajustes .tabla input { width:8rem; }
.can-item { border:1px solid var(--bd); border-radius:10px; padding:.5rem .7rem; margin:.45rem 0; }
.can-item .row label { flex:1 1 200px; margin:0; }

/* ---- móvil: la barra superior no desborda (selector de negocio flexible, pestañas desplazables) ---- */
@media (max-width: 720px) {
  .topbar select { min-width:0; flex:1 1 9rem; }
  .topbar nav { overflow-x:auto; max-width:100%; -webkit-overflow-scrolling:touch; }
  .topbar nav button { white-space:nowrap; flex:0 0 auto; }
  .topbar #usuario { display:none; }
  dialog, dialog.ancho { width:100vw; max-width:100vw; max-height:100dvh; border-radius:0; }
}
.botones a.boton-enlace { display:inline-block; text-decoration:none; border-radius:8px; padding:.35rem .8rem; background:var(--pr); color:#fff; font-weight:600; font-size:.9rem; }

/* Panel de conversaciones: conversaciones.css */
.badge.punto-rojo { background: #e0245e; color: #fff; }

/* fuentes de una respuesta */
.kb-fuentes { margin-top: 6px; font-size: .92em; }
.kb-fuentes sup { color: #2563eb; margin-left: 1px; }
.kb-fuentes sup.cita-mala { color: #b91c1c; text-decoration: line-through; }
.kb-fuentes .sin-fuente { color: #b91c1c; }
.kb-lista-fuentes { margin: 4px 0 0 18px; padding: 0; }
.kb-lista-fuentes li { margin: 2px 0; }
.kb-corr textarea, .kb-corr input { width: 100%; margin: 4px 0; }
.kb-contra div { margin-top: 2px; }