@empty-class: ~'@{icecream-prefix}-empty';

.@{empty-class} {
  display: flex;
  flex-direction: column;
  align-items: center;

  &-image {
    margin-bottom: @icecream-gap-xs;
    line-height: 0;
  }

  &-title {
    color: @icecream-color-grey-8;
    font-size: @icecream-font-size-sm;
  }

  &-subtitle {
    margin-top: 4px;
    color: @icecream-color-grey-8;
    font-size: @icecream-font-size-sm;
  }
}

.@{empty-class}-has-subtitle {
  .@{empty-class}-title {
    color: @icecream-text-color;
  }
}