@use "sass:meta";
@import "constants";
@import "functions";
@import "animation";
@import "colors";
@import "icons";

:root,
html,
body {

  // loading animation only if enabled, respects animation disable preference
  @media not (prefers-reduced-motion: reduce) {

    // animation durations
    @each $key, $value in $animation-durations {
      --#{$prefix}-#{$key}: #{$value};
    }
  }

  @include moz-pref-media("userChrome.ui-force-animation") {

    // animation durations
    @each $key, $value in $animation-durations {
      --#{$prefix}-#{$key}: #{$value};
    }
  }

  // animation
  @each $key, $value in $animation {
    --#{$prefix}-#{$key}: #{$value};
  }

  // icons
  @each $key, $value in $icons {
    --#{$prefix}-#{$key}: #{$value};
  }

  // when not chrome-refresh or when old-icons enabled
  @include moz-pref-media("not userChrome.ui-chrome-refresh") {
    @include moz-pref-media("userChrome.ui-force-old-icons") {

      // old icons
      @each $key, $value in $icons-old {
        --#{$prefix}-#{$key}: #{$value};
      }
    }
  }

  // colors
  @each $key, $value in $colors {
    --#{$prefix}-#{$key}: #{$value};
  }

  @each $key, $value in $global {
    --#{$prefix}-#{$key}: #{$value};
  }

  // dark mode colors
  @each $key, $value in $dark-mode {
    --#{$prefix}-#{$key}: #{$value};
  }

  // optional feature: Chrome refresh theme colors

  @include moz-pref-media("userChrome.theme-chrome-refresh") {
    @each $key, $value in $chrome-refresh-colors {
      --#{$prefix}-#{$key}: #{$value};
    }
  }

  // light mode colors (placed to the end to override dark mode styles if light mode is enabled)
  @media (prefers-color-scheme: light) {
    @each $key, $value in $light-mode {
      --#{$prefix}-#{$key}: #{$value};
    }
  }

  @include moz-pref-media("userChrome.theme-material") {
    @each $key, $value in $theme-material-light {
      --#{$prefix}-#{$key}: #{$value};
    }

    @media (prefers-color-scheme: dark) {
      @each $key, $value in $theme-material-dark {
        --#{$prefix}-#{$key}: #{$value};
      }
    }
  }
}