.inpage-msg {
  @include rem(padding, 15px 10px 7px 54px);
  background: $color__brand--white;
  border: 1px solid $color__brand--black;
  position: relative;

  @include media-query-medium {
    @include rem(margin-bottom, 20px);
  }

  @include media-query-small {
    @include rem(padding, 17px 25px 17px 54px);
  }

  p {
    @include media-query-small {
      margin: 0;
    }
  }

  &.inpage-msg--information {
    background: $color__brand--warning-bg;
    border: 1px solid $color__brand--warning;
  }

  &.inpage-msg--error {
    background: $color__brand--error-bg;
    border: 1px solid $color__brand--error;
  }

  &.inpage-msg--success {
    background: $color__brand--success-bg;
    border: 1px solid $color__brand--success;
  }

  &.inpage-msg--information-blue {
    background: $color__brand--information-blue-bg;
    border: 1px solid $color__brand--information-blue;
  }

  &.inpage-msg--no-margin {
    @include rem(margin-bottom, 0);
  }

  &.inpage-msg--change-address-msg {
    @include rem(margin-bottom, 24px);
  }
}

.inpage-msg__item--em,
.inpage-msg__product-title {
  font-weight: bold;
}

.inpage-msg__icon {
  @include rem(top, 15px);
  @include rem(left, 10px);
  @include rem(font-size, 26px);
  display: none;
  position: absolute;

  @include media-query-small {
    @include rem(left, 15px);
  }

  [class*='inpage-msg--'] & {
    display: block;
  }

  .inpage-msg--error & {
    color: $color__brand--error;
  }

  .inpage-msg--success & {
    color: $color__brand--success;
  }

  .inpage-msg--information & {
    color: $color__brand--warning;
  }

  .inpage-msg--information-blue & {
    color: $color__brand--information-blue;
  }
}

.inpage-msg__close {
  @include rem(padding, 10px);
  @include rem(font-size, 20px);
  position: absolute;
  right: 0;
  top: 0;
}

.inpage-msg__title {
  @include rem(font-size, 16px);
  @include rem(margin, 0 0 12px 0);
  font-family: $font__mns-london;

  @include media-query-small {
    @include rem(font-size, 18px);
  }

  .inpage-msg--error & {
    color: $color__brand--error;
  }

  .inpage-msg--success & {
    color: $color__brand--black;
  }

  .inpage-msg--information & {
    color: $color__brand--black;
  }

  .inpage-msg--information-blue & {
    color: $color__brand--information-blue;
  }

}

.inpage-msg__content {
  @include rem(font-size, 14px);
  @include rem(line-height, 22px);
  font-family: $font__mns-london;

  .inpage-msg--success & {
    color: $color__brand--dark-grey;
  }

  .inpage-msg--information & {
    color: $color__brand--dark-grey;
  }

  .inpage-msg--information-blue & {
    color: $color__brand--information-blue;
  }

  ul {
    list-style-position: inside;
    margin: 0;
    padding: 0;
  }
}

.inpage-msg__link {
  @include rem(padding-left, 9px);
  @include rem(padding-right, 9px);
}

.inpage-msg__cta-links {
  position: absolute;
  right: 0;
  top: 0;
}

.inpage-msg__text {
  &.inpage-msg__text--highlight {
    font-weight: bold;
  }
}