.input-group.input-group-clear:has(.form-control:focus) {
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}

.input-group.input-group-clear:has(.form-control.is-valid:focus),
.was-validated .input-group.input-group-clear:has(.form-control:valid:focus) {
  border-color: var(--bs-form-valid-border-color);
  box-shadow: 0 0 0 .25rem rgba(var(--bs-success-rgb), .25);
}

.input-group.input-group-clear:has(.form-control.is-invalid:focus),
.was-validated .input-group.input-group-clear:has(.form-control:invalid:focus) {
  border-color: var(--bs-form-invalid-border-color);
  box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25);

}

.was-validated .input-group.input-group-clear:has(:invalid)+.invalid-feedback,
.was-validated .input-group.input-group-clear:has(:invalid)+.validation-feedback .invalid-feedback,
.was-validated .input-group.input-group-clear:has(:valid)+.valid-feedback,
.was-validated .input-group.input-group-clear:has(:valid)+.validation-feedback .valid-feedback,
.was-validated .input-group.input-group-clear:has(:invalid)+.invalid-tooltip,
.was-validated .input-group.input-group-clear:has(:invalid)+.validation-feedback .invalid-tooltip,
.was-validated .input-group.input-group-clear:has(:valid)+.valid-tooltip,
.was-validated .input-group.input-group-clear:has(:valid)+.validation-feedback .valid-tooltip,
.input-group.input-group-clear:has(.is-invalid)+.invalid-feedback,
.input-group-input-group-clear:has(.is-invalid)+.validation-feedback .invalid-feedback,
.input-group.input-group-clear:has(.is-valid)+.valid-feedback,
.input-group.input-group-clear:has(.is-valid)+.validation-feedback .valid-feedback,
.input-group.input-group-clear:has(.is-invalid)+.invalid-tooltip,
.input-group.input-group-clear:has(.is-invalid)+.validation-feedback .invalid-tooltip,
.input-group.input-group-clear:has(.is-valid)+.valid-tooltip,
.input-group.input-group-clear:has(.is-valid)+.validation-feedback .valid-tooltip {
  display: block;
}

.input-group.input-group-clear .form-control:focus,
.input-group.input-group-clear .form-control:valid,
.input-group.input-group-clear .form-control.is-valid:focus,
.input-group.input-group-clear .form-control.is-invalid:focus,
.was-validated .input-group.input-group-clear .form-control:valid:focus,
.was-validated .input-group.input-group-clear .form-control:invalid:focus {
  box-shadow: none;
  border: none;
}

.input-group.input-group-clear {
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.input-group-lg.input-group-clear {
  border-radius: var(--bs-border-radius-lg);
}

.input-group.input-group-clear .form-control {
  border: 0;
  border-radius: var(--bs-border-radius) !important;
}

.input-group-lg.input-group-clear .form-control {
  border: 0;
  border-radius: var(--bs-border-radius-lg) !important;
}

.input-group.input-group-clear .btn {
  border: 0;
  box-shadow: none;
  transition: none;
}

.input-group.input-group-clear .input-group-text:first-child {
  border-left: none;
  border-top: none;
  border-bottom: none;
  border-right: var(--bs-border-width) solid var(--bs-border-color);
  z-index: 10
}

.input-group.input-group-clear:has(.form-control:placeholder-shown) .btn {
  display: none;
}

.bi {
  display: inline-block;
  vertical-align: -.125em;
  fill: currentcolor;
}