:root {
    --bg-color: #885896; /* Default background color */
    --text-color: #ffffff; /* Default text color */

    --bg-from: #f8fafc;
    --bg-to: #eff6ff;
    --card-bg: rgba(255, 255, 255, 0.95);
    --muted: #6b7280;
    --radius: 14px;
    --glass: blur(6px);
}

.select-border {
    border-radius: 15px;
    width: 190px;
    list-style: none;
    height: 35px;
    margin-right: 10px;
    padding: 5px 7px;
    font-size: 14px;
    border-radius: 7px;
}

.card {
    border-radius: 14px !important;
}
.btn-res-sub {
    border-radius: 15px;
}
.overview-div {
    list-style: none;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
.overview-div li {
    width: 100%;
    height: 75px;
    border-radius: 18px;
    padding: 18px;
}

.card-h-text {
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    text-align: center;
    margin-bottom: 10px !important;
}
.card-m-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 7px;
    text-align: center;
}

.card-bg-1 {
    background: #40abfcb8;
}
.card-bg-2 {
    background: #e9b45a;
}
.card-bg-3 {
    background: #5d3868;
}
.card-bg-4 {
    background: #9f9f9f;
}
.card-bg-5 {
    background: #d35f5fcc;
}
.card-bg-6 {
    background: #a1c470;
}
.card-bg-7 {
    background: #d35f5fcc;
}
.card-bg-8 {
    background: #9f9f9f;
}
.card-bg-9 {
    background: #b65656;
}
.card-bg-10 {
    background: #a1c470;
}
.card-bg-11 {
    background: #e9b45a;
}
.card-bg-12 {
    background: #40abfcb8;
}
.card-bg-13 {
    background: #e9b45a;
}
.card-bg-14 {
    background: #9a93f4;
}
.align-btn {
    display: flex;
    justify-content: space-between;
}
.btn-color {
    background: var(--bg-color);
    color: var(--text-color);
    border-radius: 20px;
}
.btn-light-br {
    border-radius: 20px;
}
.br-none {
    border: none !important;
}
.dashboard-btn {
    gap: 6px;
    display: flex;
    margin-top: 18px;
}
#attendance_history {
    height: 300px !important;
}

#work-status {
    width: 100%;
    height: 100% !important;
    margin-top: 117px;
}
/* .dataTables_filter{
width: 98%;
} */

.highcharts-figure,
.highcharts-data-table table {
    min-width: 310px;
    max-width: 800px;
    margin: 1em auto;
}

.highcharts-data-table table {
    font-family: Verdana, sans-serif;
    border-collapse: collapse;
    border: 1px solid #ebebeb;
    margin: 10px auto;
    text-align: center;
    width: 100%;
    max-width: 500px;
}

.highcharts-data-table caption {
    padding: 1em 0;
    font-size: 1.2em;
    color: #555;
}

.highcharts-data-table th {
    font-weight: 600;
    padding: 0.5em;
}

.highcharts-data-table td,
.highcharts-data-table th,
.highcharts-data-table caption {
    padding: 0.5em;
}
.highcharts-exporting-group {
    display: none;
}
#container-3d {
    height: auto;
}
#Balance {
    height: auto;
}

.highcharts-data-table thead tr,
.highcharts-data-table tr:nth-child(even) {
    background: #f8f8f8;
}

.highcharts-data-table tr:hover {
    background: #f1f7ff;
}
.card-margin {
    margin-bottom: 13px;
}
.chart-height {
    height: 250px;
}
.height-70 {
    height: 73px;
}
.menuFecture li {
    padding: 0px 10px 0px;
    font-size: 10px;
}
.menuFecture-span {
    display: inline-block;

    width: 10px;
    height: 10px;
    margin-right: 5px;
}
.menuFecture-firstColor {
    background: #fd7e14;
}
.menuFecture-sec {
    background: #f10075;
}
.menuFecture-third {
    background: #0168fa;
}
.fc-Office {
    padding: 10px 10px;
}
.select-border {
    height: 35px;
    padding: 5px 7px;
    font-size: 12px;
    border-radius: 7px;
}
.menuFecture {
    list-style: none;
    justify-content: start;
    margin-top: 10px;
    flex-wrap: wrap;
    padding-left: 0px;
}
.highcharts-title {
    font-size: 15px !important;
}

.pb-15 {
    padding-bottom: 15px;
}
.modal-bg-image {
    background-image: url("../img/new-slider.png") !important;
    background-size: 100% 100%;
}
.off-can {
    margin-bottom: 20px;
}
.table thead tr {
    background: var(--bg-color);
    color: white;
}
button.dt-button,
div.dt-button,
a.dt-button,
input.dt-button {
    padding: 5px 14px !important;
}
.buttons-excel {
    background: #4caf50 !important;
    color: white !important;
    border: none !important;
}
.buttons-pdf {
    background: #dc4c64 !important;
    color: white !important;
    border: none !important;
}
.can-width {
    width: 50% !important;
}

