.list {
  @extend .padding-inline-0;
  list-style-type: none;
  border-radius: $list-border-radius;
  margin-bottom: $list-margin-bottom;
  padding: 0;

  &:not(.list-separated) {
    border: $list-border;
  }
  &-border {
    .item {
      &:not(:last-child) {
        border-bottom: $list-border;
      }
    }
  }
  ul {
    margin-bottom: 0;
  }

  &.hoverable {
    .item:hover {
      background-color: $list-item-hover-color;
    }
  }
  &-separated {
    border: none;
    .item {
      padding: $list-item-separated-padding;
      margin-bottom: 0.5rem;
      border: $list-item-separated-border;
      border-radius: $list-item-serparates-radius;
    }
  }
}
.item {
  padding: $list-item-padding;
}