﻿
.main-navbar {
    box-shadow: 1px 2px 24px -18px #585151;
}

    .main-navbar.main-navbar-orange {
        background-color: #e4561f !important;
    }

        .main-navbar.main-navbar-orange a.navbar-brand > img.color-logo {
            display: none
        }

        .main-navbar.main-navbar-orange a.navbar-brand > img.white-logo {
            display: flex !important;
        }

        .main-navbar.main-navbar-orange ul.navbar-bars > li > .menu-bars {
            color: white !important;
        }


            .main-navbar.main-navbar-orange ul.navbar-bars > li > .menu-bars.active {
                color: white !important;
                background-color: #ef9978c9;
            }

            .main-navbar.main-navbar-orange ul.navbar-bars > li > .menu-bars:hover {
                color: white !important;
                background-color: #f98457c9;
            }

        .main-navbar.main-navbar-orange a.dropdown-toggle {
            color: white !important;
        }

.main-left-content .sidebars.main-menus-orange ul li {
    border-bottom: 1px solid orangered;
    border-left: 1px solid orangered;
    border-right: 1px solid orangered;
}

    .main-left-content .sidebars.main-menus-orange ul li:first-child {
        border-top: 1px solid orangered;
    }

.main-left-content .sidebars.main-menus-orange ul.sub-menu {
    box-shadow: -3px 3px 0px 0px #bf3d0c42;
}

.main-left-content .sidebars.main-menus.main-menus-orange ul li.active {
    background-color: #ff4500ab;
}

.main-left-content .sidebars.main-menus.main-menus-orange ul li:not(.expanded):not(.active):hover {
    box-shadow: 0 0 9px 1px #ff45008c;
}

.main-left-content .sidebars.main-menus-orange > ul li > a {
    color: orangered !important;
}

.main-left-content .sidebars.main-menus.main-menus-orange ul > li.active > a {
    color: white !important;
}

.custom-scrollbar.custom-scrollbar-orange::-webkit-scrollbar-thumb {
    background-color: orangered;
}

.main-left-content.main-left-content-orange {
    border-right: 1px solid #FC413F;
    
}
/***********Orange theme end************/

/***********default theme start************/
.main-navbar.main-navbar-default {
    background-color:darkblue !important;
    border-bottom: 1px solid #585151;
}

    .main-navbar.main-navbar-default .logo-brand {
        border-right: 2px solid #6c757d;
        box-shadow: unset;
    }

    .main-navbar.main-navbar-default a.navbar-brand > img.white-logo {
        display: none !important;
    }

    .main-navbar.main-navbar-default a.navbar-brand > img.color-logo {
        display: flex !important;
    }

    .main-navbar.main-navbar-default ul.navbar-bars > li > .menu-bars {
        color: #6c757d !important;
    }

        .main-navbar.main-navbar-default ul.navbar-bars > li > .menu-bars:hover {
            background-color: #dc3545;
            border-radius: 20px;
        }

        .main-navbar.main-navbar-default ul.navbar-bars > li > .menu-bars.active {
            color: white !important;
            background-color: #060606;
            border-radius: 20px;
        }

            .main-navbar.main-navbar-default ul.navbar-bars > li > .menu-bars.active:hover {
                color: white !important;
                background-color:green;
                border-radius: 20px;
            }

    .main-navbar.main-navbar-default a.dropdown-toggle {
        color: #6c757d !important;
    }

.main-left-content .sidebars.main-menus-default ul li {
    border-bottom: 1px solid #dc3545 !important;
    border-left: 1px solid #dc3545 !important;
    border-right: 1px solid #dc3545 !important;
}

    .main-left-content .sidebars.main-menus-default ul li:first-child {
        border-top: 1px solid #dc3545 !important;
    }

.main-left-content .sidebars.main-menus-default ul.sub-menu {
    box-shadow: 0 0 5px 2px #c7c6c6 !important;
}

.main-left-content .sidebars.main-menus.main-menus-default ul li.active:not(.expanded) {
    background-color: #585151;
}

.main-left-content .sidebars.main-menus.main-menus-default ul li:not(.expanded):not(.active):hover {
    box-shadow: 0 0 13px 4px #007bff;
}

