diff --git a/webUI/src/assets/site.css b/webUI/src/assets/site.css
index 1d56eee..dbd927e 100644
--- a/webUI/src/assets/site.css
+++ b/webUI/src/assets/site.css
@@ -4,4 +4,5 @@ label.required:before {
 }
 .btn-link{
   text-decoration: none;
-}
\ No newline at end of file
+}
+
diff --git a/webUI/src/main.ts b/webUI/src/main.ts
index 6cdc6f6..ce6b0fc 100644
--- a/webUI/src/main.ts
+++ b/webUI/src/main.ts
@@ -62,14 +62,17 @@ const vuetify = createVuetify({
         VTextField: {
             hideDetails: "auto",
             variant: "outlined",
-            size: "small"
+            size: "small",
+            density: "comfortable"
         },
         VTextarea: {
             hideDetails: "auto",
+            density: "comfortable"
         },
         VSelect: {
             hideDetails: "auto",
-            variant: "outlined"
+            variant: "outlined",
+            density: "comfortable"
         },
         VDialog: {
             VCard: {
diff --git a/webUI/src/views/acc/accounting/mod.vue b/webUI/src/views/acc/accounting/mod.vue
index 9dd024a..25f1e7f 100644
--- a/webUI/src/views/acc/accounting/mod.vue
+++ b/webUI/src/views/acc/accounting/mod.vue
@@ -22,6 +22,7 @@
         :items="form.rows"
         class="elevation-1"
         hide-default-footer
+        :header-props="{ class: 'custom-header' }"
       >
         <template v-slot:top>
           <v-toolbar flat>
diff --git a/webUI/src/views/acc/bank/list.vue b/webUI/src/views/acc/bank/list.vue
index 7f1b990..61ec68e 100644
--- a/webUI/src/views/acc/bank/list.vue
+++ b/webUI/src/views/acc/bank/list.vue
@@ -53,6 +53,8 @@
     :loading="loading"
     :search="search"
     class="elevation-1 text-center"
+    :header-props="{ class: 'custom-header' }"
+
   >
     <template v-slot:item="{ item }">
       <tr>
diff --git a/webUI/src/views/acc/persons/card.vue b/webUI/src/views/acc/persons/card.vue
index 6ad5b0a..826bcd0 100644
--- a/webUI/src/views/acc/persons/card.vue
+++ b/webUI/src/views/acc/persons/card.vue
@@ -187,7 +187,7 @@
     <v-row dense>
       <v-col cols="12">
         <v-data-table v-model="itemsSelected" :headers="headers" :items="items" :search="searchValue" :loading="loading"
-          show-select dense :items-per-page="25" class="elevation-1">
+          show-select dense :items-per-page="25" class="elevation-1" :header-props="{ class: 'custom-header' }">
           <template v-slot:top>
             <v-toolbar flat dense color="grey-lighten-4">
               <v-toolbar-title class="text-subtitle-1">{{ $t('pages.person_card.transactions') }}</v-toolbar-title>
diff --git a/webUI/src/views/acc/persons/list.vue b/webUI/src/views/acc/persons/list.vue
index 2c20634..0a020f4 100644
--- a/webUI/src/views/acc/persons/list.vue
+++ b/webUI/src/views/acc/persons/list.vue
@@ -3,7 +3,8 @@
     <template v-slot:prepend>
       <v-tooltip :text="$t('dialog.back')" location="bottom">
         <template v-slot:activator="{ props }">
-          <v-btn v-bind="props" @click="$router.back()" class="d-none d-sm-flex" variant="text" icon="mdi-arrow-right" />
+          <v-btn v-bind="props" @click="$router.back()" class="d-none d-sm-flex" variant="text"
+            icon="mdi-arrow-right" />
         </template>
       </v-tooltip>
     </template>
@@ -103,39 +104,18 @@
     </template>
   </v-text-field>
 
-  <v-data-table-server
-    v-model:items-per-page="serverOptions.rowsPerPage"
-    v-model:page="serverOptions.page"
-    v-model:sort-by="serverOptions.sortBy"
-    :headers="visibleHeaders"
-    :items="items"
-    :items-length="totalItems"
-    :loading="loading"
-    multi-sort
-    class="elevation-1"
-    :items-per-page-options="[5, 10, 20, 50]"
-    item-value="code"
-    items-per-page-text="تعداد سطر"
-    no-data-text="اطلاعاتی برای نمایش وجود ندارد"
-    :header-props="{ class: 'custom-header' }"
-  >
+  <v-data-table-server v-model:items-per-page="serverOptions.rowsPerPage" v-model:page="serverOptions.page"
+    v-model:sort-by="serverOptions.sortBy" :headers="visibleHeaders" :items="items" :items-length="totalItems"
+    :loading="loading" multi-sort class="elevation-1" :items-per-page-options="[5, 10, 20, 50]" item-value="code"
+    items-per-page-text="تعداد سطر" no-data-text="اطلاعاتی برای نمایش وجود ندارد"
+    :header-props="{ class: 'custom-header' }">
     <!-- ستون چک‌باکس دستی -->
     <template v-slot:header.checkbox>
-      <v-checkbox
-        v-model="selectAll"
-        @change="toggleSelectAll"
-        hide-details
-        density="compact"
-      ></v-checkbox>
+      <v-checkbox v-model="selectAll" @change="toggleSelectAll" hide-details density="compact"></v-checkbox>
     </template>
     <template v-slot:item.checkbox="{ item }">
-      <v-checkbox
-        v-model="selectedItems"
-        :value="item"
-        hide-details
-        density="compact"
-        @change="updateSelected"
-      ></v-checkbox>
+      <v-checkbox v-model="selectedItems" :value="item" hide-details density="compact"
+        @change="updateSelected"></v-checkbox>
     </template>
 
     <template v-slot:item.operation="{ item }">
@@ -202,7 +182,8 @@
       <v-card-text>
         <v-row>
           <v-col v-for="header in optionalHeaders" :key="header.value" cols="12" sm="4">
-            <v-checkbox v-model="header.visible" :label="header.title" @change="saveColumnSettings" hide-details class="mb-2"></v-checkbox>
+            <v-checkbox v-model="header.visible" :label="header.title" @change="saveColumnSettings" hide-details
+              class="mb-2"></v-checkbox>
           </v-col>
         </v-row>
       </v-card-text>
@@ -334,7 +315,18 @@ const fetchData = async () => {
         sortBy: sortBy.length > 0 ? sortBy : null,
       });
       items.value = response.data.items || [];
-      totalItems.value = response.data.total || 0;
+
+      // اگر فیلتری اعمال شده باشد، از total (تعداد فیلترشده) استفاده کن
+      // اگر فیلتری اعمال نشده باشد، از unfilteredTotal (تعداد کل) استفاده کن
+      const isFiltered =
+        searchValue.value ||
+        selectedTypes.length > 0 ||
+        selectedTransactionFilters.length > 0;
+
+      totalItems.value = isFiltered
+        ? (response.data.total || 0) // تعداد کل فیلترشده
+        : (response.data.unfilteredTotal || 0); // تعداد کل بدون فیلتر
+
       resetSelections();
     } catch (error) {
       console.error('Error fetching data:', error);
@@ -394,7 +386,7 @@ const resetSelections = () => {
 
 // توابع خروجی
 const excellOutput = (allItems = true) => {
-  
+
   if (!allItems) {
     if (selectedItems.value.length === 0) {
       Swal.fire({
@@ -404,7 +396,7 @@ const excellOutput = (allItems = true) => {
       });
       return;
     }
-    
+
     // ارسال id و code به سرور
     const selected = selectedItems.value.map(item => ({ id: item.id, code: item.code }));
     axios({
@@ -446,7 +438,7 @@ const excellOutput = (allItems = true) => {
 };
 
 const print = (allItems = true) => {
-  
+
   if (!allItems) {
     if (selectedItems.value.length === 0) {
       Swal.fire({
@@ -456,7 +448,7 @@ const print = (allItems = true) => {
       });
       return;
     }
-    
+
     // ارسال id و code به سرور
     const selected = selectedItems.value.map(item => ({ id: item.id, code: item.code }));
     axios.post('/api/person/list/print', { items: selected }).then((response) => {
@@ -503,6 +495,4 @@ onMounted(() => {
 });
 </script>
 
-<style>
-
-</style>
\ No newline at end of file
+<style></style>
\ No newline at end of file
diff --git a/webUI/src/views/acc/persons/receive/list.vue b/webUI/src/views/acc/persons/receive/list.vue
index a926de9..4d3b6a7 100644
--- a/webUI/src/views/acc/persons/receive/list.vue
+++ b/webUI/src/views/acc/persons/receive/list.vue
@@ -115,6 +115,7 @@
       :loading="loading"
       item-value="code"
       class="elevation-1"
+      :header-props="{ class: 'custom-header' }"
       :items-per-page-options="[5, 10, 20, 50]"
       items-per-page-text="تعداد سطر در هر صفحه"
       @update:options="loadData"
diff --git a/webUI/src/views/acc/sell/viewInvoice.vue b/webUI/src/views/acc/sell/viewInvoice.vue
index c632a63..ac67789 100644
--- a/webUI/src/views/acc/sell/viewInvoice.vue
+++ b/webUI/src/views/acc/sell/viewInvoice.vue
@@ -62,6 +62,15 @@ export default defineComponent({
       { title: 'تعداد', key: 'count' },
       { title: 'مبلغ کل', key: 'sumTotal' },
     ],
+    desktopHeaders: [
+      { title: 'کالا', key: 'commodity.name' },
+      { title: 'تعداد', key: 'count' },
+      { title: 'قیمت واحد', key: 'price' },
+      { title: 'تخفیف', key: 'discount' },
+      { title: 'مالیات', key: 'tax' },
+      { title: 'مبلغ کل', key: 'sumTotal' },
+      { title: 'شرح', key: 'des' },
+    ],
   }),
   computed: {
     formattedAmount() {
@@ -170,7 +179,7 @@ export default defineComponent({
     <print-options :invoice-id="$route.params.id" />
   </v-toolbar>
 
-  <v-tabs v-model="activeTab" color="primary" grow class="mt-0">
+  <v-tabs v-model="activeTab" color="primary"  grow class="mt-0 bg-gray">
     <v-tab value="person-info">اطلاعات شخص</v-tab>
     <v-tab value="invoice-info">اقلام فاکتور</v-tab>
     <v-tab value="payments">دریافت‌ها</v-tab>
@@ -216,13 +225,29 @@ export default defineComponent({
           </v-row>
 
           <v-list-subheader>اقلام</v-list-subheader>
-          <v-data-table :headers="mobileHeaders" :items="commoditys" :loading="loading" show-expand class="elevation-1">
+          <v-data-table
+            :headers="$vuetify.display.smAndDown ? mobileHeaders : desktopHeaders"
+            :items="commoditys"
+            :loading="loading"
+            :show-expand="$vuetify.display.smAndDown"
+            class="elevation-1"
+            :header-props="{ class: 'custom-header' }"
+          >
             <template v-slot:item.sumTotal="{ item }">
               {{ $filters.formatNumber(item.sumTotal) }}
             </template>
             <template v-slot:item.count="{ item }">
               {{ item.count }} {{ item.commodity.unit }}
             </template>
+            <template v-slot:item.price="{ item }">
+              {{ $filters.formatNumber(item.price) }}
+            </template>
+            <template v-slot:item.discount="{ item }">
+              {{ $filters.formatNumber(item.discount) }}
+            </template>
+            <template v-slot:item.tax="{ item }">
+              {{ $filters.formatNumber(item.tax) }}
+            </template>
             <template v-slot:expanded-row="{ item }">
               <v-list dense>
                 <v-list-item>
@@ -274,7 +299,7 @@ export default defineComponent({
       <!-- تب دریافت‌ها -->
       <v-window-item value="payments">
         <v-card-text>
-          <v-data-table v-if="item.relatedDocs.length" :headers="[
+          <v-data-table v-if="item.relatedDocs.length" :header-props="{ class: 'custom-header' }" :headers="[
             { title: 'مشاهده', key: 'view' },
             { title: 'شماره', key: 'code' },
             { title: 'تاریخ', key: 'date' },
@@ -318,5 +343,5 @@ export default defineComponent({
 </template>
 
 <style scoped>
-/* استایل‌ها */
+
 </style>
\ No newline at end of file
diff --git a/webUI/src/views/acc/smspanel/smspanel.vue b/webUI/src/views/acc/smspanel/smspanel.vue
index 263ed38..a798ed5 100644
--- a/webUI/src/views/acc/smspanel/smspanel.vue
+++ b/webUI/src/views/acc/smspanel/smspanel.vue
@@ -114,6 +114,7 @@
             :items="paysitems"
             :search="payssearchValue"
             :loading="loading"
+            :header-props="{ class: 'custom-header' }"
             loading-text="در حال بارگذاری..."
             no-data-text="اطلاعاتی برای نمایش وجود ندارد"
           >
@@ -137,6 +138,7 @@
           <v-data-table
             :headers="headers"
             :items="items"
+            :header-props="{ class: 'custom-header' }"
             :search="searchValue"
             :loading="loading"
             loading-text="در حال بارگذاری..."
diff --git a/webUI/src/views/acc/ultimatepackage/list.vue b/webUI/src/views/acc/ultimatepackage/list.vue
index 6a7dbae..8cd08ea 100644
--- a/webUI/src/views/acc/ultimatepackage/list.vue
+++ b/webUI/src/views/acc/ultimatepackage/list.vue
@@ -16,6 +16,7 @@
         <v-data-table
           v-if="canShowForm && !initialLoading"
           :headers="headers"
+          :header-props="{ class: 'custom-header' }"
           :items="packages"
           :items-per-page="10"
           :loading="isLoading"
diff --git a/webUI/src/views/user/manager/support/list.vue b/webUI/src/views/user/manager/support/list.vue
index ccbecf1..eab3fac 100644
--- a/webUI/src/views/user/manager/support/list.vue
+++ b/webUI/src/views/user/manager/support/list.vue
@@ -34,7 +34,7 @@
       <v-window v-model="activeTab">
         <v-window-item value="pending">
           <v-data-table-server v-model:items-per-page="itemsPerPagePending" v-model:page="pagePending"
-            :headers="headers" :items="pendingItems" :items-length="totalPending" :loading="loading"
+          :header-props="{ class: 'custom-header' }" :headers="headers" :items="pendingItems" :items-length="totalPending" :loading="loading"
             :no-data-text="$t('table.no_data')" class="elevation-1" show-select v-model="selectedTickets"
             @update:options="loadPendingData">
             <template #item.operation="{ item }">
@@ -50,7 +50,7 @@
 
         <v-window-item value="responded">
           <v-data-table-server v-model:items-per-page="itemsPerPageResponded" v-model:page="pageResponded"
-            :headers="headers" :items="respondedItems" :items-length="totalResponded" :loading="loading"
+          :header-props="{ class: 'custom-header' }" :headers="headers" :items="respondedItems" :items-length="totalResponded" :loading="loading"
             :no-data-text="$t('table.no_data')" class="elevation-1" show-select v-model="selectedTickets"
             @update:options="loadRespondedData">
             <template #item.operation="{ item }">
@@ -66,7 +66,7 @@
 
         <v-window-item value="closed">
           <v-data-table-server v-model:items-per-page="itemsPerPageClosed" v-model:page="pageClosed" :headers="headers"
-            :items="closedItems" :items-length="totalClosed" :loading="loading" :no-data-text="$t('table.no_data')"
+          :header-props="{ class: 'custom-header' }":items="closedItems" :items-length="totalClosed" :loading="loading" :no-data-text="$t('table.no_data')"
             class="elevation-1" show-select v-model="selectedTickets" @update:options="loadClosedData">
             <template #item.operation="{ item }">
               <v-tooltip :text="$t('dialog.view')" location="bottom">
diff --git a/webUI/src/views/user/manager/users/list.vue b/webUI/src/views/user/manager/users/list.vue
index d00b188..8f1ce98 100644
--- a/webUI/src/views/user/manager/users/list.vue
+++ b/webUI/src/views/user/manager/users/list.vue
@@ -134,6 +134,7 @@ loadFromServer();
               class="elevation-1"
               item-value="id"
               return-object
+              :header-props="{ class: 'custom-header' }"
             >
               <template #item.operation="{ item }">
                 <v-menu>
diff --git a/webUI/src/views/user/profile/dashboard.vue b/webUI/src/views/user/profile/dashboard.vue
index 941fcb3..36da6d2 100644
--- a/webUI/src/views/user/profile/dashboard.vue
+++ b/webUI/src/views/user/profile/dashboard.vue
@@ -83,7 +83,7 @@
               <v-col cols="12">
                 <v-card>
                   <v-card-title>{{ $t('marketing.recent_users') }}</v-card-title>
-                  <v-data-table :headers="computedHeaders" :items="recentUsers" :loading="loading" hide-default-footer
+                  <v-data-table :header-props="{ class: 'custom-header' }" :headers="computedHeaders" :items="recentUsers" :loading="loading" hide-default-footer
                     class="elevation-1">
                     <!-- اسلات سفارشی برای ستون وضعیت -->
                     <template v-slot:item.active="{ item }">
diff --git a/webUI/src/views/user/profile/support/list.vue b/webUI/src/views/user/profile/support/list.vue
index c5846d4..959de0f 100644
--- a/webUI/src/views/user/profile/support/list.vue
+++ b/webUI/src/views/user/profile/support/list.vue
@@ -24,7 +24,7 @@
 
       <v-window v-model="activeTab">
         <v-window-item value="pending">
-          <v-data-table :headers="headers" :items="pendingItems" :loading="loading" :no-data-text="$t('table.no_data')"
+          <v-data-table :header-props="{ class: 'custom-header' }" :headers="headers" :items="pendingItems" :loading="loading" :no-data-text="$t('table.no_data')"
             class="elevation-1">
             <template #item.operation="{ item }">
               <v-tooltip :text="$t('dialog.view')" location="bottom">
@@ -38,7 +38,7 @@
         </v-window-item>
 
         <v-window-item value="responded">
-          <v-data-table :headers="headers" :items="respondedItems" :loading="loading"
+          <v-data-table :header-props="{ class: 'custom-header' }" :headers="headers" :items="respondedItems" :loading="loading"
             :no-data-text="$t('table.no_data')" class="elevation-1">
             <template #item.operation="{ item }">
               <v-tooltip :text="$t('dialog.view')" location="bottom">
@@ -52,7 +52,7 @@
         </v-window-item>
 
         <v-window-item value="closed">
-          <v-data-table :headers="headers" :items="closedItems" :loading="loading" :no-data-text="$t('table.no_data')"
+          <v-data-table :header-props="{ class: 'custom-header' }" :headers="headers" :items="closedItems" :loading="loading" :no-data-text="$t('table.no_data')"
             class="elevation-1">
             <template #item.operation="{ item }">
               <v-tooltip :text="$t('dialog.view')" location="bottom">