// cover some element-ui styles
// 表单项
.mc-form-item {
  &.form {
    margin-bottom: 10px;
  }

  .item-label {
    color: $textColor;

    .more {
      display: inline-block;
      float: right;
    }
  }

  .el-form-item {
    margin-bottom: 0;
  }

  .el-form-item__content {
    line-height: inherit;
  }

  .el-form-item.is-success .el-input__inner,
  .el-form-item.is-success .el-textarea__inner {
    border-color: $lineColorDark;
  }

  .el-input__inner:focus, .el-textarea__inner:focus,
  .el-form-item.is-success .el-input__inner:focus,
  .el-form-item.is-success .el-textarea__inner:focus {
    border-color: $colorPrimary;
  }

  .el-form-item.is-error .el-input__inner,
  .el-form-item.is-error .el-input__inner:focus,
  .el-form-item.is-error .el-textarea__inner,
  .el-form-item.is-error .el-textarea__inner:focus,
  .el-message-box__input input.invalid,
  .el-message-box__input input.invalid:focus {
    border-color: $colorError;
  }

  .el-form-item__error {
    left: auto;
    top: -20px;
    bottom: auto;
    right: 0;
    color: $colorError;
  }
}

.mc-form-input-item {
  .el-form-item__content {
    line-height: inherit;
  }
}

.is-disabled.el-form {
  .el-tag {
    color: rgba(41, 41, 41, 0.4);
    cursor: not-allowed;
  }
}

// 头部文本输入框
.header-input {
  .el-input__inner {
    height: 24px;
    line-height: 24px;
    padding: 0 6px;
    background-color: $colorGrey;
    color: #FFFFFF;
    border-color: $colorGrey
  }

  .el-input__clear, .el-input__clear:hover {
    color: #ffffff;
  }
}

// 文本输入框
.dt-input {
  font-size: $fontDefault;
  line-height: 26px;

  .el-input__inner {
    border: 1px solid $lineColorDark;
    height: 28px;
    line-height: 28px;
    font-size: $fontDefault;
    color: $textColor;
    padding: 0 8px;

    &::placeholder {
      color: $textCaption;
    }
  }

  .el-input__prefix, .el-input__suffix {
    height: auto;
    color: $textCaption;
  }

  &.dt-large {
    line-height: 30px;

    .el-input__inner {
      height: 32px;
      line-height: 32px;
    }
  }

  &.dt-small {
    line-height: 22px;

    .el-input__inner {
      height: 24px;
      line-height: 24px;
    }

  }

  &.el-input--suffix {
    .el-input__inner {
      padding: 0 26px 0 8px;
    }
  }

  .el-input__inner[type='number'] {
    padding: 0 0 0 8px;
  }

  &.el-input.is-disabled .el-input__inner {
    background-color: $bgColor;
    border-color: $lineColor;
    color: $textDisabled;
  }

  &.active .el-input__inner {
    border-bottom: 1px solid $textPrimary;
  }

  .el-input-group__append, .el-input-group__prepend {
    background: $bgColor;
    border-color: $lineColorDark;
    color: $textCaption;
    padding: 0 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100px;

    .el-select {
      min-width: 80px;
      margin: -2px 0;
    }
  }


  &.select-prepend {
    .el-input-group__prepend {
      background: #ffffff;
      padding: 0;
    }
  }

  &.el-input.is-disabled {
    .el-input-group__append, .el-input-group__prepend {
      border-color: $lineColor;
    }

    &.el-input-group--prepend {
      div.el-select .el-input__inner, div.el-select:hover .el-input__inner {
        border: none;
        background-color: $bgColor;
        color: $textDisabled;
      }

    }
  }

  .el-input__inner:focus {
    border-color: $textPrimary;
  }

  .dt-dialog-btn {
    color: #D8D8D8;
  }

  .dt-dialog-btn.el-button:focus, .dt-dialog-btn.el-button:hover {
    color: #D8D8D8;
  }

  &.el-input .el-input__clear {
    color: $bgIcon;
    line-height: 28px;
  }
}

// 文本搜索输入框
.dt-input-search {
  .el-input__inner {
    border: none;
    border-bottom: 1px solid $lineColor;
    background: none;
    height: 28px;
    line-height: 28px;
    font-size: $fontDefault;
    color: $textColor;
    border-radius: 0;
    padding-left: 0;
  }

  &.active .el-input__inner {
    border-bottom: 1px solid $textPrimary;
  }

  &.input-20 .el-input__inner {
    padding-left: 20px;
  }
}

