// List groups
// *******************************************************************************

@mixin list-group-item-variant($state: null, $background: null, $color: null) {
}

// Basic List groups
@mixin template-list-group-item-variant($parent, $background, $color: null) {
  $background-color: if(
    $dark-style,
    shift-color($background, -$list-group-item-bg-scale, $card-bg),
    shift-color($background, $list-group-item-bg-scale, $card-bg)
  );
  $border-color: if(
    $dark-style,
    if(
      $parent == '.list-group-item-dark',
      color-contrast($background),
      shift-color($background, -$list-group-item-color-scale, $card-bg)
    ),
    shift-color($background, $list-group-item-color-scale, $card-bg)
  );
  $color: if(
    $parent == '.list-group-item-dark' and $dark-style,
    color-contrast($background),
    shift-color($background, $list-group-item-color-scale)
  );
  $hover-background: shade-color($background-color, $list-group-item-bg-hover-scale);
  #{$parent} {
    border-color: $border-color;
    background-color: $background-color;
    color: $color !important;
  }

  a#{$parent},
  button#{$parent} {
    color: $color;
    &:hover,
    &:focus {
      border-color: $border-color;
      background-color: $hover-background;
      color: $color;
    }

    &.active {
      border-color: $border-color !important;
      background-color: $background !important;
      // color: if($color, $color, color-contrast($background));
      color: color-contrast($background) !important;
    }
  }
}

@mixin template-list-group-theme($background, $color: null) {
  @include template-list-group-item-variant('.list-group-item-primary', $background);

  .list-group-item.active {
    &,
    &:hover,
    &:focus {
      border-color: $background;
      background-color: $background;
      color: color-contrast($background);
    }
  }
}