/* ============ desktop view .start// ============ */
@media all and (min-width: 992px) {

    .dropdown-menu li {
      position: relative;
    }

    .dropdown-menu .submenu {
      display: none;
      position: absolute;
      right: 100%;
      top: -7px;
    }

    .dropdown-menu .submenu-left {
      left: 100%;
      right: auto;
    }

    .dropdown-menu>li:hover {
      background-color: #f1f1f1
    }

    .dropdown-menu>li:hover>.submenu {
      display: block;
    }
  }

  /* ============ desktop view .end// ============ */

      /* ============ small devices ============ */
      @media (max-width: 991px) {

        .dropdown-menu {
          margin-left: 0.7rem;
          margin-right: 0.7rem;
          margin-bottom: .5rem;
        }
  
        .logo {
          max-width: 75%;
        }
  
        .title {
          /* font-size:25px !important; */
          margin-top: 10px;
        }
     
      }
      /* ============ small devices .end// ============ */
      
 .scrollable-menu {
    display: block;
    max-height: 200px; /* ارتفاع پیش‌فرض */
    overflow-y: auto; /* اسکرول بار عمودی */
    transition: max-height 0.3s ease-out; /* انتقال انیمیشن */
    scrollbar-width: thin; /* برای مرورگرهای فایرفاکس */
    scrollbar-color: #888 #f1f1f1; /* برای مرورگرهای فایرفاکس */
}

/* برای مرورگرهای وبکیت مانند کروم و سافاری */
.scrollable-menu::-webkit-scrollbar {
    width: 8px;
}

.scrollable-menu::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.scrollable-menu::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.scrollable-menu::-webkit-scrollbar-thumb:hover {
    background: #555;
}    



/* استایل کلی برای منو و زیرمنوها */
.nav-item.dropdown .dropdown-menu {
    background-color: #f8f9fa; /* رنگ پس‌زمینه پیش‌فرض */
    border: 1px solid #ddd; /* حاشیه برای جداسازی بهتر */
}

/* استایل برای زیرمنوها */
.nav-item.dropdown .dropdown-menu .submenu {
    background-color: #e9ecef; /* رنگ پس‌زمینه روشن‌تر برای زیرمنوها */
}

/* استایل برای آیتم‌های منو و زیرمنوها */
.nav-item.dropdown .dropdown-menu .dropdown-item {
    color: #333; /* رنگ متن پیش‌فرض */
    padding: 8px 16px; /* فاصله داخلی برای بهتر دیده شدن */
}

/* استایل برای آیتم‌های منو و زیرمنوها هنگام هاور */
.nav-item.dropdown .dropdown-menu .dropdown-item:hover {
    background-color: #007bff; /* رنگ آبی برای هاور */
    color: #fff; /* رنگ متن سفید هنگام هاور */
}

/* استایل برای منو و زیرمنوها وقتی باز هستند */
.nav-item.dropdown.show .dropdown-menu {
    background-color: #343a40; /* رنگ تیره برای پس‌زمینه */
}

.nav-item.dropdown.show .dropdown-menu .dropdown-item {
    color: #fff; /* رنگ متن سفید وقتی منو باز است */
}

.nav-item.dropdown.show .dropdown-menu .dropdown-item:hover {
    background-color: #495057; /* رنگ تیره‌تر برای هاور */
    color: #fff;
}

/* استایل برای زیرمنوها وقتی باز هستند */
.nav-item.dropdown.show .dropdown-menu .submenu {
    background-color: #2d3338; /* رنگ تیره‌تر برای زیرمنوها */
}

/* استایل برای اسکرول بار */
.scrollable-menu {
    max-height: 200px; /* ارتفاع حداکثر برای اسکرول */
    overflow-y: auto; /* فعال‌سازی اسکرول عمودی */
}

.scrollable-menu::-webkit-scrollbar {
    width: 8px; /* عرض اسکرول بار */
}

.scrollable-menu::-webkit-scrollbar-track {
    background: #f1f1f1; /* رنگ پس‌زمینه اسکرول بار */
}

.scrollable-menu::-webkit-scrollbar-thumb {
    background: #888; /* رنگ اسکرول بار */
    border-radius: 4px; /* گردی گوشه‌ها */
}

.scrollable-menu::-webkit-scrollbar-thumb:hover {
    background: #555; /* رنگ اسکرول بار هنگام هاور */
}