html:not(.dark-theme) body.light-blue {
    background: #b7ebf7;
    background: -webkit-linear-gradient(120deg, #f0f9ff 0%, #e0f2fe 30%, #bae6fd 70%, #99e6ff 100%);
    background: linear-gradient(120deg, #f0f9ff 0%, #e0f2fe 30%, #bae6fd 70%, #99e6ff 100%);
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper {
    background-color: #252525;
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper .sidebar-header .logo-text {
    color: white;
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper .sidebar-header .logo-icon {
    filter: invert(1) grayscale(100%) brightness(200%);
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper .sidebar-header .logo-icon.green-icon {
    filter: invert(49%) sepia(90%) saturate(3000%) hue-rotate(120deg) brightness(100%) contrast(100%) !important;
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper .metismenu a {
    color: rgb(231, 231, 231);
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper .metismenu a .parent-icon svg{
    fill: white;
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper .metismenu .mm-active>a {
    position: relative;
    overflow: hidden;
    color: #0ab5ee;
    background-color: #ffffff;
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper .metismenu .mm-active>a::before {
    content: "";
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(120deg,
            transparent,
            rgba(0, 131, 253, 0.20),
            transparent);
    transform: skewX(-20deg);
    animation: shine 5s infinite;
}

@keyframes shine {
    0% {
        right: -100%;
    }

    25% {
        right: 100%;
    }

    100% {
        right: 100%;
    }
}

html:not(.dark-theme) body.light-blue .sidebar-wrapper::before {
    opacity: 0.2;
}

html:not(.dark-theme) body.light-blue .paye-title-bar h6 {
    color: #0ea5e9;
    -webkit-text-stroke: 3px white;
    text-stroke: 2px #0ea5e9;
    paint-order: stroke fill;
}

html:not(.dark-theme) body.light-blue .paye-card table a{
    color: var(--bs-table-color);
    transition: color 0.2s linear;
}

html:not(.dark-theme) body.light-blue .paye-card table a:hover{
    color: #0ea5e9;
}
html:not(.dark-theme) body.light-blue .filter-modal .filter-area .filter-card{
    background: linear-gradient(-45deg, #e4f2ff, #b1d0ff);
}

html:not(.dark-theme) body.light-blue .card{
    box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.8),0 2px 6px 0 rgb(206, 206, 238) !important;
}