@use "sass:meta";
@use "sass:string";
@use "./variables/colorsDnLight";
@use "./variables/colorsDnDark";
@use "./helpers/colors.scss" as *;

html,
.ds-light {
  @each $name, $value in meta.module-variables("colorsDnLight") {
    --ds-color-#{string.slice($name, 8)}: #{$value};
  }
}

// enable listening to OS dark mode by setting class support-color-scheme on html-tag
html.support-color-scheme:not(.ds-light) {
  @media (prefers-color-scheme: dark) {
    @include get-dark-color-scheme();
  }
}

// for manually switching on dark mode
.ds-dark {
  @include get-dark-color-scheme();
}

html {
  --ds-theme-color: #{$ds-color-text-brand};
}

.ds-theme--nyheter {
  --ds-theme-color: #{$ds-color-text-brand};
}

.ds-theme--kultur {
  --ds-theme-color: #{$ds-color-text-culture};
}