/*
 * Estado de carregamento de qualquer botão/link que dispara requisição.
 * O atributo é posto e tirado por app/javascript/carregamento.js.
 *
 * O texto some por -webkit-text-fill-color (e não por color) justamente para o currentColor
 * continuar valendo: é dele que o spinner tira a cor, seja qual for a variante do botão.
 */
[data-carregando] {
  position: relative;
  pointer-events: none;
  cursor: progress;
  -webkit-text-fill-color: transparent;
}

[data-carregando] > * {
  visibility: hidden;
}

[data-carregando]::after {
  content: "";

  position: absolute;
  inset: 0;
  margin: auto;

  inline-size: 1rem;
  block-size: 1rem;

  border: 2px solid currentColor;
  border-block-start-color: transparent;
  border-radius: 9999px;

  animation: carregamento-girar 700ms linear infinite;
}

@keyframes carregamento-girar {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-carregando]::after {
    animation-duration: 2s;
  }
}