// 数字输入框
.dt-input-number {
  .el-input-number--small {
    line-height: 20px;
    margin-top: 4px;
    width: 96px;

    .el-input-number__decrease, .el-input-number__increase {
      width: 18px;
      height: 18px;
      line-height: 16px;
      border-radius: 2px;
      border: 1px dashed $lineColor;
      background: rgba(244, 241, 239, 0.9);
      box-sizing: border-box;
      color: $lineColorDark;
    }

    .el-input-number__decrease:hover, .el-input-number__increase:hover {
      color: $textPrimary;
    }

    .el-input--small {
      width: 42px;
      margin-left: 25px;
    }

    .el-input__inner {
      height: 20px;
      line-height: 20px;
      border-radius: 2px;
      padding-left: 3px;
      padding-right: 3px;
      border: none;
    }
  }

  .el-input.is-disabled .el-input__inner {
    background-color: $bgColor;
    border-color: $lineColor;
    color: $textDisabled;
  }

  .el-input__inner {
    border: 1px solid $lineColorDark;
    height: 28px;
  }

  .el-input-number__decrease, .el-input-number__increase {
    width: 25px;
    border: none;
  }

  &.el-input-number .el-input__inner {
    text-align: left;
  }

  &.el-input-number.is-controls-right .el-input-number__increase {
    border-bottom: 0px;
    top: 0px;
    background: transparent;
  }

  &.el-input-number.is-controls-right .el-input-number__decrease {
    border-left: 0px;
    bottom: 0px;
    background: transparent;
  }

  &.el-input-number {
    width: 100%;
    line-height: 28px;
  }
}

// 文本域
.dt-textarea {
  .el-textarea__inner {
    color: $textColor;
    padding: 5px 8px;
    font-size: $fontDefault;
    border: 1px solid $lineColorDark;
    border-radius: 2px;
    line-height: 18px;

    &::placeholder {
      color: $textCaption;
    }
  }

  &.el-textarea.is-disabled .el-textarea__inner {
    background-color: $bgColor;
    border-color: $lineColor;
    color: $textDisabled;
  }
}

// 单选
.dt-radio {
  color: $textColor;

  .el-radio__inner {
    border: 1px solid $bgIcon;
  }

  .el-radio__label {
    font-size: $fontDefault;
    padding-left: 5px;
  }

  &.el-radio + .el-radio {
    margin-left: 0;
  }

  .el-radio__input.is-checked .el-radio__inner {
    // border-color: $lineColorDark;
    background: #ffffff;
  }

  .el-radio__input.is-checked + .el-radio__label {
    color: $radioCheckColor;
  }

  .el-radio__inner::after {
    background-color: $colorPrimary;
    width: 8px;
    height: 8px;
  }

  .el-radio__inner:hover {
    border-color: $lineColorDark;
  }

  .el-radio-button__inner {
    height: 28px;
    line-height: 28px;
    padding: 0 12px;
    font-size: $fontDefault;
    border: none;
    color: $textColor;
    font-weight: normal;

    &:hover {
      background-color: $bgColor;
    }
  }

  &.el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled) {
    box-shadow: none;
  }

  .el-radio__input.is-disabled .el-radio__inner {
    background-color: $bgRadioDisabled;
    border-color: $lineColorDark;
  }

  .el-radio__input.is-disabled + span.el-radio__label {
    color: $textDisabled;
  }
}

.dt-radio-group {
  .el-radio-button__inner {
    font-size: 12px;
    border: 1px solid $bgIcon;
    border-left: 0;
    height: 28px;
    width: 80px;
    line-height: 4px;
    color: $textColor;
  }

  .el-radio-button__inner:hover {
    color: $textPrimary;
  }

  .el-radio-button__orig-radio:checked + .el-radio-button__inner {
    background-color: $textPrimary;
    border-color: $textPrimary;
    color: $bgDefault;
  }

  .el-radio-button__orig-radio:disabled:checked + .el-radio-button__inner {
    background-color: $bgColor;
  }

  .el-radio-button:first-child .el-radio-button__inner {
    border-left: 1px solid $bgIcon;
  }

  .el-radio-button__orig-radio:disabled + .el-radio-button__inner {
    background-color: $bgColor;
    border-color: $bgIconDisabled;
    color: $textDisabled;
  }

  // .el-radio-button:last-child .el-radio-button__inner,
  // .el-radio-button:first-child .el-radio-button__inner {
  //   border: none;
  //   border-radius: 0;
  // }

  // .el-radio-button__orig-radio:checked + .el-radio-button__inner {
  //   color: $colorPrimary;
  //   background-color: #ffffff;
  //   box-shadow: none;
  //   border: none;
  // }
}

