$max-height: 200px;

.#{$lib-name}-cascader {
  display: inline-block;
  position: relative;

  .tag-container {
    max-height: $max-height;
    overflow: auto;
  }

  .inner-input {
    max-height: $max-height;
    i {
      cursor: pointer;
      font-size: 14px;
      transition: transform $transition-time;
    }
  }

  &-drop {
    z-index: 500;
    span {
      color: $title-color-light;
      white-space: nowrap;
    }

    &__menu {
      display: inline-block;
      height: 180px;
      width: 200px;
      color: $content-color-light;
      font-size: 14px;
      background: $title-color-dark;
      vertical-align: top;
      list-style: none;
      overflow: auto;
      padding: 0;
      margin: 0;
      box-sizing: border-box;
      border-radius: $border-radius-base;
      border: 1px solid $border-color-base;
      box-shadow: $box-shadow-base;
      white-space: nowrap;
    }

    .nodata {
      text-align: center;
      min-width: 150px;
      font-size: 14px;
      color: $sub-text-color-light;
      i {
        font-size: 60px;
        margin-top: 27px;
        margin-bottom: 14px;
      }
    }

    &__list {
      position: relative;
      min-width: 150px;
      line-height: 14px;
      padding: 8px 10px;
      text-align: left;
      cursor: pointer;
      transition: all $transition-time;
      a {
        display: inline-block;
        color: $content-color-light;
        margin-right: 10px;
        text-decoration: none;
        max-width: 170px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
      }
      &.disabled {
        cursor: not-allowed;
        color: $disabled-text-color-light;
        background: $background-color-disabled;
      }
      span {
        color: $primary-color;
      }
      &:first-child {
        margin-top: 10px;
      }
      &:last-child {
        margin-bottom: 10px;
      }
      &.active {
        color: $primary-color;
        a {
          color: $primary-color;
        }
        .selected-mark {
          position: absolute;
          z-index: 1;
          display: block;
          width: 5px;
          height: 10px;
          top: 10px;
          right: 10px;
          border: 2px solid $primary-color;
          border-top: 0;
          border-left: 0;
          transform: rotate(45deg);
        }
      }
      //e6f7ff
      &:not(.disabled):hover {
        background: lighten($primary-color-hover, 45);
      }
      i {
        position: absolute;
        right: 10px;
        width: 12px;
        font-size: 14px;
      }
    }
  }
}
