@import "mixins/all";

/*
  -------------------
  Flash notifications
  -------------------
*/

.ajax-notification,
.flash-notification {
  margin-bottom: lines(0.5);
  @include media(tablet) {
    margin-bottom: lines(1);
  }
  position: relative;
  padding: em(8) em(20) em(12) em(20);
  @include border-radius(em(5));
  .ajax-icon, .flash-icon {
    position: absolute;
    top: em(10);
    left: em(12);
  }
  .ajax-text, .flash-text {
    margin-left: lines(0.75);
    min-height: lines(0.5);
  }
}

.ajax-notice, .ajax-warning,
.flash-notice, .flash-warning,
.ajax-update-notice {
  background: $highlight;
}

.ajax-success,
.flass-success,
.ajax-update-success {
  background: $light-green;
}

.ajax-error,
.flash-error,
.ajax-update-error {
  color: $background;
  background: $error-red;
}

.flash-error-link {
  color: darken($background, 20%);
  &:hover {
    color: darken($background, 30%);
  }
}

.narrow-notification {
  @include media(tablet) {
    margin-right: lines(16);
  }
}