@import "../../styles/themes.scss";
@import "../../styles/typography.scss";

.box-shadow-component {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  background-color: var(--primary-background-hover-color);
  @include font-paragraph-bold();
  color: var(--primary-text-color);
  margin: 0 $spacing-medium $spacing-large;
  border-radius: $border-radius-small;
}

.box-shadow-small {
  box-shadow: $box-shadow-small;
}

.box-shadow-medium {
  box-shadow: $box-shadow-medium;
}

.box-shadow-large {
  box-shadow: $box-shadow-large;
}

.border-radius-small {
  border-radius: $border-radius-small;
}

.border-radius-medium {
  border-radius: $border-radius-medium;
}

.border-radius-large {
  border-radius: $border-radius-big;
}