// 多选
.dt-checkbox, .mc-tree, .dt-table-content {
  &.el-checkbox {
    color: $textColor;
  }

  .el-checkbox__inner {
    border-color: $lineColorDark;
  }

  .el-checkbox__input.is-disabled + span.el-checkbox__label {
    color: $textDisabled;
  }

  .el-checkbox__inner:hover, .el-checkbox__input.is-focus .el-checkbox__inner {
    border-color: $colorPrimary;
  }

  .el-checkbox__input.is-checked .el-checkbox__inner,
  .el-checkbox__input.is-indeterminate .el-checkbox__inner {
    background-color: $colorPrimary;
    border-color: $colorPrimary;
  }

  .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
    background-color: $bgColor;
    border-color: $lineColorDark;

    &:after {
      border-color: $lineColorDark
    }
  }

  .el-checkbox__input.is-checked + .el-checkbox__label {
    color: $textColor;
  }

  .el-checkbox__input.is-disabled .el-checkbox__inner {
    background-color: $lineColor;
    border-color: $lineColorDark;
  }

  .el-checkbox__label {
    font-size: 12px;
    padding-left: 6px;
  }
}

//
// .dt-dateInput {
//   &.el-input__inner {
//     width: 100%;
//     min-width: 240px;
//     border-color: #D0D0C7;
//   }

//   &.el-input__inner::placeholder, .el-range-separator {
//     color: $textColor;
//   }

//   &.el-range-editor.is-active, &.el-range-editor.is-active:hover {
//     border-color: $textPrimary;
//   }
// }

//日期选择器
.dt-datePicker {

  &.el-input {
    font-size: 12px;
    width: 100%;
  }

  &.el-input.is-disabled .el-input__inner {
    background-color: $bgColor;
    border-color: $lineColor;
    color: $textDisabled;
  }

  .el-input__inner {
    border: 1px solid $lineColorDark;
    height: 28px;
    color: $textColor;

    &::placeholder {
      color: $textCaption;
    }
  }

  .el-icon-date:before {
    font-family: "fontLisening";
    content: '\e879';
  }

  .el-input__icon {
    line-height: 28px;
    color: $bgIcon;
  }

  &.el-date-table th {
    color: $textCaption;
  }

  .el-date-range-picker__content {
    padding: 12px;
  }

  .el-date-range-picker__header div {
    color: $textColor;
    font-size: $fontDefault;
    font-weight: normal;
  }

  .el-picker-panel__icon-btn:hover {
    color: $colorPrimary;
  }

  .el-date-table td.in-range div,
  .el-date-table td.in-range div:hover,
  .el-date-table td.in-range div span:hover,
  .el-date-table.is-week-mode .el-date-table__row.current div,
  .el-date-table.is-week-mode .el-date-table__row:hover div {
    background-color: $colorPrimary;
    color: #ffffff;
  }

  .el-date-table td {
    font-size: $fontDefault;
    width: 20px;
    height: 32px;
    padding: 2px 0;

    div {
      margin: 0 2px;
      height: 24px;
    }

    span {
      line-height: 24px;
      background: none;
      top: 4px;

      &:hover {
        color: $colorPrimary;
      }
    }

    &.start-date div, &.end-date div {
      border-radius: 0;
      background-color: $bgColor;
      color: $colorPrimary;

      &:hover {
        background-color: $bgColor;

        span:hover {
          border-radius: 0;
          background-color: $bgColor;
          color: $colorPrimary;
        }
      }

    }

    &.today span {
      color: $textColor;
      font-weight: normal;
    }

    &.today.in-range span {
      color: #ffffff;

      &:hover {
        color: #ffffff;
      }
    }

    &.today.start-date span, &.today.end-date span {
      color: $colorPrimary;
    }
  }

  .el-picker-panel__footer .el-button--text {
    color: $colorPrimary;
    display: none;
  }

  .el-button.is-plain {
    border-radius: 4px;
    border-color: $bgColor;
    color: $colorPrimary;
    margin-right: 8px;
  }

  .el-button.is-plain:focus, .el-button.is-plain:hover {
    border-color: $bgColor;
    color: $colorPrimary;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3);
  }

  .el-button.is-disabled.is-plain, .el-button.is-disabled.is-plain:focus, .el-button.is-disabled.is-plain:hover {
    background: $bgColor;
    color: rgba(74, 74, 74, 0.54);
    box-shadow: none;
  }

  &.no-headerPicker .el-date-range-picker__time-header {
    display: none;
  }
}

