@use "sb-element/core/theming";
/*****************************************************************************
Button / Theme
******************************************************************************/

// COLOR
@mixin button-color($bg, $color, $hover-bg, $hover-color) {
  background: $bg;
  color: $color;
  &:hover {
    background: $hover-bg;
    color: $hover-color;
  }
  &:disabled:hover {
    background: $bg;
    color: $color;
  }
}

// THEME
@mixin theme($theme) {
  @include theming.for-each-color($theme) using ($color) {
    .sb-button.sb--#{$color} {
      @include button-color(
        theming.get-color($theme, $color),
        theming.get-text($theme, $color),
        theming.get-color-inverted($theme, $color),
        theming.get-text-inverted($theme, $color)
      );

      &.plain {
        @include button-color(
          theming.get-color-inverted($theme, $color),
          theming.get-text-inverted($theme, $color),
          theming.get-color($theme, $color),
          theming.get-text($theme, $color)
        );
      }
    }
  }
}