@use "aloha_prefix" as aloha;
@use "color_utils";

:root {
  @each $color-key, $color-value in color_utils.$a_colors_global {
      #{ color_utils.getColorVar($color-key) }: #{ $color-value };
  }
  @each $color-key, $color-value in color_utils.$a_theme_colors_text {
    #{ color_utils.getColorVar($color-key, "_text_emphasis") }: #{$color-value};
  }
  @each $color-key, $color-value in color_utils.$a_theme_colors_bg_subtle {
    #{ color_utils.getColorVar($color-key, "_bg_subtle") }: #{$color-value};
  }
  @each $color-key, $color-value in color_utils.$a_theme_colors_border_subtle {
    #{ color_utils.getColorVar($color-key, "_border_subtle") }: #{$color-value};
  }
  --a_color_emphasis_color: #000;

  --a_border_width: 1px;
  --a_border_style: solid;
  --a_border_color: var(--a_color_gray_300);
}

@each $color in color_utils.$a_colors {
    .#{ aloha.$aloha-prefix }color_#{ "" + $color } {
        color: var(#{ color_utils.getColorVar($color) }) !important;
    }
}
.a_color_transparent {
  color: transparent !important;
}
.a_color_inherit {
  color: inherit !important;
}

@each $bg_color in color_utils.$a_bg_colors {
    .#{ aloha.$aloha-prefix }bg_#{ "" + $bg_color } {
        background-color: var(#{ color_utils.getColorVar($bg_color) }) !important;
    }
}
.a_bg_transparent {
    background-color: transparent !important;
}
.a_bg_inherit {
    background-color: inherit !important;
}