.btn_bg {
    padding: 7px 15px 7px 15px;
}

.add_btn_bg {
    padding: 7px 18px !important;
}

.btn-toltip {
    position: relative;
    margin-right: 19px !important;
}
.btn-toltip:hover span {
    opacity: 1;
    /* transform: translate(-50%, 0); */
}
.btn-toltip span {
    position: absolute;
    left: 50%;
    top: 5px;
    opacity: 0;
    padding: 3px 5px;
    background-color: #1e181ec4;
    border-radius: 3px;
    line-height: 1.6;
    text-align: left;
    display: inline-table;
    white-space: nowrap;
    transform: translate(-50%, 1em);
    transition: all 0.15s ease-in-out;
    color: #ffffff;
    z-index: 99;
}
.full-width {
    width: 80% !important;
}
.form-header {
    background-color: #885896 !important;

    padding: 10px 11px;
    border-radius: 3px;
    margin-bottom: 20px;
}
.form-header h5 {
    color: var(--text-color);
    margin: 0px;
}
.card-margin {
    margin-bottom: 10px;
}
/* .select2-container--default .select2-selection--multiple {

    max-height: 80px;
    overflow-y: auto;
    overflow-x: hidden;
} */
/* .select2-selection__arrow::after {
   content: "▼"; /* Or use a custom Unicode arrow */
/* font-size: 12px;
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    display:none;
  } */
.select2-selection__arrow {
    height: 100%;
    position: absolute;
    top: 0;
    right: 1px;
    width: 20px;
    pointer-events: none;
}
.select2-container--default
    .select2-selection--multiple
    .select2-selection__choice {
    background-color: #885896;
    border: 1px solid #aaa;
}
/* .select2-container {

    width: 100% !important;
} */
.add-btn {
    background: #885896;
    border: 1px solid #885896;
}
.add-btn:hover {
    background: #885896;
    border: 1px solid #885896;
}
label {
    font-weight: 500;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:focus {
    border: 0;
    background-color: #f5b105 !important;
    color: #fff !important;
    border-color: #ffffff !important;
    border-radius: 50%;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: white !important;

    border-radius: 50%;
}
.dataTables_wrapper .dataTables_paginate .next:hover {
    border-radius: 10px !important;
}
/**=====================
    2.21 Loader CSS Start
==========================**/
.loader-wrapper {
    height: 100%;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    background-color: #fff;
    z-index: 11;
    top: 0;
}
.loader-wrapper .loader4 {
    position: relative;
    color: var(--theme-deafult);
    font-size: 50px;
    text-indent: -9999em;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: loader4 1.7s infinite ease,
        loader4Round 1.7s infinite ease;
    animation: loader4 1.7s infinite ease, loader4Round 1.7s infinite ease;
    overflow: hidden;
}

@-webkit-keyframes loader4 {
    0% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,
            0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
            0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    5%,
    95% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,
            0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
            0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    10%,
    59% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,
            -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,
            -0.297em -0.775em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,
            -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,
            -0.297em -0.775em 0 -0.477em;
    }
    20% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,
            -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,
            -0.749em -0.34em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,
            -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,
            -0.749em -0.34em 0 -0.477em;
    }
    38% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,
            -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,
            -0.82em -0.09em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,
            -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,
            -0.82em -0.09em 0 -0.477em;
    }
    100% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,
            0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
            0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
}

