@use "sass:map";
@use "sass:meta";
@use "./variables/spacingDetail";
@use "./variables/spacingDetailScreenLarge";
@use "./helpers/mediaQueries.scss" as *;
@use "./helpers/utilities.scss" as *;

:root {
  @each $name, $map in meta.module-variables("spacingDetail") {
    @each $key in map.keys($map) {
      --ds-spacing-px-#{$key}: #{map.get($map, $key) * 1px};
      --ds-spacing-rem-#{$key}: #{ds-px-to-rem(map.get($map, $key))};
    }
  }

  @include ds-mq-smallest-breakpoint(tablet) {
    @each $name, $map in meta.module-variables("spacingDetailScreenLarge") {
      @each $key in map.keys($map) {
        --ds-spacing-px-#{$key}: #{map.get($map, $key) * 1px};
        --ds-spacing-rem-#{$key}: #{ds-px-to-rem(map.get($map, $key))};
      }
    }
  }
}