@use "00-base/configure" as *;

.ma__error-page {
  margin-bottom: 40px;
  text-align: center;

  &__label {
    font-size: $fonts-11xlarge;
    line-height: 0.72;
    margin-bottom: 15px;
    text-transform: uppercase;

    @media ($bp-small-min) {
      font-size: $fonts-max;
    }
  }

  &__type {
    font-size: $fonts-xlarge;
    letter-spacing: $letter-spacing-large;
    text-transform: uppercase;
  }

  &__title {
    font-size: $fonts-xlarge;
    line-height: 1.31;

    @media ($bp-small-min) {
      font-size: $fonts-4xlarge;
    }
  }

  &__message {
    font-size: $fonts-large;
    line-height: 1.5;
    margin-bottom: 1.75em;

    @media ($bp-small-min) {
      font-size: $fonts-larger;
    }
  }
}

//theme

.ma__error-page {

  &:before {
    background-color: rgba($c-warning, .15);
  }

  &__label {
    color: $c-warning;
    font-weight: 900;
  }

  &__type {
    color: $c-font-detail;
    font-weight: $fonts-bold;
  }

  &__title {
    font-weight: $fonts-bold;
  }

  &__message {
    color: $c-font-base;
    font-weight: $fonts-lighter;
  }
}