@keyframes loader4 {
    0% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,
            0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
            0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    5%,
    95% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,
            0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
            0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    10%,
    59% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,
            -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,
            -0.297em -0.775em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,
            -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,
            -0.297em -0.775em 0 -0.477em;
    }
    20% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,
            -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,
            -0.749em -0.34em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,
            -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,
            -0.749em -0.34em 0 -0.477em;
    }
    38% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,
            -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,
            -0.82em -0.09em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,
            -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,
            -0.82em -0.09em 0 -0.477em;
    }
    100% {
        -webkit-box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,
            0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
            0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
}
@-webkit-keyframes loader4Round {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes loader4Round {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.off-can {
    border-radius: 0px !important;
}

.image-box {
    width: 100%;
    position: absolute;
    bottom: 0px;
    right: 0px;
}

.image-box img {
    width: 100%;
}

.modal-bg-image {
    background-image: url("https://filmcell.mahaitgov.in/img/sidebar_bg2.png");
}

.close-btn {
    color: #ffffff;
}
.select2-container .select2-selection--single {
    height: 38px;
}
.select2-container--default
    .select2-selection--single
    .select2-selection__arrow
    b {
    top: 66%;
    width: 0;
}
.download_table {
    position: absolute;
    top: -11px;
    right: 20px;
}
.ext-text {
    font-size: 12px;
    padding: 4px 12px 4px;
    border: 0px;
}
.vh-100 {
    height: 100% !important;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type="number"] {
    -moz-appearance: textfield;
}
/* .feather_icons.delete-scheme.fa-trash-alt {
    color: #ab0000;
}
.feather_icons.edit-scheme.far.fa-edit {
    color: #009100;
} */
/**=====================
      2.21 Loader CSS Ends
  ==========================**/
@media screen and (min-width: 320px) and (max-width: 800px) {
    .nav-item .nav-link {
        color: #2e2c2c !important;
    }
    .responsive-width {
        width: 180px;
    }
}
label.myErrorClass {
    font-size: 12px;
    color: #a90404;
    display: block;
    margin-bottom: -13px;
    width: 100%;
}
input.myErrorClass,
select.myErrorClass {
    border: 1px solid #a90404 !important;
}
.position-select {
    position: relative;
}
.position-select label.myErrorClass {
    font-size: 12px;
    color: #a90404;
    display: block;
    margin-bottom: -18px;
    position: absolute;
    bottom: 0px;
    display: block;
}
.offcanvas-body {
    height: 80vh;
    padding-bottom: 30px;
}
.wizard > .steps a,
.wizard > .steps a:hover,
.wizard > .steps a:active {
    gap: 5px;
}
.wizard > .steps .current a .number,
.wizard > .steps .current a:hover .number,
.wizard > .steps .current a:active .number {
    border-color: #885896 !important;
    background-color: #885896 !important;
}
.wizard > .steps .current a,
.wizard > .steps .current a:hover,
.wizard > .steps .current a:active {
    color: #000000 !important;
}
/* .navbar-menu-sub .nav-sub-link:hover {
    color: #ffffff;
    background: #885896;
    padding: 2px 5px 2px 3px;
    border-left: 5px solid #dda855;
    border-radius: 3px;
} */
.mb-0 {
    margin-bottom: 0px;
}

.mt-0 {
    margin-top: 0px;
}
.wizard > .actions a,
.wizard > .actions a:hover,
.wizard > .actions a:active {
    background-color: #5d3868 !important;
}
.wizard > .actions .disabled a,
.wizard > .actions .disabled a:hover,
.wizard > .actions .disabled a:active {
    background-color: #97a3b9 !important;
}
.wizard > .content input,
.wizard > .content textarea,
.wizard > .content select {
    font-size: 15px !important;
}
.margin-documet {
    margin-top: 19px;
}
.wizard > .content > .title {
    border-bottom: 1px dashed #ccc;
    padding: 14px 0px;
    margin-bottom: 10px;
}
.ui-accordion-header.ui-state-active {
    background-color: var(--bg-color) !important;
    border-bottom-width: 0;
    color: #ffffff;
}
.ui-accordion-content {
    padding: 20px 20px 20px 20px;
}
.wizard > .steps > ul li + li::before {
    content: "\f061";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 16px;
    color: #b4bdce;
    position: absolute;
    top: 50%;
    left: -26px;
    line-height: 0;
}
.wizard > .steps > ul {
    flex-wrap: wrap;
}

.accordion-body {
    margin-bottom: 10px;
}
.ui-accordion-header ~ .ui-accordion-header {
    margin-top: 10px;
}

.table-x-scroll {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
}
.tab-ys .nav-item .nav-link {
    display: flex;
    align-items: center;
    padding: 19px 25px;
    border-radius: 8px 8px 0px 0px;
    text-decoration: none;
    color: #333;
    background-color: transparent;
    transition: all 0.3s ease;
    font-weight: 500;
}
.tab-ys .active {
    background-color: var(--bg-color) !important;
    z-index: 5;
    color: #ffffff !important;
}
.icon-font-size {
    font-size: 18px;
}
.feather_icons {
    cursor: pointer;
}
.icons-img {
    width: 19px;
    margin-right: 10px;
}
.view-title {
    font-size: 18px;
    margin-bottom: 15px;
    border-bottom: 1px dashed #cccccc;
    padding: 0px 1px 12px;
}
.append-item {
    position: absolute;
    right: 15px;
    top: -15px;
    padding: 3px 9px;
    font-size: 13px;
}
.append-item-btn {
    padding: 3px 12px;
    font-size: 13px;
    margin-right: 4px;
}
.table-dropdown {
    width: 200px;
    margin-left: 5px;
    height: 35px;
    font-size: 13px;
}
.tx-decoretion-underline {
    text-decoration: underline;
    text-align: center;
}
/* .fa-trash-alt{
    background: #b51625;
    color: white;
    padding: 6px 3px;
    border-radius: 3px;
    margin: 0px;
} */

.table tr th {
    background-color: #885896 !important;
    color: #ffffff !important;
}
.summary .disabled-color {
    background: #f1f1f1;
    min-height: 38px;
}
.summary_sub_title {
    /* border-bottom: 1px dashed #ccc; */
    margin-bottom: 13px;
    padding: 0px 0px 4px;
}
.summary_sub_title h5 {
    font-size: 16px;
    color: #6b4c74;
    background: #ededed;
    padding: 10px 7px;
    border-radius: 5px;
}

.add-course-sche .form-control {
    border: 0px solid !important;
}

.form-header h5 {
    font-size: 15px !important;
}
.bg-warning {
    --bs-bg-opacity: 1;
    background-color: rgb(209 152 1) !important;
}
@media print {
    table tr td {
        border: 1px solid;
    }
}
.bg-danger {
    --bs-bg-opacity: 1;
    background-color: rgb(169 3 19) !important;
}
.dashboard-icons img {
    width: 50px;
}

/* .bg-success-light {
    background-color: rgb(205 255 227 / 18%) !important;
}
.bg-danger-light {
    background-color: rgb(205 255 227 / 18%) !important;
}

.bg-warning-light {
    background-color: rgb(255 213 178 / 18%);
}
.bg-info-light {
    background-color: rgb(172 233 255 / 18%) !important;
} */

.room-status .nav-link {
    flex-direction: row;
    height: auto;
    margin-bottom: 12px;
    border: 1px solid #ccc !important;
    padding: 10px 15px 10px;
    /* min-width: 100px; */
    /* max-width: 249px; */
    width: 222px;
    align-items: center;
    justify-content: flex-start;
}
.room-tab-title {
    display: block;
    width: 100%;
    color: #3c3c3c;
}
.image-block img {
    width: 33px;
    margin: 4px auto 0px;
}
.room-status .number {
    font-size: 18px;
    color: #a90313;
}
.room-status .description {
    padding: 0px 0px 0px 20px;
}
.room-status .nav-link.active {
    background-color: #ffffff;
    z-index: 5;
    border: 2px solid #885896 !important;
}
.white-space-space {
    white-space: normal !important;
}
.btn-proceed {
    margin-top: 20px;
}
.checkbox-outer-box {
    line-height: 30px;
}
.checkbox-outer-box .custom-control-label {
    margin-left: 10px;
    font-weight: 400;
}
.grand-total {
    text-align: right;
    background: #f8f4ff;
    padding: 16px 14px;
    border-radius: 6px;
    line-height: 28px;
    display: flex;
    justify-content: space-between;
    margin-top: 18px;
}
.grand-total span {
    font-size: 20px;
    font-weight: 600;
}

.grand-total-price {
    font-size: 21px;
    font-weight: 500;
}

.grand-total-sub {
    text-align: right;
    background: #f8f4ff;
    padding: 10px 14px;
    border-radius: 6px;
    line-height: 28px;
    display: flex;
    justify-content: end;
    gap: 54px;
}
.grand-total-sub span {
    font-size: 17px;
    font-weight: 600;
}
.grand-total-sub-price {
    font-size: 17px;
    font-weight: 500;
}
.wizad-height {
    max-height: 500px;
    overflow: auto;
}
.profile-section {
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
}

.disabled-section {
    pointer-events: none;
    opacity: 0.5;
}

input.customized_error,
select.customized_error,
textarea.customized_error {
    border: 1px solid red !important;
}
.align-item-center {
    align-items: center;
}
.justify-content-center {
    justify-content: center;
}

.table_select
    .select2-container--default
    .select2-selection--multiple
    .select2-selection__choice {
    white-space: normal;
}

/* classroom allocation list pg */
.btn-toltip .tooltip-span {
    padding: 4px 8px;
}

@media (min-width: 992px) {
    .offcanvas-responsive {
        width: 50% !important;
    }
}
@media (max-width: 991px) {
    .offcanvas-responsive {
        width: 100% !important;
    }
}

/* overall dashboard page */
.overall-card {
    box-shadow: 0 10px 30px rgba(13, 10, 24, 0.08);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.overall-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 40px rgba(13, 10, 24, 0.12);
}

/* Training & activities card */
.Notification_box {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* header gradient - deeper -> theme -> soft */
.overall-card-header {
    /* background: linear-gradient(135deg, #331034 0%, #885896 48%, #e8d7f4 100%); */
    background: linear-gradient(135deg, #642266 0%, #885896 48%, #c291df 100%);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 16px 16px 0 0;
}

/* tabs row - compact */
.tabs_upcoming {
    display: flex;
    gap: 8px;
    padding: 8px 12px;
    align-items: center;
    background: #fbfbfc;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

/* small tab buttons */
.tab-button {
    background: #f0f0f2;
    border: none;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 16px;
    cursor: pointer;
    min-width: 76px;
    text-align: center;
    transition: all 0.18s ease;
    color: #333;
}

.tab-button:hover {
    transform: translateY(-1px);
    background: #e8e8eb;
}

/* active tab gradient with theme */
.tab-button.active {
    background: linear-gradient(135deg, #6f3a79 0%, #885896 60%, #b892c9 100%);
    color: #fff;
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.06);
}

/* content body (fixed height, internal scroll) */
.Notification_body {
    display: flex;
    flex-direction: column;
    padding: 12px;
    background: #faf9fb;
    flex: 1;
    gap: 10px;
}

/* each tab panel (full height within .Notification_body) */
.training-tab-content {
    display: none;
    flex-direction: column;
    height: 100%;
}

.training-tab-content.active {
    display: flex;
}

/* scroll container (hidden scrollbar) */
.scroll-container {
    flex: 1;
    max-height: 240px;
    /* fixed internal height so main card won't grow */
    overflow-y: auto;
    -ms-overflow-style: none;
    /* IE/Edge */
    scrollbar-width: none;
    /* Firefox */
}

.scroll-container::-webkit-scrollbar {
    display: none;
}

/* Chrome/Safari */

/* single event card */
.training-item {
    background: #fff;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 6px 18px rgba(17, 14, 28, 0.04);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.training-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 26px rgba(17, 14, 28, 0.06);
}

/* date badge - multi-stop gradient so it's noticeable */
.training-item .date {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    padding: 5px 10px;
    border-radius: 20px;
    color: #fff;
    background: linear-gradient(90deg, #6a2b64 0%, #885896 50%, #c291df 100%);
    align-self: flex-start;
    white-space: nowrap;
}

/* event text */
.event_details {
    margin: 0;
    color: #333;
    font-size: 13px;
    line-height: 1.45;
}

/* bottom area: view button aligned to right */
.view_all {
    display: flex;
    justify-content: flex-end;
    /* aligned to end/right */
    margin-top: 8px;
}

/* small view button that uses theme as part of gradient for contrast */
.view_all .view-all {
    display: inline-block;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
    border-radius: 18px;
    background: linear-gradient(135deg, #885896 0%, #ff7fb6 100%);
    /* purple -> vibrant pink */
    box-shadow: 0 6px 18px rgba(136, 89, 150, 0.12);
    transition: transform 0.16s ease, box-shadow 0.16s ease, opacity 0.16s ease;
}

.view_all .view-all:hover {
    transform: translateY(-2px);
    opacity: 0.96;
}

/* small-screen adjustments */
@media (max-width: 575px) {
    .tab-button {
        padding: 6px 8px;
        min-width: 66px;
        font-size: 11px;
    }

    .date {
        font-size: 11px;
        padding: 4px 8px;
    }

    .view_all .view-all {
        padding: 6px 10px;
        font-size: 11px;
    }
}

/* pending files card */
.pending-files-carousel .custom-card {
    background: #fff;
    border-radius: 12px;
    padding: 15px 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    text-align: center;
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.pending-files-carousel .custom-card h3 {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 8px;
}

.pending-files-carousel .custom-card h6 {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    text-transform: uppercase;
}

.pending-files-carousel .custom-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
}

/* Dots styling */
.pending-files-carousel .owl-dots {
    margin-top: 15px;
    text-align: center;
}

.pending-files-carousel .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    background: #bbb;
    display: block;
    margin: 5px 4px;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.pending-files-carousel .owl-dots .owl-dot.active span {
    background: #5d3868;
    transform: scale(1.2);
}

/* vendor payment view */
.view_file {
    background-color: #fff;
    color: #885896;
    border: 1px solid #885896;
}
.view_file:hover {
    background-color: #885896;
    color: #fff;
}
.view_pg_design .card-header {
    padding: 8px 20px;
    background-color: #f0daf7;
}

/* dashboards common styling */
.dashboard_heading {
    color: #885896;
    font-size: 12px;
}

/* main dashboard css */
/* common redirect icon style */
.redirection_btn_card {
    position: relative;
}
.redirect-icon-link {
    position: absolute;
    bottom: 16px;
    right: 16px;
    color: #6b7280;
    font-size: 1.1rem;
    text-decoration: none;
    transition: color 0.35s cubic-bezier(0.25, 0.8, 0.25, 1),
        text-shadow 0.35s cubic-bezier(0.25, 0.8, 0.25, 1),
        transform 0.35s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 2;
}
.redirect-icon-link i {
    transition: transform 0.35s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.redirect-icon-link:hover {
    color: #6f3f90;
    text-shadow: 0 2px 6px rgba(136, 88, 150, 0.4);
    transform: translate(2px, -2px);
}
.redirect-icon-link:hover i {
    transform: translate(2px, -2px);
}

.main_dashboard .container {
    width: 100%;
    padding: 24px;
}

.main_dashboard header {
    margin-bottom: 18px;
}

.main_dashboard header h1 {
    font-size: 28px;
    margin: 0 0 6px;
}

.main_dashboard header p {
    margin: 0;
    color: var(--muted);
}

/* grid */
.main_dashboard .grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 25px;
}

@media (min-width: 840px) {
    .main_dashboard .grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .main_dashboard .grid .span-2 {
        grid-column: span 2;
    }

    .main_dashboard .grid .span-3 {
        grid-column: span 3;
    }
}

/* Card */
.main_dashboard .card {
    background: var(--card-bg);
    border-radius: var(--radius);
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    backdrop-filter: var(--glass);
    border: 1px solid rgba(15, 23, 42, 0.04);
}

.main_dashboard .card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.04);
}

.main_dashboard .card-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    color: #374151;
}

.main_dashboard .bar {
    width: 8px;
    height: 28px;
    border-radius: 6px;
    display: inline-block;
}

.main_dashboard .card-body {
    padding: 14px 16px;
}

/* scroll list */
.main_dashboard .list-scroll {
    max-height: 200px;
    overflow: auto;
    padding-right: 6px;
}

.main_dashboard .table-scroll {
    max-height: 400px;
    overflow: auto;
}

.main_dashboard .list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
}

.main_dashboard .list-item .left {
    display: flex;
    gap: 10px;
    align-items: center;
}

.main_dashboard .dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block;
}

.main_dashboard .name {
    font-weight: 600;
    color: #374151;
}

/* trend */
.main_dashboard .trend {
    font-weight: 700;
    font-size: 14px;
    margin-right: 8px;
}

.main_dashboard .trend.up {
    color: #15803d;
}

/* green */
.main_dashboard .trend.down {
    color: #b91c1c;
}

/* red */
.main_dashboard .trend.stable {
    color: #6b7280;
}

/* gray */

/* badge */
.main_dashboard .badge {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 13px;
}

/* occupancy */
.main_dashboard .occupancy-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.main_dashboard .occupancy-value {
    font-size: 26px;
    font-weight: 800;
}

.main_dashboard .progress {
    background: #eef2ff;
    height: 12px;
    border-radius: 999px;
    overflow: hidden;
}

.main_dashboard .progress > span {
    display: block;
    height: 100%;
    width: 0%;
    transition: width 0.35s ease;
}

/* progress colors */
.main_dashboard .prog-green {
    background: #16a34a;
}

.main_dashboard .prog-blue {
    background: #9d64b8;
}

.main_dashboard .prog-yellow {
    background: #f59e0b;
}

.main_dashboard .prog-red {
    background: #ef4444;
}

.main_dashboard .prog-vacant {
    background: #e5e7eb;
}

/* select */
.main_dashboard select {
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid #e6e9ef;
    background: #fff;
    font-weight: 600;
}

/* gallery */
.main_dashboard .gallery {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.main_dashboard .gallery img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
    transition: transform 0.25s ease;
}

.main_dashboard .gallery img:hover {
    transform: scale(1.04);
}

/* small text */
.main_dashboard .muted {
    color: var(--muted);
    font-size: 13px;
}

/* small avatar circle for faculty */
.main_dashboard .avatar {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
}

.main_dashboard .avatar.yellow {
    background: linear-gradient(90deg, #facc15, #f97316);
}

.main_dashboard .avatar.gray {
    background: linear-gradient(90deg, #9ca3af, #6b7280);
}

.main_dashboard .avatar.blue {
    background: linear-gradient(90deg, #b388c5, #9d64b8);
}

/* small utilities */
.main_dashboard .flex {
    display: flex;
}

.main_dashboard .center {
    align-items: center;
}

.main_dashboard .between {
    justify-content: space-between;
}

.main_dashboard .gap-2 {
    gap: 8px;
}

.main_dashboard .gap-3 {
    gap: 12px;
}

.main_dashboard .mb-2 {
    margin-bottom: 8px;
}

.main_dashboard .mt-2 {
    margin-top: 8px;
}

/* New styles for additional cards */
.main_dashboard .status-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
}

.main_dashboard .status-progress {
    width: 60%;
    height: 8px;
    background: #eef2ff;
    border-radius: 4px;
    overflow: hidden;
}

.main_dashboard .status-progress-bar {
    height: 100%;
    border-radius: 4px;
}

.main_dashboard .status-count {
    font-weight: 600;
    color: #374151;
}

.main_dashboard .course-completion {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.main_dashboard .completion-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: #f8fafc;
    border-radius: 8px;
}

.main_dashboard .completion-count {
    font-weight: 700;
    font-size: 18px;
    color: #2563eb;
}

.main_dashboard .completion-label {
    font-weight: 600;
    color: #374151;
}

/* Chart containers */
.main_dashboard .chart-container {
    position: relative;
    height: 200px;
    margin-top: 15px;
}

.main_dashboard .chart-toggle {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
}

.main_dashboard .chart-toggle button {
    padding: 6px 12px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
    background: white;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.main_dashboard .chart-toggle button.active {
    background: #9d64b8;
    color: white;
    border-color: #9d64b8;
}

.main_dashboard .chart-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #374151;
}

/* Ongoing Courses Card Styles */
.main_dashboard .ongoing-courses-card,
.main_dashboard .pending-courses-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    /* margin-top: 20px; */
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
}

.main_dashboard .ongoing-courses-card h2,
.main_dashboard .pending-courses-card h2 {
    margin: 0 0 20px;
    font-size: 22px;
    color: #1e3a8a;
    text-align: center;
    letter-spacing: 0.5px;
}

.main_dashboard .tabs {
    display: flex;
    border-bottom: 3px solid #e5e7eb;
    margin-bottom: 15px;
}

.main_dashboard .tab {
    flex: 1;
    padding: 12px;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    border-radius: 10px 10px 0 0;
    transition: background 0.3s, color 0.3s;
    background: #f1f5f9;
    color: #374151;
}

.main_dashboard .tab.active {
    background: #9d64b8;
    color: white;
}

.main_dashboard .tab-content {
    display: none;
    animation: fadeIn 0.5s ease-in-out;
}

.main_dashboard .tab-content.active {
    display: block;
}

.main_dashboard .courses-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    overflow: hidden;
    border-radius: 12px;
}

.main_dashboard .courses-table th,
.main_dashboard .courses-table td {
    padding: 12px;
    text-align: left;
    font-size: 14px;
}

.main_dashboard .courses-table th {
    background: #9d64b8;
    color: #fff;
    font-weight: bold;
}

.main_dashboard .courses-table tbody tr:nth-child(odd) {
    background: #f9fafb;
}

.main_dashboard .courses-table tbody tr:nth-child(even) {
    background: #eef2ff;
}

.main_dashboard .courses-table tbody tr:hover {
    background: #dbeafe;
    transition: background 0.3s ease;
}

.main_dashboard .courses-table td {
    color: #374151;
}

/* Make inner inputs and selects full width */
.main_dashboard .filter-wrapper .form-group {
    width: 100%;
}

/* Ensure Select2 is responsive */
.main_dashboard .select2-container {
    width: 100% !important;
}

/* Area of expertise list page */
.sub-area-row .btn_bg {
    padding: 5px 15px 5px !important;
}

/* APC Proposal code details pg */
/* fixed height select2 container */
.fixed_height_select2_containers
    .select2-container--default
    .select2-selection--multiple {
    max-height: 85px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 5px;
    scrollbar-width: thin;
}

.fixed_height_select2_containers
    .select2-container--default
    .select2-selection--multiple::-webkit-scrollbar {
    width: 6px;
}

.fixed_height_select2_containers
    .select2-container--default
    .select2-selection--multiple::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 10px;
}

.fixed_height_select2_containers
    .select2-container--default
    .select2-selection--multiple::-webkit-scrollbar-track {
    background: transparent;
}

/* common styling */
@media screen and (min-width: 576px) {
    .offcanvas_w75 {
        width: 75% !important;
    }
    .offcanvas_w50 {
        width: 50% !important;
    }
}

/* fixed height submenu */
.new-nav .fixed_height_submenu {
    max-height: 316px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: #b0b0b0 transparent;
}

.new-nav .fixed_height_submenu::-webkit-scrollbar {
    width: 6px;
}

.new-nav .fixed_height_submenu::-webkit-scrollbar-track {
    background: transparent;
}

.new-nav .fixed_height_submenu::-webkit-scrollbar-thumb {
    background-color: #b0b0b0;
    border-radius: 10px;
}

/* advance_expenses_pg */
.advance_expenses_pg .responsive-width.select2-container {
    width: 221px;
}

.advance_expenses_pg .required-asterisk {
    color: #dc3545;
}

.advance_expenses_pg .err_clr {
    color: #dc3545;
    font-weight: bold;
    font-size: 12px;
}

.advance_expenses_pg .validation_error {
    color: #dc3545;
    font-weight: bold;
    font-size: 12px;
    display: block;
    margin-top: 4px;
}

.advance_expenses_pg .is-invalid {
    border-color: #dc3545;
}

.advance_expenses_pg .sub_card {
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    box-shadow: 0 6px 14px rgba(22, 24, 26, 0.06);
}

.advance_expenses_pg .note-box {
    background: #f9f9f9;
    border-left: 4px solid #ddd;
    padding: 12px;
    margin-top: 12px;
}

.advance_expenses_pg .append-item {
    margin-bottom: 10px;
}

.advance_expenses_pg .price-breakup {
    padding: 12px;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    background: #fff;
}

.advance_expenses_pg .total-price {
    font-size: 1.05rem;
}

.advance_expenses_pg .rupee {
    margin-right: 6px;
}

.advance_expenses_pg .right-end-input .input-group {
    justify-content: flex-end;
}

.advance_expenses_pg .text-amount {
    min-width: 120px;
    display: inline-block;
    text-align: right;
}

/* add yrcc pg */
.section-title-yr {
    font-weight: 600;
    font-size: 17px;
    color: #1f2937;
    padding: 0.5rem 0 0.5rem 1rem;
    margin: 1.25rem 0 1rem 0;
    border-left: 4px solid #885896;
    background: #f2edf3;
}

/* view yrcpr pg */
.gallery-item img:hover {
    opacity: 0.8;
    transform: scale(1.05);
    transition: all 0.3s ease;
}

.view_img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 5px;
}

