$breadcrumbListSeparatorColor: $gray-70;

$includeHtml: false !default;

@if ($includeHtml) {
  .sg-breadcrumb-list {
    @include sgListBasicStyles();
    display: inline-block;
    color: $breadcrumbListSeparatorColor;

    &--spaced {
      .sg-breadcrumb-list__element::after {
        padding: 0 4px;
      }
    }

    &__element {
      display: inline-block;

      &::after {
        content: '\00B7';
        display: inline-block;
        color: $breadcrumbListSeparatorColor;
        padding: 0 2px;
      }

      &:last-child::after {
        display: none;
      }
    }

    &--short {
      line-height: 1rem;
      min-height: 1rem;
    }

    &--adaptive {
      color: inherit;

      .sg-breadcrumb-list__element {
        &::after {
          color: inherit;
        }
      }
    }

    &--inline-items {
      .sg-breadcrumb-list__element {
        display: inline;
      }
    }
  }
}