/*
 * antibot.css — riga di stato della verifica anti-bot (registrazione)
 *
 * Non è un widget: è una riga sola, e per giunta quasi sempre invisibile.
 * Quando la verifica riesce — cioè in tutti i casi normali — non compare
 * niente. Il lettore non ha fatto nulla: una spunta verde che festeggia
 * un lavoro non suo sarebbe lo stesso distintivo decorativo per cui
 * abbiamo tolto «quanto fa 9 + 3?».
 *
 * Compare in due soli casi: quando il lettore preme Registrati prima che
 * il conto sia finito (e allora merita di sapere perché il bottone non
 * risponde), e quando la verifica fallisce.
 *
 * Nasce nascosta e la scopre il JS (assets/js/antibot.js): senza
 * JavaScript resterebbe un «verifica in corso» che non finisce mai,
 * mentre lì sotto la riserva <noscript> chiede una somma.
 *
 * Serve su due pagine diverse — /accesso e wp-login.php — perciò sta in
 * un componente suo invece che dentro access.css o login.css, che sono
 * l'uno il contrario dell'altro.
 */

.pt-antibot {
  margin: 0 0 var(--pt-space-4);
}

.pt-antibot__stato {
  display: inline-flex;
  align-items: center;
  gap: var(--pt-space-2);
  font-family: var(--pt-font-body);
  font-size: var(--pt-text-sm);
  color: var(--pt-fg-subtle);
  line-height: 1.4;
}

.pt-antibot__stato[hidden] {
  display: none;
}

/* Il segno davanti al testo: un anello che gira mentre si aspetta, fermo
   quando è un errore. Disegnato in CSS, non con un'immagine. */
.pt-antibot__stato::before {
  content: "";
  flex: none;
  width: 12px;
  height: 12px;
  border-radius: var(--pt-radius-full);
  border: 2px solid currentColor;
  border-top-color: transparent;
  animation: pt-antibot-gira 700ms linear infinite;
}


.pt-antibot--ko .pt-antibot__stato {
  color: var(--pt-error);
}

.pt-antibot--ko .pt-antibot__stato::before {
  border-top-color: currentColor;
  animation: none;
}

@keyframes pt-antibot-gira {
  to { transform: rotate(360deg); }
}

/* Chi ha chiesto meno movimento vede un anello fermo: lo stato lo dice
   comunque il testo, che è la parte che conta. */
@media (prefers-reduced-motion: reduce) {
  .pt-antibot__stato::before {
    animation: none;
    border-top-color: currentColor;
    opacity: 0.5;
  }
}