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

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

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

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

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

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

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

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

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

//theme

.ma__error-page {

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

  &__label {
    color: var(--mf-c-warning);
    font-weight: 900;
  }

  &__type {
    color: var(--mf-c-font-detail);
    font-weight: $fonts-bold;
  }

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

  &__message {
    color: var(--mf-c-font-base);
    font-weight: $fonts-light;
  }
}