.status-0 {
    color: rgb(0, 80, 20);
    background: rgba(141, 255, 179, 0.808);
}

.status-1 {
    color: rgb(100, 61, 3);
    background: rgba(255, 208, 107, 0.808);
}


.tag-lead-yellow {
    color: rgb(100, 61, 3);
    background: rgba(255, 208, 107, 0.808);
}

.tag-lead-orange {
    color: rgb(150, 38, 0);
    background: rgba(255, 185, 54, 0.808);
}

.tag-lead-green {
    color: rgb(3, 100, 5);
    background: rgba(107, 255, 117, 0.808);
}

.tag-lead-dark-blue {
    color: rgb(242, 242, 242);
    background: rgba(0, 22, 162, 0.808);
}

.tag-lead-blue {
    color: rgb(3, 26, 100);
    background: rgba(107, 208, 255, 0.808);
}

.tag-lead-red {
    color: rgb(100, 3, 3);
    background: rgba(255, 107, 107, 0.808);
}

.tag-lead-red-dark {
    color: rgb(232, 232, 232);
    background: rgba(128, 0, 0, 0.808);
}

.tag-lead-purple {
    color: rgb(72, 3, 100);
    background: rgba(206, 107, 255, 0.808);
}

.tag-lead-gray {
    color: rgb(26, 16, 0);
    background: rgba(232, 232, 232, 0.808);
}

.tag-lead-black {
    color: rgb(212, 212, 212);
    background: rgba(30, 30, 30, 0.808);
}

.tag-lead-pink {
    color: rgb(100, 3, 87);
    background: rgba(255, 107, 240, 0.808);
}


.tag-status-yellow {
    color: white;
    background: rgb(231, 208, 0);
}

.tag-status-orange {
    color: white;
    background: rgb(214, 118, 0);
}

.tag-status-green {
    color: rgb(255, 255, 255);
    background: rgb(32, 183, 78);
}

.tag-status-blue {
    color: rgb(255, 255, 255);
    background: rgb(0, 125, 208);
}

.tag-status-red {
    color: rgb(255, 255, 255);
    background: rgb(181, 42, 42);
}

.tag-status-purple {
    color: rgb(255, 255, 255);
    background: rgb(159, 68, 205);
}

.tag-status-gray {
    color: rgb(26, 16, 0);
    background: rgba(232, 232, 232, 0.808);
}

.tag-status-black {
    color: rgb(255, 255, 255);
    background: rgb(30, 30, 30);
}

.tag-status-pink {
    color: rgb(255, 255, 255);
    background: rgb(211, 76, 198);
}


.tag-financial-yellow {

    color: rgb(251, 251, 0);
}

.tag-financial-orange {

    color: rgb(243, 158, 0);
}

.tag-financial-green {

    color: rgb(47, 207, 58);
}

.tag-financial-blue {

    color: rgb(1, 27, 197);
}

.tag-financial-red {

    color: rgb(186, 0, 0);
}

.tag-financial-gray {

    color: rgb(81, 81, 81);
}


.border-status-green {
    border-left: 4px solid rgb(32, 183, 78);
}

.border-status-black {
    border-left: 4px solid rgb(30, 30, 30);
}

.border-status-yellow {
    border-left: 4px solid rgb(231, 208, 0);
}

.border-status-red {
    border-left: 4px solid rgb(181, 42, 42);
}

.border-status-blue {
    border-left: 4px solid rgb(0, 125, 208);
}

.status-payment-paid {
    color: rgb(3, 100, 5);
    background: rgba(107, 255, 117, 0.808);
}

.status-payment-pending {
    color: rgb(3, 26, 100);
    background: rgba(107, 208, 255, 0.808);
}

.status-payment-delayed {
    color: white;
    background: rgba(255, 107, 107, 0.808);
}

.status-invoice-canceled {
    background: rgba(192, 192, 192, 0.808);
    border: 2px solid rgba(28, 28, 28, 0.808);
}

.status-invoice-paid {

    background: rgba(107, 255, 117, 0.808);
    border: 2px solid rgba(19, 113, 0, 0.808);
}

.status-invoice-pending {
    background: rgba(107, 208, 255, 0.808);
    border: 2px solid rgba(4, 0, 113, 0.808);
}

.status-invoice-delayed {
    background: rgba(255, 107, 107, 0.808);
    border: 2px solid rgba(113, 0, 0, 0.808);
}

.status-payment-canceled {
    color: rgb(44, 44, 44);
    background: rgba(192, 192, 192, 0.808);
}

.border-payment-paid {
    border-left: 4px solid rgba(141, 255, 179, 0.808);
}

.border-payment-pending {
    border-left: 4px solid rgba(118, 190, 223, 0.808);
}

.border-payment-canceled {
    border-left: 4px solid rgba(89, 89, 89, 0.808);
}

.border-status-0 {
    border-left: 4px solid rgba(141, 255, 179, 0.808);
}

.border-status-1 {
    border-left: 4px solid rgba(255, 208, 107, 0.808);
}


/* Scrool */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
    border-radius: 10px;
    background-color: #f0f0f0;
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background-color: rgba(249, 248, 255, 0.616);
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgb(49, 49, 49);
    background-color: #e7eefa;
}



/*remove custom style*/
.circles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.circles li {
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.0);
    animation: animate 25s linear infinite;
    bottom: -150px;
}

.logos-animation {
    opacity: 0.5;
}

.circles li:nth-child(1) {
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.circles li:nth-child(2) {
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.circles li:nth-child(3) {
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.circles li:nth-child(4) {
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s;
}

.circles li:nth-child(5) {
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.circles li:nth-child(6) {
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.circles li:nth-child(7) {
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}

.circles li:nth-child(8) {
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}

.circles li:nth-child(9) {
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.circles li:nth-child(10) {
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}

@keyframes animate {

    0% {
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100% {
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%;
    }

}

.wave {
    width: 100%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    bottom: 0px;
    z-index: 4;
}

.wave svg {
    width: 100%;
    height: auto;
    fill: var(--color_bg_primary);
}