
.el-button, .el-button:focus, .el-button:hover {
  outline: none !important;
}

.el-button.el-button--primary, .el-button.el-button--primary:focus, .el-button.el-button--primary:hover {
  color: #FFF;
  border-color: var(--color-primary);

  &:hover {
    border-color: var(--color-primary-dark);
  }
}

.el-button--mini {
  padding: 7px;
}

.el-button--text {
  border: none;

  &:hover, &:focus {
    border: none;
  }
}

.el-button--primary, .el-button--primary:focus, .el-button--primary:hover, .el-radio-button__orig-radio:checked + .el-radio-button__inner {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #FFF;

  &:hover {
    color: #FFF;
  }
}

.el-button--primary.is-disabled, .el-button--primary.is-disabled:active, .el-button--primary.is-disabled:focus, .el-button--primary.is-disabled:hover {
  color: #FFF;
  background: var(--color-primary-light);
  border-color: var(--color-primary-light) !important;
}


.el-input-group__append {
  text-align: center;
}

.el-input-group__append button.el-button {
  color: #666;
  border: none;

  &:hover {
    color: #666;
  }
}

.el-radio-button__inner:hover {
  color: var(--color-primary);
}

.ub-lister-search .field .el-radio-button {
  padding: inherit;
  border: none;
}

.el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active, .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
  color: var(--color-primary);
}

.el-step .el-step__title, .el-message {
  font-size: var(--font-size);
}

.el-upload-dragger .el-upload__text {
  font-size: var(--font-size);
}

@media screen and (max-width: 800px) {
  .el-dialog {
    width: 96%;
  }
}

.el-dialog__header {
  padding: 10px;
  border-bottom: 1px solid #EEE;
}

.el-dialog__footer {
  border-top: 1px solid #EEE;
  padding: 10px;
}

.el-dialog__title {
  font-size: var(--font-size);
}

.el-dialog__headerbtn {
  top: 10px;
  outline: none !important;

  &:hover, &:focus {
    .el-dialog__close {
      color: var(--color-primary);
    }
  }
}

.el-dialog__body {
  padding: 10px;
  font-size: var(--font-size);
}

.el-form-item__label, .el-tabs__item, .iconfont, .el-select-dropdown__empty, .el-tree-node__label {
  font-size: var(--font-size);
  border: none !important;
}

.el-input__inner {
  padding: 0 10px;
}

.el-pagination {
  font-weight: normal;
}

.el-form-item--small .el-form-item__content, .el-form-item--small .el-form-item__label {
  font-size: var(--font-size);
}

.el-select-dropdown__item {
  font-size: var(--font-size);
  padding: 0 10px;
  height: 30px;
  line-height: 30px;
}

.el-checkbox__label {
  font-size: var(--font-size);
}

.el-dropdown-menu {
  .el-dropdown-menu__item {
    line-height: 30px;
    padding: 5px 10px;

    a {
      padding: 10px 15px;
      display: block;
    }
  }

  &.el-dropdown-menu--small {
    .el-dropdown-menu__item {
      padding: 5px 10px;

      &:hover {
        color: var(--color-primary);
      }
    }
  }

  &.el-dropdown-menu--mini {
    .el-dropdown-menu__item {
      padding: 5px 10px;

      &:hover {
        color: var(--color-primary);
      }
    }
  }
}

.el-input-number.el-input-number--small {
  line-height: 28px;
}

.el-select {
  width: 100%;

  .el-select__input {
    border: none;
    padding: inherit;
    background: transparent;
    font-size: 12px;
  }
}

.el-date-editor--datetimerange.el-input__inner {
  width: 100%;
}

.el-image__error {
  font-size: var(--font-size) -small;
}

.el-transfer {
  font-size: var(--font-size);
  text-align: center;

  .el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label {
    font-size: var(--font-size);
  }

  .el-transfer-panel {
    text-align: left;

    .el-transfer-panel__item {
      display: block;
    }
  }
}

.el-switch.is-checked .el-switch__core {
  background: var(--color-primary);
  border-color: var(--color-primary);
}

