Worst of two worlds

I'm in progress of migrating an Angular 7 project to Angular 9. 90% of styles came from our global styles.scss build.

// Our styles.scss used to look like this.
$image-path: "~ng-uikit-pro-standard/assets/img";
$fa-font-path: "~@fortawesome/fontawesome-free/webfonts";
@import "partials/variables";

@import "~@fortawesome/fontawesome-free/scss/fontawesome";
@import "~@fortawesome/fontawesome-free/scss/regular";
@import "~@fortawesome/fontawesome-free/scss/solid";
@import "~@fortawesome/fontawesome-free/scss/brands";
@import "~ng-uikit-pro-standard/assets/scss/bootstrap/bootstrap";
@import "~ng-uikit-pro-standard/assets/scss/mdb"; 

/* ... */

Expected behavior

Ability to customize mdb styles and bootstrap variables and styles.

Actual behavior

Styles are difficult to customize. Skins seem like a partial solution. Packaged MDB component styles override global page styles.

Resources (screenshots, code snippets etc.)

ViewEncapsulation.None? wtf? What's the point of having component styles here then? No source for component styles or PRO styles in npm package to use in our project's style build for overriding MDB's (effectively global) styles. https://github.com/mdbootstrap/Angular-Bootstrap-with-Material-Design/blob/master/projects/angular-bootstrap-md/src/lib/free/buttons/_buttons.scss

!important propertieshttps://github.com/mdbootstrap/Angular-Bootstrap-with-Material-Design/blob/master/projects/angular-bootstrap-md/src/lib/assets/scss/core/_mixins.scss