:root {
  --si-loading-color1: #009cde;
  --si-loading-color2: #ffcd00;
}
.page-title {
  margin-block-end: 1.75rem;
}

.si-signup-form {
  position: relative;
}
.si-signup-form .form-wrapper {
  display: flex;
  flex-flow: column nowrap;
  gap: 1.5rem;
}

.si-signup-form .si-message {
  font-weight: bold;
  flex-flow: column nowrap;
}
.si-signup-form .fade:not(.show) {
  opacity: 0;
  transition: opacity 0.4s ease;
  display: none;
}

.si-signup-form .show {
  opacity: 1;
  display: flex;
}

.content--loading {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  position: absolute;
  z-index: 1000;
  background: #fff;
  justify-content: center;
  justify-content: center;
  align-items: center;
}

.content--loading:before {
  content: " ";
  display: block;
  width: 64px;
  height: 64px;
  max-width: 64px;
  background: none;
  border-radius: 50%;
  border: 6px solid var(--si-loading-color1);
  border-color: var(--si-loading-color1) transparent var(--si-loading-color2) transparent;
  animation: spinner 1.2s linear infinite;
  transition: border-color 200ms linear;
}

@keyframes spinner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}