/* © 2026 bladept696 — Centro de Comando / Hash Commander. Todos os direitos reservados.
   é proibido copiar, modificar, redistribuir ou publicar este ficheiro, no todo ou em parte, sem autorização escrita do autor.
   https://github.com/bladept696/centro-de-comando-v3 */
/* ---------- Log de eventos em linha temporal (Dashboard Geral) ----------
   Reestiliza as linhas .event-row que o logEvent() já cria; o log-linha.js só acrescenta o tipo (--c, data-g) e o ícone. */
#eventLog.ll-tl{
  --ll-red:#ff6b5c; --ll-green:#a8f05a; --ll-cyan:#4fd6ff; --ll-amber:#ffb43a; --ll-violet:#b48cff;
  max-height:260px; gap:8px; padding:4px 4px 4px 96px; overflow-x:hidden;
  background:linear-gradient(#ffb43a66,#ffb43a11) no-repeat 78px 6px / 2px calc(100% - 12px);
  background-attachment:local;
}
#eventLog.ll-tl .event-row{
  --c:var(--ll-cyan); position:relative; justify-content:flex-start; min-width:0;
  border:1px solid color-mix(in srgb,var(--c) 28%,transparent); border-radius:12px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--c) 12%,#0d0a07),#0d0a07 70%); padding:9px 12px;
}
#eventLog.ll-tl .event-row.is-new,#eventLog.ll-tl .event-row.is-error{ border-left-width:1px; background:linear-gradient(90deg,color-mix(in srgb,var(--c) 12%,#0d0a07),#0d0a07 70%); }
#eventLog.ll-tl .event-row:hover{ border-color:color-mix(in srgb,var(--c) 55%,transparent); background:linear-gradient(90deg,color-mix(in srgb,var(--c) 18%,#0d0a07),#0d0a07 70%); }
#eventLog.ll-tl .event-row[data-k="warn"]{--c:var(--ll-red)}
#eventLog.ll-tl .event-row[data-k="rec"],#eventLog.ll-tl .event-row[data-k="ok"]{--c:var(--ll-green)}
#eventLog.ll-tl .event-row[data-k="blk"]{--c:var(--ll-violet)}
#eventLog.ll-tl .event-row[data-k="diag"]{--c:var(--ll-amber)}
#eventLog.ll-tl .event-row::before{
  content:""; position:absolute; left:-23px; top:50%; width:12px; height:12px; margin-top:-6px; border-radius:50%;
  background:var(--c); box-shadow:0 0 0 4px #0b0805,0 0 12px var(--c);
}
#eventLog.ll-tl .event-left{ gap:10px; min-width:0; flex:1; }
#eventLog.ll-tl .event-time{ position:absolute; left:-96px; width:66px; text-align:right; top:50%; transform:translateY(-50%); font-size:11px; }
#eventLog.ll-tl .ll-ic{ width:26px; height:26px; border-radius:8px; display:grid; place-items:center; flex:none; font-size:14px; background:color-mix(in srgb,var(--c) 18%,#120e09); }
#eventLog.ll-tl .event-badge{ font-size:10px; padding:2px 7px; border-radius:6px; border:1px solid #2f4b70; background:#0d1523; color:#bcd2ff; flex:none; }
#eventLog.ll-tl .event-text,
#eventLog.ll-tl .event-row.is-new .event-text,
#eventLog.ll-tl .event-row.is-error .event-text{ color:color-mix(in srgb,var(--c) 75%,#fff); font-size:12px; }
/* entrada: só uma vez, com brilho que se apaga */
#eventLog.ll-tl .event-row{ transition:box-shadow 1.2s ease-out,background .15s,border-color .15s; }
#eventLog.ll-tl .event-row.event-enter{ animation:llIn .6s cubic-bezier(.2,.9,.3,1.2) both; }
@keyframes llIn{ from{ opacity:0; transform:translateY(-14px) scale(.97); } }
#eventLog.ll-tl .event-row.ll-flash{ box-shadow:0 0 0 1px var(--c),0 0 22px color-mix(in srgb,var(--c) 50%,transparent); }
body.perf-mode #eventLog.ll-tl .event-row.event-enter{ animation:none; }
body.perf-mode #eventLog.ll-tl .event-row{ transition:none; }
body.perf-mode #eventLog.ll-tl .event-row.ll-flash{ box-shadow:none; }
@media (prefers-reduced-motion:reduce){
  #eventLog.ll-tl .event-row.event-enter{ animation:none; }
  #eventLog.ll-tl .event-row{ transition:none; }
  #eventLog.ll-tl .event-row.ll-flash{ box-shadow:none; }
}
/* chips de filtro */
.ll-chips{ display:flex; gap:6px; flex-wrap:wrap; margin-left:auto; margin-right:8px; }
.ll-chip{ font:inherit; font-size:11px; padding:3px 9px; border-radius:99px; border:1px solid #3a2e1c; color:#c9b99f; background:#120d07; cursor:pointer; }
.ll-chip:hover{ border-color:#6b5530; }
.ll-chip.on{ border-color:var(--amber); color:#ffe2b0; background:#2a1c0b; }
/* filtros (sem apagar entradas) */
#eventLog[data-f="warn"] .event-row:not([data-g="warn"]),
#eventLog[data-f="rec"] .event-row:not([data-g="rec"]),
#eventLog[data-f="sys"] .event-row:not([data-g="sys"]){ display:none; }
/* telemóvel: sem coluna da hora; a hora vai para dentro do cartão */
@media (max-width:760px){
  #eventLog.ll-tl{ padding-left:28px; background-position:9px 6px; }
  #eventLog.ll-tl .event-row::before{ left:-24px; }
  #eventLog.ll-tl .event-time{ position:static; width:auto; transform:none; order:3; margin-left:auto; flex:none; }
  #eventLog.ll-tl .event-left{ flex-wrap:wrap; row-gap:2px; }
  #eventLog.ll-tl .event-text{ white-space:normal; flex:1 1 100%; order:4; }
  .ll-chips{ margin-left:0; width:100%; order:5; }
}