:root{--fondo: #f6f7f9;--superficie: #ffffff;--texto: #1c2430;--texto-suave: #5d6b7c;--borde: #dde2e8;--acento: #2563eb;--acento-texto: #ffffff;--urgente: #c0392b;--advertencia: #b9770e;--cliente: #eef1f5;--bot: #e3edff;--agente: #dff5e4}@media (prefers-color-scheme: dark){:root{--fondo: #12161c;--superficie: #1a2029;--texto: #e8ecf1;--texto-suave: #98a5b5;--borde: #2c3542;--acento: #5b8def;--acento-texto: #0b1220;--urgente: #ff7a6b;--advertencia: #e2a33b;--cliente: #262e3a;--bot: #1f3358;--agente: #1f4a2c}}*{box-sizing:border-box}body{margin:0;background:var(--fondo);color:var(--texto);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.4}button,input,select,textarea{font:inherit;color:inherit}button{background:var(--acento);color:var(--acento-texto);border:0;border-radius:8px;padding:8px 14px;cursor:pointer}button.secundario{background:transparent;color:var(--texto);border:1px solid var(--borde)}button:disabled{opacity:.5;cursor:not-allowed}input,textarea,select{background:var(--superficie);border:1px solid var(--borde);border-radius:8px;padding:8px 10px}.error{color:var(--urgente)}.cargando{padding:24px 16px;color:var(--texto-suave)}.login{min-height:100vh;display:grid;place-items:center;padding:16px}.login form{width:100%;max-width:360px;background:var(--superficie);border:1px solid var(--borde);border-radius:12px;padding:24px;display:grid;gap:14px}.login h1{margin:0;font-size:1.3rem}.login label{display:grid;gap:4px;font-size:.9rem;color:var(--texto-suave)}.pantalla{height:100vh;height:100dvh;display:flex;flex-direction:column}.encabezado{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:var(--superficie);border-bottom:1px solid var(--borde)}.marca{font-weight:700;color:var(--texto);text-decoration:none}.encabezado-derecha{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.encabezado-derecha a{color:var(--acento);text-decoration:none}.usuario{color:var(--texto-suave)}.banner{margin:0;padding:8px 16px;background:var(--superficie);border-bottom:1px solid var(--borde)}.cuerpo{flex:1;min-height:0;display:grid;grid-template-columns:340px 1fr}.lista{border-right:1px solid var(--borde);background:var(--superficie);min-height:0;overflow-y:auto}.chat{min-height:0;display:flex;flex-direction:column}.vacio{padding:24px 16px;color:var(--texto-suave)}.pestanas{display:flex;border-bottom:1px solid var(--borde)}.pestana{flex:1;background:transparent;color:var(--texto-suave);border-radius:0;padding:10px 4px;border-bottom:2px solid transparent;font-size:.85rem}.pestana.activa{color:var(--texto);border-bottom-color:var(--acento);font-weight:600}.buscar{width:calc(100% - 16px);margin:8px}.filas{list-style:none;margin:0;padding:0}.fila{display:grid;gap:2px;padding:10px 14px;color:var(--texto);text-decoration:none;border-bottom:1px solid var(--borde);border-left:3px solid transparent}.fila.seleccionada{background:var(--fondo)}.fila.urgente{border-left-color:var(--urgente)}.fila-titulo{display:flex;justify-content:space-between;gap:8px}.fila-titulo time{color:var(--texto-suave);font-size:.8rem}.fila-etiquetas{display:flex;gap:6px;flex-wrap:wrap}.fila-mensaje{color:var(--texto-suave);font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.etiqueta{font-size:.75rem;padding:1px 8px;border-radius:999px;border:1px solid var(--borde);color:var(--texto-suave)}.etiqueta.sin-asignar{color:var(--advertencia);border-color:var(--advertencia)}.etiqueta.urgente-txt{color:var(--urgente);border-color:var(--urgente);font-weight:600}.chat-panel{display:flex;flex-direction:column;height:100%;min-height:0}.chat-encabezado{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 16px;background:var(--superficie);border-bottom:1px solid var(--borde)}.chat-titulo h2{margin:0;font-size:1.1rem}.chat-titulo p{margin:2px 0 0;color:var(--texto-suave);font-size:.9rem}.chat-estado{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.chat-acciones{display:flex;gap:8px;flex-wrap:wrap}.volver{display:none;color:var(--acento);text-decoration:none;width:100%}.reasignar{display:flex;gap:8px;align-items:end;flex-wrap:wrap;padding:8px 16px;background:var(--superficie);border-bottom:1px solid var(--borde)}.reasignar label{display:grid;gap:4px;font-size:.85rem;color:var(--texto-suave)}.mensajes{flex:1;min-height:0;overflow-y:auto;padding:12px 16px;display:flex;flex-direction:column;gap:8px}.mensaje{max-width:min(70%,520px);padding:8px 12px;border-radius:12px;background:var(--cliente);align-self:flex-start}.mensaje[data-tipo=bot]{background:var(--bot);align-self:flex-end}.mensaje[data-tipo=agent]{background:var(--agente);align-self:flex-end}.mensaje[data-tipo=system]{align-self:center;background:transparent;color:var(--texto-suave);font-size:.85rem;text-align:center;max-width:90%}.mensaje-texto{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.mensaje small{color:var(--texto-suave);font-size:.75rem}.ventana{margin:0;padding:4px 16px;font-size:.8rem;color:var(--texto-suave)}.ventana.error{color:var(--urgente)}.caja{display:flex;gap:8px;padding:8px 16px 12px;background:var(--superficie);border-top:1px solid var(--borde)}.caja textarea{flex:1;resize:none}@media (max-width: 767px){.cuerpo{grid-template-columns:1fr}.pantalla:not(.con-chat) .chat{display:none}.pantalla.con-chat .lista{display:none}.volver{display:block}.mensaje{max-width:88%}.encabezado{padding:8px 12px}}.interruptor{background:transparent;color:var(--texto-suave);border:1px solid var(--borde);border-radius:999px;padding:4px 12px;font-size:.85rem}.interruptor.activo{color:var(--acento-texto);background:var(--acento);border-color:var(--acento)}.pantalla-simple{height:auto;min-height:100vh}.contenido{padding:16px;max-width:980px;width:100%;margin:0 auto}.contenido h1{margin:8px 0 16px;font-size:1.3rem}.contenido a{color:var(--acento)}.tabla-scroll{overflow-x:auto;background:var(--superficie);border:1px solid var(--borde);border-radius:12px}.tabla{width:100%;border-collapse:collapse;font-size:.9rem}.tabla th,.tabla td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--borde);white-space:nowrap}.tabla .acciones{display:flex;gap:6px}.aviso-clave{background:var(--superficie);border:1px solid var(--acento);border-radius:12px;padding:12px 16px;margin-bottom:12px}.aviso-clave p{margin:0 0 8px}.aviso-clave code{font-size:1.1rem;-webkit-user-select:all;user-select:all}.form-agente{margin-top:20px;background:var(--superficie);border:1px solid var(--borde);border-radius:12px;padding:16px;display:grid;gap:12px;max-width:420px}.form-agente h2{margin:0;font-size:1.05rem}.form-agente label{display:grid;gap:4px;font-size:.9rem;color:var(--texto-suave)}