/**
 *
 * You can write your CSS code here, DO NOT touch the default JavaScript file
 * because it will make it harder for you to update.
 *
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

body {
  background-color: #ececec;
  font-size: 12px;
  font-weight: 400;
  font-family: "Inter", sans-serif;
  color: #000000; 
}

.loader-wrapper{
    position: absolute;
    left: 0;
    top: 0;
}

.loader-1 {
    height: 32px;
    width: 32px;
    -webkit-animation: loader-1-1 4.8s linear infinite;
    animation: loader-1-1 4.8s linear infinite;
}

@-webkit-keyframes loader-1-1 {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes loader-1-1 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loader-1 span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 32px;
    width: 32px;
    clip: rect(0, 32px, 32px, 16px);
    -webkit-animation: loader-1-2 1.2s linear infinite;
    animation: loader-1-2 1.2s linear infinite;
}

@-webkit-keyframes loader-1-2 {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(220deg);
    }
}

@keyframes loader-1-2 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(220deg);
    }
}

.loader-1 span::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 32px;
    width: 32px;
    clip: rect(0, 32px, 32px, 16px);
    border: 3px solid var(--primary);
    border-radius: 50%;
    -webkit-animation: loader-1-3 1.2s cubic-bezier(0.770, 0.000, 0.175, 1.000) infinite;
    animation: loader-1-3 1.2s cubic-bezier(0.770, 0.000, 0.175, 1.000) infinite;
}

@-webkit-keyframes loader-1-3 {
    0% {
        -webkit-transform: rotate(-140deg);
    }

    50% {
        -webkit-transform: rotate(-160deg);
    }

    100% {
        -webkit-transform: rotate(140deg);
    }
}

@keyframes loader-1-3 {
    0% {
        transform: rotate(-140deg);
    }

    50% {
        transform: rotate(-160deg);
    }

    100% {
        transform: rotate(140deg);
    }
}


.loader-1.center {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}

.caret-off::before {
    display: none;
}

.caret-off::after {
    display: none;
}

.modal-xl{
    max-width: 95%;
}

.main-sidebar::-webkit-scrollbar {
    width: 5px !important;
    height: 4px !important;
}

/* Track */
.main-sidebar::-webkit-scrollbar-track {
    background: #f1f1f1 !important;
}

/* Handle */
.main-sidebar::-webkit-scrollbar-thumb {
    background: var(--secondary) !important;
}

/* Handle on hover */
.main-sidebar::-webkit-scrollbar-thumb:hover {
    background: #555 !important;
}
.import-preview-form table th, .import-preview-form table td{
    border: 1px solid #dee2e6!important;
}
/* Sidebar Base Styles */
.main-sidebar .sidebar-menu {
    width: 100%;
}

/* Navigation Item Styling */
.main-sidebar .sidebar-menu li.nav-item {
    width: 100%;
    margin: 0;
    transition: all 0.3s ease;
}

/* Dropdown and Submenu Styles */
.main-sidebar .sidebar-menu .sidebar-collapse li a {
    display: flex;
    align-items: center;
    position: relative;

    height: 50px;
    padding: 0 20px;

    color: white;
    background-color: #2c304f;
    text-decoration: none;

    letter-spacing: 0.5px;
    transition: background-color 0.3s ease, padding 0.3s ease;
}

.main-sidebar .sidebar-menu li a {
    letter-spacing: 0.5px;
}

/* Hover Effect */
.main-sidebar .sidebar-menu .sidebar-collapse li a:hover {
    background-color: rgba(103, 119, 239, 0.1);
}

/* Icon Styling */
.main-sidebar .sidebar-menu .sidebar-collapse li a i {
    margin-right: 10px;
    color: white;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.main-sidebar .sidebar-menu .sidebar-collapse li a:hover i {
    opacity: 1;
}

/* Sidebar Mini Mode Adjustments */
.sidebar-mini .main-sidebar .sidebar-menu .sidebar-collapse li a {
    justify-content: center;
    padding: 0 10px;
}

.sidebar-mini .main-sidebar .sidebar-menu .sidebar-collapse li a span {
    display: none;
}

.sidebar-mini .main-sidebar .sidebar-menu .sidebar-collapse li a i {
    margin-right: 0;
    font-size: 1rem; /* Increased icon size */
    width: 100%; /* Ensure icon takes full width */
    text-align: center; /* Center the icon */
}

/* Menu Header Styling */
.main-sidebar .sidebar-menu li.menu-header:not(:first-child){
    padding: 8px 15px;
    color: #ffffff;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1.3px;
    font-weight: 600;
}

/* Active State Styling */
body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu .sidebar-collapse > li.active > a {
    padding-left: 16px;
    background-color: transparent;
    position: relative;
}

body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu .sidebar-collapse > li.active > a:before,
.main-sidebar .sidebar-menu .sidebar-collapse li.nav-item.active > a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 25px;
    width: 4px;
    background-color: #6777ef;
}

/* Sidebar Mini Active State */
.sidebar-mini .main-sidebar .sidebar-menu .sidebar-collapse li.nav-item.active a,
.sidebar-mini .main-sidebar .sidebar-menu .sidebar-collapse li.nav-item.active a.nav-link {
    border-radius: 8px;
    height: 45px;
    padding: 0;
    justify-content: center;
    color: white;
}

/* Tooltip Support */
/* Ensure dropdown toggle is fully clickable in mini sidebar */
.sidebar-mini .main-sidebar .sidebar-menu .nav-item.dropdown {
    position: relative;
}

.sidebar-mini .main-sidebar .sidebar-menu .nav-link.dropdown-toggle {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

/* Add a larger hit area for the dropdown toggle */
.sidebar-mini .main-sidebar .sidebar-menu .nav-link.dropdown-toggle::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

/* Tooltip positioning for dropdown in mini mode */
.sidebar-mini .main-sidebar .sidebar-menu .nav-item.dropdown .dropdown-toggle[data-toggle="tooltip"] {
    position: relative;
}

body.sidebar-mini .main-sidebar .sidebar-menu > li.nav-item.dropdown{
    padding-bottom: 0;
}

.nav-link.dropdown-toggle[aria-expanded="true"]::after {
    transform: rotate(180deg);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .main-sidebar .sidebar-menu .sidebar-collapse li a {
        padding: 0 15px;
    }
}
/*# sourceMappingURL=custom.css.map */

.dataTables_wrapper{
    font-size: 12px!important;
}