// List Groups

@mixin list-group-item-variant($state, $background, $color) {
  .#{$class-prefix}-list-group-item-#{$state} {
    color: $color;
    background-color: $background;

    // [converter] extracted a&, button& to a.list-group-item-#{$state}, button.list-group-item-#{$state}
  }

  .#{$class-prefix}-html-a.#{$class-prefix}-list-group-item-#{$state},
  .#{$class-prefix}-html-button.#{$class-prefix}-list-group-item-#{$state} {
    color: $color;

    .#{$class-prefix}-list-group-item-heading {
      color: inherit;
    }

    &:hover,
    &:focus {
      color: $color;
      background-color: darken($background, 5%);
    }
    &.#{$class-prefix}-active,
    &.#{$class-prefix}-active:hover,
    &.#{$class-prefix}-active:focus {
      color: #fff;
      background-color: $color;
      border-color: $color;
    }
  }
}