@use 'sass:map';
@use '../function' as *;
@use '../mixin' as *;
@use '../config' as *;

@mixin generate-root {
  @include generate-color-variables;

  :root {
    @if map.get($generators, 'content', 'typography') {
      @include generate-variables($typography);
    }

    @if map.get($generators, 'content', 'display') {
      @include generate-variables($display);
    }

    @if map.get($generators, 'content', 'layout') {
      @include generate-variables($layout);
    }

    @if map.get($generators, 'content', 'print') {
      @include generate-variables($print);
    }

    @if setting('css-custom-properties') {
      @media (prefers-reduced-motion: reduce) {
        --#{$internal-prefix}duration: 0;
      }

      @media (prefers-reduced-motion: no-preference) {
        --#{$internal-prefix}duration: #{config('duration', $transition, false)};
        --#{$internal-prefix}timing-function: #{config('timing-function', $transition, false)};
      }
    }
  }
}