@import '../common/style/var.less';

.van-sidebar-item {
  display: block;
  box-sizing: border-box;
  overflow: hidden;
  border-left: 3px solid transparent;
  user-select: none;
  padding: var(--sidebar-padding, @sidebar-padding);
  font-size: var(--sidebar-font-size, @sidebar-font-size);
  line-height: var(--sidebar-line-height, @sidebar-line-height);
  color: var(--sidebar-text-color, @sidebar-text-color);
  background-color: var(--sidebar-background-color, @sidebar-background-color);

  &__text {
    position: relative;
    display: inline-block;
    word-break: break-all;
  }

  &--hover:not(&--disabled) {
    background-color: var(--sidebar-active-color, @sidebar-active-color);
  }

  &::after {
    border-bottom-width: 1px;
  }

  &--selected {
    color: var(--sidebar-selected-text-color, @sidebar-selected-text-color);
    font-weight: var(
      --sidebar-selected-font-weight,
      @sidebar-selected-font-weight
    );
    border-color: var(
      --sidebar-selected-border-color,
      @sidebar-selected-border-color
    );

    &::after {
      border-right-width: 1px;
    }
  }

  &--selected,
  &--selected&--hover {
    background-color: var(
      --sidebar-selected-background-color,
      @sidebar-selected-background-color
    );
  }

  &--disabled {
    color: var(--sidebar-disabled-text-color, @sidebar-disabled-text-color);
  }
}