/* Attività in diretta nella bolla «sta lavorando» (2026-10-03). Quando ci sono voci, i tre puntini
   lasciano il posto all'elenco; senza voci (backend vecchio) resta tutto come prima. */
.atv-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.corpo.atv-con > .bolla-scrive { display: none; }

.atv {
  margin-top: 4px; max-width: 560px; padding: 8px 10px; border-radius: var(--r-xl, 12px);
  background: var(--rialzo, #1f1f1f); border: 1px solid var(--linea, rgba(240, 240, 240, .08));
}
.atv-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.atv-voce {
  display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 8px;
  min-height: 28px; padding: 3px 6px; border-radius: var(--r, 6px);
  color: var(--testo-2, rgba(240, 240, 240, .72)); font-size: 13px; line-height: 1.35;
}
.atv-ico {
  display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px;
  background: var(--rialzo-2, #262626); color: var(--testo-2, rgba(240, 240, 240, .72)); font-size: 12px; line-height: 1;
}
.atv-testo { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.atv-esito { display: inline-flex; align-items: center; justify-content: center; min-width: 16px; font-size: 12px; font-weight: 700; }
.atv-e-ok .atv-esito { color: var(--verde, #3fa266); }
.atv-e-errore .atv-esito { color: var(--rosso, #e34671); }
.atv-e-errore .atv-testo { color: var(--testo, #f0f0f0); }
.atv-ultima { background: var(--accento-fondo, rgba(89, 156, 231, .14)); color: var(--testo, #f0f0f0); }
.atv-ultima .atv-testo { font-weight: 600; white-space: normal; overflow-wrap: anywhere; }
.atv-ultima .atv-ico { background: var(--accento-linea, rgba(89, 156, 231, .45)); color: var(--testo, #f0f0f0); }

/* «in corso»: un anello che gira piano; con riduzione del movimento è un punto fermo */
.atv-gira { display: inline-block; width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--accento, #599ce7); border-right-color: transparent; }
@media (prefers-reduced-motion: no-preference) {
  .atv-gira { animation: atv-gira 1.1s linear infinite; }
  .atv-voce { animation: atv-entra .22s cubic-bezier(.2, .8, .2, 1); }
  @keyframes atv-gira { to { transform: rotate(360deg); } }
  @keyframes atv-entra { from { opacity: .3; } to { opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) {
  .atv-gira { border-right-color: var(--accento, #599ce7); background: var(--accento, #599ce7); width: 8px; height: 8px; }
}

.atv-tutto {
  margin-top: 4px; padding: 4px 8px; min-height: 32px; border: 0; background: transparent;
  color: var(--accento, #599ce7); font: inherit; font-size: 12px; cursor: pointer; border-radius: var(--r, 6px);
}
.atv-tutto:hover { background: var(--hover, rgba(240, 240, 240, .06)); }

@media (max-width: 820px) {
  .atv { max-width: 100%; }
  .atv-voce { font-size: 14px; min-height: 32px; }
  .atv-tutto { min-height: 44px; font-size: 14px; }
}
.atv-tutto[hidden] { display: none; }