@use "sass:map";
@use "../../../styles/tokens/space";
@use "../../../styles/tools/generate";
@use "../../../styles/typography/config" as typography;
@use "./config";

@mixin base {
  @include generate.css-map(config.$layout);
}

@mixin bar {
  position: relative;
  margin-bottom: space.get("xsmall");

  @include generate.css-map(config.$bar);
}

@mixin label {
  margin-bottom: space.get("xsmall");
  font-weight: bold;
}

@mixin value {
  font-weight: bold;

  @include generate.css-map(
    map.get(map.get(typography.$body-text, "small"), "default")
  );
}

@mixin indicator {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  max-width: 100%;
  height: 100%;
}

@mixin indicator-color($color) {
  background-color: map.get(config.$colors, $color);
}