.video-item video:hover {
    opacity: 0.8;
    transition: all 0.3s ease;
}

.status_badge {
    font-size: 12px !important;
    padding: 6px 9px !important;
}

/* common class for Removing vertical scrollbar but keep horizontal scrollbar --> dt-horizontal-only */
.dt-horizontal-only .dataTables_scrollBody {
    overflow-y: hidden !important;
}
/* Pending - light blue */
table.dataTable tbody tr.row-pending {
    background-color: #e8f1ff !important;
}

/* In Process - light red */
table.dataTable tbody tr.row-inprocess {
    background-color: #ffe8e8 !important;
}

/* Approved - light green */
table.dataTable tbody tr.row-approved {
    background-color: #e8f8ee !important;
}

/* success modal styling */
#successModal .success-modal {
    border-radius: 16px;
}
.success-animated-icon {
    animation: scaleIn 0.35s ease-out forwards;
    width: 76px;
    height: 76px;
}

.success-animated-icon .checkmark {
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
    animation: drawCheck 0.45s ease-out forwards 0.15s;
}

@media (max-width: 576px) {
    #successModal .modal-dialog {
        max-width: calc(100% - 24px);
        margin: 12px;
    }
    .success-animated-icon {
        width: 66px !important;
        height: 66px !important;
    }
}