.main-left-content .sidebars.main-menus-default > ul li > a {
    color: #4800ff !important;
}

.main-left-content .sidebars.main-menus.main-menus-default ul > li.active:not(.expanded) > a {
    color: white !important;
}

.custom-scrollbar.custom-scrollbar-default::-webkit-scrollbar-thumb {
    background-color: #808080;
}

.main-left-content.main-left-content-default {
    border-right: 1px solid #6c757d;
}

/*green theme start */
.main-navbar.main-navbar-green {
    background-color: darkgreen !important;
}

    .main-navbar.main-navbar-green a.navbar-brand > img.color-logo {
        display: none
    }

    .main-navbar.main-navbar-green a.navbar-brand > img.color-logo {
        display: none
    }

    .main-navbar.main-navbar-green a.navbar-brand > img.white-logo {
        display: flex !important;
    }

    .main-navbar.main-navbar-green ul.navbar-bars > li > .menu-bars {
        color: white !important;
    }


        .main-navbar.main-navbar-green ul.navbar-bars > li > .menu-bars.active {
            color: white !important;
            background-color: #ffffff3b;
        }

        .main-navbar.main-navbar-green ul.navbar-bars > li > .menu-bars:hover {
            color: white !important;
            background-color: #ffffff3b;
        }

    .main-navbar.main-navbar-green a.dropdown-toggle {
        color: white !important;
    }

.main-left-content .sidebars.main-menus-green ul li {
    border-bottom: 1px solid darkgreen;
    border-left: 1px solid darkgreen;
    border-right: 1px solid darkgreen;
}

    .main-left-content .sidebars.main-menus-green ul li:first-child {
        border-top: 1px solid darkgreen;
    }

.main-left-content .sidebars.main-menus-green ul.sub-menu {
    box-shadow: -3px 3px 0px 0px #00640042;
}

.main-left-content .sidebars.main-menus.main-menus-green ul li.active {
    background-color: #006400ab;
}

.main-left-content .sidebars.main-menus.main-menus-green ul li:not(.expanded):not(.active):hover {
    box-shadow: 0 0 9px 1px #006400ab;
}

.main-left-content .sidebars.main-menus-green > ul li > a {
    color: darkgreen !important;
}

.main-left-content .sidebars.main-menus.main-menus-green ul > li.active > a {
    color: white !important;
}

.custom-scrollbar.custom-scrollbar-green::-webkit-scrollbar-thumb {
    background-color: darkgreen;
}

.main-left-content.main-left-content-green {
    border-right: 1px solid green;
}

/*green theme end */


/*dark theme start */
.main-left-content.main-left-content-dark {
    background-color: #060606;
    border-right: 1px solid green;
}

.main-right-content.main-right-content-dark .right-content-wrapper {
    background-color: #ff45001f;
}
.main-right-content.main-right-content-dark .card {
    background-color: #343a40 !important;
    color: #fff !important;
}
.main-right-content.main-right-content-dark .table {
    background-color: #343a40 !important;
    color: #fff !important;
}
.main-right-content.main-right-content-dark .table tbody tr:hover {
    color: #fff;
    background-color: rgba(255,255,255,.075);
}
.main-right-content.main-right-content-dark .modal .modal-dialog .modal-content {
    color: #fff ;
    background-color: #343a40 ;
}



.main-navbar.main-navbar-dark {
    background-color: #211c1c !important;
}

    .main-navbar.main-navbar-dark .logo-brand {
        box-shadow: unset;
        border-right: 2px solid green;
    }

    .main-navbar.main-navbar-dark a.navbar-brand > img.color-logo {
        display: flex !important;
    }

    .main-navbar.main-navbar-dark a.navbar-brand > img.white-logo {
        display: none;
    }

    .main-navbar.main-navbar-dark ul.navbar-bars > li > .menu-bars {
        color: white !important;
    }


        .main-navbar.main-navbar-dark ul.navbar-bars > li > .menu-bars.active {
            color: white !important;
            background-color: #ffffff3b;
        }

        .main-navbar.main-navbar-dark ul.navbar-bars > li > .menu-bars:hover {
            color: white !important;
            background-color: #ffffff3b;
        }

    .main-navbar.main-navbar-dark a.dropdown-toggle {
        color: #f56631 !important;
    }

