@import '../var/mixins.less';
.scTextCollapse {
  padding-top: 4px;
  color: @primary-color;
  cursor: pointer;
}
.colBtn {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid @border-color-base;
  border-radius: @border-r-3;
  &-item {
    user-select: none;
    width: 123px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    border-radius: @border-r-6;
    opacity: 1;
    background: @colBtn-btn-bg;
    border: 1px solid @colBtn-btn-bg;
    color: @heading-color;
    cursor: pointer;
    position: relative;
    margin-left: 16px;
    &:nth-child(4n + 1) {
      margin-left: 0;
    }
    &:first-child {
      margin-left: 0;
    }
    &:nth-child(n + 5) {
      margin-top: 16px;
    }
    &:hover:not(.disabled):not(.checked) {
      background: @border-pagination-color;
      border-color: @border-pagination-color;
    }
    .colBtn-item__checked {
      position: absolute;
      right: 0;
      bottom: 0;
      width: 16px;
      height: 16px;
      border-radius: 10px 0px 3px 0px;
      & > span {
        margin-left: 1px;
        margin-top: 2px;
        font-size: 12px;
        vertical-align: top;
      }
    }
    &.disabled {
      border-color: fade(@color-000, 10%);
      color: @disabled-color;
      cursor: not-allowed;
      .colBtn-item__checked {
        background:fade(@color-000, 12%);
        & > span {
          color: @disabled-color;
          vertical-align: top;
        }
      }
    }
    &.checked:not(.disabled) {
      border-color: @primary-color;
      color: @primary-color;
      background: @btn-column-color;
      .colBtn-item__checked {
        background: @primary-color;
        & > span {
          color: @white-color;
        }
      }
      &-item-describe {
        color: @primary-color;
      }
    }
  }
  &-item-text {
    font-weight: 400;
    font-size: 14px;
  }
  &-item-describe {
    font-size: 12px;
    color: @text-color-secondary;
  }

  .column-checkboxAll {
    width: 100%;
    height: 40px;
    padding: 0 24px;
    line-height: 40px;
    border-bottom: 1px solid @border-color-base;
  }

  .ant-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    padding: 16px 24px 8px;
    width: 100%;
    .ant-checkbox-wrapper {
      width: 25%;
    }
    .ant-checkbox-group-item {
      margin-right: 0;
      padding-bottom: 16px;
    }
  }

}

.underline-dashed {
  text-decoration: underline dashed;
  text-decoration-thickness: from-font;
  text-underline-offset: 4px;
  cursor: pointer;
}

.ellipsisText {
  overflow: hidden;
  text-overflow: ellipsis;
  display:-webkit-box; 
  -webkit-box-orient:vertical;
}

.describeTh {
  i {
    font-size: 15px;
    padding-left: 4px;
    color: @disabled-color;
    cursor: pointer;
    &:hover {
      color: @primary-color;
    }
  }
  &-text {
    text-decoration: underline dashed;
    text-decoration-thickness: from-font;
    text-underline-offset: 4px;
    cursor: pointer;
  }
}

.tdTooltip {
  text-decoration: underline dashed;
  text-decoration-thickness: from-font;
  text-underline-offset: 4px;
  cursor: pointer;
}

.unitTh {
  &-unit {
    padding-left: 4px;
    color: @text-color-secondary;
    font-size: 14px;
  }
}

.clearAll {
  line-height: 24px;
  font-size: 12px;
  padding: 0 6px;
  height: 24px;
  border-radius: 4px;
  color: @primary-color;
  cursor: pointer;
  &:hover {
    background: @select-hover-bg;
  }
  &:active{
    background: @cancel-btn-color;
  }
}
.pdt16 {
  padding-top: 16px;
}
.pdb16 {
  padding-bottom: 16px;
}
.action-copy {
  cursor: pointer;
}

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track {
  border-radius: 10px;
}

/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
  width: 6px;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.16);
  transition: all .2s ease-in-out;
  cursor: pointer;
  &:hover {
    background-color: rgba(0, 0, 0, 0.26);
  }
}
.create_scrollbar(4, 4px, 4px, 10px, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.26));
.create_scrollbar(6, 6px, 6px, 10px, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.26));
.create_scrollbar(8, 8px, 8px, 10px, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.26));

// .ant-table-hide-scrollbar {
//   overflow-y: initial ;
// }

.rc-virtual-list-scrollbar {
  // position: relative !important;
  width: 6px !important;
  // display: block !important;
  &.rc-virtual-list-scrollbar-show {
    display: block !important;
  }
  .rc-virtual-list-scrollbar-thumb {
    width: 4px !important;
    border-radius: 10px !important;
    background-color: rgba(0, 0, 0, 0.16) !important;
    &:hover {
      background-color: rgba(0, 0, 0, 0.26) !important;
    }
  }
}
.scBasic-help {
  display: inline-block;
  margin-left: 4px;
  font-size: 14px;
  // color: @text-color-secondary;
  cursor: pointer;

  &:hover {
    color: @primary-color;
  }
  i {
    color: @text-color-secondary;
    &:hover {
      color: @primary-color;
    }
  }
  &__wrap {
    p {
      margin-bottom: 0;
    }
  }
}