@keyframes drawCheck {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes scaleIn {
    from {
        transform: scale(0.85);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Inquiry summary page */
.inquiry-summary-pg .profile-section {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
}

.inquiry-summary-pg .profile-section:hover {
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.15);
}

.inquiry-summary-pg .inquiry-id {
    font-size: 12px;
}

.inquiry-summary-pg .page-title {
    font-size: 28px;
    color: #662d91;
    text-align: center;
    margin: 20px 0;
    font-weight: 600;
}

.inquiry-summary-pg .info-row {
    margin-bottom: 12px;
}

.inquiry-summary-pg .info-label {
    font-weight: 600;
    margin-bottom: 4px;
}

.inquiry-summary-pg .info-value {
    margin-bottom: 16px;
}

.inquiry-summary-pg .total-row {
    font-weight: bold;
    font-size: 16px;
    background-color: #f8f9fa;
    border-top: 2px solid #dee2e6;
}

.inquiry-summary-pg .section-header {
    font-size: 14px;
}

.inquiry-summary-pg .main-total td {
    font-size: 14px;
}

.inquiry-summary-pg .terms-container {
    margin: 25px 0;
    padding: 15px;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.inquiry-summary-pg .terms-checkbox {
    width: 18px;
    height: 18px;
    accent-color: #885896;
    cursor: pointer;
    margin-right: 10px;
    vertical-align: middle;
}

.inquiry-summary-pg .terms-label {
    font-size: 14px;
    cursor: pointer;
    vertical-align: middle;
}

.inquiry-summary-pg .terms-link {
    color: #885896;
    font-weight: 500;
}

.inquiry-summary-pg .terms-link:hover {
    color: #622475;
    text-decoration: underline;
}

.inquiry-summary-pg .btn-submit,
.inquiry-summary-pg .btn-download {
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    margin: 0 10px;
    min-width: 160px;
}

.inquiry-summary-pg .btn-submit:hover:not(:disabled),
.inquiry-summary-pg .btn-download:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.inquiry-summary-pg .btn-submit:disabled,
.inquiry-summary-pg .btn-download:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    background-color: #6c757d;
    color: #fff;
}


.duration-session-wrapper {
    background-color: #fdfdfd;
    border-radius: 6px;
}

.duration-session-wrapper:hover {
    background-color: #f8fafc;
}

.custom-control-label {
    cursor: pointer;
}


/* Common CSS for phase-I & II */

/* To solve datatable scroll-x issue & increase height of rows. */
/* When table has dt-scroll-x-only, affect its DataTable wrapper to give horizontal scrollbar */
.dataTables_wrapper:has(.dt-scroll-x-only) .dataTables_scrollBody {
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

/* Increased Row height */
.dataTables_wrapper:has(.dt-scroll-x-only) tbody td {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
    vertical-align: middle;
}