Ionic 4 overwrite disabled input opacity


I’m using a light grey background for my ion-inputs. When I set them to disabled the standard opacity makes it very hard to read. I can’t seem to overwrite

.native-input[disabled] {
    opacity: .4;

because it is part of the shadow dom. Is there a way to change that?

You can override css variables, that are listed in the component documentation

ion-button.button-disabled{–opacity:1;} isn’t working for me as it is adding the opacity inside the shadow dom button element. Other css overrides such as --background work fine as the styling is on ion-button itself. Any ideas? According to this post ( it should work as Ive written it. I’ll update when I find the solution.