Hi Team, I am trying to override the styles in component password-complexity-indicator. I copied the component to my theme folder, but I still get the styles placed in vendor directory. I noticed that the entry point of the component is importing an intermediate style.scss which, instead of the whole styles, it uses a helper-import

@include helper-import(molecule, password-complexity-indicator) {
    @include shop-ui-password-complexity-indicator;
}

I have checked that if I remove this helper-import and replace it with the styles, it overrides the styles like expected. I've seen this pattern in other components and I have the same behaviour. What would be the best way to override this components without removing the helper-import? And what is the reason to use this pattern in this components instead of just using the component's mixin without the helper-import?

https://docs.spryker.com/docs/scos/dev/front-end-development/202212.0/yves/atomic-frontend/managing-the-components/extending-a-component.html#c[…]es The

helper-import

mixin provides the ability to disable styles from the core by component name. No sense to use the mixin at the project level.

Thanks! That makes sense.