$active-color     : #4db7ff;
$active-color-dark: #1451a0;
$shadow-color     : #101c35;
$section-bg       : #1c2330;
$section-bg-light : #33415a;
$text-sub         : #5d739c;
$text-main        : #dddddd;
$text-title       : #f4f7fd;
$border-color     : #576580;

div {
    color: $text-main;
}

.comp-container {
    height    : 100%;
    width     : 100%;
    padding   : 14PX;
    box-sizing: border-box;
    overflow  : hidden;



    /deep/ .el-table {
        background-color   : $section-bg;
        // border-color    : $border-color;
        // border-left: 1px solid $border-color;
        border             : 1px solid $border-color;
        border-bottom      : none;
    }

    /deep/ .el-table--group::after,
    /deep/ .el-table--border::after,
    /deep/ .el-table::before {
        background-color: $border-color;
    }

    /deep/ .el-table thead tr,
    /deep/ .el-table thead tr th {
        background-color: rgba($active-color-dark, 0.4) !important;
        color           : $text-main;
    }

    /deep/ .el-table--mini th {
        height: 46px;
    }

    /deep/ .el-table--mini td {
        height        : 41px !important;
        padding-top   : 0;
        padding-bottom: 0;
    }

    /deep/ .el-table th>.cell {
        font-size  : 14px;
        font-weight: bold;
        color      : $text-main;
    }

    /deep/ .el-table td>.cell {
        font-size: 14px;
        color    : $text-main;
    }

    /deep/ .el-table th.is-leaf,
    /deep/ .el-table td {
        border-bottom: 1px solid $border-color;
    }

    /deep/ .el-table--border th,
    /deep/ .el-table--border td {
        border-right: 1px solid $border-color !important;
    }

    /deep/ .el-table tr {
        background-color: transparent !important;
    }

    /deep/.el-table--striped .el-table__body tr.el-table__row--striped td {
        background: rgba($active-color-dark, 0.2) !important;
    }

    /deep/ .el-table--enable-row-hover .el-table__body tr:hover>td {
        background-color: rgba($active-color-dark, 0.7) !important;
        cursor          : pointer;
    }


    /deep/ .el-table__body tr.current-row>td {
        background-color: rgba($active-color-dark, 0.7) !important;
    }

    /deep/ .el-table--striped .el-table__body tr.current-row>td {
        background-color: rgba($active-color-dark, 0.7) !important;
    }

    /deep/ .el-form-item__label {
        color      : $text-main;
        font-weight: 700;
    }

    /deep/ .el-input input {
        background-color: $section-bg;
        border-color    : $border-color;
        color           : $text-main;
    }

    /deep/ .el-select-dropdown {
        background-color: $section-bg;
    }

    /deep/ .el-select-dropdown {
        background-color: $section-bg;
        border          : solid 1px $border-color;
    }

    /deep/ .el-select-dropdown__item {
        height     : 28PX;
        line-height: 28PX;
    }

    /deep/ .el-select-dropdown__item span {
        color: $text-main;
    }

    /deep/ .el-select-dropdown__item.selected span {
        color: $active-color !important;
    }

    /deep/ .el-select-dropdown__item.hover,
    /deep/ .el-select-dropdown__item.hover,
    .el-select-dropdown__item:hover {
        background-color: $section-bg-light !important;
    }

    /deep/ .el-scrollbar__wrap {
        margin-right : -8PX !important;
        margin-bottom: -8PX !important;
    }

    /deep/ .el-popper[x-placement^="bottom"] .popper__arrow {
        top                : -7PX;
        border-bottom-color: $border-color;
    }

    /deep/ .el-popper[x-placement^="bottom"] .popper__arrow::after {
        border-bottom-color: $border-color;
    }

    .check-item {
        margin-right: 10px;
    }

    .check-item /deep/ .el-checkbox__label {
        font-size   : 12px;
        color       : $text-main;
        padding-left: 6px;
    }

    .search-container {
        border       : 1px dashed $border-color;
        padding-top  : 10px;
        padding-left : 10px;
        margin-bottom: 10PX;
    }

    .search-row {
        margin-bottom: 8px;

        .label {
            // font-weight: bold;
            // font-size: 12PX;
            margin-bottom   : 6px;
            display         : inline-block;
            background-color: $active-color-dark;
        }
    }

    /deep/.el-tabs {
        padding-top: 10px;
        box-sizing : border-box;
        border     : 1px solid $border-color;
    }

    /deep/ .el-tabs__nav-scroll {
        text-align: center;

    }

    /deep/ .el-tabs__nav {
        float: none;

    }

    /deep/ .el-tabs__item {
        font-size              : 12px;
        border-top-left-radius : 10px;
        border-top-right-radius: 10px;
        margin                 : 0 6px !important;
        padding                : 0 10px !important;
        border                 : none;
        height                 : 40px;
        line-height            : 40px;
    }

    /deep/ .el-tabs--border-card>.el-tabs__content {
        width     : 100%;
        height    : calc(100% - 40PX) !important;
        padding   : 10px;
        box-sizing: border-box;
        // margin-top: 10px;
    }


}