// 覆盖 ant-design-vue icon 图标 样式 开始 **********************************
.ant-select, .ant-dropdown-trigger, .ant-cascader-picker, .ant-cascader-menus, .ant-dropdown {
  .ant-select-arrow {
    z-index: 1;
  }
  .anticon-down, .anticon-right {
    // position: relative;
    display: inline-block;
    width: 12px;
    height: 12px;
    svg {
      display: none!important;
    }
    &::after {
      content: "\e662";
      font-family: "sc-ui" !important;
      font-size: 16px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      position: absolute;
      left: 0;
      line-height: 16px;
      top: -2px;
      color: @text-color-secondary;
    }
  }
  .anticon-right {
    &::after {
      line-height: 10px;
      transform: rotate(-90deg);
      top: 6px;
    }
  }
}

.ant-cascader-menu-item-expand-icon {
  .anticon-right {
    // display: none;
    &::after {
      font-size: 18px;
    }
  }
}

.ant-dropdown-trigger, .ant-dropdown-link {
  & > .anticon.anticon-down {
    position: relative;
    transform: none;
  }
}
.ant-breadcrumb-overlay-link {
  .anticon.anticon-down {
    position: relative;
    transform: none;
    // &::after {
    //   top: 4px;
    // }
  }
  &.ant-dropdown-open {
    .anticon.anticon-down {
      &::after {
        color: @primary-color;
      }
    }
  }
}

.ant-dropdown {
  .anticon-right::after {
    top: 0;
  }
}

.anticon-close {
  display: inline-block;
  width: 12px;
  height: 12px;
  position: relative;
  svg {
    display: none!important;
  }
  &::after {
    content: "\e65c";
    font-family: "sc-ui" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    left: 0;
    line-height: 16px;
    top: -2px;
    color: @text-color-secondary;
  }
}


.drawer-close {
  .anticon-close {
    width: auto;
    height: auto;
    display: auto;
    svg {
      display: inline-block!important;
    }
    &::after {
      content: none;
    }
  }
}

.spsCa {
  .ant-cascader-menu-item-expand-icon {
    width: 12px;
    line-height: 12px;
    &::after {
      content: "\e662";
      font-family: "sc-ui" !important;
      font-size: 18px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      position: absolute;
      left: 0;
      line-height: 16px;
      top: 3px;
      color: @text-color;
      transform: rotate(-90deg);
    }
  }
  .ant-cascader-menu-item-expand {
    &.ant-cascader-menu-item-active {
      .ant-cascader-menu-item-expand-icon {
        &::after {
          color: @primary-color;
        }
      }
    }
  }
}

.scSe {
  .ant-select-selection-item-remove {
    width: 12px;
    position: relative;
    &::after {
      content: "\e65c";
      font-family: "sc-ui" !important;
      font-size: 16px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      position: absolute;
      color: #a19898;
      // color: @text-color-secondary;
      left: 0;
      top: 0;
      z-index: 1;
    }
    // span + &::after {
    //   display: none;
    // }
  }
}
:root {
  .ant-pagination-jump-next {
    position: relative;
    // border: 1px solid red;
    .ant-pagination-item-container .ant-pagination-item-link-icon {
      & > svg {
        display: none;
      }
      &::after {
        content: "\e615";
        font-family: "sc-ui" !important;
        font-size: 16px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        position: absolute;
        color: #a19898;
        left: -7px;
        top: -7px;
        z-index: 1;
      }
    }
    &:hover {
      .ant-pagination-item-container .ant-pagination-item-link-icon {
        &::after {
          color: @primary-color;
        }
      }
    }
  }
  .ant-pagination-jump-prev {
    position: relative;
    // border: 1px solid red;
    .ant-pagination-item-container .ant-pagination-item-link-icon {
      & > svg {
        display: none;
      }
      &::after {
        content: "\e616";
        font-family: "sc-ui" !important;
        font-size: 16px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        position: absolute;
        color: #a19898;
        left: -7px;
        top: -7px;
        z-index: 1;
      }
    }
    &:hover {
      .ant-pagination-item-container .ant-pagination-item-link-icon {
        &::after {
          color: @primary-color;
        }
      }
    }
  }
}

// .anticon-plus {
//   display: inline-block;
//   width: 12px;
//   height: 12px;
//   position: relative;
//   svg {
//     display: none!important;
//   }
//   &::after {
//     content: "\e661";
//     font-family: "sc-ui" !important;
//     font-size: 18px;
//     font-style: normal;
//     -webkit-font-smoothing: antialiased;
//     position: absolute;
//     left: 0;
//     line-height: 16px;
//     top: -2px;
//     color: @text-color-secondary;
//   }
// }
.ant-input-search {
  .ant-input-search-icon, .ant-input-group-addon .anticon-search {
    position: relative;
    svg {
      display: none!important;
    }
    &::after {
      content: "\e663";
      font-family: "sc-ui" !important;
      font-size: 16px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
    }
  }
}
// 覆盖 ant-design-vue icon 图标 样式 结束 **********************************

p {
  margin-bottom: 0;
}


.scImage {
  img {
    width: inherit;
    height: inherit;
  }
}