//选择日期的弹框
.el-date-picker {
  width: 208px;
  height: 300px;
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.3);

  &.el-date-picker .el-picker-panel__content {
    width: 182px;
    margin: 0px 12px 0px 12px;

    .el-date-table td {
      padding: 0px;
    }

    .el-date-table td span {
      width: 22px;
      border-radius: 0;
    }

    .el-date-table td.today span {
      background: $textPrimary;
      color: #fff;
    }

    .el-date-table td.current:not(.disabled) span {
      background: $colorHover;
      color: #fff;
    }
  }

  &.el-picker-panel {
    color: $textColor;
    line-height: 12px;
  }

  .el-date-picker__header-label {
    font-size: 14px;
    padding: 0px 5px;
    color: $textColor;
    line-height: 30px;
  }

  .el-date-picker__header {
    padding: 0px 12px;
    margin: 0;
    box-shadow: 0px 1px 0px 0px rgba(229, 229, 224, 1);

    .el-icon-d-arrow-left:before {
      font-family: "fontLisening";
      content: '\e895';
    }

    .el-icon-arrow-left:before {
      font-family: "fontLisening";
      content: '\e88b';
    }

    .el-icon-d-arrow-right:before {
      font-family: "fontLisening";
      content: '\e894';
    }

    .el-icon-arrow-right:before {
      font-family: "fontLisening";
      content: '\e88a';
    }

    .el-picker-panel__icon-btn {
      color: $bgIcon;
    }

    .el-date-picker__header-label {
      line-height: 32px;
      color: #4A4A4A;
    }
  }

  .el-date-table th {
    color: $textCaption;
    border-bottom: 0px;
    height: 32px;
  }

  .el-date-table td {
    height: 32px;
  }

  .popper__arrow {
    display: none;
  }
}

.el-date-picker.has-sidebar {
  width: 208px;
}

.el-picker-panel [slot=sidebar], .el-picker-panel__sidebar {
  left: 0;
  top: unset;
  width: 46px;
  padding: 0;
  bottom: 12px;
  margin-left: 15px;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid $textPrimary;

  .el-picker-panel__shortcut {
    padding: 0;
    line-height: 22px;
    color: $textPrimary;
    font-size: 12px;
    text-align: center;
  }
}

.el-picker-panel [slot=sidebar] + .el-picker-panel__body, .el-picker-panel__sidebar + .el-picker-panel__body {
  margin: 0;
}

//选择月份的弹框
.dt-monthPicker {
  width: 234px;
  height: 152px;

  &.el-date-picker.el-date-picker .el-picker-panel__content {
    width: 229px;
    margin: 0;
  }

  &.el-date-picker .el-date-picker__header {
    padding: 0 9px;
  }
}

.el-month-table td div {
  height: 40px;
}

.el-month-table td {
  padding: 0;
}

.el-month-table td .cell {
  width: 44px;
  height: 32px;
  line-height: 32px;
  border-radius: 0;
}

.el-month-table td.current:not(.disabled) .cell {
  color: #fff;
  background: $colorHover;
}

//时间选择器
.dt-timePicker {

  &.el-input {
    font-size: 12px;
    width: 100%;
  }

  &.el-input.is-disabled .el-input__inner {
    background-color: $bgColor;
    border-color: $lineColor;
    color: $textDisabled;
  }

  .el-input__inner {
    border: 1px solid $lineColorDark;
    height: 28px;
    color: $textColor;

    &::placeholder {
      color: $textCaption;
    }
  }

  .el-input__icon {
    line-height: 28px;
    color: $bgIcon;
  }

  &.el-input.is-disabled .el-input__icon {
    color: $bgIcon;
  }
}