.main-left-content .sidebars.main-menus-dark ul li {
    border-bottom: 1px solid darkgreen;
    border-left: 1px solid darkgreen;
    border-right: 1px solid darkgreen;
}

    .main-left-content .sidebars.main-menus-dark ul li:first-child {
        border-top: 1px solid darkgreen;
    }

.main-left-content .sidebars.main-menus-dark ul.sub-menu {
    box-shadow: -3px 3px 0px 0px #0080003d;
}

.main-left-content .sidebars.main-menus.main-menus-dark ul li.active {
    background-color: #ff45009e !important;
}

.main-left-content .sidebars.main-menus.main-menus-dark ul li:not(.expanded):not(.active):hover {
    box-shadow: 0 0 9px 1px rgba(6, 79, 6, 0.68);
}

.main-left-content .sidebars.main-menus-dark > ul li > a {
    color: orangered !important;
}

.main-left-content .sidebars.main-menus.main-menus-dark ul > li.active > a {
    color: #060606 !important;
    font-weight: bold;
}

.custom-scrollbar.custom-scrollbar-dark::-webkit-scrollbar-thumb {
    background-color: darkgreen;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 1px;
    height: 1px;
    background-color: #403e3e;
}



/*dark theme end */



/***********spoton theme start************/
.main-left-content.main-left-content-spoton {
}

.main-navbar.main-navbar-spoton {
    background-color: #f8f9fac9 !important;
    border-bottom: 1px solid green;
}

    .main-navbar.main-navbar-spoton .logo-brand {
        border-right: 2px solid #6c757d;
        box-shadow: unset;
    }

    .main-navbar.main-navbar-spoton a.navbar-brand > img.white-logo {
        display: none !important;
    }

    .main-navbar.main-navbar-spoton a.navbar-brand > img.color-logo {
        display: flex !important;
    }

    .main-navbar.main-navbar-spoton ul.navbar-bars > li > .menu-bars {
        color: #ff4703 !important;
    }

        .main-navbar.main-navbar-spoton ul.navbar-bars > li > .menu-bars:hover {
            color: #00800085 !important;
            background-color: #ff47036e;
            border-radius: 20px;
        }

        .main-navbar.main-navbar-spoton ul.navbar-bars > li > .menu-bars.active {
            color: orangered !important;
            background-color: #00800047;
            border-radius: 20px;
        }

            .main-navbar.main-navbar-spoton ul.navbar-bars > li > .menu-bars.active:hover {
                color: #00800085 !important;
                background-color: #ff47036e;
                border-radius: 20px;
            }

    .main-navbar.main-navbar-spoton a.dropdown-toggle {
        color: orangered !important;
    }

.main-left-content .sidebars.main-menus-spoton ul li {
    border-bottom: 1px solid green !important;
    border-left: 1px solid green !important;
    border-right: 1px solid green !important;
}

    .main-left-content .sidebars.main-menus-spoton ul li:first-child {
        border-top: 1px solid green !important;
    }

.main-left-content .sidebars.main-menus-spoton ul.sub-menu {
    box-shadow: -3px 3px 0px 0px #00640042;
}

.main-left-content .sidebars.main-menus.main-menus-spoton ul li.active:not(.expanded) {
    background-color: green;
}

.main-left-content .sidebars.main-menus.main-menus-spoton ul li:not(.expanded):not(.active):hover {
    box-shadow: 0 0 9px 1px #006400ab;
}

.main-left-content .sidebars.main-menus-spoton > ul li > a {
    color: #ff4703 !important;
}

.main-left-content .sidebars.main-menus.main-menus-spoton ul > li.active:not(.expanded) > a {
    color: coral !important;
    font-weight: 800;
}

.custom-scrollbar.custom-scrollbar-spoton::-webkit-scrollbar-thumb {
    background-color: #808080;
}

.main-left-content.main-left-content-spoton {
    border-right: 1px solid green;
}
/***********spoton theme end************/
