	.navbar-nav {
		display: flex; /* Enable Flexbox */
		align-items: center; /* Vertically align children */
		justify-content: center; /* Keep menu items centered */
		flex-wrap: wrap; /* Allow buttons to wrap to the next line if needed */
		padding-right: 50px; /* Reserve 90px on the right for the offcanvas button */
	}

    .navbar-nav > a.nav-link {
        flex: 1;
        text-align: center;
        margin: 0;
        padding: 10px 5px;
		max-width: 120px; /* Limit the maximum width */
    }
	
    /* Style for active menu item */
    .nav-link.active {
        position: relative;
        font-weight: bold;
    }
    .nav-link.active::after {
        content: '';
        position: absolute;
        bottom: -4px;
        left: 50%;
        transform: translateX(-50%);
        width: 60%;
        height: 3px;
        background-color: #007bff;
    }

    /* Smaller font for menu text */
    .nav-link span {
        font-size: 0.85rem;
    }

    /* Center icon above text */
    .nav-link i {
        display: block;
        font-size: 1.5rem;
    }

    /* Make the always-visible items uniform in width */
    .navbar-nav.d-flex > a {
        flex: 1;
        border: 1px solid transparent;
    }

    /* Adjust for smaller screens */
    @media (max-width: 767px) {
        .nav-link span.d-md-inline {
            display: none;
        }
        .nav-link span.d-inline {
            display: inline;
        }
    }

    /* Add hover effect */
    .nav-link:hover {
        color: #007bff;
        background-color: #e9ecef;
        border-radius: 5px;
    }



/* Adjustments for the user dropdown menu */

/* Center icons and text in navbar items */
.navbar-nav > a.nav-link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 10px 5px;
}

/*****/
/* Offcanvas background and spacing */
.offcanvas {
    position: fixed;
    top: 0;
    right: -300px;
    width: 250px;
    height: 100%;
    background-color: #f8f9fa;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.1);
    z-index: 1050;
    transition: right 0.3s ease-in-out;
}

.offcanvas.show {
    right: 0; /* Slide the menu in */
}

.offcanvas-header {
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ddd;
}

.offcanvas-body {
    padding: 15px;
    overflow-y: auto;
}


/* Default style for the off canvas user button */

.offcanvas-btn-circle {
    width: 50px; /* Circular button width */
    height: 50px; /* Circular button height */
    border-radius: 50%; /* Makes the button circular */
    background-color: #007bff; /* Primary blue background */
    color: #fff; /* White icon */
    display: flex; /* Flexbox for alignment */
    align-items: center; /* Vertically center icon */
    justify-content: center; /* Horizontally center icon */
    border: none; /* Remove border */
    padding: 0; /* Remove padding that could offset alignment */
}

.offcanvas-btn-circle i {
    font-size: 1.2rem; /* Icon size */
    margin: 0; /* Remove any default margins */
}