//选择时间的弹框
.el-time-panel {
  width: 204px;
  border: 0;
  box-shadow: 0px 0px 0px 0px;
}

.el-time-panel__content {
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.3);
}

.el-time-spinner__item.active:not(.disabled) {
  color: $colorHover;
}

.el-time-panel__footer {
  display: none;
}

.el-time-spinner {
  .el-time-spinner__item {
    height: 28px;
    width: 68px;
    line-height: 28px;
    color: $textColor;
  }
}

.el-time-panel .popper__arrow {
  display: none;
}

.el-popper[x-placement^=bottom] {
  margin-top: 5px;
}

.el-time-panel__content::after, .el-time-panel__content::before {
  border: 0;
}

.el-time-spinner.has-seconds .el-time-spinner__wrapper {
  border-right: 1px solid #E5E5E0;
}

.el-time-spinner.has-seconds .el-time-spinner__wrapper:last-child {
  border: 0;
}

.el-scrollbar__bar {
  right: 0px;
}

.el-scrollbar__bar.is-horizontal {
  height: 0px;
  left: 0px;
}

//开关
.dt-switch {
  .el-switch__core {
    border-radius: 9px;
    width: 28px !important;
    height: 16px;
    border: 1px solid $bgIcon;
    background: $bgIcon;
  }

  .el-switch__core:after {
    width: 12px;
    height: 12px;
  }

  &.el-switch.is-checked .el-switch__core::after {
    margin-left: -13px;
  }

  &.el-switch.is-checked .el-switch__core {
    border: 1px solid $textPrimary;
    background: $textPrimary;
  }

  .el-switch__label {
    color: $textColor;
  }

  .el-switch__label * {
    font-size: 12px;
  }

  .el-switch__label--right {
    margin-left: 4px;
  }
}

//弹出选择
.dt-input-dialog {
  font-size: $fontDefault;
  line-height: 26px;

  .el-input__inner {
    border: 1px solid $lineColorDark;
    height: 28px;
    line-height: 28px;
    font-size: $fontDefault;
    color: $textColor;
    padding: 0 8px;

    &::placeholder {
      color: $textCaption;
    }
  }

  &.el-input.is-disabled .el-input__inner {
    background-color: $bgColor;
    border-color: $lineColor;
    color: $textDisabled;
  }

  .el-input__suffix {
    cursor: pointer;
  }

  &.el-input__suffix-inner .el-button {
    color: $bgIcon;
  }
}

// 下拉选项框
.dt-select {
  width: 100%;

  .el-input__inner {
    height: 28px;
    line-height: 28px;
    font-size: $fontDefault;
    border: 1px solid $lineColorDark;
    color: $textColor;

    &::placeholder {
      color: $textCaption;
    }
  }

  .el-input__icon {
    height: 28px;
    line-height: 28px;
    color: $bgIcon;
  }

  &.dt-large {
    .el-input__inner, .el-input__icon {
      height: 32px;
      line-height: 32px;
    }
  }

  &.dt-small {
    .el-input__inner, .el-input__icon {
      height: 24px;
      line-height: 24px;
    }
  }

  .el-input__inner:focus, .el-input.is-focus .el-input__inner {
    border-color: $textPrimary;
  }

  .el-input.is-disabled {
    .el-input__inner {
      background-color: $bgColor;
      border-color: $lineColor;
      color: $textDisabled;
    }

    .el-input__inner::-webkit-input-placeholder, .el-input__inner::-ms-input-placeholder, .el-input__inner::placeholder {
      color: $textDisabled;
    }
  }

  .el-tag {
    width: auto;
    overflow: hidden;
    word-break: break-word;
    text-overflow: ellipsis;
    background-color: $bgColor;
    border-color: $bgIconDisabled;
    border-radius: 2px;
    padding-right: 16px;
    position: relative;
    color: $textColor;

    .el-icon-close {
      position: absolute;
      background-color: transparent;
      right: 0;
      top: 3px;
      color: $bgIcon;

      &:hover {
        background-color: transparent;
        color: $colorPrimary;
      }
    }

  }

  &.dt-disabled .el-tag {
    color: rgba(41, 41, 41, 0.4);
    cursor: not-allowed;
  }

  .el-input__suffix {
    .el-select__caret {
      color: $bgIcon;
    }
  }
}

