@import "../mixins/fluid-type";

$accent-sizes: ('2xl', 'xl', 'lg', 'md', 'sm', 'xs', '2xs');

// Generate CSS custom properties for Accent
@mixin generate-accent-css-vars($theme-config) {
  @include generate-fluid-type-css-vars('accent', $accent-sizes, $theme-config);
}

// Generate Accent classes
@mixin generate-accent-classes($use-fallback: false, $fallback-config: null) {
  @include generate-fluid-type-classes('accent', $accent-sizes, $use-fallback, $fallback-config);
  
  // common style(s) for Accent sizes
  @each $size in $accent-sizes {
    .accent-#{$size} {
      text-transform: uppercase;
    }
  }
}
