$cascader-prefix-cls: "#{$css-prefix}cascader";
$cascader-item-prefix-cls: "#{$css-prefix}cascader-menu-item";


.#{$cascader-prefix-cls} {
  &-menu {
    & + span {
      margin-left: -3px;
    }

    & &-item {
      padding-left: 8px;

      & .h-checkbox-wrapper {
        margin: 0 4px 0 0;
      }

      i {
        color: #999;
        font-weight: normal;
        margin-top: $cascader-item-i-margin-top;
      }

      &-active {
        background-color: #f7f7f7;
        color: #333;
        font-weight: bold;

        i {
          color: #999;
          font-weight: normal;
        }
      }
    }
  }

  &.#{$cascader-prefix-cls}-multiple {
    .#{$cascader-prefix-cls}-menu {
      &-item-active {
        background-color: #fff;
        color: #333;
        font-weight: normal;
      }

      &-item-active:hover {
        background-color: $background-color-select-hover;
      }
    }

    .#{$cascader-prefix-cls}-rel {

      .#{$cascader-prefix-cls}-tag-wrapper {
        line-height: 26px; //******************
        .#{$css-prefix}tag {
          height: $form-component-height - 6px;//******************
          line-height: $form-component-height - 6px; //******************
          margin: 2px;
          padding-right: $muti-select-tag-padding-right;
          padding-left: $muti-select-tag-padding-left;
          background: $muti-select-tag-background-color !important;
          border: $muti-select-tag-border !important;
          &>.#{$css-prefix}icon {
            color: $muti-select-tag-icon-color;
            right: 4px;
          }
        }
      }
    }
    &.#{$cascader-prefix-cls}-disabled .#{$cascader-prefix-cls}-rel {
      background-color: #f7f7f7;

      &:hover {
        border-color: $border-color-base;
      }
      .#{$css-prefix}tag {
        color: #999;
      }
    }
    &.#{$cascader-prefix-cls}-visible {
      .#{$cascader-prefix-cls}-rel {
        @include active();
      }
    }
  }


  &-arrow {
    margin-top: -5px;
  }
  &.#{$cascader-prefix-cls}-multiple.#{$cascader-prefix-cls}-size-large &-rel {
    .#{$cascader-prefix-cls}-tag-wrapper {
      line-height: $input-height-large;
      height: $input-height-large;
    }
  }
}
