/*========== Start Alart ==========*/
.yoo-alert-text {
  font-size: 14px;
  line-height: 1.6em;
}

.yoo-alert {
  font-size: 14px;
  line-height: 1.6em;
  padding: 12px 20px;
  border-radius: 4px;
  border: 1px solid;

  a {
    font-weight: 500;
    text-decoration: underline;
  }

  p {
    margin-bottom: 0;
  }

  h2 {
    font-size: 18px;
    margin-bottom: 5px;
  }

  hr {
    margin: 5px 0;
    opacity: 0.3;
  }
  &.yoo-style1 {
    padding: 15px 20px;
  }
}

.yoo-primary {
  color: $accent-color6;
  border-color: rgba($accent-color6, 0.6);
  background-color: rgba($accent-color6, 0.1);

  h2 {
    color: $accent-color6;
  }
  hr {
    border-color: $accent-color6;
  }
}

.yoo-success {
  color: $accent-color3;
  border-color: rgba($accent-color3, 0.6);
  background-color: rgba($accent-color3, 0.1);

  h2 {
    color: $accent-color3;
  }
  hr {
    border-color: $base-color3;
  }
}

.yoo-info {
  color: $accent-color1;
  border-color: rgba($accent-color1, 0.6);
  background-color: rgba($accent-color1, 0.1);

  h2 {
    color: $accent-color1;
  }
  hr {
    border-color: $accent-color1;
  }
}

.yoo-danger {
  color: $accent-color4;
  border-color: rgba($accent-color4, 0.6);
  background-color: rgba($accent-color4, 0.1);

  h2 {
    color: $accent-color4;
  }
  hr {
    border-color: $accent-color4;
  }
}

.yoo-primary-text {
  color: $accent-color6;
}

.yoo-success-text {
  color: $accent-color3;
}

.yoo-info-text {
  color: $accent-color1;
}

.yoo-danger-text {
  color: $accent-color4;
}

.yoo-alert-wrap .yoo-alert:not(:last-child) {
  margin-bottom: 10px;
}

.yoo-link {
  color: $accent-color2;
}
/*========== End Alart ==========*/