$toast-height: $size-m;
$toast-max-width: 530px;
$toast-horizontal-spacing: $spacing-l;
$toast-vertical-spacing: $spacing-xxs;
$toast-shadow: $style-elevate;
$toast-radius: $radius-rounded;

//$toast-danger-background: $color-alert;
//$toast-danger-background-darken: $color-alert--active;
//$toast-default-background: $color-cardbase;
//$toast-default-background-darken: $color-cardbase--hover;
$toast-default-background: #323443;
$toast-default-background-strip: #2f3140;
$toast-danger-background: #E04141;
$toast-danger-background-strip: #d63f3f;

.toast {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: $toast-height;
  min-width: $toast-max-width;
  margin: 0 0 $toast-vertical-spacing;
  padding: 0 $toast-horizontal-spacing;
  color: #fff;
  box-shadow: $toast-shadow;
  border-radius: $toast-radius;
  text-align: center;
  @include font-text-bodybold();
  .close {
    display: flex;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 10px;
    padding: 5px;
    transform: translate(0, -50%);
    font-size: 10px;
    color: rgba(255, 255, 255, .5);
    &:hover {
      color: #fff;
    }
  }
  &.success {
    background: repeating-linear-gradient(
            -45deg,
            $toast-default-background,
            $toast-default-background 23px,
            $toast-default-background-strip 23px,
            $toast-default-background-strip 36px
    );
  }
  &.danger {
    background: repeating-linear-gradient(
            -45deg,
            $toast-danger-background,
            $toast-danger-background 23px,
            $toast-danger-background-strip 23px,
            $toast-danger-background-strip 46px
    );
  }
  &.info {
    background: repeating-linear-gradient(
            -45deg,
            $toast-default-background,
            $toast-default-background 23px,
            $toast-default-background-strip 23px,
            $toast-default-background-strip 36px
    );
  }
}

@media (max-width: $tabletBreakpoint) {
  .toast {
    min-width: 80vw;
  }
}
