/* Sidebar */
#sidebar {
    height: 100vh;
    background-color: #343a40;
    color: white;
    padding: 15px;
    position: fixed;
    top: 0;
    left: 0;
    width: 250px;
    overflow-x: hidden;
    transition: all 0.3s ease-in-out; /* Smooth transition */
    z-index: 1000; /* Ensure it's above other elements */
}

#sidebar .nav-link {
    color: white;
}

#sidebar .nav-link:hover {
    background-color: #495057;
}

.nav-link {
    display: flex;
    align-items: center; /* Align icons and text */
    gap: 10px; /* Adjust spacing between icon and text */
    font-size: 14px; /* Adjust text size */
}

.nav-link i {
    width: 20px; /* Set a fixed width for icons */
    text-align: center;
    margin-right: 8px;
}

/* Content */
#content {
    margin-left: 250px; /* Matches sidebar width */
    padding: 20px;
    width: calc(100% - 250px);
    transition: all 0.3s ease-in-out;
    margin-top: 35px;
}

/* Sidebar Collapsed */
.sidebar-collapsed {
    width: 0;
    padding: 0;
    overflow: hidden;
}

.content-expanded {
    margin-left: 0 !important;
    width: 100% !important;
}
.settings-menu .nav-link {
    font-size: 0.7rem; /* Adjust size as needed */
    padding: 5px 10px;
}
#ratesMenu .nav-link {
    font-size: 0.7rem !important; /* Reduce text size */
    padding: 5px 10px;
}

/* Global Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
 #sidebarToggle {
        top: 15px;
        left: 15px;
        z-index: 1050;
    }

/* Responsive Fix */
@media (max-width: 768px) {
    #sidebar {
        width: 200px;
        left: -200px; /* Hide sidebar by default */
    }

    #content {
        margin-left: 0;
        width: 100%;
        margin-top: 35px;
    }

    /* When sidebar is open */
    .sidebar-open {
        left: 0 !important;
    }

    .content-shift {
        margin-left: 200px !important;
        width: calc(100% - 200px) !important;
    }
}