// 下拉选择
.dt-select-option {
  border: none;
  border-radius: 2px;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);

  .el-select-dropdown__wrap {
    max-height: 160px;
  }

  .el-scrollbar__thumb {
    background-color: $lineColorDark;
  }

  &.el-popper[x-placement^=bottom] {
    margin-top: 3px;
  }

  .el-select-dropdown__list {
    padding: 0;
  }

  .el-select-dropdown__item {
    padding: 6px 14px;
    font-size: 12px;
    height: auto;
    line-height: 14px;
    white-space: normal;
    color: $textColor;

    &.is-disabled {
      color: $textDisabled;
    }
  }

  .el-select-dropdown__item.hover {
    background-color: transparent;
  }

  .el-select-dropdown__item:hover,
  &.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
    background-color: $bgColor;
  }

  .el-select-dropdown__item.is-disabled:hover {
    background-color: transparent;
  }

  .el-select-dropdown__empty {
    font-size: $fontDefault;
    padding: 0;
    height: 28px;
    line-height: 28px;
    color: $textCaption;
  }

  .el-select-dropdown__item.selected {
    color: $colorPrimary;
  }

  .popper__arrow {
    display: none;
  }

  .option-operate {
    color: $colorPrimary;
  }

  &.is-multiple .el-select-dropdown__item.selected {
    color: $colorPrimary;

    &::after {
      display: none;
    }
  }

  .el-checkbox {
    margin-right: 8px;

    .el-checkbox__label {
      display: none;
    }
  }
}

.dt-select-menu {
  width: 100%;
  min-width: 88px;

  .el-input__inner {
    height: 28px;
    line-height: 28px;
    font-size: $fontDefault;
    border: none;
    color: #ffffff;
    background: transparent;
    text-overflow: ellipsis;

    &::placeholder {
      color: #ffffff;
    }
  }

  .el-input__icon {
    height: 28px;
    line-height: 28px;
    color: $bgIcon;
  }

  .el-input__suffix {
    .el-select__caret {
      color: $bgIcon;
      font-size: 12px;
    }
  }
}

.menu-project .dt-select-menu {
  .el-input__inner {
    padding-left: 0;
    padding-right: 24px;
  }

  .el-input__suffix {
    .el-input__icon {
      width: 16px;
    }
  }
}

.dt-select-option-menu {
  border: none;
  border-radius: 2px;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.3);
  background: $colorDarkGrey;

  .el-select-dropdown__wrap {
    max-height: 150px;
  }

  .el-scrollbar__thumb {
    background-color: #4A5C7D;
  }

  &.el-popper[x-placement^=bottom] {
    margin-top: 3px;
  }

  .el-select-dropdown__list {
    padding: 4px 0;
  }

  .el-select-dropdown__item {
    padding: 7px 14px;
    font-size: 12px;
    height: auto;
    line-height: 14px;
    white-space: normal;
    color: #ffffff;

    &.is-disabled {
      color: $textDisabled;
    }
  }

  .el-select-dropdown__item.hover {
    background-color: transparent;
  }

  .el-select-dropdown__item:hover,
  &.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
    background-color: $colorGrey;
  }

  .el-select-dropdown__item.is-disabled:hover {
    background-color: transparent;
  }

  .el-select-dropdown__empty {
    font-size: $fontDefault;
    padding: 0;
    height: 28px;
    line-height: 28px;
    color: #ffffff;
  }

  .el-select-dropdown__item.selected {
    color: $colorHover;
    font-weight: bold;
  }

  .popper__arrow {
    display: none;
  }
}

