/* Fix for navbar overlap issue */
body {
    /*padding-top: 56px !important;*/
}

/* Main layout flex container */
.main-layout {
    display: flex;
}

/* Sidebar styling */
.sidebar {
    width: 250px;
    min-height: calc(100vh - 56px);
    margin-top: 0 !important;
}

.sidebar .p-3 {
    margin-top: 20px;
}

/* Content area styling */
.content-area {
    flex-grow: 1;
    min-width: 0;
    margin-left: 20px;
}

/* Ensure sidebar starts below navbar */
.sidebar-desktop {
    position: fixed !important;
    top: 56px !important;
    left: 0 !important;
    height: calc(100vh - 56px) !important;
    overflow-y: auto !important;
    z-index: 1020 !important;
}

/* Ensure dropdown menu appears above everything */
.dropdown-menu {
    z-index: 1050 !important;
    position: absolute !important;
}

/* Fix dropdown toggle */
.dropdown-toggle::after {
    display: inline-block !important;
    margin-left: 0.255em !important;
    vertical-align: 0.255em !important;
    content: "" !important;
    border-top: 0.3em solid !important;
    border-right: 0.3em solid transparent !important;
    border-bottom: 0 !important;
    border-left: 0.3em solid transparent !important;
}

/* Adjust main content area */
.col-lg-10 .p-4 {
    padding-top: 2rem !important;
}

.cust-gap {
    margin-top: 50px; /* Default gap */
}

/* For screens smaller than 600px (mobile screens) */
@media (max-width: 990px) {
    
}
    
/* Fix for mobile view */
@media (max-width: 991px) {
    body {
        padding-top: 56px !important;
    }
    .cust-gap {
            margin-top: 0px; /* Reduced gap for smaller screens */
        }
    .sidebar-desktop {
        position: relative !important;
        top: 0 !important;
        height: auto !important;
    }
}

/* Ensure navbar stays on top */
.navbar.fixed-top {
    z-index: 1030 !important;
}

/* Fix for sidebar on desktop */
@media (min-width: 992px) {
    .col-lg-2 {
        position: fixed !important;
        top: 70px !important;
        left: 0 !important;
        height: calc(100vh - 70px) !important;
        overflow-y: auto !important;
    }

    .col-lg-10 {
        margin-left: 16.666667% !important;
    }
}