﻿ 
.navbar-toggler {
    width: 50px;
    height: 50px;
    padding: 0;
    border-radius: 50%;
    transition: 0.3s ease-in-out;
    flex-shrink: 0;
}

.navbar-toggler:focus {
    box-shadow: none;
}
 
/* Styling for navbar */
.navbar-nav .dropdown-menu {
    /*border: none;*/ /* Remove border */
    /*box-shadow: none;*/ /* Remove shadow */
}

.navbar-nav .dropdown-menu .dropdown-item {
    padding: 0.5rem 1rem; /* Adjust padding */
    color: #212529; /* Text color */
}

    .navbar-nav .dropdown-menu .dropdown-item:hover {
        background-color: #f8f9fa; /* Hover background color */
    }

.navbar-nav .dropdown-menu .dropdown-divider {
    margin: 0.5rem 0; /* Adjust margin */
    border-color: #dee2e6; /* Divider color */
}

.nav-item .badge-container {
    position: absolute;
    top: -10px; /* Adjust this value to move the badge vertically */
    left: 85%; /* Center the badge horizontally */
    transform: translateX(-50%); /* Center the badge horizontally */
    z-index: 1; /* Ensure the badge stays on top */
}

.nav-item .badge {
    font-size: 0.75em; /* Adjust the font size as needed */
    padding: 0.25em 0.5em; /* Adjust the padding as needed */
}


 


@media screen and (max-width: 991px) {
    .navbar-collapse.collapse:not(.show) {
        display: block;
    }

    .navbar-collapse {
        position: fixed;
        top: 0;
        left: 0;
        background: #f8f9fa;
        width: 215px;
        height: 100%;
        z-index: 9999;
        padding: 15px;
        transform: translateX(-215px);
        transition: 0.5s ease-in-out;
        display: block;
    }

        .navbar-collapse.show {
            transform: translateX(0px);
        }

    .nav-overlay {
        position: absolute;
        background: #0000007d;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        z-index: 2;
        transform: translateX(-100vw);
        transition: 0.5s ease-in-out;
        display: block;
    }

        .nav-overlay.active {
            transform: translateX(0);
        }
}
 