//下拉表格的弹框
.dt-select-table-option {
  border: none;
  border-radius: 2px;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);

  .el-select-dropdown__wrap {
    max-height: 300px;
  }

  .el-scrollbar__thumb {
    background-color: $lineColorDark;
  }

  &.el-popper[x-placement^=bottom] {
    margin-top: 3px;
  }

  .el-select-dropdown__list {
    padding: 0;
  }

  .el-select-dropdown__item {
    padding: 0;
    font-size: 12px;
    height: auto;
    line-height: 14px;
    white-space: normal;
    color: $textColor;


    &.is-disabled {
      color: $textDisabled;
    }
  }

  .el-select-dropdown__item.hover {
    background-color: transparent;
  }

  .el-select-dropdown__item:hover,
  &.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
    background-color: $bgColor;
  }

  .el-select-dropdown__item.is-disabled:hover {
    background-color: transparent;
  }

  .el-select-dropdown__empty {
    font-size: $fontDefault;
    padding: 0;
    height: 28px;
    line-height: 28px;
    color: $textCaption;
  }

  .el-select-dropdown__item.selected {
    color: $colorPrimary;
    font-weight: normal;
  }

  .popper__arrow {
    display: none;
  }

  .option-operate {
    color: $colorPrimary;
  }

  &.is-multiple .el-select-dropdown__item.selected {
    color: $colorPrimary;

    &::after {
      display: none;
    }
  }

  .el-checkbox {
    margin-right: 8px;

    .el-checkbox__label {
      display: none;
    }
  }

  .el-scrollbar__bar.is-vertical{
    display: none;
  }
}

//下拉树的弹框
.dt-select-tree-option {
  border: none;
  border-radius: 2px;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);

  .el-select-dropdown__wrap {
    max-height: 140px;
  }

  .el-scrollbar__thumb {
    background-color: $lineColorDark;
  }

  &.el-popper[x-placement^=bottom] {
    margin-top: 3px;
  }

  .el-select-dropdown__list {
    padding: 0;
  }

  .el-select-dropdown__item {
    padding: 0;
    font-size: 12px;
    height: auto;
    line-height: 14px;
    white-space: normal;
    color: $textColor;


    &.is-disabled {
      color: $textDisabled;
    }
  }

  .el-select-dropdown__item.hover {
    background-color: transparent;
  }

  .el-select-dropdown__item:hover,
  &.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
    background-color: $bgColor;
  }

  .el-select-dropdown__item.is-disabled:hover {
    background-color: transparent;
  }

  .el-select-dropdown__empty {
    font-size: $fontDefault;
    padding: 0;
    height: 28px;
    line-height: 28px;
    color: $textCaption;
  }

  .el-select-dropdown__item.selected {
    color: $colorPrimary;
    font-weight: normal;
  }

  .popper__arrow {
    display: none;
  }

  .option-operate {
    color: $colorPrimary;
  }

  &.is-multiple .el-select-dropdown__item.selected {
    color: $colorPrimary;

    &::after {
      display: none;
    }
  }

  .el-checkbox {
    margin-right: 8px;

    .el-checkbox__label {
      display: none;
    }
  }

  .el-tree-node__content {
    .el-tree-node__expand-icon {
      margin-left: 5px;
    }
  }
}

// 级联选择器
.dt-cascader {
  .el-input__inner {
    height: 28px;
    border: 1px solid $lineColorDark;
    color: $textColor;
    font-size: 12px;

    &::placeholder {
      color: $textCaption;
      font-size: 12px;
    }
  }

  &.el-cascader {
    width: 100%;
    line-height: 28px;
  }

  .el-input.is-disabled .el-input__inner {
    background-color: $bgColor;
    border-color: $lineColor;
    color: $textDisabled;
  }

  .el-input__icon {
    line-height: 28px;
  }

  &.el-cascader .el-input .el-input__inner:focus, .el-cascader .el-input.is-focus .el-input__inner {
    border-color: $textPrimary;
  }
}

//级联选择器弹框
.dt-cascader-options {
  &.el-cascader__dropdown {
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.3);
  }

  .el-cascader-panel {
    font-size: 12px;
    border-radius: 2px;
  }

  .el-cascader-menu {
    color: $textColor;
    border-right: 1px solid $lineColor;
  }

  .el-cascader-menu__wrap {
    max-height: 300px;
    min-height: 100px;
    height: 100%;
  }

  .el-cascader-node .el-cascader-node__postfix {
    color: $bgIcon;
  }

  .el-cascader-node.in-active-path .el-cascader-node__postfix {
    color: $colorPrimary;
  }

  .el-cascader-menu__list {
    padding: 0;
  }

  .popper__arrow {
    display: none;
  }

  .el-cascader-menu {
    min-width: 120px;
    max-width: 200px;
  }

  .el-cascader-node {
    height: 28px;
    line-height: 28px;
    padding: 0;
  }

  .el-cascader-node.in-active-path, .el-cascader-node.is-active, .el-cascader-node.is-selectable.in-checked-path {
    color: $colorPrimary;
    font-weight: unset;
  }

  .el-cascader-node__postfix {
    right: 4px;
  }
}

