I'm creating a moduler html/js application with self contained UI components. Each of my UI component may have its own template file (structure), js files (behavior) and css files (presentation). 

* Now I would like these components to have a 'default' presentation with an own local css file
* This is not a problem, and I can define the default styling on the component 'local' css
* But in addition I need global theming too, theme css defines styles for the 'whole app'
* If an user applies a theme, all local component styles should be overridden by the theme css

I know I can do this with marking all styles on the global theme css as 'important'. But I dont want to go that way. Any other suggestions on how to approach this?