fix(style): make sure the `color-scheme` changes accordingly

Both based on the user's preferences and system settings.

By setting color-scheme to dark light, one can tell the browser that our pages can handle both dark and light modes.

:root {
    color-scheme: dark light;
}

One can also use a meta tag for applying color-scheme to your document.

<meta name="color-scheme" content="light dark">

The advantage of using a meta tag is that the browser knows your preferences before loading your website's CSS.

⚠️ Since we don't only rely on system's default color schema, and allow overriding that using the "User preferences", we need to do a little bit more of CSS trickery to ensure that the color-scheme changes accordingly, as shown in this PR.

fix: https://github.com/Lundalogik/crm-feature/issues/3834

jgroth / kompendium

fix(style): make sure the `color-scheme` changes accordingly #133