body {
    font-family: 'Inter', sans-serif;
}

/* Custom styles for responsive navigation */
@media (max-width: 768px) {
    #nav-content {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: rgb(31 41 55); /* Matches bg-gray-800 */
        padding: 1rem;
        flex-direction: column;
        z-index: 50;
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    }
    
    #nav-content:not(.hidden) {
        display: flex;
    }
    
    #nav-user-info {
        background-color: transparent !important;
        justify-content: space-between !important;
    }
    
    #user-avatar-container {
        margin-right: 0.75rem !important; /* Ensures mr-3 is consistent */
    }
}

@media (min-width: 768px) {
    #nav-user-info {
        justify-content: flex-start !important;
    }
}