/* New text menu styles */
.text-menu-items {
    display: flex;
    align-items: center;
    gap: 10px; /* Space between links */
    justify-content: flex-end; /* Push to the right */
    width: 100%; /* Take full width of parent (#main-app-wrapper) */
    box-sizing: border-box; /* Include padding in width calculation */
    margin-top:20px;
    margin-bottom: 0 !important; /* This will remove the margin from mb-4 */
}

.text-menu-items .nav {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}

.text-menu-items .nav-item {
    /* No specific styles needed here unless you want to override Bootstrap's li defaults */
}

.text-menu-link {
    font-size: 13px; /* Small font size, e.g., 14px */
    color: #077d3c; /* Default text color (gray-800) for non-active links */
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.2s, color 0.2s;
    white-space: nowrap; /* Prevent wrapping */
    margin-right: 20px !important;
    font-weight: normal;
}

/* NEW STYLES FOR PROFILE PICTURE IN NAV BAR */
        .profile-pic-nav {
            width: 30px; /* Small size for nav bar */
            height: 30px; /* Small size for nav bar */
            border-radius: 50%; /* Make it circular */
            object-fit: cover; /* Ensure image covers the area without distortion */
            margin-right: 35px; /* Space between picture and "Hello" text */
            border: 1px solid #ccc; /* Optional: subtle border */
            vertical-align: middle; /* Align with text */
        }
        /* Style for the container of the picture and name if you want them together */
        .user-greeting {
            display: flex;
            align-items: center;
            padding: 5px 10px;
            color: #333;
            white-space: nowrap;
        }
        
#signInLink {
    margin-right: 35px !important;
    font-weight: normal !importants;
    font-size: 13px;
}

#signInLink:hover {

}