.o-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: $space-8;
}

.o-empty-title {
  font-size: $font-2xl;
  font-weight: $font-medium;
  line-height: 1.4;
  text-align: center;
  color: $color-grey-700;
}

.o-empty-message {
  max-width: 362px;
  font-size: $font-m;
  line-height: 1.5;
  text-align: center;
  color: $color-grey-500;
}

.o-empty-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  font-size: 48px;
  color: $color-grey-400;

  &.-boxed {
    width: 84px;
    height: 84px;
    margin-bottom: $space-1;
    font-size: 36px;
    background-color: $color-grey-0;
    border-radius: 50%;
    box-shadow: inset 0 4px 12px 0 rgba(0, 0, 0, 0.025);
  }
}

.o-empty-cta {
  display: flex;
  gap: $space-4;
  margin-top: $space-5;
}