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

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

.el-button.is-disabled, .el-button.is-disabled:focus, .el-button.is-disabled:hover {
    color: #c0c4cc;
    background-color: #fff;
    border-color: #ebeef5;
}

.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: 40rem) {
    .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: 2px 8px;
            line-height: 26px;

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

    &.el-dropdown-menu--mini {
        .el-dropdown-menu__item {
            padding: 2px 6px;
            line-height: 22px;

            &: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-input {
        .el-input__inner {
            background-color: #FFF;
        }
    }
}

//.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-editor {
    &.el-input {
        &.el-date-editor--date {
            width: 7rem;
        }

        &.el-date-editor--datetime {
            width: 10rem;
        }

        .el-input__inner {
            text-align: center;
        }
    }

    &.el-range-editor {
        padding-right: 0;

        &.el-date-editor--datetimerange {
            width: 16rem;
        }

        &.el-date-editor--daterange {
            width: 11rem;
        }

        .el-range-input {
            flex-grow: 1;
        }

        .el-input__icon, .el-range-separator {
            width: auto;
        }

        .el-range__close-icon {
            display: none;
        }
    }
}

.el-picker-panel {

    .el-picker-panel__body {
        .el-picker-panel__content {
            padding: 8px;

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

    &.el-date-picker {
        width: 222px;

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

        .el-date-picker__time-header {
            .el-input__inner {
                height: 24px;
                line-height: 24px;
                font-size: var(--font-size-small);
                text-align: center;
            }
        }

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

            .el-date-picker__header-label, .el-picker-panel__icon-btn {
                font-size: var(--font-size-small);
            }
        }
    }

    &.el-date-range-picker {
        width: 502px;

        &.has-sidebar {
            width: 592px;
        }

        .el-picker-panel__body {
            min-width: 500px;
            width: 500px;
        }

        .el-date-range-picker__time-header {
            .el-input__inner {
                height: 24px;
                line-height: 24px;
                font-size: var(--font-size-small);
                text-align: center;
            }
        }

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

        .el-picker-panel__sidebar {
            width: 90px;

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


.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);

    .el-button-group {
        .el-button--default {
            &:hover, &:focus {
                border-color: #dcdfe6;
            }
        }
    }
}

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

@media screen and (max-width: 40rem) {
    .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;
}

.el-cascader {
    .el-input__inner {
        &:read-only {
            background-color: var(--color-input-light-bg);
        }
    }
}

.el-cascader-panel {
    .el-cascader-node {
        height: 28px;
        line-height: 28px;

        & > .el-radio {
            margin-top: 12px;
        }
    }
}

.el-input-number__decrease:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled), .el-input-number__increase:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled) {
    border-color: #DDD;
}
