/*------------------------------------------------------------
ALERTS
====================================*/

/* Notif */
.alert {
  position: relative;
  border-width: 0 0 $alert-border-width 0;
  text-align: center;
  font-size: $alert-font-size;
  font-weight: $font-weight-sbold;

  // Icon
  &:before {
    content: '';
    display: block;
    position: absolute;
    left: $alert-icon-padding-x;
    top: 50%;
    transform: translateY(-50%);
    background: {
      repeat: no-repeat;
      size: contain;
      position: center;
    };
  }

  p {
    margin-bottom: 0;
  }
}
@each $color, $value in $theme-colors {
  .alert-#{$color} {
    @include alert-variant(rgba($value, 0.05), $value, $value);

    &:before {
      @if($color=='danger') {
        width: $alert-danger-icon-width;
        height: $alert-danger-icon-height;
        background-image: str_replace($alert-danger-icon, "#", "%23");
      } @else if($color=='success') {
        width: $alert-success-icon-width;
        height: $alert-success-icon-height;
        background-image: str_replace($alert-success-icon, "#", "%23");
      } @else if($color=='warning') {
        width: $alert-warning-icon-width;
        height: $alert-warning-icon-height;
        background-image: str_replace($alert-warning-icon, "#", "%23");
      } @else if($color=='info') {
        width: $alert-info-icon-width;
        height: $alert-info-icon-height;
        background-image: str_replace($alert-info-icon, "#", "%23");
      }
    }
  }
}

// Marge sous menu
.menu-container + .sylius-flash-message {
  .alert {
    &:last-child {
      margin-bottom: 3rem;
    }
  }
}

/* RESPONSIVE */
/***************************************/
@include media-breakpoint-up(lg) {
  // Marge sous menu
  .menu-container + .sylius-flash-message {
    .alert {
      &:first-child {
        margin-top: -2.5rem;
      }
      &:last-child {
        margin-bottom: 4rem;
      }
    }
  }
}
