:root {
  --form-accent: #e8763a;
  --form-border: #eadfd7;
  --form-surface: #fffdfa;
  --form-text: #2f2925;
  --form-muted: #806f65;
  --form-danger: #c43c36;
  --form-radius: 14px;
}

.page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
  max-width: 100%;
  border-color: var(--form-border);
  border-radius: var(--form-radius);
  background-color: var(--form-surface);
  color: var(--form-text);
}

.page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea):focus {
  outline: none;
  border-color: var(--form-accent);
  box-shadow: 0 0 0 4px rgba(232, 118, 58, .12);
}

.page :where(input, select, textarea):disabled {
  cursor: not-allowed;
  opacity: .65;
}

.page :where(.error, .form-error, .alert-error, .auth-alert--error, .flash-error) {
  border: 1px solid rgba(196, 60, 54, .25);
  border-radius: 14px;
  background: #fff2f1;
  color: var(--form-danger);
}

.page :where(.success, .form-success, .alert-success, .auth-alert--success, .flash-success) {
  border: 1px solid rgba(45, 145, 84, .24);
  border-radius: 14px;
  background: #effaf3;
  color: #257444;
}

@media (max-width: 720px) {
  .page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    font-size: 16px;
  }
}
