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

		&.list-group-item-action {
			&:hover, &:focus {
				color: $color;
				background-color: tint-color($background, 10%);
			}

			&.active {
				background-color: $color;
				border-color: $color;
			}
		}
	}
}

@mixin dark-list-group {
	.list-group-item-action {
		color: $dark-list-group-action-color;
		&:hover, &:focus {
			color: $dark-list-group-action-hover-color;
			background-color: $dark-list-group-hover-bg;
		}
		&:active {
			color: $dark-list-group-action-active-color;
			background-color: $dark-list-group-action-active-bg;
		}
	}

	.list-group-item {
		color: $dark-list-group-color;
		background-color: $dark-list-group-bg;
		border-color: $dark-list-group-border-color;

		&.disabled,
		&:disabled {
			color: $dark-list-group-disabled-color;
			background-color: $dark-list-group-disabled-bg;
		}

		&.active {
			color: $dark-list-group-active-color;
			background-color: $dark-list-group-active-bg;
			border-color: $dark-list-group-active-border-color;
		}
	}

	@each $state, $value in $theme-colors {
		$list-group-variant-bg: shift-color($value, -$list-group-item-bg-scale);
		$list-group-variant-color: shift-color($value, -$list-group-item-color-scale);
		@if (contrast-ratio($list-group-variant-bg, $list-group-variant-color) < $min-contrast-ratio) {
			$list-group-variant-color: mix($value, color-contrast($list-group-variant-bg), abs($list-group-item-color-scale));
		}

		@include dark-list-group-item-variant($state, $list-group-variant-bg, $list-group-variant-color);
	}
}