.ub-form .line .field label.el-checkbox {
  border: none;
  margin-right: 10px;
  padding: 0;

  .el-checkbox__label {
    padding: 0 0 0 5px;
  }
}

.el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner, .el-radio__input.is-checked .el-radio__inner {
  background: var(--color-primary);
  border-color: var(--color-primary);
}

.el-checkbox__input.is-checked + .el-checkbox__label {
  color: var(--color-primary);
}

.el-checkbox__input.is-focus .el-checkbox__inner {
  border-color: var(--color-primary);
}

.el-checkbox__input.is-focus + .el-checkbox__label {
  color: var(--color-primary);
}

.el-radio__input.is-checked + .el-radio__label {
  color: var(--color-primary);
}

.el-radio__label {
  font-size: var(--font-size);
}

.el-table {
  tr {
    th {
      .cell {
        font-size: var(--font-size);
      }
    }
  }

  .ascending .sort-caret.ascending {
    border-bottom-color: var(--color-primary);
  }

  .descending .sort-caret.descending {
    border-top-color: var(--color-primary);
  }
}

.el-drawer__open {
  .el-drawer__header {
    padding: 10px;
    border-bottom: 1px solid #EEE;
    margin-bottom: 0;
  }

  .el-drawer__body {
    padding: 10px;
    display: block;
    position: relative;

    .body {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      overflow: auto;
      padding: 20px;
      padding-bottom: 50px;
    }

    .foot {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 10px;
      background: #FFF;
      border-top: 1px solid #EEE;
      text-align: right;
    }
  }
}

.te-toolbar-section {
  height: 40px;

  .tui-editor-defaultUI-toolbar {
    padding: 0 5px;

    button {
      margin: 8px 5px;
      outline: none;
    }

    .tui-toolbar-divider {
      margin: 13px 0;
    }

    button.tui-scrollsync {
      display: none !important;
    }
  }
}

.el-loading-spinner i {
  color: #FFF;
  font-size: 30px;
}

.el-loading-spinner .el-loading-text {
  color: #FFF;
  font-size: 12px;
}

.el-loading-spinner {
  margin-top: -15px;

  .circular {
    width: 30px;
    height: 30px;
  }
}

.el-drawer__close-btn {
  line-height: 20px;
  outline: none !important;
}

.el-tabs__item.is-active {
  color: var(--color-primary);
}

.el-tabs__item:hover {
  color: var(--color-primary);
}

.el-tabs__active-bar {
  background-color: var(--color-primary);
}

.ub-form .line .field label {
  &.el-radio {
    border: none;
  }
}

.el-textarea__inner {
  padding: 5px;
}

.el-date-picker {
  width: 230px;

  .el-picker-panel__content {
    width: 220px;
  }
}

.el-date-range-picker {
  width: 450px;
}

.el-date-range-picker .el-picker-panel__body {
  min-width: 440px;
  width: 440px;
}

.el-date-picker__time-header {
  padding: 5px 0;
}

.el-date-picker__header {
  margin: 5px;
}

.el-picker-panel__content {
  margin: 5px;
}

.el-date-picker__header-label, .el-date-range-picker__header div {
  font-size: var(--font-size);
}

.el-date-table td, .el-date-table td div {
  height: 20px;
}

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

.el-radio-group {
  label {
    margin-bottom: 0;
  }
}

.ub-form .line .field label.el-radio-button {
  padding: 0;
  border: none;
}

.el-dropdown {
  font-size: var(--font-size);
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px white inset;
}

@media screen and (max-width: 800px) {
  .el-message-box {
    max-width: 80%;
  }
}

.pb-el-select-confirm-box {
  height: 33px;

  .pb-el-select-confirm-box-bar {
    padding: 5px 10px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #FFF;
    border-top: 1px solid #EEE;
    text-align: right;

    button {
      height: 22px;
      line-height: 20px;
      padding: 0 10px;
    }
  }
}


.el-radio-button__orig-radio:checked + .el-radio-button__inner {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  -webkit-box-shadow: -1px 0 0 0 var(--color-primary);
  box-shadow: -1px 0 0 0 var(--color-primary);
}

.el-avatar{
  vertical-align: middle;
}
