@mixin bg($bgColor, $class, $titleColor, $itemColor, $btnColor, $secondBgColor) {

@if $secondBgColor != null {
  .plan {
    &__header {
      background-image: linear-gradient(to bottom right, $bgColor, $secondBgColor);
    }
    &__term input:checked ~ .plan__checkmark {
      background-color: $bgColor;
    }
    &__button {
      background-color: $btnColor;
    }
  }
} @else {
  .plan {
    &__header,
    &__term input:checked ~ .plan__checkmark {
      background-color: $bgColor;
    }

    &__button {
      background-color: $btnColor;
    }
  }
}

.plan__title--#{$class},
.plan__brand--#{$class} {
  display: block;
  color: $titleColor;
}

.plan__text,
.plan__value {
  color: $itemColor;
}

}

.plan {

&--classic {
  @include bg($venetianRed, 'classic', $cardinal, $coral, $venetianRed, $mediumVioletRed);
}

&--exclusive {
  @include bg($muddyWater, 'exclusive', $cardinal, $primary, $muddyWater, null);
}

&--prime {
  @include bg($ultramarine, 'prime', $darkPurple, $darkPurple, $ultramarine, null);
}

&--private {
  @include bg($wedgewood, 'private', $brightRed, $brightRed, $wedgewood, null);
}

}