@media (max-width: 992px) {
    /* إخفاء user-name-div من مكانه الأصلي */
    .user-name-div , .mobile-user-section {
        display: none !important;
    }




    /* زر المستخدم في الموبايل */
    .nav-items .mobile-user-section .user-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        width: 100%;
        padding: 10px 20px;
        background: rgba(255, 255, 255, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.3);
        border-radius: 50px;
        color: white;
        text-decoration: none;
        font-size: 14px;
        transition: all 0.3s ease;
        cursor: pointer;
    }

    /* القائمة المنسدلة للمستخدم في الموبايل */
    .nav-items .mobile-user-section .dropdown-menu {
        position: static !important;
        transform: none !important;
        width: 100%;
        background: rgba(0, 0, 0, 0.95);
        border: 1px solid rgba(255, 255, 255, 0.15);
        margin-top: 10px;
        border-radius: 10px;
        overflow: hidden;
        display: none;
    }

    .nav-items .mobile-user-section .dropdown-menu.show {
        display: block !important;
    }

    /* نفس التنسيق للقوائم الرئيسية */
    .nav-items .wrap .dropdown-menu {
        position: static !important;
        float: none !important;
        width: 100% !important;
        margin: 5px 0 !important;
        border: 1px solid var(--border-color);
        box-shadow: none !important;
        transform: none !important;
        display: none;
        background: var(--card-color);
    }

    .nav-items .wrap .dropdown-menu.show {
        display: block !important;
    }
}

@media screen and (max-width: 768px) {
    nav .container .nav-items .wrap {
        flex-direction: column;
        gap: 1rem !important;
    }
    .py-5 {
        padding-top: 6rem !important;
        padding-bottom: 3rem !important;
    }
    .nav-items
    {
        z-index:-1;
    }
}