@each $state, $data in $form-validation-states {
    @if $state == "valid" {
        .#{$state}-tooltip {
            color: var(--#{$prefix}success-contrast);
        }

        @if $enable-dark-mode {
            @include color-mode(dark) {
                .form-control.is-valid,
                .was-validated .form-control:valid {
                    @if $enable-validation-icons {
                        background-image: escape-svg($form-feedback-icon-valid-dark);
                    }
                }

                .form-select.is-valid,
                .was-validated .form-select:valid {
                    @if $enable-validation-icons {
                        &:not([multiple]):not([size]),
                        &:not([multiple])[size="1"] {
                            --#{$prefix}form-select-bg-icon: #{escape-svg($form-feedback-icon-valid-dark)};
                        }
                    }
                }
            }
        }
    } @else if $state == "invalid" {
        .#{$state}-tooltip {
            color: var(--#{$prefix}danger-contrast);
        }

        @if $enable-dark-mode {
            @include color-mode(dark) {
                .form-control.is-invalid,
                .was-validated .form-control:invalid {
                    @if $enable-validation-icons {
                        background-image: escape-svg($form-feedback-icon-invalid-dark);
                    }
                }

                .form-select.is-invalid,
                .was-validated .form-select:invalid {
                    @if $enable-validation-icons {
                        &:not([multiple]):not([size]),
                        &:not([multiple])[size="1"] {
                            --#{$prefix}form-select-bg-icon: #{escape-svg($form-feedback-icon-invalid-dark)};
                        }
                    }
                }
            }
        }
    }
}