diff --git a/src/App.vue b/src/App.vue
index 026fda2..d1cb225 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -15,7 +15,16 @@
       >
         <router-view v-slot="{ Component, route }">
           <transition :name="route.meta.transition || 'fade'">
-            <component :is="Component" :key="route.fullPath" class="app-main" />
+            <!--
+              Key only the top-level matched route (e.g. main vs login), not fullPath.
+              Using fullPath remounted the whole AppLayoutShell (sidebar/bottom nav)
+              on every page change and reloaded the menu logo each time.
+            -->
+            <component
+              :is="Component"
+              :key="route.matched[0]?.name ?? route.name"
+              class="app-main"
+            />
           </transition>
         </router-view>
       </AConfigProvider>
@@ -103,7 +112,7 @@ const indicator = h(LoadingOutlined, {
 })
 const displayVersion = getDisplayAppVersion(pkg.version)
 const showSplash = ref(true)
-const primaryColor = getAppPrimaryColor(colors.primary || '#a72b77')
+const primaryColor = getAppPrimaryColor(colors.primary || '#000000')
 
 useApplyDesktopLayoutClass()
 
diff --git a/src/assets/css/main.less b/src/assets/css/main.less
index b8e30ef..db90443 100644
--- a/src/assets/css/main.less
+++ b/src/assets/css/main.less
@@ -378,14 +378,39 @@ body {
   background-color: var(--app-primary-color, #a72b77) !important;
 
 }
-.ant-slider-handle {
-  background-color: var(--app-primary-color, #a72b77) !important;
-
+.ant-radio-checked .ant-radio-inner,.ant-radio-group-solid .ant-radio-button-wrapper-checked {
+  border-color: var(--app-primary-color)!important;
+  background-color: var(--app-primary-color)!important
 }
 
+.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover:before {
+  background-color: var(--app-primary-color)!important
+}
+
+.ant-slider-handle {
+  background-color: var(--app-primary-color, #a72b77) !important;
+  border-color: var(--app-tertiary-color, #e0be7f) !important;
+}
+.ant-btn-primary{
+  background-color: var(--app-primary-color, #a72b77) !important;
+  color: var(--app-tertiary-color, #ffffff) !important;
+  border-color:  var(--app-primary-color, #a72b77) !important;;
+}
 .ant-drawer-body{
   padding: 0px !important;
 }
 .ant-radio-group-solid .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover{
   color: white !important;
+}
+.ant-spin{
+  color: var(--app-tertiary-color, #000000) !important;
+}
+.ant-spin-dot-item{
+  background-color: var(--app-tertiary-color, #a72b77) !important;
+
+}
+.ant-btn:hover{
+  color: var(--app-primary-color, #a72b77) !important;
+  border-color:  var(--app-primary-color, #a72b77) !important;;
+
 }
\ No newline at end of file
diff --git a/src/components/BasicPacks/BasicButton.vue b/src/components/BasicPacks/BasicButton.vue
index 6cdf12d..cb5d476 100644
--- a/src/components/BasicPacks/BasicButton.vue
+++ b/src/components/BasicPacks/BasicButton.vue
@@ -2,7 +2,7 @@
   <AButton :disabled="props.disabledB"  :type="props.type" :size="props.size" :class="[prefixCls, _class]" :loading="props.loading">
     <!--    py-1 px-2-->
     <div
-      class="flex items-center gap-1 justify-center flex-row-reverse gap-2 py-1 px-2"
+      class="flex items-center gap-1 justify-center flex-row-reverse gap-2  px-2"
       :class="[{ 'flex-row-reverse': suffixIcon }]"
     >
       <slot v-if="$slots.default"></slot>
diff --git a/src/components/BasicPacks/BasicIcon.vue b/src/components/BasicPacks/BasicIcon.vue
index 1d1c291..26b3b7b 100644
--- a/src/components/BasicPacks/BasicIcon.vue
+++ b/src/components/BasicPacks/BasicIcon.vue
@@ -12,6 +12,7 @@
 import icons from '@/components/BasicPacks/tools/icons/icons.json'
 import {usePrefix} from "@/utils/usePrefix";
 import {computed, onMounted, ref, withDefaults, defineProps} from "vue";
+import { getAppPrimaryColor } from '@/config/brand-theme'
 
 interface Props {
   icon: string
@@ -28,6 +29,11 @@ const tempIcon = ref<string>()
 const refIcon = ref<HTMLDivElement>()
 tempIcon.value = icons[`${props.icon}`] as string
 const color = computed(() => {
+  if (!props.color) return props.color
+  const raw = String(props.color).trim()
+  if (raw.includes('--app-primary-color') || raw === 'primary') {
+    return getAppPrimaryColor()
+  }
   return props.color
 })
 
diff --git a/src/components/BasicPacks/BasicInput.vue b/src/components/BasicPacks/BasicInput.vue
index cf17223..52abf6a 100644
--- a/src/components/BasicPacks/BasicInput.vue
+++ b/src/components/BasicPacks/BasicInput.vue
@@ -37,6 +37,7 @@ import {usePrefix} from "@/utils/usePrefix";
 import {computed} from "vue";
 import {usePrice} from "@/components/BasicPacks/BasicPriceInput/src/utils/usePrice";
 import {persianToEnglishDigits, shouldNormalizeInputDigits} from '@/utils/persianDigits';
+import { getAppPrimaryColor } from '@/config/brand-theme'
 
 //Props
 interface Prop {
@@ -55,12 +56,22 @@ interface Prop {
   placeHolder?: String
 }
 
-const addonBgColor = computed(() => props.addonBgColor)
-const addonTextColor = computed(() => props.addonTextColor)
+function resolveCssColor(value?: String | string | null) {
+  if (!value) return value
+  const raw = String(value).trim()
+  if (raw.includes('--app-primary-color') || raw === 'primary') {
+    return getAppPrimaryColor()
+  }
+  return raw
+}
 
 const props = withDefaults(defineProps<Prop>(), {
   isPassword: false
 })
+
+const addonBgColorResolved = computed(() => resolveCssColor(props.addonBgColor) || getAppPrimaryColor())
+const addonTextColorResolved = computed(() => resolveCssColor(props.addonTextColor) || 'white')
+
 const emits = defineEmits(['update:value', 'onchange'])
 
 const localValue = computed({
@@ -118,8 +129,8 @@ const {prefixCls} = usePrefix('input')
   }
 
   .ant-input-group-addon {
-    background-color: v-bind(addonBgColor);
-    color: v-bind(addonTextColor);
+    background-color: v-bind(addonBgColorResolved);
+    color: v-bind(addonTextColorResolved);
   }
 }
 </style>
diff --git a/src/layouts/config/navigation.ts b/src/layouts/config/navigation.ts
index 8c717a1..ed3a1bb 100644
--- a/src/layouts/config/navigation.ts
+++ b/src/layouts/config/navigation.ts
@@ -1,5 +1,10 @@
 import type { AppNavItem } from '../types'
-import { hasAbshodeTrading, hasHomePage, hasProductShop } from '@/config/project-profile'
+import {
+  hasAbshodeTrading,
+  hasHomePage,
+  hasProductShop,
+  isKashkoolProject,
+} from '@/config/project-profile'
 
 /** تب‌های پایین موبایل — کاربر لاگین‌شده (کشکول و مشابه) */
 export const AUTH_PRIMARY_NAV: AppNavItem[] = [
@@ -39,6 +44,16 @@ export const AUTH_SECONDARY_NAV: AppNavItem[] = [
   { id: 'rules', routeName: 'rules', label: 'قوانین و مقررات', icon: 'vuesax-linear:task' },
 ]
 
+/** منوی تمام‌صفحه کشکول — فقط این آیتم‌ها */
+export const KASHKOOL_OVERFLOW_NAV: AppNavItem[] = [
+  { id: 'user', routeName: 'user', label: 'حساب کاربری', icon: 'vuesax-linear:user' },
+  { id: 'physicalReceive', routeName: 'physicalReceive', label: 'دریافت طلای فیزیکی', icon: 'vuesax-linear:direct-inbox' },
+  { id: 'notifyTrigger', routeName: 'notifyTrigger', label: 'هشدار قیمت', icon: 'vuesax-linear:bill' },
+  { id: 'buyProduct', routeName: 'buyProduct', label: 'خرید محصول', icon: 'vuesax-linear:coin' },
+  { id: 'giftCard', routeName: 'giftCard', label: 'ثبت کارت هدیه', icon: 'vuesax-linear:gift' },
+  { id: 'rules', routeName: 'rules', label: 'قوانین و مقررات', icon: 'vuesax-linear:task' },
+]
+
 function filterSecondaryNavItems(items: AppNavItem[]): AppNavItem[] {
   return items.filter((item) => {
     if (item.routeName === 'buyProduct' && !hasProductShop()) return false
@@ -64,6 +79,7 @@ export function getPrimaryNavItems(isAuthenticated: boolean): AppNavItem[] {
 
 export function getSecondaryNavItems(isAuthenticated: boolean): AppNavItem[] {
   if (!isAuthenticated) return []
+  if (isKashkoolProject()) return KASHKOOL_OVERFLOW_NAV
   return filterSecondaryNavItems(AUTH_SECONDARY_NAV)
 }
 
@@ -74,5 +90,9 @@ export function getOverflowMenuItems(isAuthenticated: boolean): AppNavItem[] {
     )
   }
 
+  if (isKashkoolProject()) {
+    return KASHKOOL_OVERFLOW_NAV
+  }
+
   return filterSecondaryNavItems(AUTH_SECONDARY_NAV)
 }
diff --git a/src/layouts/mobile/MobileBottomNav.vue b/src/layouts/mobile/MobileBottomNav.vue
index 6866b00..5d0d90b 100644
--- a/src/layouts/mobile/MobileBottomNav.vue
+++ b/src/layouts/mobile/MobileBottomNav.vue
@@ -16,7 +16,12 @@
       <div class="main_in">
         <div class="text-white circle_in">
           <div class="circle_into" @click="$emit('toggle-overflow')">
-            <img class="p-2" :src="navLogo" alt="" />
+            <img
+              class="p-2"
+              :class="{ 'nav-logo--white': isKashkool }"
+              :src="navLogo"
+              alt=""
+            />
           </div>
         </div>
       </div>
@@ -46,6 +51,7 @@ import Icon from '@/components/BasicPacks/BasicIcon.vue'
 import { isToken } from '@/utils'
 import { useCartStore } from '@/store/cartStore'
 import { getAppIconUrl } from '@/config/brand-assets'
+import { isKashkoolProject } from '@/config/project-profile'
 import { getPrimaryNavItems } from '../config/navigation'
 
 defineProps<{
@@ -59,6 +65,7 @@ defineEmits<{
 
 const cartStore = useCartStore()
 const navLogo = getAppIconUrl()
+const isKashkool = isKashkoolProject()
 const cartCount = computed(() => cartStore.itemCount || 0)
 
 const primaryItems = computed(() => getPrimaryNavItems(isToken()))
@@ -80,4 +87,8 @@ const rightTabs = computed(() => primaryItems.value.slice(2))
 .tab__icon :deep(.ant-badge) {
   color: inherit;
 }
+
+.nav-logo--white {
+  filter: brightness(0) invert(1);
+}
 </style>
diff --git a/src/views/base/earnMoney/mobile/MobileEarnMoneyView.vue b/src/views/base/earnMoney/mobile/MobileEarnMoneyView.vue
index 049bea7..4e391c6 100644
--- a/src/views/base/earnMoney/mobile/MobileEarnMoneyView.vue
+++ b/src/views/base/earnMoney/mobile/MobileEarnMoneyView.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div>
     <div class="bg-white w-full py-3 px-3 text-primary font-bold drop-shadow flex">
       <div @click="router.back()">
@@ -7,7 +7,7 @@
       <div class="mr-2">کسب درآمد</div>
     </div>
     <div class="p-4">
-      <div class="p-3 border-solid border-1 rounded-[8px] border-[#a72b77]">
+      <div class="p-3 border-solid border-1 rounded-[8px] border-primary">
         <div class="flex items-center">
           <div class="bg-[#DBEAFE] h-10 w-10 rounded-100% flex justify-center items-center">
             <img :src="coin" />
diff --git a/src/views/base/gold/index.vue b/src/views/base/gold/index.vue
index 86b8bc6..c68ea6e 100644
--- a/src/views/base/gold/index.vue
+++ b/src/views/base/gold/index.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div class="h-35rem overflow-y-auto px-5">
     <div class=" !overflow-y-scroll bg-white py-3   text-primary font-bold  flex justify-evenly">
       <!--      <div @click="isBuy = false" class="w-full text-center" :class="!isBuy?'text-primary':'text-gray-400'">خرید طلا</div>
@@ -51,14 +51,14 @@
           <bg_main/>
           <div class="z-100 relative">
             <a-form-item>
-              <BasicInput v-model:value="form.goldCash" addon-before="ریال" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldCash" addon-before="ریال" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="ارزش کل"
                           size="large"
                           type="price" @onchange="calculateGold" />
             </a-form-item>
             <a-form-item :rules="[justNumber()]">
-              <BasicInput v-model:value="form.goldValue" addon-before="گرم" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldValue" addon-before="گرم" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="مقدار طلا"
                           size="large" type="text" inputmode="decimal" @onchange="calculateCash" />
@@ -647,7 +647,7 @@ async function ok() {
 
 <style lang="less">
 .completeButtonStyle .van-dialog__confirm .van-button__content {
-  background-color: #a72b77;
+  background-color: var(--app-primary-color);
   color: white;
 }
 
diff --git a/src/views/base/home/components/ProductInventory.vue b/src/views/base/home/components/ProductInventory.vue
index 21f7553..407360d 100644
--- a/src/views/base/home/components/ProductInventory.vue
+++ b/src/views/base/home/components/ProductInventory.vue
@@ -1,21 +1,21 @@
-<template>
+<template>
   <div v-if="props.ProductItem.wallet" class="bg-gradient-to-l from-primary rounded-lg p-px  to-transparent ">
     <div class="flex flex-col gap-7 rounded-lg p-4 w-56  bg-white ">
       <div class="flex justify-between items-center font-medium text-sm">
         <div class="text-primary">موجودی {{ props.ProductItem.title }}</div>
-        <BasicIcon v-if="props.ProductItem.group_type=='گوی'"  stroke-width="1"  size="50" color="#a72b77" class="rotate-310" icon="vuesax-linear:grammerly"/>
-        <BasicIcon v-else-if="props.ProductItem.group_type=='سکه'"  stroke-width="1"  size="50" color="#a72b77" class="rotate-310" icon="vuesax-linear:coin"/>
-        <BasicIcon v-else-if="props.ProductItem.group_type=='شمش'"  stroke-width="1"  size="50" color="#a72b77" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
-        <BasicIcon v-else-if="props.ProductItem.group_type=='مکعب'"  stroke-width="1"  size="50" color="#a72b77" class="rotate-310" icon="vuesax-linear:keyboard"/>
-        <BasicIcon v-else-if="props.ProductItem.group_type=='آبشده'"  stroke-width="1"  size="50" color="#a72b77" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
-        <BasicIcon v-else  stroke-width="1"  size="50" color="#a72b77" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
+        <BasicIcon v-if="props.ProductItem.group_type=='گوی'"  stroke-width="1"  size="50" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:grammerly"/>
+        <BasicIcon v-else-if="props.ProductItem.group_type=='سکه'"  stroke-width="1"  size="50" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:coin"/>
+        <BasicIcon v-else-if="props.ProductItem.group_type=='شمش'"  stroke-width="1"  size="50" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
+        <BasicIcon v-else-if="props.ProductItem.group_type=='مکعب'"  stroke-width="1"  size="50" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:keyboard"/>
+        <BasicIcon v-else-if="props.ProductItem.group_type=='آبشده'"  stroke-width="1"  size="50" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
+        <BasicIcon v-else  stroke-width="1"  size="50" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
       </div>
       <div class="flex justify-between px-2 items-center ">
-        <BasicIcon v-if="props.ProductItem.group_type=='گوی'"  stroke-width="1"  size="26" color="#a72b77" class="rotate-310" icon="vuesax-linear:grammerly"/>
-        <BasicIcon v-else-if="props.ProductItem.group_type=='سکه'"  stroke-width="1"  size="26" color="#a72b77" class="rotate-310" icon="vuesax-linear:coin"/>
-        <BasicIcon v-else-if="props.ProductItem.group_type=='شمش'"  stroke-width="1"  size="26" color="#a72b77" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
-        <BasicIcon v-else-if="props.ProductItem.group_type=='مکعب'"  stroke-width="1"  size="26" color="#a72b77" class="rotate-310" icon="vuesax-linear:keyboard"/>
-        <BasicIcon v-else  stroke-width="1"  size="26" color="#a72b77" class="rotate-310" icon="vuesax-linear:slider-vertical"/>        <div class="flex justify-between gap-2 items-center">
+        <BasicIcon v-if="props.ProductItem.group_type=='گوی'"  stroke-width="1"  size="26" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:grammerly"/>
+        <BasicIcon v-else-if="props.ProductItem.group_type=='سکه'"  stroke-width="1"  size="26" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:coin"/>
+        <BasicIcon v-else-if="props.ProductItem.group_type=='شمش'"  stroke-width="1"  size="26" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:slider-vertical"/>
+        <BasicIcon v-else-if="props.ProductItem.group_type=='مکعب'"  stroke-width="1"  size="26" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:keyboard"/>
+        <BasicIcon v-else  stroke-width="1"  size="26" color="var(--app-primary-color)" class="rotate-310" icon="vuesax-linear:slider-vertical"/>        <div class="flex justify-between gap-2 items-center">
           <span v-if="props.ProductItem.group_type=='آبشده'" class="font-bold text-secondary">{{userWallet.walletInfo?.gold??0}}</span>
         <span v-else class="font-bold text-secondary">{{props?.ProductItem.wallet?.gold??0}}</span>
           <span class="text-gray-400">{{props?.ProductItem?.unit}}</span>
diff --git a/src/views/base/home/index.vue b/src/views/base/home/index.vue
index 67830b7..eba96f8 100644
--- a/src/views/base/home/index.vue
+++ b/src/views/base/home/index.vue
@@ -32,7 +32,12 @@
 
           <div class="relative z-10">
             <div class="flex font-bold text-lg items-center gap-2 mb-3">
-              <img :src="appIconUrl" alt='' class='h-8 drop-shadow-md' />
+              <img
+                :src="appIconUrl"
+                alt=""
+                class="h-8 drop-shadow-md"
+                :class="{ 'home-brand-logo--white': isKashkool }"
+              />
               <div class="tracking-wide">{{ projectName }}</div>
             </div>
 
@@ -500,7 +505,7 @@ import type { PInventory, Product } from '@/models/products'
 import { useWalletAssets } from '@/composables/useWalletAssets'
 import { resolveAssetsRialValue } from '@/utils/productAssets'
 import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
-import { getProjectDisplayName, hasAbshodeTrading } from '@/config/project-profile'
+import { getProjectDisplayName, hasAbshodeTrading, isKashkoolProject } from '@/config/project-profile'
 import { getAppIconUrl } from '@/config/brand-assets'
 import { getAppPrimaryColor, getAppPrimaryDark } from '@/config/brand-theme'
 import { message, Modal } from 'ant-design-vue'
@@ -514,6 +519,7 @@ const walletStore = useWalletStore()
 const isDesktop = useDesktopBreakpoint()
 const projectName = getProjectDisplayName('کشکول گلد')
 const showAbshodeTrading = hasAbshodeTrading()
+const isKashkool = isKashkoolProject()
 const appIconUrl = getAppIconUrl()
 const primaryColor = getAppPrimaryColor()
 const primaryDark = getAppPrimaryDark()
@@ -988,4 +994,8 @@ apexchart {
   padding: 0 !important;
   margin: 0 !important;
 }
+
+.home-brand-logo--white {
+  filter: brightness(0) invert(1);
+}
 </style>
\ No newline at end of file
diff --git a/src/views/base/home/index_old2.vue b/src/views/base/home/index_old2.vue
index ca3aa45..d10f132 100644
--- a/src/views/base/home/index_old2.vue
+++ b/src/views/base/home/index_old2.vue
@@ -1,7 +1,7 @@
-<template>
+<template>
   <div class="">
     <!--    <div class="bg-primary h-30 mt-[-3rem] z-100000000000"></div>-->
-    <div class="fixed h-[60vh] bg-[#a72b77] w-screen">
+    <div class="fixed h-[60vh] bg-primary w-screen">
       <div class="flex w-full justify-around mt-18">
         <div class="text-center">
           <div class="text-[#E5D7CE] text-xs ">موجودی کیف طلا</div>
diff --git a/src/views/base/home/indexgolak.vue b/src/views/base/home/indexgolak.vue
index 54ab84f..611ee18 100644
--- a/src/views/base/home/indexgolak.vue
+++ b/src/views/base/home/indexgolak.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div class="h-35rem overflow-y-auto">
     <!--    <div class="bg-primary h-30 mt-[-3rem] z-100000000000"></div>-->
     <div class="h-[60vh] bg-primary wrap-fix">
@@ -620,7 +620,7 @@ const priceChartOptions = ref({
       show: false
     }
   },
-  colors: ['#a72b77'],
+  colors: ['var(--app-primary-color)'],
   fill: {
     type: 'gradient',
     gradient: {
diff --git a/src/views/base/physicalReceive/components/PhysicalReceiveCartRow.vue b/src/views/base/physicalReceive/components/PhysicalReceiveCartRow.vue
index 0962341..91e4848 100644
--- a/src/views/base/physicalReceive/components/PhysicalReceiveCartRow.vue
+++ b/src/views/base/physicalReceive/components/PhysicalReceiveCartRow.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div>
     <div class="flex">
       <div class="bg-gray-100 m-2 rounded-lg w-18 h-18 flex justify-center p-1 shrink-0">
@@ -25,7 +25,7 @@
             <BasicInput
               v-model:value="item.count"
               :addon-before="item.product.unit"
-              addon-bg-color="#a72b77"
+              addon-bg-color="var(--app-primary-color)"
               addon-text-color="white"
               type="text"
               inputmode="numeric"
diff --git a/src/views/base/physicalReceive/components/ReceiveDealProduct.vue b/src/views/base/physicalReceive/components/ReceiveDealProduct.vue
index c59d732..200d654 100644
--- a/src/views/base/physicalReceive/components/ReceiveDealProduct.vue
+++ b/src/views/base/physicalReceive/components/ReceiveDealProduct.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div class="h-35rem overflow-y-auto">
     <div class=" !overflow-y-scroll bg-white py-3   text-primary font-bold  flex justify-evenly">
       <!--      <div @click="isBuy = false" class="w-full text-center" :class="!isBuy?'text-primary':'text-gray-400'">خرید طلا</div>
@@ -65,7 +65,7 @@
 
             <a-form-item v-if="isBuy" name="goldValue"
                          :rules="[justNumber2(props?.ProductItem?.price , form.method , props?.ProductItem?.amount, true)]">
-              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="تعداد"
                           size="large" type="number" inputmode="number" @onchange="calculateCash" />
@@ -73,7 +73,7 @@
 
             <a-form-item v-else name="goldValue"
                          :rules="[justNumber3(props?.ProductItem?.sellPrice, productNum ,false)]">
-              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="تعداد"
                           size="large" type="number" inputmode="number" @onchange="calculateCash" />
@@ -694,7 +694,7 @@ watch(form.value.goldValue, () => {
   background: blue;
 }*/
 .completeButtonStyle .van-dialog__confirm .van-button__content {
-  background: #a72b77;
+  background: var(--app-primary-color);
   color: white;
 }
 
diff --git a/src/views/base/products/components/DealProduct.vue b/src/views/base/products/components/DealProduct.vue
index 6425d33..853d370 100644
--- a/src/views/base/products/components/DealProduct.vue
+++ b/src/views/base/products/components/DealProduct.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div class="h-35rem overflow-y-auto">
     <div class=" !overflow-y-scroll bg-white py-3   text-primary font-bold  flex justify-evenly">
       <!--      <div @click="isBuy = false" class="w-full text-center" :class="!isBuy?'text-primary':'text-gray-400'">خرید طلا</div>
@@ -61,14 +61,14 @@
 
             <a-form-item v-if="isBuy" name="goldValue"
                          :rules="[justNumber4(props?.ProductItem?.price , form.method , props?.ProductItem?.amount, true, form.gateway)]">
-              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="تعداد"
                           size="large" type="number" inputmode="number" @onchange="calculateCash" />
             </a-form-item>
             <a-form-item v-else name="goldValue"
                          :rules="[justNumber3(props?.ProductItem?.sellPrice, productNum ,false)]">
-              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="تعداد"
                           size="large" type="number" inputmode="number" @onchange="calculateCash" />
@@ -773,7 +773,7 @@ async function ok() {
   background: blue;
 }*/
 .completeButtonStyle .van-dialog__confirm .van-button__content {
-  background: #a72b77;
+  background: var(--app-primary-color);
   color: white;
 }
 
diff --git a/src/views/base/products/components/DealProductBackUp.vue b/src/views/base/products/components/DealProductBackUp.vue
index c65c937..35a8779 100644
--- a/src/views/base/products/components/DealProductBackUp.vue
+++ b/src/views/base/products/components/DealProductBackUp.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div class="h-35rem overflow-y-auto">
     <div class=" !overflow-y-scroll bg-white py-3   text-primary font-bold  flex justify-evenly">
       <!--      <div @click="isBuy = false" class="w-full text-center" :class="!isBuy?'text-primary':'text-gray-400'">خرید طلا</div>
@@ -61,14 +61,14 @@
 
             <a-form-item v-if="isBuy" name="goldValue"
                          :rules="[justNumber2(props?.ProductItem?.price , form.method , props?.ProductItem?.amount, true, form.gateway)]">
-              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="تعداد"
                           size="large" type="number" inputmode="number" @onchange="calculateCash" />
             </a-form-item>
             <a-form-item v-else name="goldValue"
                          :rules="[justNumber3(props?.ProductItem?.sellPrice, productNum ,false)]">
-              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="#a72b77"
+              <BasicInput v-model:value="form.goldValue" addon-before="تعداد" addon-bg-color="var(--app-primary-color)"
                           addon-text-color="white"
                           place-holder="تعداد"
                           size="large" type="number" inputmode="number" @onchange="calculateCash" />
@@ -749,7 +749,7 @@ async function ok() {
   background: blue;
 }*/
 .completeButtonStyle .van-dialog__confirm .van-button__content {
-  background: #a72b77;
+  background: var(--app-primary-color);
   color: white;
 }
 
diff --git a/src/views/base/wallet/desktop/DesktopWalletView.vue b/src/views/base/wallet/desktop/DesktopWalletView.vue
index 2349603..16ec928 100644
--- a/src/views/base/wallet/desktop/DesktopWalletView.vue
+++ b/src/views/base/wallet/desktop/DesktopWalletView.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div class="dwallet">
     <div class="dwallet__container">
       <DesktopPageTopbar
@@ -45,7 +45,7 @@
               <BasicInput
                 v-model:value="form.value"
                 addon-before="ریال"
-                addon-bg-color="#a72b77"
+                addon-bg-color="var(--app-primary-color)"
                 addon-text-color="white"
                 place-holder="مبلغ"
                 size="large"
diff --git a/src/views/base/wallet/mobile/MobileWalletView.vue b/src/views/base/wallet/mobile/MobileWalletView.vue
index b8b6a6b..c24b69b 100644
--- a/src/views/base/wallet/mobile/MobileWalletView.vue
+++ b/src/views/base/wallet/mobile/MobileWalletView.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div>
     <div class="absolute inset-0 bg-cover bg-center opacity-60" :style="{ backgroundImage: `url(${img})` }"></div>
     <div class="mpage-header wrap-fix z-[1999]">کیف پول</div>
@@ -38,7 +38,7 @@
               <BasicInput
                 v-model:value="form.value"
                 addon-before="ریال"
-                addon-bg-color="#a72b77"
+                addon-bg-color="var(--app-primary-color)"
                 addon-text-color="white"
                 place-holder="مبلغ"
                 size="large"
diff --git a/src/views/login/components/Login.vue b/src/views/login/components/Login.vue
index 15d0ef3..1ba86c4 100644
--- a/src/views/login/components/Login.vue
+++ b/src/views/login/components/Login.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
   <div class="w-full  flex flex-col">
     <img :src="logo" alt="" class="z-100  rounded-full  aspect-square self-center w-42 " STYLE="margin-bottom: 60px">
 
@@ -437,7 +437,7 @@ const getcode=()=>{
           </div>
         </BasicButton>
         <div class="flex gap-1 justify-center mt-5 text-xs" @click="$emit('register',true)">اگر حساب کاربری ندارید
-          <div class="font-bold text-[#a72b77]">از این قسمت</div>
+          <div class="font-bold text-primary">از این قسمت</div>
           ثبت نام کنید.
         </div>
       </a-form-item>