.navigator {
  display: flex;
}

.navigator__item {
  margin-top: 35px;
  cursor: pointer;
  -webkit-user-select: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: var(--color-link-hover);
  padding: 12px 16px 12px 16px;
  color: black;
  width: max-content;
  font-size: 14px;

  @apply --squircle;

  &--previous {
    align-items: flex-start;
    margin-left: 0;
  }

  &--next {
    align-items: flex-end;
    margin-left: auto;
  }

  &-direction {
    text-transform: capitalize;
    color: var(--color-text-second);
    font-size: 12px;
    line-height: 140%;
    margin-bottom: 2px;
  }

  &-label {
    width: 100%;
    font-weight: 500;
  }
}


