hac/src/styles/index.scss

html, body, #app {
    height: 100%;
    background-color: #EBF4F6;
}
*:focus-visible {
    outline: none;
}
.el-message {
    max-width: 400px;
}
.el-scrollbar.hc-main-scrollbar .el-scrollbar__bar {
    right: -18px;
}

.el-scrollbar:not(.hc-main-scrollbar) .el-scrollbar__bar {
    right: 0;
}
.el-scrollbar.hc--right-15 .el-scrollbar__bar {
    right: -15px;
}

.hc-main-row {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.hc-sb-table .el-tabs .el-tabs__header .el-tabs__nav .el-tabs__item {
    background: #f1f5f8;
}
.hc-sb-table .el-tabs .el-tabs__active-bar {
    background: white;
}
.hc-sb-table .el-tabs .el-tabs__active-bar:after,
.hc-sb-table .el-tabs .el-tabs__active-bar:before {
    background: white;
}

.hac-card-title {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    margin-left: 8px;
    &::before {
        content: '';
        position: relative;
        display: inline-block;
        width: 5px;
        height: 18px;
        border-radius: 10px;
        background-color: var(--el-color-primary-dark-2);
        right: 8px;
    }
}

.bg-purple1 {
    background-color: rgb(184, 122, 253);
}
.bg-purple1-gradient {
    background: linear-gradient(90.99deg, rgba(98,113,252,1) 0.63%,rgba(115,115,252,1) 19%,rgba(152,119,253,1) 35.04%,rgba(163,121,253,1) 51.28%,rgba(178,122,253,1) 73.03%,rgba(184,122,253,1) 97.29%);
    color: white;
}

.bg-blue1 {
    background-color: rgba(109,131,251,1);
}
.bg-blue1-gradient {
    background: linear-gradient(90.99deg, rgba(62,162,246,1) 0.63%,rgba(74,154,247,1) 20.93%,rgba(71,155,247,1) 37.36%,rgba(87,145,249,1) 53.8%,rgba(101,136,250,1) 73.03%,rgba(109,131,251,1) 97.29%);
    color: white;
}

.bg-blue2 {
    background-color: rgba(109,131,251,1);
}
.bg-blue2-gradient {
    background: linear-gradient(90.99deg, rgba(62,162,246,1) 0.63%,rgba(74,154,247,1) 20.93%,rgba(71,155,247,1) 37.36%,rgba(87,145,249,1) 53.8%,rgba(101,136,250,1) 73.03%,rgba(109,131,251,1) 97.29%);
    color: white;
}

.bg-red1 {
    background-color: rgba(239,148,100,1);
}
.bg-red1-gradient {
    background: linear-gradient(90.99deg, rgba(234,100,110,1) 0.63%,rgba(235,111,110,1) 19%,rgba(236,121,108,1) 35.04%,rgba(237,134,104,1) 51.28%,rgba(238,141,101,1) 73.13%,rgba(239,148,100,1) 97.29%);
    color: white;
}

.bg-green1 {
    background-color: rgba(111,210,165,1);
}
.bg-green1-gradient {
    background: linear-gradient(90.99deg, rgba(74,199,214,1) 0.63%,rgba(84,202,203,1) 19%,rgba(92,205,189,1) 35.04%,rgba(101,207,180,1) 51.28%,rgba(103,208,178,1) 73.03%,rgba(111,210,165,1) 97.29%);
    color: white;
}

.bg-pink1 {
    background-color: rgba(239,148,100,1);
}
.bg-pink1-gradient {
    background: linear-gradient(90.99deg, rgba(234,100,110,1) 0.63%,rgba(235,111,110,1) 19%,rgba(236,121,108,1) 35.04%,rgba(237,134,104,1) 51.28%,rgba(238,141,101,1) 73.13%,rgba(239,148,100,1) 97.29%);
    color: white;
}


.hc-table-ref-box {
    border-color: #f3f3f3;
}

.el-card.hc-card-box {
    --el-card-bg-color: white;
}
.el-card.hc-card-box .el-card__body .hc-card-action-box {
    background-color: white;
}
.el-card .el-card__body .hc-card-main-box .hc-card-item-box {
    background: #f3f8fc;
}
.hac-card-item.hc-card-item-box {
    background: white;
    .hc-card-item-header {
        .item-header, .item-extra {
            height: 100%;
        }
        .item-extra {
            margin-left: 14px;
        }
    }
}

.hc-table-ref-box.no-border {
    border: 0;
}

.el-card.hc-card-box .el-card__body .hc-card-action-box {
    .el-button + .el-button {
        margin-left: 32px;
    }
}