:root {
  --form-control-gap: 1rem;
  --form-error-color: #dc3545;
  --form-success-color: #198754;
  --form-label-color: #111827;
}

.form-stack {
  display: grid;
  gap: var(--form-control-gap);
}

form[data-submitting="true"] {
  opacity: .65;
  pointer-events: none;
}

.form-label,
label {
  color: var(--form-label-color);
  font-weight: 600;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
  box-shadow: 0 0 0 .25rem rgba(65, 105, 225, .15);
}

.form-control.is-invalid,
.form-select.is-invalid,
textarea.form-control.is-invalid {
  border-color: var(--form-error-color);
  box-shadow: none;
}

.invalid-feedback {
  display: block;
  font-size: .875rem;
  color: var(--form-error-color);
}

.form-text {
  font-size: .875rem;
  color: #6c757d;
}
