.alert {
  padding: 0.5em 2.5em 0.5em 1em;
  background-color: var(--danger-low);
  color: var(--primary);
  position: relative;
  margin-bottom: 1em;

  .close {
    font-size: $font-up-3;
    position: absolute;
    top: 0.265em;
    right: 0.66em;
    .d-icon {
      color: var(--primary-medium);
    }
  }

  &.alert-success {
    background-color: var(--success-low);
    color: var(--primary);
  }
  &.alert-error {
    background-color: var(--danger-low);
    color: var(--primary);
  }
  &.alert-info {
    background-color: var(--tertiary-low);
    color: var(--primary);
    &.clickable {
      color: var(--tertiary);
    }
  }
}

a.alert.clickable {
  display: flex;
}