@media (min-width: 768px) {
  /* =========================================
     استایل منوی دسکتاپ (تم دارک و RTL)
     ========================================= */
  
  /* کانتینر اصلی منو */
  #desktop-main-menu.desktop-menu {
      display: flex;
      flex-direction: row;
      list-style: none;
      margin: 0;
      padding: 0;
      direction: rtl;
  }
  
  /* آیتم‌های سطح اصلی */
  #desktop-main-menu > li {
      position: relative;
  }
  
  /* لینک‌های سطح اصلی */
  #desktop-main-menu > li > a {
      display: flex;
      align-items: center;
      padding: 18px 18px;
      color: #e0e0e0;
      text-decoration: none;
      font-size: 15px;
      font-weight: 500;
      transition: all 0.3s ease;
      border-bottom: 3px solid transparent;
  }
  
  /* افکت هاور و فعال برای سطح اصلی */
  #desktop-main-menu > li > a:hover,
  #desktop-main-menu > li:hover > a {
      color: #ffffff;
      background-color: rgba(255, 255, 255, 0.05);
  }
  
  /* آیتم فعال (صفحه جاری) */
  #desktop-main-menu > li.current-menu-item > a,
  #desktop-main-menu > li.current_page_item > a {
      color: rgb(228 170 63 / var(--tw-text-opacity, 1)); /* رنگ آبی روشن برای تمایز */
      border-bottom-color: rgb(228 170 63 / var(--tw-text-opacity, 1));
      background-color: rgba(77, 171, 247, 0.08);
  }
  
  /* آیکون فلش رو به پایین برای آیتم‌های دارای زیرمنو (سطح ۱) */
  #desktop-main-menu > li.menu-item-has-children > a::after {
      content: '';
      display: inline-block;
      width: 7px;
      height: 7px;
      border-left: 2px solid #888;
      border-bottom: 2px solid #888;
      transform: rotate(-45deg);
      margin-right: 8px;
      transition: transform 0.3s ease, border-color 0.3s ease;
  }
  
  #desktop-main-menu > li.menu-item-has-children:hover > a::after {
      transform: rotate(135deg);
      border-color: rgb(228 170 63 / var(--tw-text-opacity, 1));
  }
  
  /* =========================================
     استایل زیرمنوها (Dropdown)
     ========================================= */
  
  #desktop-main-menu .sub-menu {
      position: absolute;
      top: 100%;
      right: 0;
      min-width: 240px;
      background-color: #25252b; /* کمی روشن‌تر از پس‌زمینه اصلی برای کنتراست */
      border-radius: 10px;
      box-shadow: 0 15px 40px rgba(0, 0, 0, 0.6);
      list-style: none;
      margin: 0;
      padding: 8px 0;
      
      /* انیمیشن باز شدن */
      opacity: 0;
      visibility: hidden;
      transform: translateY(15px);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      z-index: 10000;
  }
  
  /* نمایش زیرمنو هنگام هاور روی والد */
  #desktop-main-menu li:hover > .sub-menu {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
  }
  
  /* آیتم‌های داخل زیرمنو */
  #desktop-main-menu .sub-menu li {
      position: relative;
      margin: 0;
  }
  
  #desktop-main-menu .sub-menu a {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 12px 20px;
      color: #b0b0b0;
      text-decoration: none;
      font-size: 14px;
      font-weight: 400;
      transition: all 0.2s ease;
      border-right: 3px solid transparent;
  }
  
  /* افکت هاور روی آیتم‌های زیرمنو */
  #desktop-main-menu .sub-menu a:hover {
      color: #ffffff;
      background-color: rgba(255, 255, 255, 0.06);
      padding-right: 26px; /* حرکت جزئی به چپ برای حس تعامل */
      border-right-color: rgb(228 170 63 / var(--tw-text-opacity, 1));
  }
  
  /* =========================================
     استایل زیرمنوهای سطح ۲ و عمیق‌تر (باز شدن به سمت چپ)
     ========================================= */
  
  #desktop-main-menu .sub-menu .sub-menu {
      top: -8px; /* تراز عمودی زیباتر */
      right: 100%; /* باز شدن به سمت چپ در حالت RTL */
      margin-right: 8px; /* فاصله کوچک از منوی والد */
  }
  
  /* آیکون فلش رو به چپ برای زیرمنوهای سطح ۲ به بعد */
  #desktop-main-menu .sub-menu .menu-item-has-children > a::after {
      transform: rotate(45deg); /* فلش به سمت چپ اشاره می‌کند */
      margin-right: auto; /* انتقال فلش به سمت چپ لینک */
      margin-left: 0;
  }
  
  #desktop-main-menu .sub-menu .menu-item-has-children:hover > a::after {
      border-color: rgb(228 170 63 / var(--tw-text-opacity, 1));
  }
  
  /* حذف حاشیه و استایل‌های اضافی پیش‌فرض مرورگر */
  #desktop-main-menu ul {
      list-style: none;
      margin: 0;
      padding: 0;
  }
}
/* تنظیمات کلی منو در موبایل */
@media (max-width: 768px) {
    #desktop-main-menu.desktop-menu {
        list-style: none;
        margin: 0;
        padding: 0;
        direction: rtl;
        background-color: #121212; /* پس‌زمینه اصلی تیره */
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    }

    /* آیتم‌های اصلی منو */
    #desktop-main-menu > li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    #desktop-main-menu a {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px;
        color: #e0e0e0; /* رنگ متن روشن */
        text-decoration: none;
        font-size: 15px;
        font-weight: 500;
        transition: all 0.3s ease;
        -webkit-tap-highlight-color: transparent; /* حذف هایلایت آبی در موبایل */
    }

    /* حالت هاور و لمس */
    #desktop-main-menu a:hover,
    #desktop-main-menu a:active {
        background-color: rgba(255, 255, 255, 0.05);
        color: #ffffff;
    }

    /* آیتم فعال (صفحه جاری) */
    #desktop-main-menu .current-menu-item > a,
    #desktop-main-menu .current_page_item > a {
        color: #4dabf7; /* رنگ آبی روشن برای تمایز */
        background-color: rgba(77, 171, 247, 0.1);
        border-right: 3px solid #4dabf7;
    }

    /* آیکون فلش برای آیتم‌های دارای زیرمنو */
    #desktop-main-menu .menu-item-has-children > a::after {
        content: '';
        display: inline-block;
        width: 8px;
        height: 8px;
        border-left: 2px solid #888;
        border-bottom: 2px solid #888;
        transform: rotate(-45deg); /* فلش رو به پایین در RTL */
        margin-left: 10px;
        transition: transform 0.3s ease, border-color 0.3s ease;
    }

    /* چرخش فلش هنگام باز شدن منو */
    #desktop-main-menu .menu-item-has-children.is-open > a::after {
        transform: rotate(135deg); /* فلش رو به بالا */
        border-color: #4dabf7;
    }

    /* استایل زیرمنوها */
    #desktop-main-menu .sub-menu {
        list-style: none;
        margin: 0;
        padding: 0;
        background-color: #1a1a1f; /* کمی تیره‌تر از پس‌زمینه اصلی */
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    #desktop-main-menu .sub-menu li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    }

    /* تورفتگی سطوح مختلف زیرمنو */
    #desktop-main-menu .sub-menu a {
        padding-right: 40px; /* سطح ۱ */
        font-size: 14px;
        color: #b0b0b0;
    }

    #desktop-main-menu .sub-menu .sub-menu a {
        padding-right: 60px; /* سطح ۲ */
        font-size: 13px;
        color: #909090;
        background-color: #151519;
    }

    #desktop-main-menu .sub-menu .sub-menu .sub-menu a {
        padding-right: 80px; /* سطح ۳ */
        font-size: 13px;
        color: #808080;
    }

    /* حذف خط زیرین آخرین آیتم */
    #desktop-main-menu li:last-child {
        border-bottom: none;
    }
}

