.form-input {
  @apply block w-full rounded-md border-0 py-2.5 px-3 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-gray-600 sm:text-sm sm:leading-6 transition duration-150 ease-in-out;
}

.form-label {
  @apply block text-sm font-medium text-gray-700;
}

.form-field {
  @apply relative;
}

.form-field-hint {
  @apply mt-2 text-sm text-gray-500;
}

.form-field-error {
  @apply mt-2 text-sm text-red-600;
}

.form-submit {
  @apply rounded-md bg-indigo-600 py-2.5 px-4 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600 transition duration-150 ease-in-out;
}

.form-cancel {
  @apply rounded-md bg-white py-2.5 px-4 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 transition duration-150 ease-in-out;
}