@import '../../base/bootstrap-extended/include'; // Bootstrap includes
@import '../../base/components/include'; // Components includes

$dtr-text-color: #8b919c;
$dtr-border-color: #404656;

.el-input__inner {
  background-color: $input-bg;
  border: none !important;
}
.el-date-editor .el-range-input {
  background-color: $input-bg;
}
.el-picker-panel {
  border: 1px solid #fff !important;
}
/*底部操作字体颜色*/
.el-button--text {
  color: $primary;
}
.el-button--text:focus, .el-button--text:hover {
  color: $primary;
}
.el-button.el-picker-panel__link-btn.el-button--default.el-button--mini.is-plain {
  background-color: $primary !important;
  border-color: $primary !important;
  color: #FFF;
}
.el-button.is-disabled.is-plain, .el-button.is-disabled.is-plain:focus, .el-button.is-disabled.is-plain {
  background-color: $primary !important;
  border-color: $primary !important;
  color: #FFF;
}
.el-button.is-plain:focus, .el-button.is-plain:hover {
  background: $primary !important;
  border-color: $primary !important;
  color: #FFF;
}
.el-popper[x-placement^=top] .popper__arrow {
  border-top-color: #fff;
}
.el-popper[x-placement^=bottom] .popper__arrow {
  border-bottom-color: #fff;
}
.dark-layout {
  /*文本框背景颜色*/
  .el-input__inner {
    -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
    color: $dtr-text-color;
    background-color: $theme-dark-input-bg;
    border: none !important;
    &:hover {
      border-color: $primary;
    }
  }
  .el-date-editor .el-range-input {
    background-color: $theme-dark-input-bg;
  }
  /* 至字的颜色 */
  .el-range-separator {
    color: #b4b7bd;
  }
  //.el-range-editor.el-input__inner:hover>td {
  //  background-color: #343d55 !important;
  //}
  //.el-range-editor.el-input__inner {
  //  background-color: #283046 !important;
  //}
  //.el-date-editor .el-range-input {
  //  background-color: $theme-dark-input-bg !important;
  //}
  .el-date-table td.today span {
    color: $primary !important;
  }
  .el-date-table td.available:hover {
    color: $primary !important;
  }
  /*选择弹出框边框颜色*/
  .el-picker-panel__sidebar {
    background-color: $theme-dark-card-bg !important;
    border-right: 1px solid $dtr-border-color !important;
  }
  .el-picker-panel__body-wrapper {
    border: none !important;
  }
  .el-date-range-picker__content.is-left {
    border-right: 1px solid $dtr-border-color !important;
  }
  .el-date-range-picker__time-header {
    border-bottom : 1px solid $dtr-border-color !important;
  }
  .el-picker-panel {
    background: $theme-dark-card-bg !important;
    color: $dtr-text-color;
    border: 1px solid $theme-dark-card-bg !important;
    box-shadow: $theme-dark-box-shadow;
  }
  .el-picker-panel__footer {
    background-color: $theme-dark-card-bg !important;
    border-top: 1px solid $dtr-border-color !important;
  }
  /*选中条背景色*/
  .el-date-table td.in-range div, .el-date-table td.in-range div: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: rgba($primary, .15);
    color: #FFF;
  }
  /*选中条开始结束日期颜色*/
  .el-date-table td.end-date span, .el-date-table td.start-date span {
    background-color: $primary;
  }
  // 被禁用情况下
  .el-input.is-disabled .el-input__inner {
    background-color: $theme-dark-input-disabled-bg;
    border-color: $primary;
    cursor: not-allowed;
  }
  /* 最近一周快捷字体颜色 */
  .el-picker-panel__shortcut{
    color: $dtr-text-color;
  }
  .el-picker-panel__shortcut:hover{
    color: $primary;
  }
  .el-date-table th {
    color: $dtr-text-color;
    font-weight: 400;
    border-bottom: solid 1px $dtr-border-color;
  }
  /* 选择器图标颜色 */
  .el-picker-panel__icon-btn {
    font-size: 12px;
    color: #a7aebd;
    outline: 0;
  }
  /* 时间选择块样式 */
  .el-time-panel {
    margin: 5px 0;
    border: 1px solid $dtr-border-color;
    background-color: $theme-dark-card-bg !important;
    color: $dtr-text-color !important;
    -webkit-box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
    box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
    border-radius: 2px;
  }
  .el-time-spinner__item.active:not(.disabled) {
    color: #606266 !important;
    font-weight: 700;
  }
  .el-time-spinner__item:hover:not(.disabled):not(.active) {
    background: #151c2f;
    color: #FFF !important;
  }
  .el-time-spinner__item.active:not(.disabled) {
    color: #FFF !important;
  }
  /* footer上边线 */
  .el-time-panel__footer {
    border-top: 1px solid #283046;
    padding: 4px;
  }
  /* footer 取消按钮 */
  .el-time-panel__btn {
    color: $primary;
  }
  /* 时间选择器被选择时间样式 */
  .el-time-panel__content::after, .el-time-panel__content::before {
    border: none !important;
  }
  /* 日期组件当前日期颜色 */
  .el-date-table td.today span {
    color: #FFF !important;
  }
}