//searchinput
.dt-searchinput {
  .el-input__inner {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    border-bottom: 1px solid $lineColorDark;
    height: 28px;
    line-height: 28px;
    font-size: $fontDefault;
    color: $textColor;
    margin-left: 0;

    &::placeholder {
      color: $textCaption;
    }
  }

  &.el-input--prefix .el-input__inner {
    padding-left: 24px;
  }

  .el-input__prefix, .el-input__suffix {
    line-height: 28px;
    color: $bgIcon;
  }

  &.el-input.is-disabled .el-input__inner {
    color: $textDisabled;
    background-color: #fff;
    border-color: $lineColor;
  }

  .el-input__suffix {
    cursor: pointer;
    font-size: 12px;
  }
}

//下拉实时新增弹框
.dt-select-add {
  &.el-select-dropdown {

    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.3);
  }

  .el-select-dropdown__list {
    padding: 0;
  }

  .el-select-dropdown__item {
    padding: 0 10px;
    height: 28px;
    color: $textColor;
    line-height: 28px;
    font-size: 12px;
  }

  .dt-addHandle {
    height: 28px;
    padding-left: 10px;
    line-height: 28px;
    box-shadow: 0px 1px 0px 0px rgba(229, 229, 224, 1);
  }

  .el-button {
    padding: 0;
    border: unset;
    font-size: 12px;
  }

  .el-button--text {
    color: $colorPrimary;
  }

  .popper__arrow {
    display: none;
  }

  .el-select-dropdown__item.hover, .el-select-dropdown__item:hover {
    background-color: unset;
  }

  .el-select-dropdown__item.selected {
    color: $colorPrimary;
    font-weight: unset;
  }
}

// .dt-cascader-options {
//   &.el-cascader-menus {
//     margin-top: -2px;
//     border-radius: 2px 2px 0 0;
//     box-shadow: none;
//     border: none;
//     background: none;
//     position: relative;

//     .el-cascader-menu {
//       height: auto;
//       padding: 0;
//       min-width: 120px;
//       min-height: 114px;
//       max-height: 142px;
//       border: 1px solid $lineColor;
//       box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
//       border-radius: 2px;
//     }

//     .el-cascader-menu__item {
//       padding: 0 20px 0 12px;
//       height: 28px;
//       line-height: 28px;
//       font-size: 12px;
//       color: #4A4A4A;
//       border-top: 1px solid #F4F1EF;
//     }

//     .el-cascader-menu__item:first-child {
//       border-top: none;
//     }

//     .el-cascader-menu__item--extensible:after {
//       font-size: 12px;
//       color: #B9B9AF;
//       right: 5px;
//     }

//     .el-cascader-menu__item.is-active {
//       background-color: $bgColor;
//       color: $textPrimary;
//     }

//     .el-cascader-menu__item:focus:not(:active), .el-cascader-menu__item:hover {
//       background-color: $bgColor;
//       color: $textPrimary;
//     }

//     .el-cascader-menu__item.selected {
//       color: #ffffff;
//       background-color: $bgColor
//     }
//   }

//   .popper__arrow {
//     display: none;
//   }

//   path, g {
//     fill: transparent;
//   }

// }
.dt-dropdown {
  font-size: 12px;

  &:focus:active, .el-dropdown-selfdefine:focus:active, el-dropdown-selfdefine:focus:not(.focusing) {
    outline: none;
    box-shadow: none;
  }

  .el-dropdown-link {
    cursor: pointer;
  }
}

.dt-dropdown-menu {
  &.el-dropdown-menu {
    border-radius: 2px;
    padding: 0;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    border: none;
    min-width: 80px;
    max-width: 160px;
    overflow-y: hidden;
    margin: 0;

    &:hover {
      overflow-y: auto;
    }
  }

  .el-dropdown-menu__item {
    font-size: 12px;
    color: $textColor;
    line-height: 18px;
    padding: 5px 20px;
  }

  .el-dropdown-menu__item:first-child {
    border-top: none;
  }

  .el-dropdown-menu__item:focus, .el-dropdown-menu__item:not(.is-disabled):hover {
    background-color: $bgColor;
    color: $textColor;
  }
}