.sui-m-call-out {
  display: flex;

  &__status {
    background-color: $sui-color-success;
    border-radius: $sui-border-radius-md;
    width: rem(64);
    height: rem(64);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: $sui-space-md;
    box-shadow: $sui-shadow-200;
    color: $sui-color-brand-denim-100;
    flex: none;

    &.as--sm {
      width: rem(42);
      height: rem(42);
    }

    &.as--warning {
      background-color: $sui-color-warning;
    }

    &.as--danger {
      background-color: $sui-color-danger;
    }
  }

  &__content {
    flex: 1;
  }

  &__title {
    font-size: $sui-font-size-ml;
    font-weight: bold;
  }

  &__description {
    font-size: $sui-font-size-ms;
  }
}