:root {
  --form-success: #16a34a;
  --form-danger: #dc2626;
  --form-warning: #d97706;
  --form-focus: 0 0 0 3px rgba(17, 24, 39, 0.15);
  --form-focus-success: 0 0 0 3px rgba(22, 163, 74, 0.2);
  --form-focus-danger: 0 0 0 3px rgba(220, 38, 38, 0.18);
  --form-focus-warning: 0 0 0 3px rgba(217, 119, 6, 0.18);
}

.registration-form input,
.registration-form textarea,
.registration-form button {
  font: inherit;
}

.registration-form input:focus,
.registration-form textarea:focus {
  outline: none;
  box-shadow: var(--form-focus);
}

.registration-form input::placeholder,
.registration-form textarea::placeholder {
  opacity: 0.8;
}

.registration-form .valid,
.registration-form input.valid,
.registration-form textarea.valid {
  border-color: var(--form-success) !important;
  box-shadow: var(--form-focus-success) !important;
}

.registration-form .invalid,
.registration-form input.invalid,
.registration-form textarea.invalid {
  border-color: var(--form-danger) !important;
  box-shadow: var(--form-focus-danger) !important;
}

.registration-form .phone-checking,
.registration-form input[type="tel"][style*="border-color: #ffc107"],
.registration-form input[type="tel"][style*="border-color: rgb(255, 193, 7)"] {
  border-color: var(--form-warning) !important;
  box-shadow: var(--form-focus-warning) !important;
}

.registration-form .iti {
  width: 100%;
  display: block;
}

.registration-form .iti input[name="phone"] {
  width: 100%;
}

.registration-form .iti--separate-dial-code input[name="phone"] {
  padding-left: 96px !important;
}

.registration-form .iti__selected-dial-code {
  color: currentColor;
}

.registration-form [data-validation-error="true"] {
  position: relative;
}

.registration-form [data-validation-error="true"]::after {
  content: '!';
  position: absolute;
  top: 6px;
  right: 8px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: var(--form-danger);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
}

.registration-form .suggestion {
  color: inherit;
  text-decoration: underline;
  cursor: pointer;
}

.pageloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  background: url("https://cdnjs.cloudflare.com/ajax/libs/galleriffic/2.0.1/css/loader.gif") center no-repeat rgba(249, 249, 249, 0.8);
}

#toast-container > .toast {
  z-index: 9999 !important;
}

@keyframes onAutoFillStart {
  from {}
  to {}
}

input:-webkit-autofill {
  animation-name: onAutoFillStart;
}

@media (prefers-reduced-motion: reduce) {
  .registration-form *,
  .registration-form *::before,
  .registration-form *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}