/**
 * @file
 * Full-screen "submitting" overlay for the TSCA probe-request webforms.
 *
 * Shown by js/tsca-submit-overlay.js while one of the three TSCA forms is
 * POSTing. The forms submit synchronously and take 12-15 seconds server-side,
 * so the overlay both reassures the user and physically blocks a second click
 * on the submit button.
 */

/* Lock background scrolling while the overlay is up. */
.tsca-submit-overlay-open {
  overflow: hidden;
}

.tsca-submit-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.94);
}

/* The element keeps the `hidden` attribute until a submit is in flight;
   the explicit rule beats the `display: flex` above. */
.tsca-submit-overlay[hidden] {
  display: none;
}

.tsca-submit-overlay__box {
  max-width: 26rem;
  text-align: center;
  color: #1a1a1a;
}

.tsca-submit-overlay__spinner {
  width: 3rem;
  height: 3rem;
  margin: 0 auto 1.25rem;
  border: 4px solid rgba(0, 0, 0, 0.15);
  border-top-color: #0b5fa5;
  border-radius: 50%;
  animation: tsca-submit-overlay-spin 0.9s linear infinite;
}

.tsca-submit-overlay__message {
  margin: 0 0 0.5rem;
  font-size: 1.25rem;
  font-weight: 700;
}

.tsca-submit-overlay__note {
  margin: 0;
  font-size: 0.95rem;
  color: #555;
}

@keyframes tsca-submit-overlay-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Respect users who ask for reduced motion: keep a slow tick, not a stop,
   so the overlay still reads as "working". */
@media (prefers-reduced-motion: reduce) {
  .tsca-submit-overlay__spinner {
    animation-duration: 3s;
  }
}