/* Client-side form validation feedback */
.needs-validation .invalid-feedback[data-js-validation] {
  display: none;
}

.needs-validation .is-invalid ~ .invalid-feedback[data-js-validation],
.needs-validation .form-group .is-invalid ~ .invalid-feedback[data-js-validation],
.needs-validation .mb-3 .is-invalid ~ .invalid-feedback[data-js-validation],
.needs-validation .col-md-6 .is-invalid ~ .invalid-feedback[data-js-validation],
.needs-validation .col-md-4 .is-invalid ~ .invalid-feedback[data-js-validation],
.needs-validation .col-12 .is-invalid ~ .invalid-feedback[data-js-validation] {
  display: block;
}

.needs-validation .invalid-feedback[data-js-validation].d-block {
  display: block;
}

.js-form-validation-summary {
  margin-bottom: 1rem;
  font-size: 0.95rem;
}

.needs-validation .form-control.is-invalid,
.needs-validation .form-select.is-invalid {
  border-color: var(--bs-danger, #dc3545);
  padding-inline-end: calc(1.5em + 0.75rem);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: left 0.75rem center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

[dir="rtl"] .needs-validation .form-control.is-invalid,
[dir="rtl"] .needs-validation .form-select.is-invalid {
  background-position: right 0.75rem center;
  padding-inline-start: calc(1.5em + 0.75rem);
  padding-inline-end: 0.75rem;
}

.needs-validation .form-control.is-valid,
.needs-validation .form-select.is-valid {
  border-color: var(--bs-success, #198754);
}

.was-validated .form-control:invalid,
.was-validated .form-select:invalid {
  border-color: var(--bs-danger, #dc3545);
}