Bootstrap formvalidation fallback with .is-invalid and .is-v

Expected behavior

The material styled form should display success / error icons and color highlighting also with fallback option for server-side validation (utilizing the .is-valid and .is-invalid classes on the "form-control" element).

Actual behavior

With plain bootstrap, server-side form validation works fine and displays the success / error icons within the input field and colors the border green or red:

With material styled forms, this is not working, even in your demo (compare left to right):

Just the "valid-feedback" and "invalid-feedback" divs are displayed, but the icon and the colored border are missing.

First I thought that this is just wrong in the demo, but after buying the pro version and testing it locally, I can tell that it is the same there.

When looking at inspector / "firebug" I can see that the class is correctly applied to the form-control element, but somehow, the style don't turn active:

With a normal, not MD formatted form, this part of the css is taking affect:

I think, it has something to do with this:

If the pseudo classe :valid / :invalid are used, then the style is active.

As I want to have server side validation in place, I need this to function correctly.

Thanks!!

Resources (screenshots, code snippets etc.)