/* *****************************************************************************
*
*  Alerts
*
* ***************************************************************************** */

.alert {
  @each $themeColor, $value in $theme-colors {
    // Bs4 default alerts
    &--#{$themeColor} {
      @include gradient-bg($value);
      color: $white;
      border-color: $value;

      a {
        color: $white;
      }

      hr {
        border-top-color: $value;
      }
    }
  }

  @each $themeColor, $value in $theme-colors {
    &-#{$themeColor} {
      border-left-color: $value;
      color: darken($value, 30%);
      background-color: transparentize($value, 0.85);
    }
  }
}