diff --git a/apps/web/src/views/ProductsSettingsView.vue b/apps/web/src/views/ProductsSettingsView.vue
index 3b8e819..5fcef1b 100644
--- a/apps/web/src/views/ProductsSettingsView.vue
+++ b/apps/web/src/views/ProductsSettingsView.vue
@@ -411,25 +411,25 @@ onMounted(load);
               </td>
               <td class="ops" @click.stop>
                 <UiDropdownMenu
-                  :open="menuId === p.id"
+                  :open="menuId === `d:${p.id}`"
                   align="end"
-                  @update:open="(v) => (menuId = v ? p.id : null)"
+                  @update:open="(v) => (menuId = v ? `d:${p.id}` : null)"
                 >
                   <template #trigger="{ toggle }">
                     <button
                       type="button"
-                      class="icon-btn"
+                      class="more"
                       aria-label="عملیات"
                       @click.stop="toggle"
                     >
-                      <UiIcon name="dots" :size="16" />
+                      <UiIcon name="dots-v" :size="16" />
                     </button>
                   </template>
-                  <button type="button" @click="goEdit(p.id)">ویرایش</button>
-                  <button type="button" @click="toggleActive(p)">
+                  <button type="button" @click.stop="goEdit(p.id)">ویرایش</button>
+                  <button type="button" @click.stop="toggleActive(p)">
                     {{ p.isActive ? 'غیرفعال کردن' : 'فعال کردن' }}
                   </button>
-                  <button type="button" class="danger" @click="removeProduct(p)">حذف</button>
+                  <button type="button" class="danger" @click.stop="removeProduct(p)">حذف</button>
                 </UiDropdownMenu>
               </td>
             </tr>
@@ -460,25 +460,25 @@ onMounted(load);
           </div>
           <div class="mob-side">
             <UiDropdownMenu
-              :open="menuId === p.id"
+              :open="menuId === `m:${p.id}`"
               align="end"
-              @update:open="(v) => (menuId = v ? p.id : null)"
+              @update:open="(v) => (menuId = v ? `m:${p.id}` : null)"
             >
               <template #trigger="{ toggle }">
                 <button
                   type="button"
-                  class="icon-btn"
+                  class="more"
                   aria-label="عملیات"
                   @click.stop="toggle"
                 >
                   <UiIcon name="dots-v" :size="16" />
                 </button>
               </template>
-              <button type="button" @click="goEdit(p.id)">ویرایش</button>
-              <button type="button" @click="toggleActive(p)">
+              <button type="button" @click.stop="goEdit(p.id)">ویرایش</button>
+              <button type="button" @click.stop="toggleActive(p)">
                 {{ p.isActive ? 'غیرفعال کردن' : 'فعال کردن' }}
               </button>
-              <button type="button" class="danger" @click="removeProduct(p)">حذف</button>
+              <button type="button" class="danger" @click.stop="removeProduct(p)">حذف</button>
             </UiDropdownMenu>
             <UiBadge :variant="p.isActive ? 'success' : 'neutral'" size="sm" dot>
               {{ p.isActive ? 'فعال' : 'غیرفعال' }}
@@ -680,6 +680,22 @@ tr:last-child td {
 .ops {
   width: 64px;
 }
+.more {
+  width: 32px;
+  height: 32px;
+  border: 0;
+  background: none;
+  color: #94a3b8;
+  border-radius: var(--radius);
+  display: grid;
+  place-items: center;
+  cursor: pointer;
+  padding: 0;
+}
+.more:hover {
+  background: var(--accent-soft);
+  color: var(--accent);
+}
 .mob-list {
   display: none;
   gap: 0.65rem;