Inconsistent background color when custom select is invalid

Created by: fgb4101

• Bootstrap 4.2.1.
• Operating system and version: Windows 10 (1809).
• Browser and version: Chrome 71, Firefox 64.

When applying the class 'is-invalid' to an input or a select tag, the 'background-color' is not consistent.

The first example shows the native styles. https://jsbin.com/xocuwivocu/1/edit?html,css,output

The second example shows the same but with the fix I used. https://jsbin.com/soxurazula/1/edit?html,css,output