#mobileMenu.open {
    transform: translateX(0);
}

.nav-item {
    position: relative;
}

.dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 180px;
    background: rgba(0,0,0,0.95);
    border: 1px solid rgba(255, 251, 251, 0.185);

    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: 0.2s ease;
}

html[dir="rtl"] .dropdown {
    left: auto;
    right: 0;
}

.nav-item:hover .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.mobile-dropdown {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}