/* Responsive Profile Tab Fix */

/* Ensure profile tabs don't overlap with other elements */
.profile-tabs {
    position: relative;
    z-index: 1;
    flex-wrap: wrap;
}

/* Ensure user dropdown doesn't interfere with profile content */
.user-dropdown {
    z-index: 1000;
}

/* Medium screens */
@media (max-width: 1024px) {
    .profile-tab {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
    
    .profile-tabs {
        gap: 0.25rem;
    }
}

/* Small screens */
@media (max-width: 768px) {
    .profile-tabs {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }
    
    .profile-tab {
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* Very small screens */
@media (max-width: 480px) {
    .profile-tabs {
        grid-template-columns: 1fr;
    }
    
    .profile-tab {
        width: 100%;
    }
}

/* Ensure proper spacing in profile mode */
.mode-content.profile-mode {
    position: relative;
    overflow: visible;
}

/* Prevent accidental clicks by ensuring proper spacing */
.profile-header {
    margin-bottom: 2rem;
}

/* Fix potential button overlap issues */
.dropdown-item {
    position: relative;
    z-index: auto;
}

/* Ensure logout button doesn't extend beyond dropdown */
#logoutBtn {
    width: 100%;
    box-sizing: border-box;
}