﻿/*Side bar backgroud*/
.layout-fixed .main-sidebar {
    background-image: url("../images/parretn_spiral.png");
    background-size: 400px 400px;
}

.layout-fixed.dark-mode .main-sidebar {
    background-color: rgba(34, 39, 43, 1) !important;
    /*background-color: rgba(23, 26, 28, 1) !important;*/
    /*background-color: rgba(69, 77, 85, 1) !important;*/
}

.layout-fixed .main-sidebar {
    background-color: rgba(34, 39, 43, 1) !important;
    /*background-color: rgba(23, 26, 28, 1) !important;*/
    /*background-color: rgba(69, 77, 85, 1) !important;*/
}

.content-wrapper {
    /*background-image: url("../images/parretn_spiral.png");
    background-size: 400px 400px;*/
}

.main-header {
    /*background-image: url("../images/pattern_circle.png");
    background-size: 200px 200px;*/
}

/*Side bar hover color*/
.nav-link:hover .nav-icon, .nav-item:hover > .nav-link .nav-icon {
    color: #FF5800 !important;
}

.brand-link:hover > img {
    border: 1px solid #FF5800;
}

.brand-link:hover > span {
    color: whitesmoke;
}

/*Chrome calendar color*/
.dark-mode ::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

/*Chrome input backgroud color for auto fill*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-background-clip: text;
    -webkit-text-fill-color: black;
    transition: background-color 5000s ease-in-out 0s;
    box-shadow: inset 0 0 20px 20px #23232329;
}

/*Apex Chart*/
/*.dark-mode .apexchart .apexcharts-legend-text, .dark-mode .apexchart .apexcharts-title-text {
    color: white !important;
    fill: white !important;
}

.dark-mode .apexchart .apexcharts-text * {
    color: white !important;
    fill: white !important;
}

.dark-mode .apexcharts-menu.apexcharts-menu-open {
    background-color: rgba(0,0,0,0.2) !important;
    border: 1px solid black;
}

    .dark-mode .apexcharts-menu.apexcharts-menu-open .apexcharts-menu-item:hover {
        background-color: rgba(0,0,0,0.2);
    }

.dark-mode > .apexcharts-legend-series {
    color: white;
}

.dark-mode > .apexcharts-text {
    color: white;
}

.dark-mode .apexcharts-tooltip, .dark-mode .apexcharts-tooltip-series-group.apexcharts-active {
    background-color: rgba(0,0,0,0.2) !important;
    border: 1px solid black;
}

    .dark-mode .apexcharts-tooltip .apexcharts-tooltip-title {
        color: black;
    }*/



/*Apex chart dark theme issue code from net*/
/*.dark-mode .apexcharts-text {
    fill: #fff;
}

.dark-mode .apexcharts-tooltip,
.dark-mode .apexcharts-tooltip-title {
    background-color: #333 !important;
    color: #fff !important;
    border: 1px solid #555 !important;
}

.dark-mode .apexcharts-legend-text {
    color: #fff !important;
    border: 1px solid #555 !important;
}*/
/*Apex chart dark theme issue code from net*/

/*Syncfusion date range, time picker*/
.dark-mode .e-control.e-timepicker,
.dark-mode .e-control.e-daterangepicker {
    background: #343a40 !important;
    color: white !important;
}

/*input range*/
.slider {
    -webkit-appearance: none;
    width: 100%;
    height: calc(2.25rem + 2px);
    outline: none;
}

    .slider:hover {
        /*opacity: 1;*/
    }

    .slider::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 25px;
        height: 25px;
        background: #007bff;
        cursor: pointer;
        border-radius: 10%;
    }

    .slider::-moz-range-thumb {
        width: 25px;
        height: 25px;
        background: #007bff;
        cursor: pointer;
    }

.slider-primary::-webkit-slider-thumb,
.slider-primary::-moz-range-thumb {
    background: #007bff;
}

.dark-mode .slider-primary::-moz-range-thumb {
    background: #3f6791;
}

.dark-mode .slider-primary::-webkit-slider-thumb {
    background: #3f6791;
}

/*input number*/
input[type="number"], input[type="date"] {
    text-align: right;
}

/*Quickgrid text wraping*/
.quickgrid[theme=default] {
    --col-gap: 0rem !important;
}

    .quickgrid[theme=default] td {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }


/*Quickgrid Table Scrolling */
.enable-table-scroll {
    max-height: 37rem;
    overflow-y: auto;
}

    .enable-table-scroll table {
        min-width: 100%;
    }

    /* Sticky header while scrolling */
    .enable-table-scroll thead {
        position: sticky;
        top: 0;
        background-color: #d8d8d8;
        outline: 1px solid gray;
        z-index: 1;
    }

    /* For virtualized grids, it's essential that all rows have the same known height */
    .enable-table-scroll tr {
        height: 30px;
        border-bottom: 0.5px solid silver;
    }

    .enable-table-scroll tbody td {
        white-space: normal;
        overflow: visible;
        max-width: none;
        text-overflow: clip;
    }


hr {
    border: 1px solid #007bff;
    border-radius: 50%;
}
.dark-mode hr {
    border: 1px solid #3f6791;
    border-radius:50%;
}


/* Sidebar button not showing in mobile mode*/
@media only screen and (max-width: 991px) {
    .main-header {
        margin-left: 0px !important;
    }

    .main-sidebar {
        top: 85px !important;
        transition-delay: 0.25s !important;
        transition: top 0.25s;
    }
}
