diff --git a/package-lock.json b/package-lock.json
index f3b2f07..aeda0dd 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,6 +10,7 @@
       "dependencies": {
         "@ant-design/plots": "^1.2.6",
         "@autocomplete/material-ui": "0.0.17",
+        "@capacitor-mlkit/barcode-scanning": "^8.0.1",
         "@dnd-kit/core": "^6.3.1",
         "@dnd-kit/sortable": "^10.0.0",
         "@emotion/react": "^11.11.4",
@@ -19,6 +20,8 @@
         "@reduxjs/toolkit": "^1.9.5",
         "@tanstack/react-query": "^5.90.11",
         "@tanstack/react-query-devtools": "^5.91.1",
+        "@tanstack/react-virtual": "^3.13.18",
+        "@zxing/library": "^0.21.3",
         "antd": "^5.17.4",
         "antd-img-crop": "^4.22.0",
         "aos": "^2.3.4",
@@ -48,6 +51,7 @@
         "mui-autocomplete": "^2.0.1",
         "number-to-words": "^1.2.4",
         "pdf-lib": "^1.17.1",
+        "qr-scanner": "^1.4.2",
         "qrcode": "^1.5.3",
         "qrcode.react": "^4.2.0",
         "react": "^18.3.1",
@@ -581,7 +585,6 @@
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.28.6.tgz",
       "integrity": "sha512-2lfu57JtzctfIrcGMz992hyLlByuzgIk58+hhGCxjKZ3rWI82NnVLjXcaTqkI2NvlcvOskZaiZ5kjUALo3Lpxg==",
-      "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
@@ -590,7 +593,6 @@
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.6.tgz",
       "integrity": "sha512-H3mcG6ZDLTlYfaSNi0iOKkigqMFvkTKlGUYlD8GW7nNOYRrevuA46iTypPyv+06V3fEmvvazfntkBU34L0azAw==",
-      "dev": true,
       "dependencies": {
         "@babel/code-frame": "^7.28.6",
         "@babel/generator": "^7.28.6",
@@ -619,8 +621,7 @@
     "node_modules/@babel/core/node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "dev": true
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg=="
     },
     "node_modules/@babel/generator": {
       "version": "7.28.6",
@@ -637,11 +638,23 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@babel/helper-annotate-as-pure": {
+      "version": "7.27.3",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz",
+      "integrity": "sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/types": "^7.27.3"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/helper-compilation-targets": {
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.28.6.tgz",
       "integrity": "sha512-JYtls3hqi15fcx5GaSNL7SCTJ2MNmjrkHXg4FSpOA/grxK8KwyZ5bubHsCq8FXCkua6xhuaaBit+3b7+VZRfcA==",
-      "dev": true,
       "dependencies": {
         "@babel/compat-data": "^7.28.6",
         "@babel/helper-validator-option": "^7.27.1",
@@ -657,7 +670,6 @@
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
       "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
       "dependencies": {
         "yallist": "^3.0.2"
       }
@@ -665,8 +677,7 @@
     "node_modules/@babel/helper-compilation-targets/node_modules/yallist": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
-      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
-      "dev": true
+      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="
     },
     "node_modules/@babel/helper-globals": {
       "version": "7.28.0",
@@ -692,7 +703,6 @@
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.28.6.tgz",
       "integrity": "sha512-67oXFAYr2cDLDVGLXTEABjdBJZ6drElUSI7WKp70NrpyISso3plG9SAGEF6y7zbha/wOzUByWWTJvEDVNIUGcA==",
-      "dev": true,
       "dependencies": {
         "@babel/helper-module-imports": "^7.28.6",
         "@babel/helper-validator-identifier": "^7.28.5",
@@ -709,7 +719,6 @@
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.28.6.tgz",
       "integrity": "sha512-S9gzZ/bz83GRysI7gAD4wPT/AI3uCnY+9xn+Mx/KPs2JwHJIz1W8PZkg2cqyt3RNOBM8ejcXhV6y8Og7ly/Dug==",
-      "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
@@ -734,7 +743,6 @@
       "version": "7.27.1",
       "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz",
       "integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==",
-      "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
@@ -743,7 +751,6 @@
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.28.6.tgz",
       "integrity": "sha512-xOBvwq86HHdB7WUDTfKfT/Vuxh7gElQ+Sfti2Cy6yIWNW05P8iUslOVcZ4/sKbE+/jQaukQAdz/gf3724kYdqw==",
-      "dev": true,
       "dependencies": {
         "@babel/template": "^7.28.6",
         "@babel/types": "^7.28.6"
@@ -766,6 +773,74 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/plugin-syntax-jsx": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.28.6.tgz",
+      "integrity": "sha512-wgEmr06G6sIpqr8YDwA2dSRTE3bJ+V0IfpzfSY3Lfgd7YWOaAdlykvJi13ZKBt8cZHfgH1IXN+CL656W3uUa4w==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-display-name": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.28.0.tgz",
+      "integrity": "sha512-D6Eujc2zMxKjfa4Zxl4GHMsmhKKZ9VpcqIchJLvwTxad9zWIYulwYItBovpDOoNLISpcZSXoDJ5gaGbQUDqViA==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.27.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.28.6.tgz",
+      "integrity": "sha512-61bxqhiRfAACulXSLd/GxqmAedUSrRZIu/cbaT18T1CetkTmtDN15it7i80ru4DVqRK1WMxQhXs+Lf9kajm5Ow==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/helper-annotate-as-pure": "^7.27.3",
+        "@babel/helper-module-imports": "^7.28.6",
+        "@babel/helper-plugin-utils": "^7.28.6",
+        "@babel/plugin-syntax-jsx": "^7.28.6",
+        "@babel/types": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-development": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.27.1.tgz",
+      "integrity": "sha512-ykDdF5yI4f1WrAolLqeF3hmYU12j9ntLQl/AOG1HAS21jxyg1Q0/J/tpREuYLfatGdGmXp/3yS0ZA76kOlVq9Q==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/plugin-transform-react-jsx": "^7.27.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
     "node_modules/@babel/plugin-transform-react-jsx-self": {
       "version": "7.27.1",
       "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.27.1.tgz",
@@ -796,6 +871,44 @@
         "@babel/core": "^7.0.0-0"
       }
     },
+    "node_modules/@babel/plugin-transform-react-pure-annotations": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.27.1.tgz",
+      "integrity": "sha512-JfuinvDOsD9FVMTHpzA/pBLisxpv1aSf+OIV8lgH3MuWrks19R27e6a6DipIg4aX1Zm9Wpb04p8wljfKrVSnPA==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/helper-annotate-as-pure": "^7.27.1",
+        "@babel/helper-plugin-utils": "^7.27.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/preset-react": {
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/preset-react/-/preset-react-7.28.5.tgz",
+      "integrity": "sha512-Z3J8vhRq7CeLjdC58jLv4lnZ5RKFUJWqH5emvxmv9Hv3BD1T9R/Im713R4MTKwvFaV74ejZ3sM01LyEKk4ugNQ==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.27.1",
+        "@babel/helper-validator-option": "^7.27.1",
+        "@babel/plugin-transform-react-display-name": "^7.28.0",
+        "@babel/plugin-transform-react-jsx": "^7.27.1",
+        "@babel/plugin-transform-react-jsx-development": "^7.27.1",
+        "@babel/plugin-transform-react-pure-annotations": "^7.27.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
     "node_modules/@babel/runtime": {
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.6.tgz",
@@ -846,6 +959,35 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@capacitor-mlkit/barcode-scanning": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/@capacitor-mlkit/barcode-scanning/-/barcode-scanning-8.0.1.tgz",
+      "integrity": "sha512-94SyxzbcQ2HBd7yxS34dqc0PzwdOw8/98xBrjw1ioznE/Ksky/iwsip5Bm8P8Qg+dgnJYWz7NcIPjd+6bLjVoQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/capawesome-team/"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/capawesome"
+        }
+      ],
+      "license": "Apache-2.0",
+      "peerDependencies": {
+        "@capacitor/core": ">=8.0.0"
+      }
+    },
+    "node_modules/@capacitor/core": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/@capacitor/core/-/core-8.1.0.tgz",
+      "integrity": "sha512-UfMBMWc1v7J+14AhH03QmeNwV3HZx3qnOWhpwnHfzALEwAwlV/itQOQqcasMQYhOHWL0tiymc5ByaLTn7KKQxw==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
     "node_modules/@dnd-kit/accessibility": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/@dnd-kit/accessibility/-/accessibility-3.1.1.tgz",
@@ -1479,6 +1621,30 @@
         "url": "https://opencollective.com/eslint"
       }
     },
+    "node_modules/@eslint/eslintrc/node_modules/ajv": {
+      "version": "6.12.6",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+      "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/@eslint/eslintrc/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@eslint/eslintrc/node_modules/strip-json-comments": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
@@ -1769,7 +1935,6 @@
       "version": "2.3.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
       "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
-      "dev": true,
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.5",
         "@jridgewell/trace-mapping": "^0.3.24"
@@ -2803,6 +2968,381 @@
         }
       }
     },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.58.0.tgz",
+      "integrity": "sha512-mr0tmS/4FoVk1cnaeN244A/wjvGDNItZKR8hRhnmCzygyRXYtKF5jVDSIILR1U97CTzAYmbgIj/Dukg62ggG5w==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.58.0.tgz",
+      "integrity": "sha512-+s++dbp+/RTte62mQD9wLSbiMTV+xr/PeRJEc/sFZFSBRlHPNPVaf5FXlzAL77Mr8FtSfQqCN+I598M8U41ccQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.58.0.tgz",
+      "integrity": "sha512-MFWBwTcYs0jZbINQBXHfSrpSQJq3IUOakcKPzfeSznONop14Pxuqa0Kg19GD0rNBMPQI2tFtu3UzapZpH0Uc1Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.58.0.tgz",
+      "integrity": "sha512-yiKJY7pj9c9JwzuKYLFaDZw5gma3fI9bkPEIyofvVfsPqjCWPglSHdpdwXpKGvDeYDms3Qal8qGMEHZ1M/4Udg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-freebsd-arm64": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.58.0.tgz",
+      "integrity": "sha512-x97kCoBh5MOevpn/CNK9W1x8BEzO238541BGWBc315uOlN0AD/ifZ1msg+ZQB05Ux+VF6EcYqpiagfLJ8U3LvQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-freebsd-x64": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.58.0.tgz",
+      "integrity": "sha512-Aa8jPoZ6IQAG2eIrcXPpjRcMjROMFxCt1UYPZZtCxRV68WkuSigYtQ/7Zwrcr2IvtNJo7T2JfDXyMLxq5L4Jlg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.58.0.tgz",
+      "integrity": "sha512-Ob8YgT5kD/lSIYW2Rcngs5kNB/44Q2RzBSPz9brf2WEtcGR7/f/E9HeHn1wYaAwKBni+bdXEwgHvUd0x12lQSA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.58.0.tgz",
+      "integrity": "sha512-K+RI5oP1ceqoadvNt1FecL17Qtw/n9BgRSzxif3rTL2QlIu88ccvY+Y9nnHe/cmT5zbH9+bpiJuG1mGHRVwF4Q==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.58.0.tgz",
+      "integrity": "sha512-T+17JAsCKUjmbopcKepJjHWHXSjeW7O5PL7lEFaeQmiVyw4kkc5/lyYKzrv6ElWRX/MrEWfPiJWqbTvfIvjM1Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.58.0.tgz",
+      "integrity": "sha512-cCePktb9+6R9itIJdeCFF9txPU7pQeEHB5AbHu/MKsfH/k70ZtOeq1k4YAtBv9Z7mmKI5/wOLYjQ+B9QdxR6LA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-loong64-gnu": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.58.0.tgz",
+      "integrity": "sha512-iekUaLkfliAsDl4/xSdoCJ1gnnIXvoNz85C8U8+ZxknM5pBStfZjeXgB8lXobDQvvPRCN8FPmmuTtH+z95HTmg==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-loong64-musl": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.58.0.tgz",
+      "integrity": "sha512-68ofRgJNl/jYJbxFjCKE7IwhbfxOl1muPN4KbIqAIe32lm22KmU7E8OPvyy68HTNkI2iV/c8y2kSPSm2mW/Q9Q==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-gnu": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.58.0.tgz",
+      "integrity": "sha512-dpz8vT0i+JqUKuSNPCP5SYyIV2Lh0sNL1+FhM7eLC457d5B9/BC3kDPp5BBftMmTNsBarcPcoz5UGSsnCiw4XQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-musl": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.58.0.tgz",
+      "integrity": "sha512-4gdkkf9UJ7tafnweBCR/mk4jf3Jfl0cKX9Np80t5i78kjIH0ZdezUv/JDI2VtruE5lunfACqftJ8dIMGN4oHew==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.58.0.tgz",
+      "integrity": "sha512-YFS4vPnOkDTD/JriUeeZurFYoJhPf9GQQEF/v4lltp3mVcBmnsAdjEWhr2cjUCZzZNzxCG0HZOvJU44UGHSdzw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-musl": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.58.0.tgz",
+      "integrity": "sha512-x2xgZlFne+QVNKV8b4wwaCS8pwq3y14zedZ5DqLzjdRITvreBk//4Knbcvm7+lWmms9V9qFp60MtUd0/t/PXPw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.58.0.tgz",
+      "integrity": "sha512-jIhrujyn4UnWF8S+DHSkAkDEO3hLX0cjzxJZPLF80xFyzyUIYgSMRcYQ3+uqEoyDD2beGq7Dj7edi8OnJcS/hg==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.58.0.tgz",
+      "integrity": "sha512-+410Srdoh78MKSJxTQ+hZ/Mx+ajd6RjjPwBPNd0R3J9FtL6ZA0GqiiyNjCO9In0IzZkCNrpGymSfn+kgyPQocg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.58.0.tgz",
+      "integrity": "sha512-ZjMyby5SICi227y1MTR3VYBpFTdZs823Rs/hpakufleBoufoOIB6jtm9FEoxn/cgO7l6PM2rCEl5Kre5vX0QrQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-openbsd-x64": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.58.0.tgz",
+      "integrity": "sha512-ds4iwfYkSQ0k1nb8LTcyXw//ToHOnNTJtceySpL3fa7tc/AsE+UpUFphW126A6fKBGJD5dhRvg8zw1rvoGFxmw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-openharmony-arm64": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.58.0.tgz",
+      "integrity": "sha512-fd/zpJniln4ICdPkjWFhZYeY/bpnaN9pGa6ko+5WD38I0tTqk9lXMgXZg09MNdhpARngmxiCg0B0XUamNw/5BQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.58.0.tgz",
+      "integrity": "sha512-YpG8dUOip7DCz3nr/JUfPbIUo+2d/dy++5bFzgi4ugOGBIox+qMbbqt/JoORwvI/C9Kn2tz6+Bieoqd5+B1CjA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.58.0.tgz",
+      "integrity": "sha512-b9DI8jpFQVh4hIXFr0/+N/TzLdpBIoPzjt0Rt4xJbW3mzguV3mduR9cNgiuFcuL/TeORejJhCWiAXe3E/6PxWA==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-win32-x64-gnu": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.58.0.tgz",
+      "integrity": "sha512-CSrVpmoRJFN06LL9xhkitkwUcTZtIotYAF5p6XOR2zW0Zz5mzb3IPpcoPhB02frzMHFNo1reQ9xSF5fFm3hUsQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "peer": true
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.58.0.tgz",
+      "integrity": "sha512-QFsBgQNTnh5K0t/sBsjJLq24YVqEIVkGpfN2VHsnN90soZyhaiA9UUHufcctVNL4ypJY0wrwad0wslx2KJQ1/w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "peer": true
+    },
     "node_modules/@sindresorhus/is": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-4.6.0.tgz",
@@ -2936,6 +3476,33 @@
         "react": "^18 || ^19"
       }
     },
+    "node_modules/@tanstack/react-virtual": {
+      "version": "3.13.18",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-virtual/-/react-virtual-3.13.18.tgz",
+      "integrity": "sha512-dZkhyfahpvlaV0rIKnvQiVoWPyURppl6w4m9IwMDpuIjcJ1sD9YGWrt0wISvgU7ewACXx2Ct46WPgI6qAD4v6A==",
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/virtual-core": "3.13.18"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/@tanstack/virtual-core": {
+      "version": "3.13.18",
+      "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.13.18.tgz",
+      "integrity": "sha512-Mx86Hqu1k39icq2Zusq+Ey2J6dDWTjDvEv43PJtRCoEYTLyfaPnxIQ6iy7YAOK0NV/qOEmZQ/uCufrppZxTgcg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
       "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
@@ -3119,6 +3686,12 @@
       "resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.63.tgz",
       "integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ=="
     },
+    "node_modules/@types/offscreencanvas": {
+      "version": "2019.7.3",
+      "resolved": "https://registry.npmjs.org/@types/offscreencanvas/-/offscreencanvas-2019.7.3.tgz",
+      "integrity": "sha512-ieXiYmgSRXUDeOntE1InxjWyvEelZGP63M+cGuquuRLuIKKT1osnkXjxev9B7d1nXSug5vpunx+gNlbVxMlC9A==",
+      "license": "MIT"
+    },
     "node_modules/@types/pako": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/@types/pako/-/pako-2.0.4.tgz",
@@ -3263,6 +3836,28 @@
         "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"
       }
     },
+    "node_modules/@zxing/library": {
+      "version": "0.21.3",
+      "resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.21.3.tgz",
+      "integrity": "sha512-hZHqFe2JyH/ZxviJZosZjV+2s6EDSY0O24R+FQmlWZBZXP9IqMo7S3nb3+2LBWxodJQkSurdQGnqE7KXqrYgow==",
+      "license": "MIT",
+      "dependencies": {
+        "ts-custom-error": "^3.2.1"
+      },
+      "engines": {
+        "node": ">= 10.4.0"
+      },
+      "optionalDependencies": {
+        "@zxing/text-encoding": "~0.9.0"
+      }
+    },
+    "node_modules/@zxing/text-encoding": {
+      "version": "0.9.0",
+      "resolved": "https://registry.npmjs.org/@zxing/text-encoding/-/text-encoding-0.9.0.tgz",
+      "integrity": "sha512-U/4aVJ2mxI0aDNI8Uq0wEhMgY+u4CNtEb0om3+y3+niDAsoTCOB33UF0sxpzqzdqXLqmvc+vZyAt4O8pPdfkwA==",
+      "license": "(Unlicense OR Apache-2.0)",
+      "optional": true
+    },
     "node_modules/acorn": {
       "version": "8.15.0",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
@@ -3293,18 +3888,16 @@
       }
     },
     "node_modules/ajv": {
-      "version": "6.12.6",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
-      "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+      "version": "5.5.2",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
+      "integrity": "sha512-Ajr4IcMXq/2QmMkEmSvxqfLN5zGmJ92gHXAeOXq1OekoH2rfDNsgdDoL2f7QaRCy7G/E6TpxBVdRuNraMztGHw==",
+      "license": "MIT",
+      "peer": true,
       "dependencies": {
-        "fast-deep-equal": "^3.1.1",
+        "co": "^4.6.0",
+        "fast-deep-equal": "^1.0.0",
         "fast-json-stable-stringify": "^2.0.0",
-        "json-schema-traverse": "^0.4.1",
-        "uri-js": "^4.2.2"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/epoberezkin"
+        "json-schema-traverse": "^0.3.0"
       }
     },
     "node_modules/ajv-formats": {
@@ -3346,6 +3939,13 @@
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true
     },
+    "node_modules/ajv/node_modules/fast-deep-equal": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.1.0.tgz",
+      "integrity": "sha512-fueX787WZKCV0Is4/T2cyAdM4+x1S3MXXOAhavE1ys/W42SHAPacLTQhucja22QBYrfGw50M2sRiXPtTGv9Ymw==",
+      "license": "MIT",
+      "peer": true
+    },
     "node_modules/align-text": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
@@ -3363,6 +3963,7 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
       "integrity": "sha512-S2Hw0TtNkMJhIabBwIojKL9YHO5T0n5eNqWJ7Lrlel/zDbftQpxpapi8tZs3X1HWa+u+QeydGmzzNU0m09+Rcg==",
+      "license": "BSD-3-Clause OR MIT",
       "engines": {
         "node": ">=0.4.2"
       }
@@ -3418,6 +4019,7 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
       "integrity": "sha512-TIGnTpdo+E3+pCyAluZvtED5p5wCqLdezCyhPZzKPcxvFplEt4i+W7OONCKgeZFT3+y5NZZfOOS/Bdcanm1MYA==",
+      "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -3426,6 +4028,7 @@
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
       "integrity": "sha512-kmCevFghRiWM7HB5zTPULl4r9bVFSWjz62MhqizDGUrq2NWuNMQyuv4tHHoKJHs69M/MF64lEcHdYIocrdWQYA==",
+      "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -3888,7 +4491,6 @@
       "version": "2.9.18",
       "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.9.18.tgz",
       "integrity": "sha512-e23vBV1ZLfjb9apvfPk4rHVu2ry6RIr2Wfs+O324okSidrX7pTAnEJPCh/O5BtRlr7QtZI7ktOP3vsqr7Z5XoA==",
-      "dev": true,
       "bin": {
         "baseline-browser-mapping": "dist/cli.js"
       }
@@ -4086,7 +4688,6 @@
       "version": "4.28.1",
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.1.tgz",
       "integrity": "sha512-ZC5Bd0LgJXgwGqUknZY/vkUQ04r8NXnJZ3yYi4vDmSiZmC/pdSN0NbNRPxZpbtO4uAfDUAFffO8IZoM3Gj8IkA==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -4268,7 +4869,6 @@
       "version": "1.0.30001766",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001766.tgz",
       "integrity": "sha512-4C0lfJ0/YPjJQHagaE9x2Elb69CIqEPZeG0anQt9SIvIoOH4a4uaRl73IavyO+0qZh6MDLH//DrXThEYKHkmYA==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -4358,6 +4958,7 @@
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
       "integrity": "sha512-U3lRVLMSlsCfjqYPbLyVv11M9CPW4I728d6TCKMAOJueEeB9/8o+eSsMnxPJD+Q+K909sdESg7C+tIkoH6on1A==",
+      "license": "MIT",
       "dependencies": {
         "ansi-styles": "^2.2.1",
         "escape-string-regexp": "^1.0.2",
@@ -4476,6 +5077,17 @@
         "node": ">=6"
       }
     },
+    "node_modules/co": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
+      "integrity": "sha512-QVb0dM5HvG+uaxitm8wONl7jltx8dqhfU33DcqtOZcLSVIKSDDLDi7+0LbAKiyI8hD9u42m2YxXSkMGWThaecQ==",
+      "license": "MIT",
+      "peer": true,
+      "engines": {
+        "iojs": ">= 1.0.0",
+        "node": ">= 0.12.0"
+      }
+    },
     "node_modules/codepage": {
       "version": "1.15.0",
       "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz",
@@ -5335,8 +5947,7 @@
     "node_modules/electron-to-chromium": {
       "version": "1.5.279",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.279.tgz",
-      "integrity": "sha512-0bblUU5UNdOt5G7XqGiJtpZMONma6WAfq9vsFmtn9x1+joAObr6x1chfqyxFSDCAFwFhCQDrqeAr6MYdpwJ9Hg==",
-      "dev": true
+      "integrity": "sha512-0bblUU5UNdOt5G7XqGiJtpZMONma6WAfq9vsFmtn9x1+joAObr6x1chfqyxFSDCAFwFhCQDrqeAr6MYdpwJ9Hg=="
     },
     "node_modules/electron/node_modules/@types/node": {
       "version": "16.18.126",
@@ -5628,7 +6239,6 @@
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
       "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
-      "dev": true,
       "engines": {
         "node": ">=6"
       }
@@ -5807,6 +6417,23 @@
         "url": "https://opencollective.com/eslint"
       }
     },
+    "node_modules/eslint/node_modules/ajv": {
+      "version": "6.12.6",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+      "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
     "node_modules/eslint/node_modules/ansi-regex": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -5898,6 +6525,13 @@
         "node": ">=8"
       }
     },
+    "node_modules/eslint/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/eslint/node_modules/locate-path": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -6229,7 +6863,8 @@
     "node_modules/fast-deep-equal": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
-      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
+      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "dev": true
     },
     "node_modules/fast-json-stable-stringify": {
       "version": "2.1.0",
@@ -6397,6 +7032,20 @@
         "uglify-js": "^2.6.2"
       }
     },
+    "node_modules/fmin/node_modules/rollup": {
+      "version": "0.25.8",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-0.25.8.tgz",
+      "integrity": "sha512-a2S4Bh3bgrdO4BhKr2E4nZkjTvrJ2m2bWjMTzVYtoqSCn0HnuxosXnaJUHrMEziOWr3CzL9GjilQQKcyCQpJoA==",
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^1.1.1",
+        "minimist": "^1.2.0",
+        "source-map-support": "^0.3.2"
+      },
+      "bin": {
+        "rollup": "bin/rollup"
+      }
+    },
     "node_modules/follow-redirects": {
       "version": "1.15.11",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.11.tgz",
@@ -6552,7 +7201,6 @@
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
       "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
-      "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
@@ -6816,6 +7464,7 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
       "integrity": "sha512-C8vBJ8DwUCx19vhm7urhTuUsr4/IyP6l4VzNQDv+ryHQObW3TTTp9yB68WpYgRe2bbaGuZ/se74IqFeVnMnLZg==",
+      "license": "MIT",
       "dependencies": {
         "ansi-regex": "^2.0.0"
       },
@@ -8028,9 +8677,11 @@
       "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w=="
     },
     "node_modules/json-schema-traverse": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.3.1.tgz",
+      "integrity": "sha512-4JD/Ivzg7PoW8NzdrBSr3UFwC9mHgvI7Z6z3QGBsSHgKaRTUDmyZAAKJo2UbG1kUVfS9WS8bi36N49U1xw43DA==",
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/json-schema-typed": {
       "version": "8.0.2",
@@ -8073,7 +8724,6 @@
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
       "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
-      "dev": true,
       "bin": {
         "json5": "lib/cli.js"
       },
@@ -8795,8 +9445,7 @@
     "node_modules/node-releases": {
       "version": "2.0.27",
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.27.tgz",
-      "integrity": "sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA==",
-      "dev": true
+      "integrity": "sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA=="
     },
     "node_modules/normalize-path": {
       "version": "3.0.0",
@@ -9455,10 +10104,21 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
       "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
+      "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=6"
       }
     },
+    "node_modules/qr-scanner": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/qr-scanner/-/qr-scanner-1.4.2.tgz",
+      "integrity": "sha512-kV1yQUe2FENvn59tMZW6mOVfpq9mGxGf8l6+EGaXUOd4RBOLg7tRC83OrirM5AtDvZRpdjdlXURsHreAOSPOUw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/offscreencanvas": "^2019.6.4"
+      }
+    },
     "node_modules/qr.js": {
       "version": "0.0.0",
       "resolved": "https://registry.npmjs.org/qr.js/-/qr.js-0.0.0.tgz",
@@ -10940,16 +11600,49 @@
       }
     },
     "node_modules/rollup": {
-      "version": "0.25.8",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-0.25.8.tgz",
-      "integrity": "sha512-a2S4Bh3bgrdO4BhKr2E4nZkjTvrJ2m2bWjMTzVYtoqSCn0HnuxosXnaJUHrMEziOWr3CzL9GjilQQKcyCQpJoA==",
+      "version": "4.58.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.58.0.tgz",
+      "integrity": "sha512-wbT0mBmWbIvvq8NeEYWWvevvxnOyhKChir47S66WCxw1SXqhw7ssIYejnQEVt7XYQpsj2y8F9PM+Cr3SNEa0gw==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
       "dependencies": {
-        "chalk": "^1.1.1",
-        "minimist": "^1.2.0",
-        "source-map-support": "^0.3.2"
+        "@types/estree": "1.0.8"
       },
       "bin": {
-        "rollup": "bin/rollup"
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-android-arm-eabi": "4.58.0",
+        "@rollup/rollup-android-arm64": "4.58.0",
+        "@rollup/rollup-darwin-arm64": "4.58.0",
+        "@rollup/rollup-darwin-x64": "4.58.0",
+        "@rollup/rollup-freebsd-arm64": "4.58.0",
+        "@rollup/rollup-freebsd-x64": "4.58.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.58.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.58.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.58.0",
+        "@rollup/rollup-linux-arm64-musl": "4.58.0",
+        "@rollup/rollup-linux-loong64-gnu": "4.58.0",
+        "@rollup/rollup-linux-loong64-musl": "4.58.0",
+        "@rollup/rollup-linux-ppc64-gnu": "4.58.0",
+        "@rollup/rollup-linux-ppc64-musl": "4.58.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.58.0",
+        "@rollup/rollup-linux-riscv64-musl": "4.58.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.58.0",
+        "@rollup/rollup-linux-x64-gnu": "4.58.0",
+        "@rollup/rollup-linux-x64-musl": "4.58.0",
+        "@rollup/rollup-openbsd-x64": "4.58.0",
+        "@rollup/rollup-openharmony-arm64": "4.58.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.58.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.58.0",
+        "@rollup/rollup-win32-x64-gnu": "4.58.0",
+        "@rollup/rollup-win32-x64-msvc": "4.58.0",
+        "fsevents": "~2.3.2"
       }
     },
     "node_modules/rollup-plugin-obfuscator": {
@@ -11434,6 +12127,7 @@
       "version": "0.3.3",
       "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.3.3.tgz",
       "integrity": "sha512-9O4+y9n64RewmFoKUZ/5Tx9IHIcXM6Q+RTSw6ehnqybUz4a7iwR3Eaw80uLtqqQ5D0C+5H03D4KKGo9PdP33Gg==",
+      "license": "MIT",
       "dependencies": {
         "source-map": "0.1.32"
       }
@@ -11636,6 +12330,7 @@
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
       "integrity": "sha512-VhumSSbBqDTP8p2ZLKj40UjBCV4+v8bUSEpUb4KjRgWk9pbqGF4REFj6KEagidb2f/M6AzC0EmFyDNGaw9OCzg==",
+      "license": "MIT",
       "dependencies": {
         "ansi-regex": "^2.0.0"
       },
@@ -11702,6 +12397,7 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
       "integrity": "sha512-KKNVtd6pCYgPIKU4cp2733HWYCpplQhddZLBUryaAHou723x+FRzQ5Df824Fj+IyyuiQTRoub4SnIFfIcrp70g==",
+      "license": "MIT",
       "engines": {
         "node": ">=0.8.0"
       }
@@ -11999,6 +12695,15 @@
       "resolved": "https://registry.npmjs.org/trim-canvas/-/trim-canvas-0.1.2.tgz",
       "integrity": "sha512-nd4Ga3iLFV94mdhW9JFMLpQbHUyCQuhFOD71PEAt1NjtMD5wbZctzhX8c3agHNybMR5zXD1XTGoIEWk995E6pQ=="
     },
+    "node_modules/ts-custom-error": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/ts-custom-error/-/ts-custom-error-3.3.1.tgz",
+      "integrity": "sha512-5OX1tzOjxWEgsr/YEUWSuPrQ00deKLh6D7OTWcvNHm12/7QPyRh8SYpyWvA4IZv8H/+GQWQEh/kwo95Q9OVW1A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
     "node_modules/tslib": {
       "version": "2.8.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
@@ -12272,7 +12977,6 @@
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz",
       "integrity": "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -12378,6 +13082,8 @@
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
       "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
       "dependencies": {
         "punycode": "^2.1.0"
       }
diff --git a/package.json b/package.json
index 187784c..213d7b5 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
   "dependencies": {
     "@ant-design/plots": "^1.2.6",
     "@autocomplete/material-ui": "0.0.17",
+    "@capacitor-mlkit/barcode-scanning": "^8.0.1",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@emotion/react": "^11.11.4",
@@ -23,6 +24,7 @@
     "@tanstack/react-query": "^5.90.11",
     "@tanstack/react-query-devtools": "^5.91.1",
     "@tanstack/react-virtual": "^3.13.18",
+    "@zxing/library": "^0.21.3",
     "antd": "^5.17.4",
     "antd-img-crop": "^4.22.0",
     "aos": "^2.3.4",
@@ -52,6 +54,7 @@
     "mui-autocomplete": "^2.0.1",
     "number-to-words": "^1.2.4",
     "pdf-lib": "^1.17.1",
+    "qr-scanner": "^1.4.2",
     "qrcode": "^1.5.3",
     "qrcode.react": "^4.2.0",
     "react": "^18.3.1",
diff --git a/src/Components/AddProduct/AddProduct.jsx b/src/Components/AddProduct/AddProduct.jsx
index 6a1d6af..23bb908 100644
--- a/src/Components/AddProduct/AddProduct.jsx
+++ b/src/Components/AddProduct/AddProduct.jsx
@@ -53,6 +53,9 @@ export default function AddProduct({ products, setProducts }) {
     return (
         <div className="add-product__container">
             <div className="add-product__header">
+                <div>
+                    Add Product
+                </div>
                 <button className="add-product__add-btn" onClick={addRow}>+ Add Row</button>
             </div>
 
diff --git a/src/Components/Modal/ProductDetailsModal.jsx b/src/Components/Modal/ProductDetailsModal.jsx
index 4f377c0..16754f2 100644
--- a/src/Components/Modal/ProductDetailsModal.jsx
+++ b/src/Components/Modal/ProductDetailsModal.jsx
@@ -1,9 +1,11 @@
-import React from 'react';
+import React, { lazy } from 'react';
 import { DefaultModal } from './DefaultModal';
-import StockReceived from '../../Pages/StockTransfer/StockReceived';
 import Buttons from '../Forms/Buttons';
 import { BiPlus } from 'react-icons/bi';
 import { ArrowRightOutlined } from '@ant-design/icons';
+const StockReceived = lazy(
+  () => import('../../Pages/StockTransfer/StockReceived.jsx')
+);
 
 const ProductDetailsModal = ({
   open,
@@ -11,7 +13,7 @@ const ProductDetailsModal = ({
   productDetails,
   headerData,
   onDataChange,
-  onSubmit
+  onSubmit,
 }) => {
   return (
     <DefaultModal
@@ -23,17 +25,34 @@ const ProductDetailsModal = ({
     >
       <div style={{ overflowX: 'auto' }}>
         {headerData && (
-          <div style={{
-            display: 'flex',
-            gap: '20px',
-            marginBottom: '15px',
-            padding: '10px',
-            backgroundColor: '#f5f5f5',
-            borderRadius: '4px'
-          }}>
-            <div><strong>Dispatch Id:</strong> <span style={{fontSize:"12px"}}>   {headerData.Dispatch_Id}  </span> </div>
-            <div><strong>Date & Time:</strong>   <span style={{fontSize:"12px"}}>  {headerData.dateTime}  </span></div>
-            <div><strong>From Branch:</strong> <span style={{fontSize:"12px"}}>  {headerData.fromBranch}  </span> </div>
+          <div
+            style={{
+              display: 'flex',
+              gap: '20px',
+              marginBottom: '15px',
+              padding: '10px',
+              backgroundColor: '#f5f5f5',
+              borderRadius: '4px',
+            }}
+          >
+            <div>
+              <strong>Dispatch Id:</strong>{' '}
+              <span style={{ fontSize: '12px' }}>
+                {' '}
+                {headerData.Dispatch_Id}{' '}
+              </span>{' '}
+            </div>
+            <div>
+              <strong>Date & Time:</strong>{' '}
+              <span style={{ fontSize: '12px' }}> {headerData.dateTime} </span>
+            </div>
+            <div>
+              <strong>From Branch:</strong>{' '}
+              <span style={{ fontSize: '12px' }}>
+                {' '}
+                {headerData.fromBranch}{' '}
+              </span>{' '}
+            </div>
             {/* <div><strong>dispatched By</strong> {headerData.Created_By}</div> */}
           </div>
         )}
@@ -43,12 +62,14 @@ const ProductDetailsModal = ({
           editable={true}
         />
 
-        <div style={{
-          display: "flex",
-          alignItems: "center",
-          paddingTop: "10px",
-          flexDirection: "row-reverse"
-        }}>
+        <div
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            paddingTop: '10px',
+            flexDirection: 'row-reverse',
+          }}
+        >
           <Buttons
             buttonText={'SUBMIT'}
             handleSubmit={onSubmit}
@@ -63,4 +84,4 @@ const ProductDetailsModal = ({
   );
 };
 
-export default ProductDetailsModal;
\ No newline at end of file
+export default ProductDetailsModal;
diff --git a/src/Components/Modal/ReceivedStocksModal.jsx b/src/Components/Modal/ReceivedStocksModal.jsx
index 193523f..0d8a520 100644
--- a/src/Components/Modal/ReceivedStocksModal.jsx
+++ b/src/Components/Modal/ReceivedStocksModal.jsx
@@ -1,14 +1,14 @@
 import React from 'react';
 import { DefaultModal } from './DefaultModal';
 import { Tables } from '../Tables/Table';
-import "./ReceivedStockModel.scss"
+import './ReceivedStockModel.scss';
 const ReceivedStocksModal = ({
   open,
   onClose,
   columns,
   tableData,
   handlePageChange,
-  customTable = false
+  customTable = false,
 }) => {
   const renderCell = (column, row, index) => {
     if (column.render) {
@@ -28,24 +28,32 @@ const ReceivedStocksModal = ({
       className={'receive-stocks-modal'}
     >
       <>
-
-        {!customTable && <div style={{overflowX:"auto"}}>
-
-          <Tables
-            columns={columns}
-            data={tableData}
-            dataSource={tableData}
-            pagination={handlePageChange}
-          />
-        </div>}
-        {
-          customTable &&
-          <div className="ReceivedStocksModalMaster" >
-            <table style={{ width: "100%" }}>
+        {!customTable && (
+          <div style={{ overflowX: 'auto' }}>
+            <Tables
+              columns={columns}
+              data={tableData}
+              dataSource={tableData}
+              pagination={handlePageChange}
+            />
+          </div>
+        )}
+        {customTable && (
+          <div className="ReceivedStocksModalMaster">
+            <table style={{ width: '100%' }}>
               <thead>
                 <tr>
                   {columns.map((column) => (
-                    <th key={column.key} style={{ textAlign: column.align, width: column.width, backgroundColor: '#f0f8ff', fontFamily: "poppins", fontWeight: "450" }}>
+                    <th
+                      key={column.key}
+                      style={{
+                        textAlign: column.align,
+                        width: column.width,
+                        backgroundColor: '#f0f8ff',
+                        fontFamily: 'poppins',
+                        fontWeight: '450',
+                      }}
+                    >
                       {column.title?.toUpperCase()}
                     </th>
                   ))}
@@ -53,9 +61,12 @@ const ReceivedStocksModal = ({
               </thead>
               <tbody>
                 {tableData.map((row, index) => (
-                  <tr key={row.key || index} style={{ fontSize: "13px" }}>
+                  <tr key={row.key || index} style={{ fontSize: '13px' }}>
                     {columns.map((column) => (
-                      <td key={column.key} style={{ textAlign: column.align, width: column.width }}>
+                      <td
+                        key={column.key}
+                        style={{ textAlign: column.align, width: column.width }}
+                      >
                         {renderCell(column, row, index)}
                       </td>
                     ))}
@@ -64,13 +75,10 @@ const ReceivedStocksModal = ({
               </tbody>
             </table>
           </div>
-        }
-
-
+        )}
       </>
-
     </DefaultModal>
   );
 };
 
-export default ReceivedStocksModal;
\ No newline at end of file
+export default ReceivedStocksModal;
diff --git a/src/Features/BookingScreen/BookingData/BookingData.js b/src/Features/BookingScreen/BookingData/BookingData.js
index 8626441..a8530a3 100644
--- a/src/Features/BookingScreen/BookingData/BookingData.js
+++ b/src/Features/BookingScreen/BookingData/BookingData.js
@@ -149,6 +149,16 @@ export const getConfigType = createAsyncThunk(
     }
   }
 );
+export const getConfigTypeBookingType = createAsyncThunk(
+  'BookingData/getConfigTypeBookingType',
+  async ({ TypeName }) => {
+    if (TypeName != null && TypeName != undefined) {
+      return await axiosRetailInstanceData.get(
+        `/configMaster?TypeName=${TypeName}`
+      );
+    }
+  }
+);
 export const PostBookingData = createAsyncThunk(
   'BookingData/PostBookingdata',
   async (postData) => {
@@ -682,7 +692,6 @@ export const getSelectedFavItems = createAsyncThunk(
       if (fromDate) params.append('fromDate', fromDate);
       if (toDate) params.append('toDate', toDate);
       // let url = `/productCardList?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&Type=A`;
-
       return await axiosRetailInstanceData.get(
         `/productCardList?${params.toString()}`
       );
@@ -858,7 +867,6 @@ export const getCardDataWithoutSubmodule = createAsyncThunk(
           ? { fromDate: data?.fromDate, toDate: data?.toDate }
           : {}),
       });
-
       return await axiosRetailInstanceData.get(
         `/productCardList?${params.toString()}`
       );
@@ -1609,7 +1617,8 @@ const initialState = {
   salesBillEdit: false,
   previousOrderPayment: [],
   previousOrderOfferDetails: [],
-  getmultipleSearchDatas: []
+  getmultipleSearchDatas: [],
+  AllBookingType: [],
 };
 
 const BookingData = createSlice({
@@ -1981,6 +1990,13 @@ const BookingData = createSlice({
           state.ItemCard = [];
         }
       }),
+      builder.addCase(getConfigTypeBookingType.fulfilled, (state, action) => {
+        if (action?.payload?.data?.statusCode === 1) {
+          state.AllBookingType = action?.payload?.data?.data;
+        } else {
+          state.AllBookingType = [];
+        }
+      }),
       builder.addCase(getLayoutsearch.fulfilled, (state, action) => {
         if (action?.payload?.data?.statusCode === 1) {
           state.ItemCard = action?.payload?.data?.data;
@@ -2113,7 +2129,10 @@ const BookingData = createSlice({
     });
     builder.addCase(getmultipleSearch.fulfilled, (state, action) => {
       if (action?.payload?.data?.statusCode === 1) {
-        state.getmultipleSearchDatas = action?.payload?.data?.data[0]?.SearchTermDtl?.map((e) => e?.SearchTerm) || [];
+        state.getmultipleSearchDatas =
+          action?.payload?.data?.data[0]?.SearchTermDtl?.map(
+            (e) => e?.SearchTerm
+          ) || [];
       } else {
         state.getmultipleSearchDatas = [];
       }
@@ -2220,7 +2239,7 @@ export const {
   triggerProductCard,
   changeBillEditingMode,
   changePreviousOrderPayment,
-  changePreviousOrderOfferDetail
+  changePreviousOrderOfferDetail,
 } = BookingData.actions;
 
 export const GlobalComboRedirectionToDefaultLayoutForParking = (state) =>
@@ -2389,13 +2408,14 @@ export const GlobalAddBookingDetailsTrigger = (state) =>
   state?.BookingData?.AddBookingDetailsTrigger;
 export const GlobalCurrentOrderId = (state) =>
   state?.BookingData?.CurrentOrderId;
-export const GlobalSalesBillEdit = (state) =>
-  state?.BookingData?.salesBillEdit;
+export const GlobalSalesBillEdit = (state) => state?.BookingData?.salesBillEdit;
 export const GlobalPreviousOrderPayment = (state) =>
   state?.BookingData?.previousOrderPayment;
 export const GlobalPreviousOrderOfferDetails = (state) =>
   state?.BookingData?.previousOrderOfferDetails;
 export const GlobalGetmultipleSearchDatas = (state) =>
   state?.BookingData?.getmultipleSearchDatas;
+export const GlobalAllBookingType = (state) =>
+  state?.BookingData?.AllBookingType;
 
 export default BookingData.reducer;
diff --git a/src/Features/Payment/PaymentOptions/PaymentOptions.js b/src/Features/Payment/PaymentOptions/PaymentOptions.js
index d73cade..bad66ed 100644
--- a/src/Features/Payment/PaymentOptions/PaymentOptions.js
+++ b/src/Features/Payment/PaymentOptions/PaymentOptions.js
@@ -77,7 +77,7 @@ export const putPaymentOptions = createAsyncThunk(
   }
 );
 export const getPaymentUPIDetails = createAsyncThunk(
-  'getPaymentGatewayDetails', 
+  'getPaymentGatewayDetails',
   async ({ CompId, AppId, BranchId, DetailType }) => {
     if (
       CompId != undefined &&
diff --git a/src/Features/WholeSale/WholesaleData.js b/src/Features/WholeSale/WholesaleData.js
index e2072d3..096b6a6 100644
--- a/src/Features/WholeSale/WholesaleData.js
+++ b/src/Features/WholeSale/WholesaleData.js
@@ -465,8 +465,8 @@ const WholesaleData = createSlice({
       state.WholeSaleEntryList = action?.payload;
     },
     changeWholeSaleSelectedEntryDtl: (state, action) => {
-      (state.WholeSaleSelectedEntryDtl = action?.payload),
-        (state.WholeSaleSelectedProdDtl = [action?.payload?.ProdDetails?.[0]]);
+      ((state.WholeSaleSelectedEntryDtl = action?.payload),
+        (state.WholeSaleSelectedProdDtl = [action?.payload?.ProdDetails?.[0]]));
       state.WholeSaleSelectedGradeDtl = [
         action?.payload?.ProdDetails?.[0].GradeDetails?.[0],
       ];
@@ -513,7 +513,7 @@ const WholesaleData = createSlice({
     },
   },
   extraReducers: (builder) => {
-    builder.addCase(getWholeSaleSupplier.fulfilled, (state, action) => {
+    (builder.addCase(getWholeSaleSupplier.fulfilled, (state, action) => {
       if (action?.payload?.data?.statusCode == 1) {
         state.SupplierDetails = action?.payload?.data?.data;
       } else {
@@ -636,7 +636,7 @@ const WholesaleData = createSlice({
         } else {
           state.WSBookingStatus = [];
         }
-      });
+      }));
   },
 });
 export const {
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBTOverall1.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBTOverall1.jsx
index bcc150e..429e834 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBTOverall1.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBTOverall1.jsx
@@ -1,11 +1,8 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, lazy, Suspense } from 'react';
 import { useSelector } from 'react-redux';
 import { Button, Popover } from 'antd';
 import { AiOutlineClose } from 'react-icons/ai';
 import { IoIosArrowUp } from 'react-icons/io';
-import BSBillingTable1 from '../BSBillingTable1/BSBillingTable1';
-import BST1Payment from '../BSBillingTable1/BST1Payment';
-import BSSummery from '../BSBillingTableSummery/BSSummery';
 import {
   GlobalCustId,
   GlobalSelOption,
@@ -14,13 +11,23 @@ import {
   GlobalOrderStatus,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBTOverall.scss';
-import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities';
-import BSCustomerSelect from '../../UtillComponents/BSSelectCustomer.jsx';
 import PozoAddCustomerIcon from '../../UtillComponents/Pozo retail icons/PozoAddCustomerIcon';
 import { isMobile } from 'react-device-detect';
 import { getTemplateData } from '../../../../../Features/ThemeChange/ThemeChange.js';
 import PozoCartIcon from '../../../../../Pages/BookingScreen/Components/UtillComponents/PozoCartIcon.jsx';
 import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
+// jsx File
+const BSBillingTable1 = lazy(
+  () => import('../BSBillingTable1/BSBillingTable1.jsx')
+);
+const BST1Payment = lazy(() => import('../BSBillingTable1/BST1Payment'));
+const BSSummery = lazy(() => import('../BSBillingTableSummery/BSSummery'));
+const FeaturesFunctionalities = lazy(
+  () => import('../../BookingFunctionality/FeaturesFunctionalities')
+);
+const BSCustomerSelect = lazy(
+  () => import('../../UtillComponents/BSSelectCustomer.jsx')
+);
 
 export default function BSBTOverall1() {
   const [open, setOpen] = useState(false);
@@ -73,7 +80,7 @@ export default function BSBTOverall1() {
     containerHeight = isMobile
       ? ExpDate <= 7
         ? '490px'
-        : '475px'  // billing table 1 height in POS
+        : '475px' // billing table 1 height in POS
       : ExpDate <= 7
         ? '85vh'
         : '';
@@ -121,126 +128,132 @@ export default function BSBTOverall1() {
   }, [width]);
 
   return (
-    <>
-      <div
-        className={
-          templateData?.BookingLayout?.[0] === 'Layout6'
-            ? 'BSBTOverall1-Default layout6-height'
-            : 'BSBTOverall1-Default'
-        }
-        style={{ height: containerHeight }}
-      >
-        {width > 768 && <BSBillingTable1 />}
-        {(addcustomer || hold) && (
-          <FeaturesFunctionalities
-            handleAddCustomerCancel={handleAddCustomerCancel}
-            addcustomer={addcustomer}
-            handleHoldCancel={handleHoldCancel}
-            modalOpen={hold}
-          />
-        )}
-        <div className="BSBTOverall1-div">
-          {width <= 768 && (
-            <div
-              className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
-              style={{
-                transition: 'max-height 0.3s ease-in-out',
-                overflow: 'scroll',
-                maxHeight: responsiveBill ? '210px' : '0px',
-              }}
-            >
-              {tableData && <BSBillingTable1 />}
-            </div>
+    <Suspense fallback={<div>Loading…</div>}>
+      <>
+        <div
+          className={
+            templateData?.BookingLayout?.[0] === 'Layout6'
+              ? 'BSBTOverall1-Default layout6-height'
+              : 'BSBTOverall1-Default'
+          }
+          style={{ height: containerHeight }}
+        >
+          {width > 768 && <BSBillingTable1 />}
+          {(addcustomer || hold) && (
+            <FeaturesFunctionalities
+              handleAddCustomerCancel={handleAddCustomerCancel}
+              addcustomer={addcustomer}
+              handleHoldCancel={handleHoldCancel}
+              modalOpen={hold}
+            />
           )}
-          <div className="BSBTOverall1-Default-summary">
-            {summeryopen == true && (
-              <div className="BSBillingTable1-summary">
-                <button
-                  className="BSBillingTable1-summary-close"
-                  onClick={() => {
-                    setSummeryopen(false);
-                  }}
-                >
-                  X
-                </button>
-              </div>
-            )}
-
-            <Popover
-              content={
-                open && (
-                  <>
-                    <a onClick={hide}>
-                      <AiOutlineClose color="black" />
-                    </a>
-                    <BSSummery />
-                  </>
-                )
-              }
-              trigger="click"
-              open={open}
-              onOpenChange={handleOpenChange}
-            >
-              <Button className="icon-button" onClick={handleOpenChange}>
-                SUMMARY <IoIosArrowUp />
-              </Button>
-            </Popover>
-            <div className="CustomerAddSrch">
-              <div style={{ height: '2.1rem' }}>
-                {tableOptions.find(
-                  (item) => item.OptionName === 'AddCustomer'
-                ) && (
-                  <div
-                    style={{
-                      display: 'flex',
-                      alignItems: 'center',
-                      columnGap: '0.5rem',
-                    }}
-                  >
-                    <BSCustomerSelect />
-
-                    <TooltipWrapper title={'Add Customer'} isMobile={isMobile}>
-                      {' '}
-                      <PozoAddCustomerIcon
-                        className="BSBillingNav-icon-table-icon"
-                        onClick={handleAddCustomer}
-                        style={{
-                          fontSize: '25px',
-                          color: selOption || GetCustId ? '#52c41a' : '#1292EE',
-                          cursor: Custdisable ? 'not-allowed' : 'pointer',
-                        }}
-                      />
-                    </TooltipWrapper>
-                  </div>
-                )}
-              </div>
-            </div>
-            {tableData && (
+          <div className="BSBTOverall1-div">
+            {width <= 768 && (
               <div
-                onClick={handleResponsiveBill}
-                className="Btn-responsiveBill"
-                style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
+                className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
+                style={{
+                  transition: 'max-height 0.3s ease-in-out',
+                  overflow: 'scroll',
+                  maxHeight: responsiveBill ? '210px' : '0px',
+                }}
               >
-                {width <= 768 && (
-                  <div
-                    style={{
-                      width: '28px',
-                      display: 'flex',
-                      alignItems: 'center',
-                      height: '26px',
-                    }}
-                  >
-                    <PozoCartIcon />
-                  </div>
-                )}
+                {tableData && <BSBillingTable1 />}
               </div>
             )}
-          </div>
-          <div>
-            <BST1Payment />
+            <div className="BSBTOverall1-Default-summary">
+              {summeryopen == true && (
+                <div className="BSBillingTable1-summary">
+                  <button
+                    className="BSBillingTable1-summary-close"
+                    onClick={() => {
+                      setSummeryopen(false);
+                    }}
+                  >
+                    X
+                  </button>
+                </div>
+              )}
+
+              <Popover
+                content={
+                  open && (
+                    <>
+                      <a onClick={hide}>
+                        <AiOutlineClose color="black" />
+                      </a>
+                      <BSSummery />
+                    </>
+                  )
+                }
+                trigger="click"
+                open={open}
+                onOpenChange={handleOpenChange}
+              >
+                <Button className="icon-button" onClick={handleOpenChange}>
+                  SUMMARY <IoIosArrowUp />
+                </Button>
+              </Popover>
+              <div className="CustomerAddSrch">
+                <div style={{ height: '2.1rem' }}>
+                  {tableOptions.find(
+                    (item) => item.OptionName === 'AddCustomer'
+                  ) && (
+                    <div
+                      style={{
+                        display: 'flex',
+                        alignItems: 'center',
+                        columnGap: '0.5rem',
+                      }}
+                    >
+                      <BSCustomerSelect />
+
+                      <TooltipWrapper
+                        title={'Add Customer'}
+                        isMobile={isMobile}
+                      >
+                        {' '}
+                        <PozoAddCustomerIcon
+                          className="BSBillingNav-icon-table-icon"
+                          onClick={handleAddCustomer}
+                          style={{
+                            fontSize: '25px',
+                            color:
+                              selOption || GetCustId ? '#52c41a' : '#1292EE',
+                            cursor: Custdisable ? 'not-allowed' : 'pointer',
+                          }}
+                        />
+                      </TooltipWrapper>
+                    </div>
+                  )}
+                </div>
+              </div>
+              {tableData && (
+                <div
+                  onClick={handleResponsiveBill}
+                  className="Btn-responsiveBill"
+                  style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
+                >
+                  {width <= 768 && (
+                    <div
+                      style={{
+                        width: '28px',
+                        display: 'flex',
+                        alignItems: 'center',
+                        height: '26px',
+                      }}
+                    >
+                      <PozoCartIcon />
+                    </div>
+                  )}
+                </div>
+              )}
+            </div>
+            <div>
+              <BST1Payment />
+            </div>
           </div>
         </div>
-      </div>
-    </>
+      </>
+    </Suspense>
   );
 }
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBillingTable1.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBillingTable1.jsx
index 4b15324..e4e1cbe 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBillingTable1.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBillingTable1.jsx
@@ -6,7 +6,6 @@ import WebFont from 'webfontloader';
 import { isMobile } from 'react-device-detect';
 import dineInIcon from '../../../../../Images/Dine In.svg';
 import TakeAwayIcon from '../../../../../Images/Take away.svg';
-import { settingDataSelector } from '../../../../../Features/PreferenceMaster/PreferenceMaster.js';
 import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
 import {
   ChangeTotalAmount,
@@ -18,13 +17,10 @@ import {
   puttinghold,
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption.js';
 import {
-  ChangeOfferAppliedProducts,
-  ChangeFreeProductList,
   ChangeFullFreeProductList,
   GlobalFreeProdList,
   GlobalOfferAppliedProducts,
   changeFullOfferAppliedProducts,
-  changeLoyaltyConsumedQuantities,
   ClearOfferAppliedProducts,
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 
@@ -76,11 +72,17 @@ import {
   changePreviousOrderPayment,
   changePreviousOrderOfferDetail,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
-import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
-import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
-import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBillingTable1.scss';
 import { useUtilsComponent } from '../../../../../Services/utils.js';
-import CustomerPriceHistory from '../../UtillComponents/CustomerPriceHistory.jsx';
+// Jsx Files
+const BSEditTotalAmt = lazy(
+  () => import('../BSEditTotalAmount/BSEditTotalAmt.jsx')
+);
+
+const BSImeiDetails = lazy(() => import('../BSImeiDetails/BSImeiDetails.jsx'));
+const CustomerPriceHistory = lazy(
+  () => import('../../UtillComponents/CustomerPriceHistory.jsx')
+); // Scss File
+import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBillingTable1.scss';
 
 const BSBillingTable1 = () => {
   const { removeExtraCharge } = useUtilsComponent();
@@ -142,7 +144,8 @@ const BSBillingTable1 = () => {
   const GetCustId = useSelector(GlobalCustId);
   const selectedCustomer = useSelector(GlobalSelOption);
 
-  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] = useState(false);
+  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] =
+    useState(false);
   const [customerProduct, setCustomerProduct] = useState(null);
 
   const tableDataDinein = tableData?.filter(
@@ -152,8 +155,8 @@ const BSBillingTable1 = () => {
     OrderType === 'Hold'
       ? tableData?.filter((a, b) => a.BookingTypeName === 'TakeAway')
       : tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
-      );
+          (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
+        );
 
   const OldtableDataDinein = tableData?.filter(
     (a, b) => a.BookingTypeName === 'Dine In' && a?.SalesId
@@ -161,8 +164,8 @@ const BSBillingTable1 = () => {
   const OldtableDataTakeAway =
     OrderType != 'Hold'
       ? tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
-      )
+          (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
+        )
       : [];
   const [OpenEditTotalAmt, setOpenEditTotalAmt] = useState(false);
   const [OpenImeiDetail, setOpenImeiDetail] = useState(false);
@@ -320,7 +323,6 @@ const BSBillingTable1 = () => {
         event.preventDefault();
         handleShortcut('weightAmount');
       }
-
     };
     window.addEventListener('keydown', handleKeyDown);
 
@@ -329,11 +331,6 @@ const BSBillingTable1 = () => {
     };
   }, [preferenceshortcutkey, tableDataTakeAway, tableDataDinein, BillOrderPre]);
 
-
-
-
-
-
   function safeRound(amountStr) {
     if (amountStr == null) return allowDecimal ? '0.00' : '0';
 
@@ -347,7 +344,7 @@ const BSBillingTable1 = () => {
   const handleCustomerProductPriceHistory = (item) => {
     setCustomerPriceHistoryOpen(true);
     setCustomerProduct(item?.ProdId);
-  }
+  };
 
   const getstockbadge = async () => {
     let data = {
@@ -1133,9 +1130,9 @@ const BSBillingTable1 = () => {
             )?.map((item, idx) =>
               idx === 0
                 ? {
-                  ...item,
-                  FreeQty,
-                }
+                    ...item,
+                    FreeQty,
+                  }
                 : item
             ),
           };
@@ -1855,7 +1852,6 @@ const BSBillingTable1 = () => {
                   insideinwardDtlId: false,
                 });
               } else {
-                let data = isCheckFreeProductOutside?.FreeQty - item?.OrderQty;
                 //First i Calculate Another Booking Type Qty
                 let anotherBookingType = tableData?.find(
                   (e) =>
@@ -1870,21 +1866,6 @@ const BSBillingTable1 = () => {
                     e?.BookingTypeName != item?.BookingTypeName
                 );
 
-                let diff =
-                  item?.OrderQty - FreeProductSameBookingType?.OrderQty;
-
-                //SameBookingFreeQty
-                //FreeProductSameBookingType?.OrderQty
-
-                //Another BookingType Paid Qty
-                //anotherBookingType
-
-                //anotherBookingType?.Free OrderQty
-                //ischeckBothBookingType
-
-                //anotherBookingType?.OrderQty-ischeckBothBookingType?.OrderQty
-                //convert another Booking Type Qty also Free to Paid
-
                 if (
                   (anotherBookingType?.OrderQty || 0) <
                   anotherBookingTypeOffer?.OrderQty
@@ -2042,145 +2023,7 @@ const BSBillingTable1 = () => {
         }
       }
     }
-
   };
-  // const removeFromCart = async (item) => {
-  //   setPreviousdataLength(tableData?.length);
-  //   if (item?.BookingTypeName !== 'Dine In' && OrderType !== 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName !== 'Dine In' && OrderType === 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(ChangeTotalAmount([]));
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName === 'Dine In') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     ); // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(ChangeSelectedCustDisable(false));
-  //       await dispatch(changeSelectedOption(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   }
-  // };
 
   const OpenEditTotalAmount = () => {
     setOpenEditTotalAmt(true);
@@ -2190,195 +2033,211 @@ const BSBillingTable1 = () => {
   };
 
   return (
-    <>
-      <div className="BillingTable1-Structure" style={{ overflow: 'auto' }}>
-        <div className="BillingTable1-table-div">
-          <table className="Billing-Table1">
-            <thead className="Billing-Table1-head">
-              <tr
-                style={{
-                  fontFamily: SelectedFont,
-                  color: SelectedBillColor?.['FontColor'],
-                  backgroundColor: SelectedBillColor?.['BackgroundColor'],
-                }}
-              >
-                {tableOptions?.map((item) => (
-                  <>
-                    {item.OptionName == 'Sl.No' && BookingTypeBoth && (
-                      <th
-                        style={{
-                          fontFamily: SelectedFont,
-                          fontWeight: '600',
-                          fontSize: '13px',
-                          width: '15px',
-                          padding: '1px',
-                        }}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="Serial Number">{''}</Tooltip>
-                        ) : (
-                          <div>{''}</div>
-                        )}
-                      </th>
-                    )}
-                    {item.OptionName == 'Sl.No' && (
-                      <th
-                        style={{
-                          fontFamily: SelectedFont,
-                          fontWeight: '600',
-                          fontSize: '13px',
-                          width: '10px',
-                        }}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="Serial Number">Sl.No</Tooltip>
-                        ) : (
-                          <div>Sl.No</div>
-                        )}
-                      </th>
-                    )}
-                    {item.OptionName == 'Item' && (
-                      <th
-                        className="BillingTable1-table-th"
-                        style={{
-                          fontFamily: SelectedFont,
-                          color: SelectedBillColor?.['FontColor'],
-                          fontWeight: '600',
-                          fontSize: '14px',
-                        }}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="Item Name">Item</Tooltip>
-                        ) : (
-                          <div> Item </div>
-                        )}
-                      </th>
-                    )}
-                    {item.OptionName == 'MRP' && (
-                      <th
-                        className="BillingTable1-table-th"
-                        style={{
-                          fontFamily: SelectedFont,
-                          color: SelectedBillColor?.['FontColor'],
-                          fontWeight: '600',
-                          fontSize: '14px',
-                          width: '20px',
-                        }}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="MRP">MRP</Tooltip>
-                        ) : (
-                          <div>MRP</div>
-                        )}
-                      </th>
-                    )}
-                    {item.OptionName == 'Discount' && (
-                      <th
-                        className="BillingTable1-table-th"
-                        style={{
-                          fontFamily: SelectedFont,
-                          color: SelectedBillColor?.['FontColor'],
-                          fontWeight: '600',
-                          fontSize: '14px',
-                          width: '20px',
-                        }}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="Discount">₹/%</Tooltip>
-                        ) : (
-                          <div>₹/% </div>
-                        )}
-                      </th>
-                    )}
-                    {item.OptionName == 'Quantity' && (
-                      <th
-                        className="BillingTable1-table-th"
-                        style={{
-                          fontFamily: SelectedFont,
-                          color: SelectedBillColor?.['FontColor'],
-                          fontWeight: '600',
-                          fontSize: '14px',
-                          width: '20px',
-                        }}
-                        onClick={() => {
-                          if (tableData?.length > 0) {
-                            OpenEditTotalAmount();
-                          }
-                        }}
-                      // onClick={tableData?.length>0? OpenEditTotalAmount :""}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="Quantity">Qty</Tooltip>
-                        ) : (
-                          <div>Qty</div>
-                        )}
-                      </th>
-                    )}
-                    {item.OptionName == 'Rate' && (
-                      <th
-                        className="BillingTable1-table-th"
-                        style={{
-                          fontFamily: SelectedFont,
-                          color: SelectedBillColor?.['FontColor'],
-                          fontWeight: '600',
-                          fontSize: '14px',
-                          width: '20px',
-                        }}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="Rate">Rt</Tooltip>
-                        ) : (
-                          <div> Rt </div>
-                        )}
-                      </th>
-                    )}
-                    {item.OptionName == 'Amount' && (
-                      <th
-                        className="BillingTable1-table-th"
-                        style={{
-                          fontFamily: SelectedFont,
-                          color: SelectedBillColor?.['FontColor'],
-                          fontWeight: '600',
-                          fontSize: '14px',
-                          width: '20px',
-                        }}
-                      >
-                        {!isMobile ? (
-                          <Tooltip title="Amount">Amt</Tooltip>
-                        ) : (
-                          <div>Amt</div>
-                        )}
-                      </th>
-                    )}
+    <Suspense fallback={<div>Loading…</div>}>
+      <>
+        <div className="BillingTable1-Structure" style={{ overflow: 'auto' }}>
+          <div className="BillingTable1-table-div">
+            <table className="Billing-Table1">
+              <thead className="Billing-Table1-head">
+                <tr
+                  style={{
+                    fontFamily: SelectedFont,
+                    color: SelectedBillColor?.['FontColor'],
+                    backgroundColor: SelectedBillColor?.['BackgroundColor'],
+                  }}
+                >
+                  {tableOptions?.map((item) => (
+                    <>
+                      {item.OptionName == 'Sl.No' && BookingTypeBoth && (
+                        <th
+                          style={{
+                            fontFamily: SelectedFont,
+                            fontWeight: '600',
+                            fontSize: '13px',
+                            width: '15px',
+                            padding: '1px',
+                          }}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="Serial Number">{''}</Tooltip>
+                          ) : (
+                            <div>{''}</div>
+                          )}
+                        </th>
+                      )}
+                      {item.OptionName == 'Sl.No' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            fontWeight: '600',
+                            fontSize: '13px',
+                            width: '10px',
+                          }}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="Serial Number">Sl.No</Tooltip>
+                          ) : (
+                            <div>Sl.No</div>
+                          )}
+                        </th>
+                      )}
+                      {item.OptionName == 'Item' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            color: SelectedBillColor?.['FontColor'],
+                            fontWeight: '600',
+                            fontSize: '14px',
+                          }}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="Item Name">Item</Tooltip>
+                          ) : (
+                            <div> Item </div>
+                          )}
+                        </th>
+                      )}
+                      {item.OptionName == 'MRP' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            color: SelectedBillColor?.['FontColor'],
+                            fontWeight: '600',
+                            fontSize: '14px',
+                            width: '20px',
+                          }}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="MRP">MRP</Tooltip>
+                          ) : (
+                            <div>MRP</div>
+                          )}
+                        </th>
+                      )}
+                      {item.OptionName == 'Discount' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            color: SelectedBillColor?.['FontColor'],
+                            fontWeight: '600',
+                            fontSize: '14px',
+                            width: '20px',
+                          }}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="Discount">₹/%</Tooltip>
+                          ) : (
+                            <div>₹/% </div>
+                          )}
+                        </th>
+                      )}
+                      {item.OptionName == 'Quantity' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            color: SelectedBillColor?.['FontColor'],
+                            fontWeight: '600',
+                            fontSize: '14px',
+                            width: '20px',
+                          }}
+                          onClick={() => {
+                            if (tableData?.length > 0) {
+                              OpenEditTotalAmount();
+                            }
+                          }}
+                          // onClick={tableData?.length>0? OpenEditTotalAmount :""}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="Quantity">Qty</Tooltip>
+                          ) : (
+                            <div>Qty</div>
+                          )}
+                        </th>
+                      )}
+                      {item.OptionName == 'Rate' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            color: SelectedBillColor?.['FontColor'],
+                            fontWeight: '600',
+                            fontSize: '14px',
+                            width: '20px',
+                          }}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="Rate">Rt</Tooltip>
+                          ) : (
+                            <div> Rt </div>
+                          )}
+                        </th>
+                      )}
+                      {item.OptionName == 'Amount' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            color: SelectedBillColor?.['FontColor'],
+                            fontWeight: '600',
+                            fontSize: '14px',
+                            width: '20px',
+                          }}
+                        >
+                          {!isMobile ? (
+                            <Tooltip title="Amount">Amt</Tooltip>
+                          ) : (
+                            <div>Amt</div>
+                          )}
+                        </th>
+                      )}
 
-                    {item.OptionName == 'Delete' && (
-                      <th
-                        className="BillingTable1-table-th"
-                        style={{
-                          fontFamily: SelectedFont,
-                          color: SelectedBillColor?.['FontColor'],
-                          fontWeight: '600',
-                          fontSize: '14px',
-                          width: '10px',
-                        }}
-                      >
-                        {tableData?.length > 0 ? (
-                          <Popconfirm
-                            placement="leftTop"
-                            title="Delete the items"
-                            description="Are you sure you want to clear these items?"
-                            okText="Yes"
-                            cancelText="No"
-                            onConfirm={() => {
-                              Clearall();
-                            }}
-                          >
+                      {item.OptionName == 'Delete' && (
+                        <th
+                          className="BillingTable1-table-th"
+                          style={{
+                            fontFamily: SelectedFont,
+                            color: SelectedBillColor?.['FontColor'],
+                            fontWeight: '600',
+                            fontSize: '14px',
+                            width: '10px',
+                          }}
+                        >
+                          {tableData?.length > 0 ? (
+                            <Popconfirm
+                              placement="leftTop"
+                              title="Delete the items"
+                              description="Are you sure you want to clear these items?"
+                              okText="Yes"
+                              cancelText="No"
+                              onConfirm={() => {
+                                Clearall();
+                              }}
+                            >
+                              <div className="del-all-btn">
+                                {' '}
+                                {!isMobile ? (
+                                  <Tooltip title="Delete All" placement="left">
+                                    {' '}
+                                    <AiFillDelete />{' '}
+                                  </Tooltip>
+                                ) : (
+                                  <div>
+                                    {' '}
+                                    <AiFillDelete />{' '}
+                                  </div>
+                                )}
+                              </div>
+                            </Popconfirm>
+                          ) : (
                             <div className="del-all-btn">
-                              {' '}
                               {!isMobile ? (
-                                <Tooltip title="Delete All" placement="left">
-                                  {' '}
-                                  <AiFillDelete />{' '}
+                                <Tooltip title="Delete" placement="left">
+                                  <AiFillDelete />
                                 </Tooltip>
                               ) : (
                                 <div>
@@ -2387,456 +2246,458 @@ const BSBillingTable1 = () => {
                                 </div>
                               )}
                             </div>
-                          </Popconfirm>
-                        ) : (
-                          <div className="del-all-btn">
-                            {!isMobile ? (
-                              <Tooltip title="Delete" placement="left">
-                                <AiFillDelete />
-                              </Tooltip>
-                            ) : (
-                              <div>
-                                {' '}
-                                <AiFillDelete />{' '}
-                              </div>
-                            )}
-                          </div>
-                        )}
-                      </th>
-                    )}
-                  </>
-                ))}
-              </tr>
-            </thead>
-            {OldtableDataTakeAway?.length > 0 && (
-              <tbody className="Billing-Table1-body">
-                {OldtableDataTakeAway?.map((item, index) => (
-                  <tr
-                    key={index}
-                    className={`${item?.SalesId && OrderType !== 'Hold'
-                      ? 'Billing-Table1-row-disabled'
-                      : 'Billing-Table1-row'
+                          )}
+                        </th>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              </thead>
+              {OldtableDataTakeAway?.length > 0 && (
+                <tbody className="Billing-Table1-body">
+                  {OldtableDataTakeAway?.map((item, index) => (
+                    <tr
+                      key={index}
+                      className={`${
+                        item?.SalesId && OrderType !== 'Hold'
+                          ? 'Billing-Table1-row-disabled'
+                          : 'Billing-Table1-row'
                       } 
                                         
                                         `}
-                    style={{
-                      fontFamily: SelectedFont ? SelectedFont : '',
+                      style={{
+                        fontFamily: SelectedFont ? SelectedFont : '',
 
-                      backgroundColor:
-                        BillOrderPre === 'Y'
-                          ? item?.SalesId && OrderType !== 'Hold'
+                        backgroundColor:
+                          BillOrderPre === 'Y'
+                            ? item?.SalesId && OrderType !== 'Hold'
+                              ? 'rgb(243, 248, 213)'
+                              : triggerAnimation &&
+                                  index === 0 &&
+                                  !item?.SalesId &&
+                                  tableDataTakeAway?.length >=
+                                    PreviousdataLength
+                                ? 'wheat'
+                                : triggerAnimation &&
+                                    index === 0 &&
+                                    tableDataTakeAway?.length >=
+                                      PreviousdataLength &&
+                                    !HoldOrderDtl &&
+                                    !UnpaidData
+                                  ? 'wheat'
+                                  : 'inherit'
+                            : 'none',
+                        background:
+                          item?.SalesId && OrderType !== 'Hold'
                             ? 'rgb(243, 248, 213)'
-                            : triggerAnimation &&
+                            : GlobEstBooking === 'ParEst' &&
+                                GlobProdwisedata?.includes(
+                                  item?.InwardDtlId +
+                                    ' ' +
+                                    item?.BookingTypeName
+                                )
+                              ? '#b2d1f7'
+                              : index % 2 === 0
+                                ? 'white'
+                                : SelectedBillColor?.['OverallBackgroundColor']
+                                  ? SelectedBillColor?.[
+                                      'OverallBackgroundColor'
+                                    ]
+                                  : '#d6d6d6',
+                        animation:
+                          BillOrderPre === 'Y' && !BookingTypeBoth
+                            ? triggerAnimation &&
                               index === 0 &&
                               !item?.SalesId &&
-                              tableDataTakeAway?.length >= PreviousdataLength
-                              ? 'wheat'
-                              : triggerAnimation &&
-                                index === 0 &&
-                                tableDataTakeAway?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
+                              tableDataTakeAway?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
+                              ? 'splashAnimation 0.5s ease-in-out'
+                              : 'none'
+                            : 'none',
+                      }}
+                    >
+                      {tableOptions?.map((tableitem) => (
+                        <>
+                          {BookingTypeBoth &&
+                            index == 0 &&
+                            tableitem.OptionName == 'Sl.No' && (
+                              <td
+                                rowSpan={tableData.length}
+                                style={{ backgroundColor: '#CFB59D' }}
+                              >
+                                <img width="30px" alt="" src={TakeAwayIcon} />
+                              </td>
+                            )}
+
+                          {tableitem.OptionName == 'Sl.No' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'center',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {index + 1}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Item' && (
+                            <td
+                              className="BillingTable1-table-td for-combo"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'left',
+                              }}
+                              onClick={() =>
+                                item.FullProductIdentifierDtls?.length > 0 ||
+                                item.ProductIdentifierDtls?.length > 0
+                                  ? handleImeiDetails(item)
+                                  : editField && handleEditQuantity(item)
+                              }
+                            >
+                              {item.ProdName}
+                              &nbsp;{' '}
+                              {item?.BrandName !== null ? item?.BrandName : ''}
+                              {item?.Type != 'C' && (
+                                <>
+                                  <p
+                                    className="Tbl1-Variant"
+                                    style={{ fontFamily: 'Poppins' }}
+                                  >
+                                    (
+                                    {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                      'variant'
+                                    ) && <span>{item?.ProdVariantName} </span>}
+                                    {item?.Size}
+                                    {item?.SinglePc == 'Y'
+                                      ? 'PCS'
+                                      : item?.UomName}
+                                    )
+                                  </p>
+                                  {item?.OfferMessage &&
+                                    !Array.isArray(item.OfferMessage) && (
+                                      <p
+                                        className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                      >
+                                        {item.OfferMessage?.split('>')?.[0] +
+                                          `> ${item?.OrderQty} Eligible Free`}
+                                      </p>
+                                    )}
+                                </>
+                              )}
+                              {item?.Type === 'C' && (
+                                <div
+                                  className="Tbl1-Variant"
+                                  style={{ fontFamily: 'Poppins' }}
+                                >
+                                  {item.ProdDetail?.map((prod, index) => (
+                                    <p key={index}>
+                                      {prod.ProdName} - {prod.Size}{' '}
+                                      {prod.UomName}
+                                    </p>
+                                  ))}
+                                </div>
+                              )}
+                              {productBasedExtraCharges?.find(
+                                (find) => find.ProdId === item.ProdId
+                              ) !== undefined && (
+                                <div
+                                  style={{
+                                    fontSize: '10px',
+                                    fontWeight: '500',
+                                    whiteSpace: 'nowrap',
+                                  }}
+                                >
+                                  Extra Charges :{' '}
+                                  {
+                                    productBasedExtraCharges?.find(
+                                      (find) => find.ProdId === item.ProdId
+                                    )?.TotalAmt
+                                  }
+                                </div>
+                              )}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'MRP' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.MRP}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Discount' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item?.Type != 'C'
+                                ? item.Offer && item.Offer > 0
+                                  ? item.Offer
+                                  : '-'
+                                : item?.OfferPrice && item?.OfferPrice > 0
+                                  ? item?.OfferType === 'F'
+                                    ? `₹${item.OfferPrice}`
+                                    : `${item.OfferPrice}%`
+                                  : '-'}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Quantity' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.OrderQty}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Rate' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(item?.OrderRate || 0).toFixed(2)
+                                : Number(item?.OrderRate || 0)}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Amount' && (
+                            <td
+                              className="BillingTable1-table-td forcomboalign"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                // if (editField) {
+                                //   handleEditQuantity(item);
+                                // }
+                                if (GetCustId) {
+                                  handleCustomerProductPriceHistory(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  ).toFixed(2)
+                                : Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  )}
+                            </td>
+                          )}
+
+                          {tableitem.OptionName == 'Delete' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{ fontFamily: 'Poppins' }}
+                              onClick={() => removeFromCart(item)}
+                            >
+                              <AiOutlineClose
+                                style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                              />
+                            </td>
+                          )}
+                        </>
+                      ))}
+                    </tr>
+                  ))}
+                  {EditQuantity && OldtableDataTakeAway?.length > 0 && (
+                    <BSBillingEditQuantity
+                      handleEditQuantityCancel={handleEditQuantityCancel}
+                      BSBillingEditQuantity={EditQuantity}
+                      Productdata={Modaldata}
+                      Index={Index}
+                      shortKeyMethod={shortKeyMethod}
+                    />
+                  )}
+                </tbody>
+              )}
+              {OldtableDataDinein?.length > 0 && (
+                <tbody className="Billing-Table1-body">
+                  {OldtableDataDinein?.map((item, index) => (
+                    <tr
+                      key={OldtableDataTakeAway?.length + index}
+                      className={`${
+                        item?.SalesId
+                          ? 'Billing-Table1-row-disabled'
+                          : 'Billing-Table1-row'
+                      } 
+                                        
+                                        `}
+                      style={{
+                        fontFamily: SelectedFont ? SelectedFont : '',
+
+                        backgroundColor:
+                          BillOrderPre === 'Y'
+                            ? item?.SalesId
+                              ? 'rgb(243, 248, 213)'
+                              : BookingType === 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataTakeAway?.length + index === 0 &&
+                                  !item?.SalesId &&
+                                  tableDataDinein?.length >= PreviousdataLength
                                 ? 'wheat'
-                                : 'inherit'
-                          : 'none',
-                      background:
-                        item?.SalesId && OrderType !== 'Hold'
+                                : BookingType !== 'Dine In' &&
+                                    triggerAnimation &&
+                                    OldtableDataTakeAway?.length + index ===
+                                      0 &&
+                                    tableDataDinein?.length >=
+                                      PreviousdataLength &&
+                                    !HoldOrderDtl &&
+                                    !UnpaidData
+                                  ? 'wheat'
+                                  : 'inherit'
+                            : 'none',
+                        background: item?.SalesId
                           ? 'rgb(243, 248, 213)'
                           : GlobEstBooking === 'ParEst' &&
-                            GlobProdwisedata?.includes(
-                              item?.InwardDtlId + ' ' + item?.BookingTypeName
-                            )
+                              GlobProdwisedata?.includes(
+                                item?.InwardDtlId + ' ' + item?.BookingTypeName
+                              )
                             ? '#b2d1f7'
-                            : index % 2 === 0
+                            : (OldtableDataTakeAway?.length + index) % 2 === 0
                               ? 'white'
                               : SelectedBillColor?.['OverallBackgroundColor']
                                 ? SelectedBillColor?.['OverallBackgroundColor']
                                 : '#d6d6d6',
-                      animation:
-                        BillOrderPre === 'Y' && !BookingTypeBoth
-                          ? triggerAnimation &&
-                            index === 0 &&
-                            !item?.SalesId &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'splashAnimation 0.5s ease-in-out'
-                            : 'none'
-                          : 'none',
-                    }}
-                  >
-                    {tableOptions?.map((tableitem) => (
-                      <>
-                        {BookingTypeBoth &&
-                          index == 0 &&
-                          tableitem.OptionName == 'Sl.No' && (
-                            <td
-                              rowspan={tableData.length}
-                              style={{ backgroundColor: '#CFB59D' }}
-                            >
-                              <img width="30px" alt="" src={TakeAwayIcon} />
-                            </td>
-                          )}
-
-                        {tableitem.OptionName == 'Sl.No' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'center',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {index + 1}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Item' && (
-                          <td
-                            className="BillingTable1-table-td for-combo"
-                            style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                            onClick={() =>
-                              item.FullProductIdentifierDtls?.length > 0 ||
-                                item.ProductIdentifierDtls?.length > 0
-                                ? handleImeiDetails(item)
-                                : editField && handleEditQuantity(item)
-                            }
-                          >
-                            {item.ProdName}
-                            &nbsp;{' '}
-                            {item?.BrandName !== null ? item?.BrandName : ''}
-                            {item?.Type != 'C' && (
-                              <>
-                                <p
-                                  className="Tbl1-Variant"
-                                  style={{ fontFamily: 'Poppins' }}
-                                >
-                                  (
-                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                    'variant'
-                                  ) && <span>{item?.ProdVariantName} </span>}
-                                  {item?.Size}
-                                  {item?.SinglePc == 'Y'
-                                    ? 'PCS'
-                                    : item?.UomName}
-                                  )
-                                </p>
-                                {item?.OfferMessage &&
-                                  !Array.isArray(item.OfferMessage) && (
-                                    <p
-                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                    >
-                                      {item.OfferMessage?.split('>')?.[0] +
-                                        `> ${item?.OrderQty} Eligible Free`}
-                                    </p>
-                                  )}
-                              </>
-                            )}
-                            {item?.Type === 'C' && (
-                              <div
-                                className="Tbl1-Variant"
-                                style={{ fontFamily: 'Poppins' }}
-                              >
-                                {item.ProdDetail?.map((prod, index) => (
-                                  <p key={index}>
-                                    {prod.ProdName} - {prod.Size} {prod.UomName}
-                                  </p>
-                                ))}
-                              </div>
-                            )}
-                            {productBasedExtraCharges?.find(
-                              (find) => find.ProdId === item.ProdId
-                            ) !== undefined && (
-                                <div
-                                  style={{
-                                    fontSize: '10px',
-                                    fontWeight: '500',
-                                    whiteSpace: 'nowrap',
-                                  }}
-                                >
-                                  Extra Charges :{' '}
-                                  {
-                                    productBasedExtraCharges?.find(
-                                      (find) => find.ProdId === item.ProdId
-                                    )?.TotalAmt
-                                  }
-                                </div>
-                              )}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'MRP' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.MRP}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Discount' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item?.Type != 'C'
-                              ? item.Offer && item.Offer > 0
-                                ? item.Offer
-                                : '-'
-                              : item?.OfferPrice && item?.OfferPrice > 0
-                                ? item?.OfferType === 'F'
-                                  ? `₹${item.OfferPrice}`
-                                  : `${item.OfferPrice}%`
-                                : '-'}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Quantity' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.OrderQty}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Rate' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(item?.OrderRate || 0).toFixed(2)
-                              : Number(item?.OrderRate || 0)}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Amount' && (
-                          <td
-                            className="BillingTable1-table-td forcomboalign"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              // if (editField) {
-                              //   handleEditQuantity(item);
-                              // }
-                              if (GetCustId) {
-                                handleCustomerProductPriceHistory(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              ).toFixed(2)
-                              : Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              )}
-                          </td>
-                        )}
-
-                        {tableitem.OptionName == 'Delete' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{ fontFamily: 'Poppins' }}
-                            onClick={() => removeFromCart(item)}
-                          >
-                            <AiOutlineClose
-                              style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                            />
-                          </td>
-                        )}
-                      </>
-                    ))}
-                  </tr>
-                ))}
-                {EditQuantity && OldtableDataTakeAway?.length > 0 && (
-                  <BSBillingEditQuantity
-                    handleEditQuantityCancel={handleEditQuantityCancel}
-                    BSBillingEditQuantity={EditQuantity}
-                    Productdata={Modaldata}
-                    Index={Index}
-                    shortKeyMethod={shortKeyMethod}
-                  />
-                )}
-              </tbody>
-            )}
-            {OldtableDataDinein?.length > 0 && (
-              <tbody className="Billing-Table1-body">
-                {OldtableDataDinein?.map((item, index) => (
-                  <tr
-                    key={OldtableDataTakeAway?.length + index}
-                    className={`${item?.SalesId
-                      ? 'Billing-Table1-row-disabled'
-                      : 'Billing-Table1-row'
-                      } 
-                                        
-                                        `}
-                    style={{
-                      fontFamily: SelectedFont ? SelectedFont : '',
-
-                      backgroundColor:
-                        BillOrderPre === 'Y'
-                          ? item?.SalesId
-                            ? 'rgb(243, 248, 213)'
-                            : BookingType === 'Dine In' &&
-                              triggerAnimation &&
+                        animation:
+                          BillOrderPre === 'Y' && !BookingTypeBoth
+                            ? triggerAnimation &&
                               OldtableDataTakeAway?.length + index === 0 &&
                               !item?.SalesId &&
-                              tableDataDinein?.length >= PreviousdataLength
-                              ? 'wheat'
-                              : BookingType !== 'Dine In' &&
-                                triggerAnimation &&
-                                OldtableDataTakeAway?.length + index === 0 &&
-                                tableDataDinein?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
-                                ? 'wheat'
-                                : 'inherit'
-                          : 'none',
-                      background: item?.SalesId
-                        ? 'rgb(243, 248, 213)'
-                        : GlobEstBooking === 'ParEst' &&
-                          GlobProdwisedata?.includes(
-                            item?.InwardDtlId + ' ' + item?.BookingTypeName
-                          )
-                          ? '#b2d1f7'
-                          : (OldtableDataTakeAway?.length + index) % 2 === 0
-                            ? 'white'
-                            : SelectedBillColor?.['OverallBackgroundColor']
-                              ? SelectedBillColor?.['OverallBackgroundColor']
-                              : '#d6d6d6',
-                      animation:
-                        BillOrderPre === 'Y' && !BookingTypeBoth
-                          ? triggerAnimation &&
-                            OldtableDataTakeAway?.length + index === 0 &&
-                            !item?.SalesId &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'splashAnimation 0.5s ease-in-out'
-                            : 'none'
-                          : 'none',
-                    }}
-                  >
-                    {tableOptions?.map((tableitem) => (
-                      <>
-                        {BookingTypeBoth &&
-                          index == 0 &&
-                          tableitem.OptionName == 'Sl.No' && (
+                              tableDataDinein?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
+                              ? 'splashAnimation 0.5s ease-in-out'
+                              : 'none'
+                            : 'none',
+                      }}
+                    >
+                      {tableOptions?.map((tableitem) => (
+                        <>
+                          {BookingTypeBoth &&
+                            index == 0 &&
+                            tableitem.OptionName == 'Sl.No' && (
+                              <td
+                                rowSpan={tableData.length}
+                                style={{ backgroundColor: '#A2C3CD' }}
+                              >
+                                <img width="30px" alt="" src={dineInIcon} />
+                              </td>
+                            )}
+
+                          {tableitem.OptionName == 'Sl.No' && (
                             <td
-                              rowspan={tableData.length}
-                              style={{ backgroundColor: '#A2C3CD' }}
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'center',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
                             >
-                              <img width="30px" alt="" src={dineInIcon} />
+                              {OldtableDataTakeAway?.length + index + 1}
                             </td>
                           )}
-
-                        {tableitem.OptionName == 'Sl.No' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'center',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {OldtableDataTakeAway?.length + index + 1}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Item' && (
-                          <td
-                            className="BillingTable1-table-td for-combo"
-                            style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.ProdName}
-                            &nbsp;{' '}
-                            {item?.BrandName !== null ? item?.BrandName : ''}
-                            {item?.Type != 'C' && (
-                              <>
-                                <p
+                          {tableitem.OptionName == 'Item' && (
+                            <td
+                              className="BillingTable1-table-td for-combo"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'left',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.ProdName}
+                              &nbsp;{' '}
+                              {item?.BrandName !== null ? item?.BrandName : ''}
+                              {item?.Type != 'C' && (
+                                <>
+                                  <p
+                                    className="Tbl1-Variant"
+                                    style={{ fontFamily: 'Poppins' }}
+                                  >
+                                    (
+                                    {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                      'variant'
+                                    ) && <span>{item?.ProdVariantName} </span>}
+                                    {item?.Size}
+                                    {item?.SinglePc == 'Y'
+                                      ? 'PCS'
+                                      : item?.UomName}
+                                    )
+                                  </p>
+                                  {item?.OfferMessage &&
+                                    !Array.isArray(item.OfferMessage) && (
+                                      <p
+                                        className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                      >
+                                        {item.OfferMessage?.split('>')?.[0] +
+                                          `> ${item?.OrderQty} Eligible Free`}
+                                      </p>
+                                    )}
+                                </>
+                              )}
+                              {item?.Type === 'C' && (
+                                <div
                                   className="Tbl1-Variant"
                                   style={{ fontFamily: 'Poppins' }}
                                 >
-                                  (
-                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                    'variant'
-                                  ) && <span>{item?.ProdVariantName} </span>}
-                                  {item?.Size}
-                                  {item?.SinglePc == 'Y'
-                                    ? 'PCS'
-                                    : item?.UomName}
-                                  )
-                                </p>
-                                {item?.OfferMessage &&
-                                  !Array.isArray(item.OfferMessage) && (
-                                    <p
-                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                    >
-                                      {item.OfferMessage?.split('>')?.[0] +
-                                        `> ${item?.OrderQty} Eligible Free`}
+                                  {item.ProdDetail?.map((prod, index) => (
+                                    <p key={index}>
+                                      {prod.ProdName} - {prod.Size}{' '}
+                                      {prod.UomName}
                                     </p>
-                                  )}
-                              </>
-                            )}
-                            {item?.Type === 'C' && (
-                              <div
-                                className="Tbl1-Variant"
-                                style={{ fontFamily: 'Poppins' }}
-                              >
-                                {item.ProdDetail?.map((prod, index) => (
-                                  <p key={index}>
-                                    {prod.ProdName} - {prod.Size} {prod.UomName}
-                                  </p>
-                                ))}
-                              </div>
-                            )}
-                            {productBasedExtraCharges?.find(
-                              (find) => find.ProdId === item.ProdId
-                            ) !== undefined && (
+                                  ))}
+                                </div>
+                              )}
+                              {productBasedExtraCharges?.find(
+                                (find) => find.ProdId === item.ProdId
+                              ) !== undefined && (
                                 <div
                                   style={{
                                     fontSize: '10px',
@@ -2852,326 +2713,336 @@ const BSBillingTable1 = () => {
                                   }
                                 </div>
                               )}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'MRP' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.MRP}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Discount' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item?.Type != 'C'
-                              ? item.Offer && item.Offer > 0
-                                ? item.Offer
-                                : '-'
-                              : item?.OfferPrice && item?.OfferPrice > 0
-                                ? item?.OfferType === 'F'
-                                  ? `₹${item.OfferPrice}`
-                                  : `${item.OfferPrice}%`
-                                : '-'}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Quantity' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.OrderQty}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Rate' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(item?.OrderRate || 0).toFixed(2)
-                              : Number(item?.OrderRate || 0)}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Amount' && (
-                          <td
-                            className="BillingTable1-table-td forcomboalign"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              // if (editField) {
-                              //   handleEditQuantity(item);
-                              // }
-                              if (GetCustId) {
-                                handleCustomerProductPriceHistory(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              ).toFixed(2)
-                              : Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              )}
-                          </td>
-                        )}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'MRP' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.MRP}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Discount' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item?.Type != 'C'
+                                ? item.Offer && item.Offer > 0
+                                  ? item.Offer
+                                  : '-'
+                                : item?.OfferPrice && item?.OfferPrice > 0
+                                  ? item?.OfferType === 'F'
+                                    ? `₹${item.OfferPrice}`
+                                    : `${item.OfferPrice}%`
+                                  : '-'}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Quantity' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.OrderQty}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Rate' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(item?.OrderRate || 0).toFixed(2)
+                                : Number(item?.OrderRate || 0)}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Amount' && (
+                            <td
+                              className="BillingTable1-table-td forcomboalign"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                // if (editField) {
+                                //   handleEditQuantity(item);
+                                // }
+                                if (GetCustId) {
+                                  handleCustomerProductPriceHistory(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  ).toFixed(2)
+                                : Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  )}
+                            </td>
+                          )}
 
-                        {tableitem.OptionName == 'Delete' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{ fontFamily: 'Poppins' }}
-                            onClick={() => removeFromCart(item)}
-                          >
-                            <AiOutlineClose
-                              style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                            />
-                          </td>
-                        )}
-                      </>
-                    ))}
-                  </tr>
-                ))}
-                {OldtableDataDinein?.length > 0 && EditQuantity && (
-                  <BSBillingEditQuantity
-                    handleEditQuantityCancel={handleEditQuantityCancel}
-                    BSBillingEditQuantity={EditQuantity}
-                    Productdata={Modaldata}
-                    Index={Index}
-                    shortKeyMethod={shortKeyMethod}
-                  />
-                )}
-              </tbody>
-            )}
-            {/* TakeWay */}
-            {tableDataTakeAway?.length > 0 && (
-              <tbody className="Billing-Table1-body">
-                {tableDataTakeAway?.map((item, index) => (
-                  <tr
-                    key={
-                      OldtableDataDinein?.length +
-                      OldtableDataTakeAway?.length +
-                      index
-                    }
-                    className={`${BookingType === 'Dine In' && item?.SalesId
-                      ? 'Billing-Table1-row-disabled'
-                      : 'Billing-Table1-row'
+                          {tableitem.OptionName == 'Delete' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{ fontFamily: 'Poppins' }}
+                              onClick={() => removeFromCart(item)}
+                            >
+                              <AiOutlineClose
+                                style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                              />
+                            </td>
+                          )}
+                        </>
+                      ))}
+                    </tr>
+                  ))}
+                  {OldtableDataDinein?.length > 0 && EditQuantity && (
+                    <BSBillingEditQuantity
+                      handleEditQuantityCancel={handleEditQuantityCancel}
+                      BSBillingEditQuantity={EditQuantity}
+                      Productdata={Modaldata}
+                      Index={Index}
+                      shortKeyMethod={shortKeyMethod}
+                    />
+                  )}
+                </tbody>
+              )}
+              {/* TakeWay */}
+              {tableDataTakeAway?.length > 0 && (
+                <tbody className="Billing-Table1-body">
+                  {tableDataTakeAway?.map((item, index) => (
+                    <tr
+                      key={
+                        OldtableDataDinein?.length +
+                        OldtableDataTakeAway?.length +
+                        index
+                      }
+                      className={`${
+                        BookingType === 'Dine In' && item?.SalesId
+                          ? 'Billing-Table1-row-disabled'
+                          : 'Billing-Table1-row'
                       } 
                                         
                                         `}
-                    style={{
-                      fontFamily: SelectedFont,
+                      style={{
+                        fontFamily: SelectedFont,
 
-                      backgroundColor:
-                        BillOrderPre === 'Y'
-                          ? BookingType === 'Dine In' && item?.SalesId
-                            ? 'rgb(243, 248, 213)'
-                            : BookingType === 'Dine In' &&
-                              triggerAnimation &&
-                              OldtableDataDinein?.length +
-                              OldtableDataTakeAway?.length +
-                              index ===
-                              0 &&
-                              !item?.SalesId &&
-                              tableDataTakeAway?.length >= PreviousdataLength
-                              ? 'wheat'
-                              : BookingType !== 'Dine In' &&
-                                triggerAnimation &&
-                                OldtableDataDinein?.length +
-                                OldtableDataTakeAway?.length +
-                                index ===
-                                0 &&
-                                tableDataTakeAway?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
+                        backgroundColor:
+                          BillOrderPre === 'Y'
+                            ? BookingType === 'Dine In' && item?.SalesId
+                              ? 'rgb(243, 248, 213)'
+                              : BookingType === 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataDinein?.length +
+                                    OldtableDataTakeAway?.length +
+                                    index ===
+                                    0 &&
+                                  !item?.SalesId &&
+                                  tableDataTakeAway?.length >=
+                                    PreviousdataLength
                                 ? 'wheat'
-                                : (OldtableDataDinein?.length +
+                                : BookingType !== 'Dine In' &&
+                                    triggerAnimation &&
+                                    OldtableDataDinein?.length +
+                                      OldtableDataTakeAway?.length +
+                                      index ===
+                                      0 &&
+                                    tableDataTakeAway?.length >=
+                                      PreviousdataLength &&
+                                    !HoldOrderDtl &&
+                                    !UnpaidData
+                                  ? 'wheat'
+                                  : (OldtableDataDinein?.length +
+                                        OldtableDataTakeAway?.length +
+                                        index) %
+                                        2 ===
+                                      0
+                                    ? 'white'
+                                    : SelectedBillColor?.[
+                                          'OverallBackgroundColor'
+                                        ]
+                                      ? SelectedBillColor?.[
+                                          'OverallBackgroundColor'
+                                        ]
+                                      : '#d6d6d6'
+                            : (OldtableDataDinein?.length +
                                   OldtableDataTakeAway?.length +
                                   index) %
                                   2 ===
-                                  0
-                                  ? 'white'
-                                  : SelectedBillColor?.[
-                                    'OverallBackgroundColor'
-                                  ]
-                                    ? SelectedBillColor?.[
-                                    'OverallBackgroundColor'
-                                    ]
-                                    : '#d6d6d6'
-                          : (OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index) %
-                            2 ===
-                            0
-                            ? 'white'
-                            : SelectedBillColor?.['OverallBackgroundColor']
-                              ? SelectedBillColor?.['OverallBackgroundColor']
-                              : '#d6d6d6',
-                      background:
-                        BookingType === 'Dine In' && item?.SalesId
-                          ? 'rgb(243, 248, 213)'
-                          : GlobEstBooking === 'ParEst' &&
-                            GlobProdwisedata?.includes(
-                              item?.InwardDtlId + ' ' + item?.BookingTypeName
-                            )
-                            ? '#b2d1f7'
-                            : (OldtableDataDinein?.length +
-                              OldtableDataTakeAway?.length +
-                              index) %
-                              2 ===
-                              0
+                                0
                               ? 'white'
                               : SelectedBillColor?.['OverallBackgroundColor']
                                 ? SelectedBillColor?.['OverallBackgroundColor']
                                 : '#d6d6d6',
-                      animation:
-                        BillOrderPre === 'Y' && !BookingTypeBoth
-                          ? triggerAnimation &&
-                            OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            !item?.SalesId &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'splashAnimation 0.5s ease-in-out'
-                            : 'none'
-                          : 'none',
-                    }}
-                  >
-                    {tableOptions?.map((tableitem) => (
-                      <>
-                        {BookingTypeBoth &&
-                          index == 0 &&
-                          tableitem.OptionName == 'Sl.No' && (
+                        background:
+                          BookingType === 'Dine In' && item?.SalesId
+                            ? 'rgb(243, 248, 213)'
+                            : GlobEstBooking === 'ParEst' &&
+                                GlobProdwisedata?.includes(
+                                  item?.InwardDtlId +
+                                    ' ' +
+                                    item?.BookingTypeName
+                                )
+                              ? '#b2d1f7'
+                              : (OldtableDataDinein?.length +
+                                    OldtableDataTakeAway?.length +
+                                    index) %
+                                    2 ===
+                                  0
+                                ? 'white'
+                                : SelectedBillColor?.['OverallBackgroundColor']
+                                  ? SelectedBillColor?.[
+                                      'OverallBackgroundColor'
+                                    ]
+                                  : '#d6d6d6',
+                        animation:
+                          BillOrderPre === 'Y' && !BookingTypeBoth
+                            ? triggerAnimation &&
+                              OldtableDataDinein?.length +
+                                OldtableDataTakeAway?.length +
+                                index ===
+                                0 &&
+                              !item?.SalesId &&
+                              tableDataTakeAway?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
+                              ? 'splashAnimation 0.5s ease-in-out'
+                              : 'none'
+                            : 'none',
+                      }}
+                    >
+                      {tableOptions?.map((tableitem) => (
+                        <>
+                          {BookingTypeBoth &&
+                            index == 0 &&
+                            tableitem.OptionName == 'Sl.No' && (
+                              <td
+                                rowSpan={tableData.length}
+                                style={{ backgroundColor: '#CFB59D' }}
+                              >
+                                <img width="30px" alt="" src={TakeAwayIcon} />
+                              </td>
+                            )}
+
+                          {tableitem.OptionName == 'Sl.No' && (
                             <td
-                              rowspan={tableData.length}
-                              style={{ backgroundColor: '#CFB59D' }}
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'center',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
                             >
-                              <img width="30px" alt="" src={TakeAwayIcon} />
+                              {OldtableDataDinein?.length +
+                                OldtableDataTakeAway?.length +
+                                index +
+                                1}
                             </td>
                           )}
-
-                        {tableitem.OptionName == 'Sl.No' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'center',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {OldtableDataDinein?.length +
-                              OldtableDataTakeAway?.length +
-                              index +
-                              1}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Item' && (
-                          <td
-                            className="BillingTable1-table-td for-combo"
-                            style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                            onClick={() =>
-                              item.FullProductIdentifierDtls?.length > 0 ||
+                          {tableitem.OptionName == 'Item' && (
+                            <td
+                              className="BillingTable1-table-td for-combo"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'left',
+                              }}
+                              onClick={() =>
+                                item.FullProductIdentifierDtls?.length > 0 ||
                                 item.ProductIdentifierDtls?.length > 0
-                                ? handleImeiDetails(item)
-                                : editField && handleEditQuantity(item)
-                            }
-                          >
-                            {item?.Type !== 'OS'
-                              ? item.ProdName
-                              : item.ServiceName}
-                            &nbsp;{' '}
-                            {item?.BrandName !== null ? item?.BrandName : ''}
-                            {item?.Type != 'C' && (
-                              <>
-                                <p
+                                  ? handleImeiDetails(item)
+                                  : editField && handleEditQuantity(item)
+                              }
+                            >
+                              {item?.Type !== 'OS'
+                                ? item.ProdName
+                                : item.ServiceName}
+                              &nbsp;{' '}
+                              {item?.BrandName !== null ? item?.BrandName : ''}
+                              {item?.Type != 'C' && (
+                                <>
+                                  <p
+                                    className="Tbl1-Variant"
+                                    style={{ fontFamily: 'Poppins' }}
+                                  >
+                                    {item?.Type !== 'OS' && (
+                                      <>
+                                        {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                          'variant'
+                                        ) && (
+                                          <span>{item?.ProdVariantName} </span>
+                                        )}
+                                        {item?.Size}
+                                        {item?.SinglePc == 'Y'
+                                          ? 'PCS'
+                                          : item?.UomName}
+                                      </>
+                                    )}
+                                  </p>
+                                  {item?.OfferMessage &&
+                                    !Array.isArray(item.OfferMessage) && (
+                                      <p
+                                        className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                      >
+                                        {item.OfferMessage?.split('>')?.[0] +
+                                          `> ${item?.OrderQty} Eligible Free`}
+                                      </p>
+                                    )}
+                                </>
+                              )}
+                              {item?.Type === 'C' && (
+                                <div
                                   className="Tbl1-Variant"
                                   style={{ fontFamily: 'Poppins' }}
                                 >
-                                  {item?.Type !== 'OS' && (
-                                    <>
-                                      {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                        'variant'
-                                      ) && (
-                                          <span>{item?.ProdVariantName} </span>
-                                        )}
-                                      {item?.Size}
-                                      {item?.SinglePc == 'Y'
-                                        ? 'PCS'
-                                        : item?.UomName}
-                                    </>
-                                  )}
-                                </p>
-                                {item?.OfferMessage &&
-                                  !Array.isArray(item.OfferMessage) && (
-                                    <p
-                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                    >
-                                      {item.OfferMessage?.split('>')?.[0] +
-                                        `> ${item?.OrderQty} Eligible Free`}
+                                  {item.ProdDetail?.map((prod, index) => (
+                                    <p key={index}>
+                                      {prod.ProdName} - {prod.Size}{' '}
+                                      {prod.UomName}
                                     </p>
-                                  )}
-                              </>
-                            )}
-                            {item?.Type === 'C' && (
-                              <div
-                                className="Tbl1-Variant"
-                                style={{ fontFamily: 'Poppins' }}
-                              >
-                                {item.ProdDetail?.map((prod, index) => (
-                                  <p key={index}>
-                                    {prod.ProdName} - {prod.Size} {prod.UomName}
-                                  </p>
-                                ))}
-                              </div>
-                            )}
-                            {productBasedExtraCharges?.find(
-                              (find) => find.ProdId === item.ProdId
-                            ) !== undefined && (
+                                  ))}
+                                </div>
+                              )}
+                              {productBasedExtraCharges?.find(
+                                (find) => find.ProdId === item.ProdId
+                              ) !== undefined && (
                                 <div
                                   style={{
                                     fontSize: '10px',
@@ -3187,309 +3058,318 @@ const BSBillingTable1 = () => {
                                   }
                                 </div>
                               )}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'MRP' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.MRP}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Discount' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item?.Type != 'C'
-                              ? item.Offer && item.Offer > 0
-                                ? item.Offer
-                                : '-'
-                              : item?.OfferPrice && item?.OfferPrice > 0
-                                ? item?.OfferType === 'F'
-                                  ? `₹${item.OfferPrice}`
-                                  : `${item.OfferPrice}%`
-                                : '-'}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Quantity' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.OrderQty}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Rate' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(item?.OrderRate || 0).toFixed(2)
-                              : Number(item?.OrderRate || 0)}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Amount' && (
-                          <td
-                            className="BillingTable1-table-td forcomboalign"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              // if (editField) {
-                              //   handleEditQuantity(item);
-                              // }
-                              if (GetCustId) {
-                                handleCustomerProductPriceHistory(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              ).toFixed(2)
-                              : Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              )}
-                          </td>
-                        )}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'MRP' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.MRP}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Discount' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item?.Type != 'C'
+                                ? item.Offer && item.Offer > 0
+                                  ? item.Offer
+                                  : '-'
+                                : item?.OfferPrice && item?.OfferPrice > 0
+                                  ? item?.OfferType === 'F'
+                                    ? `₹${item.OfferPrice}`
+                                    : `${item.OfferPrice}%`
+                                  : '-'}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Quantity' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.OrderQty}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Rate' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(item?.OrderRate || 0).toFixed(2)
+                                : Number(item?.OrderRate || 0)}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Amount' && (
+                            <td
+                              className="BillingTable1-table-td forcomboalign"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                // if (editField) {
+                                //   handleEditQuantity(item);
+                                // }
+                                if (GetCustId) {
+                                  handleCustomerProductPriceHistory(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  ).toFixed(2)
+                                : Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  )}
+                            </td>
+                          )}
 
-                        {tableitem.OptionName == 'Delete' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{ fontFamily: 'Poppins' }}
-                            onClick={() => removeFromCart(item)}
-                          >
-                            <AiOutlineClose
-                              style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                            />
-                          </td>
-                        )}
-                      </>
-                    ))}
-                  </tr>
-                ))}
-                {tableDataTakeAway?.length > 0 && EditQuantity && (
-                  <BSBillingEditQuantity
-                    handleEditQuantityCancel={handleEditQuantityCancel}
-                    BSBillingEditQuantity={EditQuantity}
-                    Productdata={Modaldata}
-                    Index={Index}
-                    shortKeyMethod={shortKeyMethod}
-                  />
-                )}
-              </tbody>
-            )}
-            {/* DineIn */}
-            {tableDataDinein?.length > 0 && (
-              <tbody className="Billing-Table1-body">
-                {tableDataDinein?.map((item, index) => (
-                  <tr
-                    key={
-                      OldtableDataTakeAway?.length +
-                      OldtableDataDinein?.length +
-                      tableDataTakeAway?.length +
-                      index
-                    }
-                    className={`${BookingType === 'Dine In' && item?.SalesId
-                      ? 'Billing-Table1-row-disabled'
-                      : 'Billing-Table1-row'
+                          {tableitem.OptionName == 'Delete' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{ fontFamily: 'Poppins' }}
+                              onClick={() => removeFromCart(item)}
+                            >
+                              <AiOutlineClose
+                                style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                              />
+                            </td>
+                          )}
+                        </>
+                      ))}
+                    </tr>
+                  ))}
+                  {tableDataTakeAway?.length > 0 && EditQuantity && (
+                    <BSBillingEditQuantity
+                      handleEditQuantityCancel={handleEditQuantityCancel}
+                      BSBillingEditQuantity={EditQuantity}
+                      Productdata={Modaldata}
+                      Index={Index}
+                      shortKeyMethod={shortKeyMethod}
+                    />
+                  )}
+                </tbody>
+              )}
+              {/* DineIn */}
+              {tableDataDinein?.length > 0 && (
+                <tbody className="Billing-Table1-body">
+                  {tableDataDinein?.map((item, index) => (
+                    <tr
+                      key={
+                        OldtableDataTakeAway?.length +
+                        OldtableDataDinein?.length +
+                        tableDataTakeAway?.length +
+                        index
+                      }
+                      className={`${
+                        BookingType === 'Dine In' && item?.SalesId
+                          ? 'Billing-Table1-row-disabled'
+                          : 'Billing-Table1-row'
                       } 
                                         
                                         `}
-                    style={{
-                      fontFamily: SelectedFont,
+                      style={{
+                        fontFamily: SelectedFont,
 
-                      backgroundColor:
-                        BillOrderPre === 'Y' && !BookingTypeBoth
-                          ? BookingType === 'Dine In' &&
-                            item?.SalesId &&
-                            !BookingTypeBoth
+                        backgroundColor:
+                          BillOrderPre === 'Y' && !BookingTypeBoth
+                            ? BookingType === 'Dine In' &&
+                              item?.SalesId &&
+                              !BookingTypeBoth
+                              ? 'rgb(243, 248, 213)'
+                              : BookingType === 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataTakeAway?.length +
+                                    OldtableDataDinein?.length +
+                                    tableDataTakeAway?.length +
+                                    index ===
+                                    0 &&
+                                  !item?.SalesId &&
+                                  tableDataDinein?.length >= PreviousdataLength
+                                ? 'wheat'
+                                : BookingType !== 'Dine In' &&
+                                    triggerAnimation &&
+                                    OldtableDataTakeAway?.length +
+                                      OldtableDataDinein?.length +
+                                      tableDataTakeAway?.length +
+                                      index ===
+                                      0 &&
+                                    tableDataDinein?.length >=
+                                      PreviousdataLength &&
+                                    !HoldOrderDtl &&
+                                    !UnpaidData
+                                  ? 'wheat'
+                                  : 'inherit'
+                            : 'none',
+                        background:
+                          BookingType === 'Dine In' &&
+                          item?.SalesId &&
+                          !BookingTypeBoth
                             ? 'rgb(243, 248, 213)'
-                            : BookingType === 'Dine In' &&
-                              triggerAnimation &&
+                            : GlobEstBooking === 'ParEst' &&
+                                GlobProdwisedata?.includes(
+                                  item?.InwardDtlId +
+                                    ' ' +
+                                    item?.BookingTypeName
+                                )
+                              ? '#b2d1f7'
+                              : (OldtableDataTakeAway?.length +
+                                    OldtableDataDinein?.length +
+                                    tableDataTakeAway?.length +
+                                    index) %
+                                    2 ===
+                                  0
+                                ? 'white'
+                                : SelectedBillColor?.['OverallBackgroundColor']
+                                  ? SelectedBillColor?.[
+                                      'OverallBackgroundColor'
+                                    ]
+                                  : '#d6d6d6',
+                        animation:
+                          BillOrderPre === 'Y' && !BookingTypeBoth
+                            ? triggerAnimation &&
                               OldtableDataTakeAway?.length +
-                              OldtableDataDinein?.length +
-                              tableDataTakeAway?.length +
-                              index ===
-                              0 &&
-                              !item?.SalesId &&
-                              tableDataDinein?.length >= PreviousdataLength
-                              ? 'wheat'
-                              : BookingType !== 'Dine In' &&
-                                triggerAnimation &&
-                                OldtableDataTakeAway?.length +
                                 OldtableDataDinein?.length +
                                 tableDataTakeAway?.length +
                                 index ===
                                 0 &&
-                                tableDataDinein?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
-                                ? 'wheat'
-                                : 'inherit'
-                          : 'none',
-                      background:
-                        BookingType === 'Dine In' &&
-                          item?.SalesId &&
-                          !BookingTypeBoth
-                          ? 'rgb(243, 248, 213)'
-                          : GlobEstBooking === 'ParEst' &&
-                            GlobProdwisedata?.includes(
-                              item?.InwardDtlId + ' ' + item?.BookingTypeName
-                            )
-                            ? '#b2d1f7'
-                            : (OldtableDataTakeAway?.length +
-                              OldtableDataDinein?.length +
-                              tableDataTakeAway?.length +
-                              index) %
-                              2 ===
-                              0
-                              ? 'white'
-                              : SelectedBillColor?.['OverallBackgroundColor']
-                                ? SelectedBillColor?.['OverallBackgroundColor']
-                                : '#d6d6d6',
-                      animation:
-                        BillOrderPre === 'Y' && !BookingTypeBoth
-                          ? triggerAnimation &&
-                            OldtableDataTakeAway?.length +
-                            OldtableDataDinein?.length +
-                            tableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            !item?.SalesId &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'splashAnimation 0.5s ease-in-out'
-                            : 'none'
-                          : 'none',
-                    }}
-                  >
-                    {tableOptions?.map((tableitem) => (
-                      <>
-                        {BookingTypeBoth &&
-                          index == 0 &&
-                          tableitem.OptionName == 'Sl.No' && (
+                              !item?.SalesId &&
+                              tableDataDinein?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
+                              ? 'splashAnimation 0.5s ease-in-out'
+                              : 'none'
+                            : 'none',
+                      }}
+                    >
+                      {tableOptions?.map((tableitem) => (
+                        <>
+                          {BookingTypeBoth &&
+                            index == 0 &&
+                            tableitem.OptionName == 'Sl.No' && (
+                              <td
+                                rowSpan={tableData.length}
+                                style={{ backgroundColor: '#A2C3CD' }}
+                              >
+                                <img width="30px" alt="" src={dineInIcon} />
+                              </td>
+                            )}
+
+                          {tableitem.OptionName == 'Sl.No' && (
                             <td
-                              rowspan={tableData.length}
-                              style={{ backgroundColor: '#A2C3CD' }}
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'center',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
                             >
-                              <img width="30px" alt="" src={dineInIcon} />
+                              {OldtableDataTakeAway?.length +
+                                OldtableDataDinein?.length +
+                                tableDataTakeAway?.length +
+                                index +
+                                1}
                             </td>
                           )}
-
-                        {tableitem.OptionName == 'Sl.No' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'center',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {OldtableDataTakeAway?.length +
-                              OldtableDataDinein?.length +
-                              tableDataTakeAway?.length +
-                              index +
-                              1}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Item' && (
-                          <td
-                            className="BillingTable1-table-td for-combo"
-                            style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.ProdName}
-                            &nbsp;{' '}
-                            {item?.BrandName !== null ? item?.BrandName : ''}
-                            {item?.Type != 'C' && (
-                              <>
-                                <p
+                          {tableitem.OptionName == 'Item' && (
+                            <td
+                              className="BillingTable1-table-td for-combo"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'left',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.ProdName}
+                              &nbsp;{' '}
+                              {item?.BrandName !== null ? item?.BrandName : ''}
+                              {item?.Type != 'C' && (
+                                <>
+                                  <p
+                                    className="Tbl1-Variant"
+                                    style={{ fontFamily: 'Poppins' }}
+                                  >
+                                    (
+                                    {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                      'variant'
+                                    ) && <span>{item?.ProdVariantName} </span>}
+                                    {item?.Size}
+                                    {item?.SinglePc == 'Y'
+                                      ? 'PCS'
+                                      : item?.UomName}
+                                    )
+                                  </p>
+                                  {item?.OfferMessage &&
+                                    !Array.isArray(item.OfferMessage) && (
+                                      <p
+                                        className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                      >
+                                        {item.OfferMessage?.split('>')?.[0] +
+                                          `> ${item?.OrderQty} Eligible Free`}
+                                      </p>
+                                    )}
+                                </>
+                              )}
+                              {item?.Type === 'C' && (
+                                <div
                                   className="Tbl1-Variant"
                                   style={{ fontFamily: 'Poppins' }}
                                 >
-                                  (
-                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                    'variant'
-                                  ) && <span>{item?.ProdVariantName} </span>}
-                                  {item?.Size}
-                                  {item?.SinglePc == 'Y'
-                                    ? 'PCS'
-                                    : item?.UomName}
-                                  )
-                                </p>
-                                {item?.OfferMessage &&
-                                  !Array.isArray(item.OfferMessage) && (
-                                    <p
-                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                    >
-                                      {item.OfferMessage?.split('>')?.[0] +
-                                        `> ${item?.OrderQty} Eligible Free`}
+                                  {item.ProdDetail?.map((prod, index) => (
+                                    <p key={index}>
+                                      {prod.ProdName} - {prod.Size}{' '}
+                                      {prod.UomName}
                                     </p>
-                                  )}
-                              </>
-                            )}
-                            {item?.Type === 'C' && (
-                              <div
-                                className="Tbl1-Variant"
-                                style={{ fontFamily: 'Poppins' }}
-                              >
-                                {item.ProdDetail?.map((prod, index) => (
-                                  <p key={index}>
-                                    {prod.ProdName} - {prod.Size} {prod.UomName}
-                                  </p>
-                                ))}
-                              </div>
-                            )}
-                            {productBasedExtraCharges?.find(
-                              (find) => find.ProdId === item.ProdId
-                            ) !== undefined && (
+                                  ))}
+                                </div>
+                              )}
+                              {productBasedExtraCharges?.find(
+                                (find) => find.ProdId === item.ProdId
+                              ) !== undefined && (
                                 <div
                                   style={{
                                     fontSize: '10px',
@@ -3505,162 +3385,163 @@ const BSBillingTable1 = () => {
                                   }
                                 </div>
                               )}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'MRP' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.MRP}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Discount' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item?.Type != 'C'
-                              ? item.Offer && item.Offer > 0
-                                ? item.Offer
-                                : '-'
-                              : item?.OfferPrice && item?.OfferPrice > 0
-                                ? item?.OfferType === 'F'
-                                  ? `₹${item.OfferPrice}`
-                                  : `${item.OfferPrice}%`
-                                : '-'}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Quantity' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {item.OrderQty}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Rate' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              if (editField) {
-                                handleEditQuantity(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(item?.OrderRate || 0).toFixed(2)
-                              : Number(item?.OrderRate || 0)}
-                          </td>
-                        )}
-                        {tableitem.OptionName == 'Amount' && (
-                          <td
-                            className="BillingTable1-table-td forcomboalign"
-                            style={{
-                              fontFamily: 'Poppins',
-                              textAlign: 'right',
-                            }}
-                            onClick={() => {
-                              // if (editField) {
-                              //   handleEditQuantity(item);
-                              // }
-                              if (GetCustId) {
-                                handleCustomerProductPriceHistory(item);
-                              }
-                            }}
-                          >
-                            {allowDecimal
-                              ? Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              ).toFixed(2)
-                              : Number(
-                                item?.TotalAmt - (item?.Offer || 0) || 0
-                              )}
-                          </td>
-                        )}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'MRP' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.MRP}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Discount' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item?.Type != 'C'
+                                ? item.Offer && item.Offer > 0
+                                  ? item.Offer
+                                  : '-'
+                                : item?.OfferPrice && item?.OfferPrice > 0
+                                  ? item?.OfferType === 'F'
+                                    ? `₹${item.OfferPrice}`
+                                    : `${item.OfferPrice}%`
+                                  : '-'}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Quantity' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {item.OrderQty}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Rate' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                if (editField) {
+                                  handleEditQuantity(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(item?.OrderRate || 0).toFixed(2)
+                                : Number(item?.OrderRate || 0)}
+                            </td>
+                          )}
+                          {tableitem.OptionName == 'Amount' && (
+                            <td
+                              className="BillingTable1-table-td forcomboalign"
+                              style={{
+                                fontFamily: 'Poppins',
+                                textAlign: 'right',
+                              }}
+                              onClick={() => {
+                                // if (editField) {
+                                //   handleEditQuantity(item);
+                                // }
+                                if (GetCustId) {
+                                  handleCustomerProductPriceHistory(item);
+                                }
+                              }}
+                            >
+                              {allowDecimal
+                                ? Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  ).toFixed(2)
+                                : Number(
+                                    item?.TotalAmt - (item?.Offer || 0) || 0
+                                  )}
+                            </td>
+                          )}
 
-                        {tableitem.OptionName == 'Delete' && (
-                          <td
-                            className="BillingTable1-table-td"
-                            style={{ fontFamily: 'Poppins' }}
-                            onClick={() => removeFromCart(item)}
-                          >
-                            <AiOutlineClose
-                              style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                            />
-                          </td>
-                        )}
-                      </>
-                    ))}
-                  </tr>
-                ))}
-                {tableDataDinein?.length > 0 && EditQuantity && (
-                  <BSBillingEditQuantity
-                    handleEditQuantityCancel={handleEditQuantityCancel}
-                    BSBillingEditQuantity={EditQuantity}
-                    Productdata={Modaldata}
-                    Index={Index}
-                    shortKeyMethod={shortKeyMethod}
-                  />
-                )}
-              </tbody>
+                          {tableitem.OptionName == 'Delete' && (
+                            <td
+                              className="BillingTable1-table-td"
+                              style={{ fontFamily: 'Poppins' }}
+                              onClick={() => removeFromCart(item)}
+                            >
+                              <AiOutlineClose
+                                style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                              />
+                            </td>
+                          )}
+                        </>
+                      ))}
+                    </tr>
+                  ))}
+                  {tableDataDinein?.length > 0 && EditQuantity && (
+                    <BSBillingEditQuantity
+                      handleEditQuantityCancel={handleEditQuantityCancel}
+                      BSBillingEditQuantity={EditQuantity}
+                      Productdata={Modaldata}
+                      Index={Index}
+                      shortKeyMethod={shortKeyMethod}
+                    />
+                  )}
+                </tbody>
+              )}
+            </table>
+
+            {OpenEditTotalAmt && (
+              <BSEditTotalAmt
+                EditTotalOpen={OpenEditTotalAmt}
+                EditTotalClose={handleEditTotalAmountCancel}
+              />
             )}
-          </table>
-
-          {OpenEditTotalAmt && (
-            <BSEditTotalAmt
-              EditTotalOpen={OpenEditTotalAmt}
-              EditTotalClose={handleEditTotalAmountCancel}
-            />
-          )}
-          {OpenImeiDetail && (
-            <BSImeiDetails
-              DeviceDetails={OpenImeiDetail}
-              handleDeviceDetailClose={handleImeiDetailClose}
-              ProductDetail={Modaldata}
-            />
-          )}
-          {(customerPriceHistoryOpen && GetCustId) &&
-            <CustomerPriceHistory
-              open={customerPriceHistoryOpen}
-              custId={GetCustId}
-              setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
-              customerProduct={customerProduct}
-              setCustomerProduct={setCustomerProduct}
-              selectedCustomer={selectedCustomer}
-            />
-          }
+            {OpenImeiDetail && (
+              <BSImeiDetails
+                DeviceDetails={OpenImeiDetail}
+                handleDeviceDetailClose={handleImeiDetailClose}
+                ProductDetail={Modaldata}
+              />
+            )}
+            {customerPriceHistoryOpen && GetCustId && (
+              <CustomerPriceHistory
+                open={customerPriceHistoryOpen}
+                custId={GetCustId}
+                setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
+                customerProduct={customerProduct}
+                setCustomerProduct={setCustomerProduct}
+                selectedCustomer={selectedCustomer}
+              />
+            )}
+          </div>
         </div>
-      </div>
-    </>
+      </>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BST1Payment.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BST1Payment.jsx
index d7fba48..ebe8b68 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BST1Payment.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BST1Payment.jsx
@@ -2,10 +2,9 @@ import React, { useCallback, useEffect, useState, useRef } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import moment from 'moment';
-import { Badge, Popover, Modal, Tooltip } from 'antd';
+import { Badge, Modal, Tooltip } from 'antd';
 import { Tables } from '../../../../../Components/Tables/Table';
 import { DefaultModal } from '../../../../../Components/Modal/DefaultModal.jsx';
-import { UpOutlined } from '@ant-design/icons';
 import paygate from '../../../../../Images/paygate.png';
 import defaultupi from '../../../../../Images/defaultupi.png';
 import paydevice from '../../../../../Images/paydevice.png';
@@ -42,8 +41,6 @@ import {
   changeReorderHoldDetails,
   ChangeNavHoldData,
   GlobalNavHoldData,
-  changeSummeryQty,
-  changeSummeryTotalItems,
   changeSummeryTotalAmount,
   changeSummeryTotalTaxAmount,
   changeSummeryTotalWithoutTaxAmount,
@@ -126,6 +123,7 @@ import {
   changeBillEditingMode,
   changePreviousOrderPayment,
   changePreviousOrderOfferDetail,
+  GlobalAllBookingType,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
 import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities';
 import {
@@ -158,7 +156,6 @@ import BsBillingCreditCustomer from '../../BookingFunctionality/BSBillingCreditC
 import { isMobile } from 'react-device-detect';
 import MobilePrint from '../../BookingFunctionality/MobilePrint.jsx';
 import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
-import { settingDataSelector } from '../../../../../Features/PreferenceMaster/PreferenceMaster.js';
 import CountUp from 'react-countup';
 import { GlobalpreOrderOpen } from '../../../../../Features/BookingScreen/PreOrder/PreOrder.js';
 import SplitPayment from '../../BookingFunctionality/SplitPayment.jsx';
@@ -197,7 +194,6 @@ import BSOtherServiceClaim from '../../UtillComponents/BSOtherServiceClaim.jsx';
 import { PostOtherServices } from '../../../../../Features/OtherServices/OtherServices.js';
 import { TfiClipboard } from 'react-icons/tfi';
 import OtherServicePrintStyle1 from '../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx';
-import { MobilePdfPrint } from '../../BookingFunctionality/MobilePdfPrint.js';
 import { PublicQrCodepost } from '../../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
 import {
   ChangeFullFreeProductList,
@@ -218,7 +214,6 @@ import CustomerOrders from '../../BookingFunctionality/CustomerOrders.jsx';
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
-const RetailApiurl = import.meta.env.ENV_API_URL;
 
 export default function BST1Payment() {
   const isF4Pressed = useRef(false);
@@ -246,7 +241,9 @@ export default function BST1Payment() {
   const navigate = useNavigate();
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const Discount = useSelector(GlobalOverAllOfferAmt);
   const defaultBookingType = useSelector(GlobalDefaultBookingType);
@@ -281,7 +278,6 @@ export default function BST1Payment() {
   const GlobEstBooking = useSelector(GlobalEstimateBooking);
   const GlobProdwisedata = useSelector(GlobalSelProdWiseEst);
   const preOrder = useSelector(GlobalpreOrderOpen);
-  const OrderOfferDetail = useSelector(Global_OrderOfferDetail, shallowEqual);
   const prodCat = useSelector(GlobalProductCategorie);
   const ProdSubCat = useSelector(GlobalProductSubCategorie);
   const templateData = useSelector(getTemplateData);
@@ -292,6 +288,7 @@ export default function BST1Payment() {
   const SettingDataSelector = useSelector(PreferenceData);
   const unpaidFlow = useSelector(Globalunpaidflow);
   const appPreferences = useSelector(ApplicationPreferences);
+  const AllBookingType = useSelector(GlobalAllBookingType);
   const bookingTypePreference = appPreferences?.find(
     (preference) => preference?.PreferredCatName === 'Booking Type'
   )?.PreferenceCatDetails;
@@ -321,8 +318,6 @@ export default function BST1Payment() {
   const AppId = SessionData?.AppId;
   const UserId = SessionData?.UserId;
   const UserType = SessionData?.UserType;
-  const AuthToken = SessionData?.AuthToken;
-  const SessionMobileNo = SessionData?.SessionMobileNo;
   // for customised invoice number
   const { invoiceDate, clearInvoiceDate } = useDateStore();
   const CurrentOrderId = useSelector(GlobalCurrentOrderId);
@@ -341,7 +336,7 @@ export default function BST1Payment() {
   const [refundPaySelectedName, setRefundPaySelectedName] = useState(null);
   const [currentOrderNetAmount, setCurrentOrderNetAmount] = useState(0);
   const [previousNetAmount, setPreviousNetAmount] = useState(0);
-  console.log(currentOrderNetAmount, 'currentOrderNetAmount', previousNetAmount, salesBillEdit);
+
   const [addcustomer, setAddCustomer] = useState(false);
   const [PrintOrderDetails, setPrintOrderDetails] = useState([]);
   //Total calculation
@@ -365,7 +360,7 @@ export default function BST1Payment() {
     (item) => item.SettingIdName == 'Estimation'
   );
   const BookingTypeBoth = useSelector(GlobalBookingTypeBoth);
-  const [ConfigDataList, setConfigDataList] = useState([]);
+  const [ConfigDataList, setConfigDataList] = useState(AllBookingType);
   const [OrderStatus, setOrderStatus] = useState(true);
   const CheckOrderType = OrderCardDetail?.filter(
     (a) => a?.BookingTypeName !== BookingType
@@ -562,14 +557,21 @@ export default function BST1Payment() {
 
       const filteredPayments =
         previousOrderPayment?.filter(
-          p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+          (p) =>
+            p?.LastOrderTran === 'Y' &&
+            p?.AfterAdjustment != null &&
+            p?.AfterAdjustment !== '' &&
+            p?.AfterAdjustment
         ) || [];
 
       const paymentsToUse =
-        filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
+        filteredPayments.length > 0
+          ? filteredPayments
+          : previousOrderPayment || [];
 
       const totalPreviouspayment = paymentsToUse?.reduce(
-        (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+        (acc, payment) =>
+          acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
         0
       );
 
@@ -578,8 +580,7 @@ export default function BST1Payment() {
         0
       );
 
-      const previousNetAmount =
-        (totalPreviouspayment) || 0;
+      const previousNetAmount = totalPreviouspayment || 0;
 
       // let withdiscTotal = Total - ((OverAllSales || 0) + (OverAllEstimate || 0));
       let withdiscTotal =
@@ -592,13 +593,26 @@ export default function BST1Payment() {
         withdiscTotal >= 0
           ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
           : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      )
+      );
 
-      setTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount);
+      setTotalAmount(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount
+      );
       setCurrentOrderNetAmount(currentOrderNetAmount);
       setPreviousNetAmount(previousNetAmount);
-      dispatch(changeSummeryTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount));
-
+      dispatch(
+        changeSummeryTotalAmount(
+          salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount
+              ? currentOrderNetAmount - previousNetAmount
+              : 0
+            : currentOrderNetAmount
+        )
+      );
 
       dispatch(changeSummeryComboOfferAmount(withComboSum));
 
@@ -628,14 +642,17 @@ export default function BST1Payment() {
       UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // const Data1 = { AppId, CompId, BranchId };
+    // alert("hih")
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
   //mohan stoped data
   useEffect(() => {
     if (CompId && BranchId && AppId) {
-      getHolddata();
-      getUnpaiddatas();
+      if (holdCheckedSalesSetup) {
+        getHolddata();
+      }
+      // getUnpaiddatas();
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -668,7 +685,6 @@ export default function BST1Payment() {
   }, [salesBillEdit]);
 
   useEffect(() => {
-
     if (salesBillEdit) {
       if (SelCustId) {
         setRefundPayBtns(AllPaymentOptions);
@@ -683,8 +699,7 @@ export default function BST1Payment() {
         setRefundPayBtns(withoutCustomer);
       }
     }
-
-  }, [AllPaymentOptions, SelCustId, salesBillEdit])
+  }, [AllPaymentOptions, SelCustId, salesBillEdit]);
   useEffect(() => {
     let hasAccess = false;
 
@@ -712,10 +727,7 @@ export default function BST1Payment() {
     setEmpData(datas?.[0]);
   };
   const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
-    await dispatch(
+     await dispatch(
       getAddCustomerDetails({
         CompId: CompId,
         AppId: AppId,
@@ -892,7 +904,7 @@ export default function BST1Payment() {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
 
     if (selectedStyle) {
@@ -1246,8 +1258,9 @@ export default function BST1Payment() {
       await Promise.all(
         PrintOrderDetails?.[0]?.OrderDetails?.map(
           async (orderDetail, index) => {
-            const groupedTokens = orderDetail?.productDetails?.filter(data => data?.EditTokenAvailable !== 'N')?.reduce(
-              (acc, item, idx) => {
+            const groupedTokens = orderDetail?.productDetails
+              ?.filter((data) => data?.EditTokenAvailable !== 'N')
+              ?.reduce((acc, item, idx) => {
                 if (item.TokenAvailable === 'Y') {
                   if (!item.CounterName) {
                     // If CounterName is null or empty
@@ -1260,9 +1273,7 @@ export default function BST1Payment() {
                   }
                 }
                 return acc;
-              },
-              {}
-            );
+              }, {});
 
             // Iterate over grouped tokens and print them
             const tokensToPrint = Object.entries(groupedTokens).map(
@@ -1327,7 +1338,11 @@ export default function BST1Payment() {
   const handleButtonClick = () => {
     if (qrCode && SelectedUPIPayOption === 'Default' && UpiQRPreference) {
       UpiPayment();
-    } else if (salesBillEdit && currentOrderNetAmount < previousNetAmount && !refundPaySelected) {
+    } else if (
+      salesBillEdit &&
+      currentOrderNetAmount < previousNetAmount &&
+      !refundPaySelected
+    ) {
       setMessageType('warning');
       setMessageData('Please Select Refund Payment Method');
       return;
@@ -1523,9 +1538,9 @@ export default function BST1Payment() {
     setPaybtnselected(PaymentOptionsModeId);
   }, [PaymentOptions]);
 
-  useEffect(() => {
-    getBookingTypeId();
-  }, [BookingType]);
+  // useEffect(() => {
+  //   getBookingTypeId();
+  // }, [BookingType]);
 
   const getHolddata = async () => {
     const data = { CompId: CompId, BranchId: BranchId, AppId: AppId };
@@ -1607,7 +1622,7 @@ export default function BST1Payment() {
   const handleRefundPaymentMode = (id, name) => {
     setRefundPaySelected(id);
     setRefundPaySelectedName(name);
-  }
+  };
 
   const addUpiOption = async (id, name, UPIId) => {
     await dispatch(changeUpiIDprint(UPIId));
@@ -1831,7 +1846,9 @@ export default function BST1Payment() {
     setUpinotSelected(false);
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
-    getHolddata();
+    if (holdCheckedSalesSetup) {
+      getHolddata();
+    }
     if (defaultBookingType === 'Both') {
       await dispatch(changeBookingType('TakeAway'));
     }
@@ -2008,15 +2025,15 @@ export default function BST1Payment() {
       OrderStatus: 'O',
       OrderType:
         BookingType === 'Dine In' ||
-          BookingTypeBoth ||
-          Estimation?.SettingValue == 'N'
+        BookingTypeBoth ||
+        Estimation?.SettingValue == 'N'
           ? 'S'
           : GlobEstBooking === 'OvrAllEst'
             ? 'E'
             : GlobEstBooking === 'ParEst'
               ? GlobProdwisedata?.includes(
-                a.InwardDtlId + ' ' + a?.BookingTypeName
-              )
+                  a.InwardDtlId + ' ' + a?.BookingTypeName
+                )
                 ? 'E'
                 : 'S'
               : 'S',
@@ -2106,7 +2123,7 @@ export default function BST1Payment() {
           : Paybtnnameselected?.toLowerCase() === 'credit'
             ? 'S'
             : Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
+                SelectedUPIPayOption?.toLowerCase() === 'default'
               ? 'S'
               : 'P',
       OrderDtlDetails:
@@ -2123,86 +2140,114 @@ export default function BST1Payment() {
           ? globalTipAmount === 0
             ? SelectedTableDetails
             : SelectedTableDetails?.map((item) => ({
-              ...item,
-              TipsAmount: globalTipAmount,
-            }))
+                ...item,
+                TipsAmount: globalTipAmount,
+              }))
           : null,
 
       SalesPaymentType: 'normal',
       PaymentDetail: [
         {
-          PaymentType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? refundPaySelected :
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : SelectedUPIPayOption?.toLowerCase() === 'business'
-                    ? BusinessPayOption?.find(
-                      (busupi) => busupi?.ModeId === UpiId
-                    )?.ModeId
-                    : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          Amount: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? previousNetAmount - currentOrderNetAmount : Math.round(TotalAmount),
-          MerchantId: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'business'
-              ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                ?.MerchantId
-              : null,
-          PaymentOptionType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) && (refundPaySelectedName?.toLowerCase() === 'cash' || refundPaySelectedName?.toLowerCase() === 'credit') ? 'PC' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption?.toLowerCase() === 'business'
-                        ? 'BU'
-                        : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                ?.UPIDetailId
-              : SelectedUPIPayOption?.toLowerCase() === 'business'
+          PaymentType:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? refundPaySelected
+              : Paybtnnameselected?.toLowerCase() === 'upi'
+                ? SelectedUPIPayOption?.toLowerCase() === 'pd'
+                  ? PaymentDeviceUPI?.[0]?.ModeId
+                  : SelectedUPIPayOption?.toLowerCase() === 'pg'
+                    ? PaymentgatewayUPI?.[0]?.ModeId
+                    : SelectedUPIPayOption?.toLowerCase() === 'business'
+                      ? BusinessPayOption?.find(
+                          (busupi) => busupi?.ModeId === UpiId
+                        )?.ModeId
+                      : paybtnselected
+                : paybtnselected
+                  ? paybtnselected
+                  : null,
+          Amount:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? previousNetAmount - currentOrderNetAmount
+              : Math.round(TotalAmount),
+          MerchantId:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'business'
                 ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                  ?.MerchantUPIId
+                    ?.MerchantId
                 : null,
-          AccountDtl: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? [] :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.UPIId === UpiId
-              )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                (Paybtnnameselected?.toLowerCase() === 'card' &&
-                  SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'pg') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? 'S' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
+          PaymentOptionType:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            (refundPaySelectedName?.toLowerCase() === 'cash' ||
+              refundPaySelectedName?.toLowerCase() === 'credit')
+              ? 'PC'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'PC'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
+                  ? 'PC'
+                  : Paybtnnameselected?.toLowerCase() === 'card'
+                    ? SelectedCardOption
+                    : Paybtnnameselected?.toLowerCase() === 'upi'
+                      ? SelectedUPIPayOption?.toLowerCase() === 'default'
+                        ? 'PC'
+                        : SelectedUPIPayOption?.toLowerCase() === 'business'
+                          ? 'BU'
+                          : SelectedUPIPayOption
+                      : null,
+          ModeOfPayment:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
+                    ?.UPIDetailId
+                : SelectedUPIPayOption?.toLowerCase() === 'business'
+                  ? BusinessPayOption?.find(
+                      (busupi) => busupi?.ModeId === UpiId
+                    )?.MerchantUPIId
+                  : null,
+          AccountDtl:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? []
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
                   SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
+                    (upipay) => upipay?.UPIId === UpiId
+                  )
+                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'pd') ||
+                    (Paybtnnameselected?.toLowerCase() === 'card' &&
+                      SelectedCardOption?.toLowerCase() === 'pd')
+                  ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                  : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                        SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      (Paybtnnameselected?.toLowerCase() === 'card' &&
+                        SelectedCardOption?.toLowerCase() === 'pg')
+                    ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
+                    : [],
+          PaymentStatus:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? 'S'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'S'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
                   ? 'S'
-                  : 'P',
-          Debit: (salesBillEdit && currentOrderNetAmount < previousNetAmount && refundPaySelectedName?.toLowerCase() === 'credit') ? Math.round(previousNetAmount - currentOrderNetAmount) : 0,
-          Credit: salesBillEdit ? (currentOrderNetAmount > previousNetAmount && Paybtnnameselected?.toLowerCase() === 'credit') ? Math.round(TotalAmount) : 0 :
-            Paybtnnameselected?.toLowerCase() === 'credit'
+                  : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'default'
+                    ? 'S'
+                    : 'P',
+          Debit:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            refundPaySelectedName?.toLowerCase() === 'credit'
+              ? Math.round(previousNetAmount - currentOrderNetAmount)
+              : 0,
+          Credit: salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount &&
+              Paybtnnameselected?.toLowerCase() === 'credit'
+              ? Math.round(TotalAmount)
+              : 0
+            : Paybtnnameselected?.toLowerCase() === 'credit'
               ? Math.round(TotalAmount)
               : 0,
         },
@@ -2270,14 +2315,14 @@ export default function BST1Payment() {
         setMessageType('success');
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         response?.data?.OrderDetails?.length > 0 &&
           setPrintOrderDetails([response?.data]);
@@ -2434,14 +2479,14 @@ export default function BST1Payment() {
           setMessageType('success');
           setMessageData(
             response?.data?.response +
-            ' ' +
-            (response?.data?.OrderDetails?.length > 0
-              ? response?.data?.OrderId &&
-              extractLastNumberOrderId(
-                response?.data?.OrderId,
-                response?.data?.OrderDetails?.[0]?.FYStatus
-              )
-              : '')
+              ' ' +
+              (response?.data?.OrderDetails?.length > 0
+                ? response?.data?.OrderId &&
+                  extractLastNumberOrderId(
+                    response?.data?.OrderId,
+                    response?.data?.OrderDetails?.[0]?.FYStatus
+                  )
+                : '')
           );
           response?.data?.OrderDetails?.length > 0 &&
             setPrintOrderDetails([response?.data]);
@@ -2542,14 +2587,14 @@ export default function BST1Payment() {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -2724,14 +2769,14 @@ export default function BST1Payment() {
             setMessageType('success');
             setMessageData(
               bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
-                )
-                : '')
+                ' ' +
+                (bookingpaymentupdate?.data?.OrderDetails?.length > 0
+                  ? bookingpaymentupdate?.data?.OrderId &&
+                    extractLastNumberOrderId(
+                      bookingpaymentupdate?.data?.OrderId,
+                      bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
+                    )
+                  : '')
             );
             bookingpaymentupdate?.data?.OrderDetails?.length > 0 &&
               setPrintOrderDetails([bookingpaymentupdate?.data]);
@@ -2749,7 +2794,7 @@ export default function BST1Payment() {
         if (
           Date.now() - startTime >
           useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
+            60000
         ) {
           // 60,000 ms = 1 minute
 
@@ -3300,8 +3345,10 @@ export default function BST1Payment() {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if (salesBillEdit) {
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger, salesBillEdit]);
 
   const Otherserviceprint = async () => {
     if (OtherServicesPrintDetails?.length > 0) {
@@ -3527,30 +3574,31 @@ export default function BST1Payment() {
                       (BookingType === 'Dine In' ||
                         BookingTypeBoth ||
                         CheckOrderType?.length > 0) &&
-                        !unpaidFlow &&
-                        OrderStatus
+                      !unpaidFlow &&
+                      OrderStatus
                         ? 'none'
                         : 'auto',
                     opacity:
                       (BookingType === 'Dine In' ||
                         BookingTypeBoth ||
                         CheckOrderType?.length > 0) &&
-                        !unpaidFlow &&
-                        OrderStatus
+                      !unpaidFlow &&
+                      OrderStatus
                         ? 0.5
                         : 1,
                   }}
                 >
-                  {paybtns?.length > 0 && (currentOrderNetAmount >= previousNetAmount) ? (
+                  {paybtns?.length > 0 &&
+                  currentOrderNetAmount >= previousNetAmount ? (
                     paybtns?.map((payment) => (
                       <div className="Table3-cash">
                         <button
                           className={
                             paybtnselected === payment.ModeId &&
-                              (UpinotSelected || CardoptionnotSelected)
+                            (UpinotSelected || CardoptionnotSelected)
                               ? 'Btn-payment-mode-notupisel'
                               : paybtnselected === payment.ModeId &&
-                                (!UpinotSelected || !CardoptionnotSelected)
+                                  (!UpinotSelected || !CardoptionnotSelected)
                                 ? 'Btn-payment-mode'
                                 : 'Btn-payment-mode-sel'
                           }
@@ -3564,13 +3612,13 @@ export default function BST1Payment() {
                           onClick={() =>
                             payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
                               ? handleUPIButtonClick(
-                                payment.ModeId,
-                                payment.ModeName
-                              )
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
                               : handlePaymentMode(
-                                payment.ModeId,
-                                payment.ModeName
-                              )
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
                           }
                         >
                           {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
@@ -3621,16 +3669,18 @@ export default function BST1Payment() {
                         </button>
                       </div>
                     ))
-                  ) : (currentOrderNetAmount < previousNetAmount && salesBillEdit && refundPayBtns.length > 0) ? (
+                  ) : currentOrderNetAmount < previousNetAmount &&
+                    salesBillEdit &&
+                    refundPayBtns.length > 0 ? (
                     refundPayBtns.map((payment) => (
                       <div className="Table3-cash">
                         <button
                           className={
                             refundPaySelected === payment.ConfigId &&
-                              (UpinotSelected || CardoptionnotSelected)
+                            (UpinotSelected || CardoptionnotSelected)
                               ? 'Btn-payment-mode-notupisel'
                               : refundPaySelected === payment.ConfigId &&
-                                (!UpinotSelected || !CardoptionnotSelected)
+                                  (!UpinotSelected || !CardoptionnotSelected)
                                 ? 'Btn-payment-mode'
                                 : 'Btn-payment-mode-sel'
                           }
@@ -3641,7 +3691,12 @@ export default function BST1Payment() {
                               ? 'blink-animation 0.5s infinite alternate'
                               : 'none',
                           }}
-                          onClick={() => handleRefundPaymentMode(payment?.ConfigId, payment?.ConfigName)}
+                          onClick={() =>
+                            handleRefundPaymentMode(
+                              payment?.ConfigId,
+                              payment?.ConfigName
+                            )
+                          }
                         >
                           {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
 
@@ -3700,9 +3755,9 @@ export default function BST1Payment() {
                                 OrderCardDetail?.length > 0 && 'not-allowed',
                               color:
                                 OrderCardDetail?.length > 0 ||
-                                  (selOption?.value === undefined &&
-                                    GlobalAddCustomerDetails1?.length === 0 &&
-                                    GetCustId?.CustMobile === undefined)
+                                (selOption?.value === undefined &&
+                                  GlobalAddCustomerDetails1?.length === 0 &&
+                                  GetCustId?.CustMobile === undefined)
                                   ? 'gray'
                                   : 'rgb(18, 146, 238)',
                               fontSize: '28px',
@@ -3752,16 +3807,16 @@ export default function BST1Payment() {
                     (BookingType === 'Dine In' ||
                       BookingTypeBoth ||
                       CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
+                    !unpaidFlow &&
+                    OrderStatus
                       ? 'none'
                       : 'auto',
                   opacity:
                     (BookingType === 'Dine In' ||
                       BookingTypeBoth ||
                       CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
+                    !unpaidFlow &&
+                    OrderStatus
                       ? 0.5
                       : 1,
                 }}
@@ -3780,14 +3835,14 @@ export default function BST1Payment() {
                         width: '1.5rem',
                         cursor:
                           OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
+                          CheckBookingStatus == 'Close' ||
+                          addnewAccess
                             ? 'not-allowed'
                             : 'pointer',
                         color:
                           OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
+                          CheckBookingStatus == 'Close' ||
+                          addnewAccess
                             ? 'gray'
                             : 'rgb(18, 146, 238)',
                         display: 'flex',
@@ -3804,7 +3859,6 @@ export default function BST1Payment() {
 
             {/* Customer Orders */}
             {GetCustId && (
-
               <Tooltip title="Customer Orders" isMobile={isMobile}>
                 {' '}
                 <div
@@ -3822,8 +3876,8 @@ export default function BST1Payment() {
                     cursor: OrderCardDetail?.length > 0 && 'not-allowed',
                     color:
                       OrderCardDetail?.length > 0 ||
-                        (OrderCardDetail?.length > 0 &&
-                          GetCustId?.CustMobile === undefined)
+                      (OrderCardDetail?.length > 0 &&
+                        GetCustId?.CustMobile === undefined)
                         ? 'gray'
                         : 'rgb(18, 146, 238)',
                     fontSize: '25px',
@@ -3838,7 +3892,6 @@ export default function BST1Payment() {
               </Tooltip>
             )}
 
-
             {OtherServicesglobal && OrderCardDetail.length >= 1 && (
               <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
                 {' '}
@@ -3853,14 +3906,14 @@ export default function BST1Payment() {
                     width: '1.5rem',
                     cursor:
                       OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
+                      CheckBookingStatus == 'Close' ||
+                      addnewAccess
                         ? 'not-allowed'
                         : 'pointer',
                     color:
                       OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
+                      CheckBookingStatus == 'Close' ||
+                      addnewAccess
                         ? 'gray'
                         : 'rgb(18, 146, 238)',
                     display: 'flex',
@@ -3942,58 +3995,58 @@ export default function BST1Payment() {
               <div>
                 {unpaidFlow == false
                   ? holdCheckedSalesSetup &&
-                  BookingType !== 'Dine In' &&
-                  !BookingTypeBoth &&
-                  OrderCardDetail?.length != 0 &&
-                  CheckOrderType?.length === 0 &&
-                  OrderType != 'Failed' &&
-                  CheckBookingStatus != 'Close' &&
-                  paybtns?.length > 0 &&
-                  !addnewAccess && (
-                    <TooltipWrapper title={'Hold'} isMobile={isMobile}>
-                      {' '}
-                      <PozoHoldIcon
-                        className="BSBillingNav-icon-table-icon"
-                        onClick={() => AddBookingDetails('Hold')}
-                        style={{
-                          fontSize: '30px',
-                          cursor: 'pointer',
-                          color: '' ? '#52c41a' : '#1292EE',
-                        }}
-                      />
-                    </TooltipWrapper>
-                  )
+                    BookingType !== 'Dine In' &&
+                    !BookingTypeBoth &&
+                    OrderCardDetail?.length != 0 &&
+                    CheckOrderType?.length === 0 &&
+                    OrderType != 'Failed' &&
+                    CheckBookingStatus != 'Close' &&
+                    paybtns?.length > 0 &&
+                    !addnewAccess && (
+                      <TooltipWrapper title={'Hold'} isMobile={isMobile}>
+                        {' '}
+                        <PozoHoldIcon
+                          className="BSBillingNav-icon-table-icon"
+                          onClick={() => AddBookingDetails('Hold')}
+                          style={{
+                            fontSize: '30px',
+                            cursor: 'pointer',
+                            color: '' ? '#52c41a' : '#1292EE',
+                          }}
+                        />
+                      </TooltipWrapper>
+                    )
                   : ''}
                 {unpaidFlow == false
                   ? holdCheckedSalesSetup &&
-                  paybtns?.length > 0 &&
-                  BookingType !== 'Dine In' &&
-                  !BookingTypeBoth &&
-                  Holddata?.length > 0 &&
-                  OrderCardDetail?.length == 0 &&
-                  CheckBookingStatus != 'Close' &&
-                  !addnewAccess && (
-                    <TooltipWrapper title={'Recall'} isMobile={isMobile}>
-                      {' '}
-                      <Badge
-                        count={Holddata?.length}
-                        size={'small'}
-                        offset={[0, 7]}
-                      >
-                        <PozoHoldIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={() => HandleholdModelOpen()}
-                          style={{
-                            fontSize: '28px',
-                            cursor: 'pointer',
-                            color: Holddata ? '#52c41a' : 'default',
-                            pointerEvents:
-                              OrderType === 'Failed' ? 'none' : 'auto',
-                          }}
-                        />
-                      </Badge>
-                    </TooltipWrapper>
-                  )
+                    paybtns?.length > 0 &&
+                    BookingType !== 'Dine In' &&
+                    !BookingTypeBoth &&
+                    Holddata?.length > 0 &&
+                    OrderCardDetail?.length == 0 &&
+                    CheckBookingStatus != 'Close' &&
+                    !addnewAccess && (
+                      <TooltipWrapper title={'Recall'} isMobile={isMobile}>
+                        {' '}
+                        <Badge
+                          count={Holddata?.length}
+                          size={'small'}
+                          offset={[0, 7]}
+                        >
+                          <PozoHoldIcon
+                            className="BSBillingNav-icon-table-icon"
+                            onClick={() => HandleholdModelOpen()}
+                            style={{
+                              fontSize: '28px',
+                              cursor: 'pointer',
+                              color: Holddata ? '#52c41a' : 'default',
+                              pointerEvents:
+                                OrderType === 'Failed' ? 'none' : 'auto',
+                            }}
+                          />
+                        </Badge>
+                      </TooltipWrapper>
+                    )
                   : ''}
               </div>
             )}
@@ -4036,12 +4089,14 @@ export default function BST1Payment() {
                   addnewAccess
                     ? 'price-button-disabled'
                     : FirstPaymentclick === false &&
-                      OrderCardDetail?.length > 0 &&
-                      paybtnselected &&
-                      CheckBookingStatus != 'Close'
-                      ? !OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ?
-                        'price-button'
-                        : 'price-button'
+                        OrderCardDetail?.length > 0 &&
+                        paybtnselected &&
+                        CheckBookingStatus != 'Close'
+                      ? !OrderStatus
+                        ? salesBillEdit &&
+                          currentOrderNetAmount < previousNetAmount
+                          ? 'price-button'
+                          : 'price-button'
                         : 'price-button Order'
                       : 'price-button-disabled'
                 }
@@ -4056,32 +4111,48 @@ export default function BST1Payment() {
               >
                 {' '}
                 {isMobile ? (
-                  !OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <div>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</div> : (
-                    `₹ ${Math.round(
-                      OrderType === 'Failed'
-                        ? FailedTotalAmt
-                        : credit && overAllBal >= 0
-                          ? Math.max(0, TotalAmount - overAllBal)
-                          : TotalAmount
-                    )}`
-                  ) : (
-                    'ORDER'
-                  )
-                ) : !OrderStatus ? (salesBillEdit && (currentOrderNetAmount < previousNetAmount)) ? (<div>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</div>) : (
-                  <div>
-                    ₹{' '}
-                    <CountUp
-                      duration={0.4}
-                      className="counter"
-                      end={safeRound(
+                  !OrderStatus ? (
+                    salesBillEdit &&
+                    currentOrderNetAmount < previousNetAmount ? (
+                      <div>
+                        Refund: ₹
+                        {(previousNetAmount || 0) -
+                          (currentOrderNetAmount || 0)}
+                      </div>
+                    ) : (
+                      `₹ ${Math.round(
                         OrderType === 'Failed'
                           ? FailedTotalAmt
                           : credit && overAllBal >= 0
                             ? Math.max(0, TotalAmount - overAllBal)
                             : TotalAmount
-                      )}
-                    />
-                  </div>
+                      )}`
+                    )
+                  ) : (
+                    'ORDER'
+                  )
+                ) : !OrderStatus ? (
+                  salesBillEdit && currentOrderNetAmount < previousNetAmount ? (
+                    <div>
+                      Refund: ₹
+                      {(previousNetAmount || 0) - (currentOrderNetAmount || 0)}
+                    </div>
+                  ) : (
+                    <div>
+                      ₹{' '}
+                      <CountUp
+                        duration={0.4}
+                        className="counter"
+                        end={safeRound(
+                          OrderType === 'Failed'
+                            ? FailedTotalAmt
+                            : credit && overAllBal >= 0
+                              ? Math.max(0, TotalAmount - overAllBal)
+                              : TotalAmount
+                        )}
+                      />
+                    </div>
+                  )
                 ) : (
                   <div>ORDER</div>
                 )}
@@ -4265,10 +4336,17 @@ export default function BST1Payment() {
           SplitPaymentModal={Splitpayment}
           handlesplitpaymentclose={handlesplitpaymentclose}
           TotalNetAmount={
-            OrderType === 'Failed' ? FailedTotalAmt : Math.round(OrderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
-              ((OverAllSales > 0 ? OverAllSales : 0) +
-                (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                (Discount > 0 ? Discount : 0)))
+            OrderType === 'Failed'
+              ? FailedTotalAmt
+              : Math.round(
+                  OrderCardDetail?.reduce(
+                    (acc, data) => data?.TotalAmt + acc,
+                    0
+                  ) -
+                    ((OverAllSales > 0 ? OverAllSales : 0) +
+                      (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                      (Discount > 0 ? Discount : 0))
+                )
           }
           failedOrderData={failedOrderData}
         />
@@ -4401,9 +4479,9 @@ export default function BST1Payment() {
 
               const qty = isGroup
                 ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
-                  (sum, o) => sum + (o.OrderQty || 1),
-                  0
-                )
+                    (sum, o) => sum + (o.OrderQty || 1),
+                    0
+                  )
                 : item.OrderQty || 1;
 
               return (
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable2/BSBillingTable2.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable2/BSBillingTable2.jsx
index f6d92d8..5778907 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable2/BSBillingTable2.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable2/BSBillingTable2.jsx
@@ -1,4 +1,11 @@
-import React, { useCallback, useEffect, useState, useRef } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+  useRef,
+  lazy,
+  Suspense,
+} from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import moment from 'moment';
@@ -13,9 +20,6 @@ import { AiOutlineClose } from 'react-icons/ai';
 import paygate from '../../../../../Images/paygate.png';
 import defaultupi from '../../../../../Images/defaultupi.png';
 import paydevice from '../../../../../Images/paydevice.png';
-import BsBill2 from './BsBill2';
-import BsBill2Sum from './BsBill2Sum';
-import BSSummery1 from '../BSBillingTableSummery/BSSummery';
 import { Tables } from '../../../../../Components/Tables/Table';
 import {
   printDiv,
@@ -133,14 +137,21 @@ import {
   changeBillEditingMode,
   changePreviousOrderPayment,
   changePreviousOrderOfferDetail,
-} from '../../../../../Features/BookingScreen/BookingData/BookingData';
+} from '../../../../../Features/BookingScreen/BookingData/BookingData.js';
+import {
+  ChangeFullFreeProductList,
+  changeFullOfferAppliedProducts,
+  changeLoyaltyConsumedQuantities,
+  GlobalFreeProdList,
+  GlobalOfferAppliedProducts,
+  GlobalOverAllOfferAmt,
+} from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import {
   gettinghold,
   globalholddata,
   changeholddata,
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption';
 import { ChangeTotalAmount } from '../../../../../Features/ExteraCharges/ExtraCharges.js'; //Shifayath Date:27/12/2023
-import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities';
 import { globalExtraTotalAmount } from '../../../../../Features/ExteraCharges/ExtraCharges';
 import {
   getAddCustomerDetails,
@@ -148,31 +159,20 @@ import {
   GlobalAddCustomerDetails,
   ReprintDetails,
   triggerCustomerRefresh,
-} from '../../../../../Features/BookingScreen/Customer/addCustomer';
-import PaymentPdfBooking from '../../../../paymentpdfPage/PaymentPdfBooking';
+} from '../../../../../Features/BookingScreen/Customer/addCustomer.js';
+import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable2/BSBIllingTable2.scss';
-import BSCustomerSelect from '../../UtillComponents/BSSelectCustomer.jsx';
 import PozoHoldIcon from '../../UtillComponents/Pozo retail icons/PozoHoldIcon';
-import PozoDineInIcon from '../../UtillComponents/Pozo retail icons/PozoDineIn.jsx';
 import PozoUnpaidIcon from '../../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
+import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
 import PozoBillIcon from '../../UtillComponents/Pozo retail icons/PozoBIllIcon.jsx';
 import PozoAddCustomerIcon from '../../UtillComponents/Pozo retail icons/PozoAddCustomerIcon';
-import QrComponent from '../../BookingFunctionality/DynamicQr.jsx';
-import QrinScreen from '../../BookingFunctionality/DynamicScreenQr.jsx';
-import BSCreditCustomer from '../../UtillComponents/BSCreditCustomer.jsx';
 import Buttons from '../../../../../Components/Forms/Buttons';
 import WpIcon from '../../../../../Images/message.png';
-import BsBillingCreditCustomer from '../../BookingFunctionality/BSBillingCreditCustomer.jsx';
-import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
 import { isMobile } from 'react-device-detect';
-import MobilePrint from '../../BookingFunctionality/MobilePrint.jsx';
 import { settingDataSelector } from '../../../../../Features/PreferenceMaster/PreferenceMaster.js';
 import CountUp from 'react-countup';
 import { GlobalpreOrderOpen } from '../../../../../Features/BookingScreen/PreOrder/PreOrder.js';
-import SplitPayment from '../../BookingFunctionality/SplitPayment.jsx';
-import TokensinglePrint from '../../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx';
-import SingleTokenMobilePrint from '../../BookingFunctionality/SingleTokenMobilePrint.jsx';
-import IndividualTokenMobilePrint from '../../BookingFunctionality/IndividualTokenMobilePrint.jsx';
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
 import { getEmpAccess } from '../../../../../Features/AppPage/CenterPage.js';
 import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
@@ -184,49 +184,94 @@ import {
   Global_OverallOfferAmount,
   Global_SalesWiseOfferAmount,
 } from '../../../../../Features/Offer/Offer.js';
-import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
+import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
 import { useAuth } from '../../../../../AuthContext.jsx';
+import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import { GlobalBookingStatus } from '../../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail.js';
 import {
   changeSalesPaymentoption,
   getPaymentOptionsData,
   GlobalSalesPaymentoption,
 } from '../../../../../Features/Payment/Paymentoptions/Paymentoptions.js';
-import Paymentoption from '../../../../Payment/PaymentOptions/PaymentOptions.jsx';
 import { getCombolist } from '../../../../../Features/ComboMaster/ComboMaster.js';
-import SMSShare from '../../../../WhatsAppShare/SmsShare.jsx';
-import WhatsAppShare from '../../../../WhatsAppShare/whatsAppShare.jsx';
 import { MdSms } from 'react-icons/md';
 import { FaWhatsapp, FaPrint, FaCartPlus } from 'react-icons/fa';
-import BSTipAmount from '../../UtillComponents/BSTipAmount.jsx';
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin.js';
 import { PostOtherServices } from '../../../../../Features/OtherServices/OtherServices.js';
 import { TfiClipboard } from 'react-icons/tfi';
-import OtherServicePrintStyle1 from '../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx';
-import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
-import BSOtherServiceClaim from '../../UtillComponents/BSOtherServiceClaim.jsx';
-import { MobilePdfPrint } from '../../BookingFunctionality/MobilePdfPrint.js';
 import { PublicQrCodepost } from '../../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
-import {
-  ChangeFullFreeProductList,
-  changeFullOfferAppliedProducts,
-  changeLoyaltyConsumedQuantities,
-  GlobalFreeProdList,
-  GlobalOfferAppliedProducts,
-  GlobalOverAllOfferAmt,
-} from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import CardPopover from '../StandardTable/Utils/CardPopover.jsx';
 import UpiPopover from '../StandardTable/Utils/UpiPopOver.jsx';
 import pozologoimg from '../../../../../Images/pozologoimg.png';
 import PaymentGatewayEmbedded from '../../UtillComponents/PaymentGatewayEmbedded.jsx';
 import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
-import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
-import CustomerOrders from '../../BookingFunctionality/CustomerOrders.jsx';
+// Jsx Files
+const CustomerOrders = lazy(
+  () => import('../../BookingFunctionality/CustomerOrders.jsx')
+);
+const BSCustomerSelect = lazy(
+  () => import('../../UtillComponents/BSSelectCustomer.jsx')
+);
+const BSCreditCustomer = lazy(
+  () => import('../../UtillComponents/BSCreditCustomer.jsx')
+);
+const OtherServicePrintStyle1 = lazy(
+  () =>
+    import('../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx')
+);
+import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
+const BSOtherServiceClaim = lazy(
+  () => import('../../UtillComponents/BSOtherServiceClaim.jsx')
+);
+const SplitPayment = lazy(
+  () => import('../../BookingFunctionality/SplitPayment.jsx')
+);
+const FeaturesFunctionalities = lazy(
+  () => import('../../BookingFunctionality/FeaturesFunctionalities.jsx')
+);
+const Paymentoption = lazy(
+  () => import('../../../../Payment/PaymentOptions/PaymentOptions.jsx')
+);
+
+const BsBill2 = lazy(() => import('./BsBill2'));
+const BsBill2Sum = lazy(() => import('./BsBill2Sum'));
+const BSSummery1 = lazy(() => import('../BSBillingTableSummery/BSSummery'));
+const PaymentPdfBooking = lazy(
+  () => import('../../../../paymentpdfPage/PaymentPdfBooking')
+);
+const PozoDineInIcon = lazy(
+  () => import('../../UtillComponents/Pozo retail icons/PozoDineIn.jsx')
+);
+const QrComponent = lazy(
+  () => import('../../BookingFunctionality/DynamicQr.jsx')
+);
+const QrinScreen = lazy(
+  () => import('../../BookingFunctionality/DynamicScreenQr.jsx')
+);
+const BsBillingCreditCustomer = lazy(
+  () => import('../../BookingFunctionality/BSBillingCreditCustomer.jsx')
+);
+const MobilePrint = lazy(
+  () => import('../../BookingFunctionality/MobilePrint.jsx')
+);
+const TokensinglePrint = lazy(
+  () =>
+    import('../../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx')
+);
+const SingleTokenMobilePrint = lazy(
+  () => import('../../BookingFunctionality/SingleTokenMobilePrint.jsx')
+);
+const IndividualTokenMobilePrint = lazy(
+  () => import('../../BookingFunctionality/IndividualTokenMobilePrint.jsx')
+);
+const SMSShare = lazy(() => import('../../../../WhatsAppShare/SmsShare.jsx'));
+const WhatsAppShare = lazy(
+  () => import('../../../../WhatsAppShare/whatsAppShare.jsx')
+);
+const BSTipAmount = lazy(() => import('../../UtillComponents/BSTipAmount.jsx'));
 
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
-const RetailApiurl = import.meta.env.ENV_API_URL;
 
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
 const BSBillingTable2 = () => {
@@ -254,7 +299,9 @@ const BSBillingTable2 = () => {
   const navigate = useNavigate();
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const defaultBookingType = useSelector(GlobalDefaultBookingType);
   const globalTipAmount = useSelector(GlobaltipAmount);
@@ -375,6 +422,10 @@ const BSBillingTable2 = () => {
   const OverAllSales = useSelector(GlobalOverAllDiscSales);
   const OverAllEstimate = useSelector(GlobalOverAllDiscEstimate);
 
+  const holdCheckedSalesSetup = tableOptions?.some(
+    (item) => item?.OptionName === 'Hold'
+  );
+
   const PaymentOptionsModeName =
     PaymentOptions?.find((e) => e.ModeDefault?.toUpperCase() === 'Y')
       ?.ModeName || PaymentOptions?.[0]?.ModeName;
@@ -518,7 +569,6 @@ const BSBillingTable2 = () => {
   }, [salesBillEdit]);
 
   useEffect(() => {
-
     if (salesBillEdit) {
       if (SelCustId) {
         setRefundPayBtns(AllPaymentOptions);
@@ -533,8 +583,7 @@ const BSBillingTable2 = () => {
         setRefundPayBtns(withoutCustomer);
       }
     }
-
-  }, [AllPaymentOptions, SelCustId, salesBillEdit])
+  }, [AllPaymentOptions, SelCustId, salesBillEdit]);
 
   useEffect(() => {
     if (!preOrder) {
@@ -594,14 +643,21 @@ const BSBillingTable2 = () => {
 
       const filteredPayments =
         previousOrderPayment?.filter(
-          p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+          (p) =>
+            p?.LastOrderTran === 'Y' &&
+            p?.AfterAdjustment != null &&
+            p?.AfterAdjustment !== '' &&
+            p?.AfterAdjustment
         ) || [];
 
       const paymentsToUse =
-        filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
+        filteredPayments.length > 0
+          ? filteredPayments
+          : previousOrderPayment || [];
 
       const totalPreviouspayment = paymentsToUse?.reduce(
-        (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+        (acc, payment) =>
+          acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
         0
       );
 
@@ -610,8 +666,7 @@ const BSBillingTable2 = () => {
         0
       );
 
-      const previousNetAmount =
-        (totalPreviouspayment) || 0;
+      const previousNetAmount = totalPreviouspayment || 0;
 
       let withdiscTotal =
         Total -
@@ -623,12 +678,26 @@ const BSBillingTable2 = () => {
         withdiscTotal >= 0
           ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
           : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      )
+      );
 
-      setTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount);
+      setTotalAmount(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount
+      );
       setCurrentOrderNetAmount(currentOrderNetAmount);
       setPreviousNetAmount(previousNetAmount);
-      dispatch(changeSummeryTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount));
+      dispatch(
+        changeSummeryTotalAmount(
+          salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount
+              ? currentOrderNetAmount - previousNetAmount
+              : 0
+            : currentOrderNetAmount
+        )
+      );
 
       dispatch(changeSummeryComboOfferAmount(withComboSum));
 
@@ -658,13 +727,16 @@ const BSBillingTable2 = () => {
       UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // const Data1 = { AppId, CompId, BranchId };
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
   useEffect(() => {
     if (CompId && BranchId && AppId) {
-      getHolddata();
-      getUnpaiddatas();
+      if (holdCheckedSalesSetup) {
+        getHolddata();
+      }
+
+      // getUnpaiddatas();
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -702,29 +774,6 @@ const BSBillingTable2 = () => {
     setResponsiveBill(!responsiveBill);
   };
 
-  // useEffect(() => {
-  //   const handleKeyPress = (event) => {
-  //     if (event.shiftKey && event.code === 'KeyM') {
-  //       if (
-  //         document.activeElement.tagName !== 'INPUT' &&
-  //         document.activeElement.tagName !== 'TEXTAREA'
-  //       ) {
-  //         event.preventDefault();
-  //         setBlink(true);
-  //       }
-  //     }
-  //   };
-  //   const handleClickOutside = (event) => {
-  //     setBlink(false);
-  //   };
-  //   window.addEventListener('keydown', handleKeyPress);
-  //   window.addEventListener('mousedown', handleClickOutside);
-  //   return () => {
-  //     window.removeEventListener('keydown', handleKeyPress);
-  //     window.addEventListener('mousedown', handleClickOutside);
-  //   };
-  // }, []);
-
   const fetchApi = async () => {
     let data = {
       CompId: CompId,
@@ -740,9 +789,9 @@ const BSBillingTable2 = () => {
   };
 
   const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
+    // await dispatch(
+    //   getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
+    // );
     await dispatch(
       getAddCustomerDetails({
         CompId: CompId,
@@ -833,7 +882,11 @@ const BSBillingTable2 = () => {
   const handleButtonClick = () => {
     if (qrCode && SelectedUPIPayOption === 'Default' && UpiQRPreference) {
       UpiPayment();
-    } else if (salesBillEdit && currentOrderNetAmount < previousNetAmount && !refundPaySelected) {
+    } else if (
+      salesBillEdit &&
+      currentOrderNetAmount < previousNetAmount &&
+      !refundPaySelected
+    ) {
       setMessageType('warning');
       setMessageData('Please Select Refund Payment Method');
       return;
@@ -1313,7 +1366,7 @@ const BSBillingTable2 = () => {
   const handleRefundPaymentMode = (id, name) => {
     setRefundPaySelected(id);
     setRefundPaySelectedName(name);
-  }
+  };
 
   const addUpiOption = async (id, name, UPIId) => {
     await dispatch(changeUpiIDprint(UPIId));
@@ -1490,7 +1543,7 @@ const BSBillingTable2 = () => {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
 
     if (selectedStyle) {
@@ -1872,7 +1925,10 @@ const BSBillingTable2 = () => {
     setUpinotSelected(false);
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
-    getHolddata();
+
+    if (holdCheckedSalesSetup) {
+      getHolddata();
+    }
     if (defaultBookingType === 'Both') {
       await dispatch(changeBookingType('TakeAway'));
     }
@@ -2048,15 +2104,15 @@ const BSBillingTable2 = () => {
       OrderStatus: 'O',
       OrderType:
         BookingType === 'Dine In' ||
-          BookingTypeBoth ||
-          Estimation?.SettingValue == 'N'
+        BookingTypeBoth ||
+        Estimation?.SettingValue == 'N'
           ? 'S'
           : GlobEstBooking === 'OvrAllEst'
             ? 'E'
             : GlobEstBooking === 'ParEst'
               ? GlobProdwisedata?.includes(
-                a.InwardDtlId + ' ' + a?.BookingTypeName
-              )
+                  a.InwardDtlId + ' ' + a?.BookingTypeName
+                )
                 ? 'E'
                 : 'S'
               : 'S',
@@ -2148,7 +2204,7 @@ const BSBillingTable2 = () => {
           : Paybtnnameselected?.toLowerCase() === 'credit'
             ? 'S'
             : Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
+                SelectedUPIPayOption?.toLowerCase() === 'default'
               ? 'S'
               : 'P',
       OrderDtlDetails:
@@ -2165,87 +2221,115 @@ const BSBillingTable2 = () => {
           ? globalTipAmount === 0
             ? SelectedTableDetails
             : SelectedTableDetails?.map((item) => ({
-              ...item,
-              TipsAmount: globalTipAmount,
-            }))
+                ...item,
+                TipsAmount: globalTipAmount,
+              }))
           : null,
       // "Credit": TotalAmount,
       // "Debit": 0,
       SalesPaymentType: 'normal',
       PaymentDetail: [
         {
-          PaymentType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? refundPaySelected :
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : SelectedUPIPayOption?.toLowerCase() === 'business'
-                    ? BusinessPayOption?.find(
-                      (busupi) => busupi?.ModeId === UpiId
-                    )?.ModeId
-                    : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          Amount: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? previousNetAmount - currentOrderNetAmount : Math.round(TotalAmount),
-          MerchantId: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'business'
-              ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                ?.MerchantId
-              : null,
-          PaymentOptionType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) && (refundPaySelectedName?.toLowerCase() === 'cash' || refundPaySelectedName?.toLowerCase() === 'credit') ? 'PC' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption?.toLowerCase() === 'business'
-                        ? 'BU'
-                        : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                ?.UPIDetailId
-              : SelectedUPIPayOption?.toLowerCase() === 'business'
+          PaymentType:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? refundPaySelected
+              : Paybtnnameselected?.toLowerCase() === 'upi'
+                ? SelectedUPIPayOption?.toLowerCase() === 'pd'
+                  ? PaymentDeviceUPI?.[0]?.ModeId
+                  : SelectedUPIPayOption?.toLowerCase() === 'pg'
+                    ? PaymentgatewayUPI?.[0]?.ModeId
+                    : SelectedUPIPayOption?.toLowerCase() === 'business'
+                      ? BusinessPayOption?.find(
+                          (busupi) => busupi?.ModeId === UpiId
+                        )?.ModeId
+                      : paybtnselected
+                : paybtnselected
+                  ? paybtnselected
+                  : null,
+          Amount:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? previousNetAmount - currentOrderNetAmount
+              : Math.round(TotalAmount),
+          MerchantId:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'business'
                 ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                  ?.MerchantUPIId
+                    ?.MerchantId
                 : null,
-          AccountDtl: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? [] :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.UPIId === UpiId
-              )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                (Paybtnnameselected?.toLowerCase() === 'card' &&
-                  SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'pg') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? 'S' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
+          PaymentOptionType:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            (refundPaySelectedName?.toLowerCase() === 'cash' ||
+              refundPaySelectedName?.toLowerCase() === 'credit')
+              ? 'PC'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'PC'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
+                  ? 'PC'
+                  : Paybtnnameselected?.toLowerCase() === 'card'
+                    ? SelectedCardOption
+                    : Paybtnnameselected?.toLowerCase() === 'upi'
+                      ? SelectedUPIPayOption?.toLowerCase() === 'default'
+                        ? 'PC'
+                        : SelectedUPIPayOption?.toLowerCase() === 'business'
+                          ? 'BU'
+                          : SelectedUPIPayOption
+                      : null,
+          ModeOfPayment:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
+                    ?.UPIDetailId
+                : SelectedUPIPayOption?.toLowerCase() === 'business'
+                  ? BusinessPayOption?.find(
+                      (busupi) => busupi?.ModeId === UpiId
+                    )?.MerchantUPIId
+                  : null,
+          AccountDtl:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? []
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
                   SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
+                    (upipay) => upipay?.UPIId === UpiId
+                  )
+                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'pd') ||
+                    (Paybtnnameselected?.toLowerCase() === 'card' &&
+                      SelectedCardOption?.toLowerCase() === 'pd')
+                  ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                  : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                        SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      (Paybtnnameselected?.toLowerCase() === 'card' &&
+                        SelectedCardOption?.toLowerCase() === 'pg')
+                    ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
+                    : [],
+          PaymentStatus:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? 'S'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'S'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
                   ? 'S'
-                  : 'P',
-          Debit: (salesBillEdit && currentOrderNetAmount < previousNetAmount && refundPaySelectedName?.toLowerCase() === 'credit') ? Math.round(previousNetAmount - currentOrderNetAmount) : 0,
-          Credit: salesBillEdit ? (currentOrderNetAmount > previousNetAmount && Paybtnnameselected?.toLowerCase() === 'credit') ? Math.round(TotalAmount) : 0 :
-            Paybtnnameselected?.toLowerCase() === 'credit'
+                  : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'default'
+                    ? 'S'
+                    : 'P',
+          Debit:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            refundPaySelectedName?.toLowerCase() === 'credit'
+              ? Math.round(previousNetAmount - currentOrderNetAmount)
+              : 0,
+          Credit: salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount &&
+              Paybtnnameselected?.toLowerCase() === 'credit'
+              ? Math.round(TotalAmount)
+              : 0
+            : Paybtnnameselected?.toLowerCase() === 'credit'
               ? Math.round(TotalAmount)
               : 0,
         },
@@ -2316,14 +2400,14 @@ const BSBillingTable2 = () => {
         setMessageType('success');
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         response?.data?.OrderDetails?.length > 0 &&
           setPrintOrderDetails([response?.data]);
@@ -2480,14 +2564,14 @@ const BSBillingTable2 = () => {
           setMessageType('success');
           setMessageData(
             response?.data?.response +
-            ' ' +
-            (response?.data?.OrderDetails?.length > 0
-              ? response?.data?.OrderId &&
-              extractLastNumberOrderId(
-                response?.data?.OrderId,
-                response?.data?.OrderDetails?.[0]?.FYStatus
-              )
-              : '')
+              ' ' +
+              (response?.data?.OrderDetails?.length > 0
+                ? response?.data?.OrderId &&
+                  extractLastNumberOrderId(
+                    response?.data?.OrderId,
+                    response?.data?.OrderDetails?.[0]?.FYStatus
+                  )
+                : '')
           );
           response?.data?.OrderDetails?.length > 0 &&
             setPrintOrderDetails([response?.data]);
@@ -2591,14 +2675,14 @@ const BSBillingTable2 = () => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -2775,14 +2859,14 @@ const BSBillingTable2 = () => {
             setMessageType('success');
             setMessageData(
               bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
-                )
-                : '')
+                ' ' +
+                (bookingpaymentupdate?.data?.OrderDetails?.length > 0
+                  ? bookingpaymentupdate?.data?.OrderId &&
+                    extractLastNumberOrderId(
+                      bookingpaymentupdate?.data?.OrderId,
+                      bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
+                    )
+                  : '')
             );
             bookingpaymentupdate?.data?.OrderDetails?.length > 0 &&
               setPrintOrderDetails([bookingpaymentupdate?.data]);
@@ -2801,7 +2885,7 @@ const BSBillingTable2 = () => {
         if (
           Date.now() - startTime >
           useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
+            60000
         ) {
           // 60,000 ms = 1 minute
 
@@ -3417,8 +3501,10 @@ const BSBillingTable2 = () => {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if (salesBillEdit) {
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger, salesBillEdit]);
 
   const Otherserviceprint = async () => {
     if (OtherServicesPrintDetails?.length > 0) {
@@ -3572,1202 +3658,1239 @@ const BSBillingTable2 = () => {
     );
   };
   return (
-    <div
-      className={
-        templateData?.BookingLayout?.[0] === 'Layout6'
-          ? 'BsTable2-Master BsTable2-Master-6'
-          : 'BsTable2-Master'
-      }
-      style={{
-        height: containerHeight,
-      }}
-    >
-      <div className="BSBillingTable2-Summary">
-        {(addcustomer || hold) && (
-          <FeaturesFunctionalities
-            handleAddCustomerCancel={handleAddCustomerCancel}
-            addcustomer={addcustomer}
-            handleHoldCancel={handleHoldCancel}
-            modalOpen={hold}
-          />
-        )}
-        {creditCustomerOpen && (
-          <BSCreditCustomer
-            creditCustomerOpen={creditCustomerOpen}
-            CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-          />
-        )}
-        {TotalAmount == 0 && Success && (
-          <div>
-            <QrComponent com={`WelcomeScreen**${brachName}`} />
-          </div>
-        )}
-        {TotalAmount > 0 &&
-          qrCode &&
-          PaymentUpiOptions?.length > 0 &&
-          SelectedUpiOption && (
+    <Suspense fallback={<div>Loading…</div>}>
+      <div
+        className={
+          templateData?.BookingLayout?.[0] === 'Layout6'
+            ? 'BsTable2-Master BsTable2-Master-6'
+            : 'BsTable2-Master'
+        }
+        style={{
+          height: containerHeight,
+        }}
+      >
+        <div className="BSBillingTable2-Summary">
+          {(addcustomer || hold) && (
+            <FeaturesFunctionalities
+              handleAddCustomerCancel={handleAddCustomerCancel}
+              addcustomer={addcustomer}
+              handleHoldCancel={handleHoldCancel}
+              modalOpen={hold}
+            />
+          )}
+          {creditCustomerOpen && (
+            <BSCreditCustomer
+              creditCustomerOpen={creditCustomerOpen}
+              CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
+            />
+          )}
+          {TotalAmount == 0 && Success && (
+            <div>
+              <QrComponent com={`WelcomeScreen**${brachName}`} />
+            </div>
+          )}
+          {TotalAmount > 0 &&
+            qrCode &&
+            PaymentUpiOptions?.length > 0 &&
+            SelectedUpiOption && (
+              <div>
+                <QrComponent
+                  com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                />
+              </div>
+            )}
+
+          {PaymentUpiOptions?.length > 0 && OrderId && (
             <div>
               <QrComponent
-                com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
               />
             </div>
           )}
-
-        {PaymentUpiOptions?.length > 0 && OrderId && (
-          <div>
-            <QrComponent
-              com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
-            />
-          </div>
-        )}
-        <div className="BSBillingTable2-orders-div">
-          <div className="BSBillingTable2-bill-cont">
-            <Messages
-              messageType={messageType}
-              messageData={messageData}
-              onComplete={onComplete}
-            />
-            <div className="BSBillingTable2-bill2-cont">
-              <BsBill2 />
+          <div className="BSBillingTable2-orders-div">
+            <div className="BSBillingTable2-bill-cont">
+              <Messages
+                messageType={messageType}
+                messageData={messageData}
+                onComplete={onComplete}
+              />
+              <div className="BSBillingTable2-bill2-cont">
+                <BsBill2 />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div className="BSBillingTable2-summary-container">
-        {/* {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
+        <div className="BSBillingTable2-summary-container">
+          {/* {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
           <span className="Table3-Price-div-table">
             {" "}
             <BsBill2 />
           </span>
         )} */}
-        <div
-          className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
-          style={{
-            transition: 'max-height 0.3s ease-in-out',
-            overflow: 'scroll',
-            maxHeight: responsiveBill ? '200px' : '0px',
-          }}
-        >
-          {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
-            <div style={{ width: '100%', overflow: 'scroll' }}>
-              <BsBill2 />
-            </div>
-          )}
-        </div>
-        <div
-          style={{
-            display: 'flex',
-            alignItems: 'flex-end',
-            justifyContent: 'flex-end',
-            width: '100%',
-          }}
-        >
-          {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
-            <div
-              onClick={handleResponsiveBill}
-              className="Btn-responsiveBill"
-              style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
-            >
+          <div
+            className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
+            style={{
+              transition: 'max-height 0.3s ease-in-out',
+              overflow: 'scroll',
+              maxHeight: responsiveBill ? '200px' : '0px',
+            }}
+          >
+            {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
+              <div style={{ width: '100%', overflow: 'scroll' }}>
+                <BsBill2 />
+              </div>
+            )}
+          </div>
+          <div
+            style={{
+              display: 'flex',
+              alignItems: 'flex-end',
+              justifyContent: 'flex-end',
+              width: '100%',
+            }}
+          >
+            {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
               <div
-                style={{
-                  width: '28px',
-                  display: 'flex',
-                  alignItems: 'center',
-                  height: '26px',
-                }}
+                onClick={handleResponsiveBill}
+                className="Btn-responsiveBill"
+                style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
               >
-                {' '}
-                <PozoCartIcon />{' '}
+                <div
+                  style={{
+                    width: '28px',
+                    display: 'flex',
+                    alignItems: 'center',
+                    height: '26px',
+                  }}
+                >
+                  {' '}
+                  <PozoCartIcon />{' '}
+                </div>
+              </div>
+            )}
+          </div>
+          <div className="" style={{ display: 'flex' }}>
+            <div className="CustomerAddSrch">
+              <div style={{ height: '2.1rem' }}>
+                {tableOptions
+                  ?.filter((item) => item.OptionName === 'AddCustomer')
+                  .map((filteredItem) => (
+                    <React.Fragment key={filteredItem.TemplateOptionsId}>
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          columnGap: '0.5rem',
+                        }}
+                      >
+                        <BSCustomerSelect />
+
+                        <TooltipWrapper
+                          title={'Add Customer'}
+                          isMobile={isMobile}
+                        >
+                          {' '}
+                          <PozoAddCustomerIcon
+                            className="BSBillingNav-icon-table-icon"
+                            onClick={handleAddCustomer}
+                            style={{
+                              fontSize: '25px',
+                              color:
+                                selOption || GetCustId ? '#52c41a' : '#1292EE',
+                              cursor: Custdisable ? 'not-allowed' : 'pointer',
+                            }}
+                          />
+                        </TooltipWrapper>
+                      </div>
+                    </React.Fragment>
+                  ))}
+              </div>
+              {paybtns?.length > 1 && (
+                <div
+                  style={{
+                    pointerEvents:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 'none'
+                        : 'auto',
+                    opacity:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 0.5
+                        : 1,
+                    width: '2rem',
+                  }}
+                >
+                  {!OtherServicesglobal && (
+                    <TooltipWrapper title="Split Payment" isMobile={isMobile}>
+                      {' '}
+                      <div
+                        className="BSBillingNav-icon-table-icon"
+                        onClick={
+                          CheckBookingStatus != 'Close' && !addnewAccess
+                            ? SplitPaymentOpen
+                            : ''
+                        }
+                        style={{
+                          width: '1.6rem',
+                          cursor:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'not-allowed'
+                              : 'pointer',
+                          color:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'gray'
+                              : 'rgb(18, 146, 238)',
+                          display: 'flex',
+                          alignItems: 'center',
+                          height: '2.46rem',
+                        }}
+                      >
+                        <PozoSplitPaymentIcon />
+                      </div>
+                    </TooltipWrapper>
+                  )}
+                  {OtherServicesglobal && OrderCardDetail.length >= 1 && (
+                    <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
+                      {' '}
+                      <div
+                        className="BSBillingNav-icon-table-icon"
+                        onClick={
+                          // CheckBookingStatus != 'Close' && !addnewAccess?
+                          Otherservicesvehicleno
+                          // : ''
+                        }
+                        style={{
+                          width: '1.5rem',
+                          cursor:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'not-allowed'
+                              : 'pointer',
+                          color:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'gray'
+                              : 'rgb(18, 146, 238)',
+                          display: 'flex',
+                          alignItems: 'center',
+                          height: '2.46rem',
+                        }}
+                      >
+                        <TfiClipboard />
+                      </div>
+                    </TooltipWrapper>
+                  )}
+                </div>
+              )}
+            </div>
+
+            <div
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'space-around',
+                width: '100%',
+              }}
+            >
+              <BsBill2Sum />
+              {OrderCardDetail?.length > 0 &&
+                ParkingDisplay &&
+                !OtherServicesglobal && (
+                  <div
+                    style={{
+                      width: '1.5rem',
+                      color: 'rgb(18, 146, 238)',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                    }}
+                  >
+                    <BSOtherServiceClaim />
+                  </div>
+                )}
+              {!OtherServicesglobal && unpaidFlow == true ? (
+                <TooltipWrapper title="Print Bill" isMobile={isMobile}>
+                  {' '}
+                  <PozoBillIcon
+                    className="Hover"
+                    style={{
+                      fontSize: '25px',
+                      cursor: 'pointer',
+                      color: unpaidFlow ? '#52c41a' : '#1292EE',
+                    }}
+                    onClick={() => {
+                      Recipt();
+                    }}
+                  />
+                </TooltipWrapper>
+              ) : (
+                ''
+              )}
+              <div className="BsBill-Popover">
+                <Popover
+                  content={
+                    <>
+                      <a onClick={hide}>
+                        <AiOutlineClose color="black" />
+                      </a>
+                      {/* <span className="Table3-Price-div-table">
+                      {" "}
+                      <BsBill2 />
+                    </span> */}
+                      <BSSummery1 />
+                    </>
+                  }
+                  trigger="click"
+                  // width={1000}
+                  open={open}
+                  onOpenChange={handleOpenChange}
+                >
+                  <UpCircleOutlined
+                    style={{
+                      fontSize: '25px',
+                      cursor: 'pointer',
+                      color: '#1292EE',
+                    }}
+                  />
+                </Popover>
               </div>
             </div>
-          )}
-        </div>
-        <div className="" style={{ display: 'flex' }}>
-          <div className="CustomerAddSrch">
-            <div style={{ height: '2.1rem' }}>
-              {tableOptions
-                ?.filter((item) => item.OptionName === 'AddCustomer')
-                .map((filteredItem) => (
-                  <React.Fragment key={filteredItem.TemplateOptionsId}>
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        columnGap: '0.5rem',
-                      }}
-                    >
-                      <BSCustomerSelect />
+          </div>
 
-                      <TooltipWrapper
-                        title={'Add Customer'}
-                        isMobile={isMobile}
-                      >
-                        {' '}
-                        <PozoAddCustomerIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={handleAddCustomer}
-                          style={{
-                            fontSize: '25px',
-                            color:
-                              selOption || GetCustId ? '#52c41a' : '#1292EE',
-                            cursor: Custdisable ? 'not-allowed' : 'pointer',
-                          }}
-                        />
-                      </TooltipWrapper>
-                    </div>
-                  </React.Fragment>
-                ))}
-            </div>
-            {paybtns?.length > 1 && (
+          <div className="BSBillingTable2-pay-btn-div">
+            <TooltipWrapper
+              // title={'Payment Mode (SHIFT + M)'}
+              isMobile={isMobile}
+              placement={'left'}
+            >
               <div
+                className="pay-options-btns"
                 style={{
                   pointerEvents:
                     (BookingType === 'Dine In' ||
                       BookingTypeBoth ||
                       CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
+                    !unpaidFlow &&
+                    OrderStatus
                       ? 'none'
                       : 'auto',
                   opacity:
                     (BookingType === 'Dine In' ||
                       BookingTypeBoth ||
                       CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
+                    !unpaidFlow &&
+                    OrderStatus
                       ? 0.5
                       : 1,
-                  width: '2rem',
                 }}
               >
-                {!OtherServicesglobal && (
-                  <TooltipWrapper title="Split Payment" isMobile={isMobile}>
-                    {' '}
-                    <div
-                      className="BSBillingNav-icon-table-icon"
-                      onClick={
-                        CheckBookingStatus != 'Close' && !addnewAccess
-                          ? SplitPaymentOpen
-                          : ''
-                      }
-                      style={{
-                        width: '1.6rem',
-                        cursor:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'not-allowed'
-                            : 'pointer',
-                        color:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'gray'
-                            : 'rgb(18, 146, 238)',
-                        display: 'flex',
-                        alignItems: 'center',
-                        height: '2.46rem',
-                      }}
-                    >
-                      <PozoSplitPaymentIcon />
+                {paybtns?.length > 0 &&
+                currentOrderNetAmount >= previousNetAmount ? (
+                  paybtns?.map((payment) => (
+                    <div className="Table3-cash">
+                      <button
+                        className={
+                          paybtnselected === payment.ModeId &&
+                          (UpinotSelected || CardoptionnotSelected)
+                            ? 'Btn-payment-mode-notupisel'
+                            : paybtnselected === payment.ModeId &&
+                                (!UpinotSelected || !CardoptionnotSelected)
+                              ? 'Btn-payment-mode'
+                              : 'Btn-payment-mode-sel'
+                        }
+                        style={{
+                          fontFamily: FontFamily['para'],
+                          position: 'relative',
+                          animation: blink
+                            ? 'blink-animation 0.5s infinite alternate'
+                            : 'none',
+                        }}
+                        onClick={() =>
+                          payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
+                            ? handleUPIButtonClick(
+                                payment.ModeId,
+                                payment.ModeName
+                              )
+                            : handlePaymentMode(
+                                payment.ModeId,
+                                payment.ModeName
+                              )
+                        }
+                      >
+                        <div
+                          style={{
+                            display: 'flex',
+                            flexDirection: 'row',
+                            columnGap: '0.5rem',
+                          }}
+                        >
+                          {payment.ModeName}
+                          {payment?.ModeName?.toLowerCase() === 'card' && (
+                            <CardPopover
+                              CardPayOption={CardPayOption}
+                              SelectedCardOption={SelectedCardOption}
+                              AddCardOption={AddCardOption}
+                              CardOptionOpen={CardOptionOpen}
+                              EnableCardOptions={EnableCardOptions}
+                              paygate={paygate}
+                              paydevice={paydevice}
+                            />
+                          )}
+                          {payment?.ModeName?.toLowerCase() === 'upi' && (
+                            <UpiPopover
+                              defaultPaymentMode={defaultPaymentMode}
+                              defaultEnabled={defaultEnabled}
+                              setDefaultEnabled={setDefaultEnabled}
+                              UpiOptionOpen={UpiOptionOpen}
+                              UpiPayOption={UpiPayOption}
+                              SelectedUPIPayOption={SelectedUPIPayOption}
+                              AddUPIPaymentOption={AddUPIPaymentOption}
+                              PaymentUpiOptions={PaymentUpiOptions}
+                              BusinessPayOption={BusinessPayOption}
+                              UpiOption={UpiOption}
+                              UpiId={UpiId}
+                              paygate={paygate}
+                              paydevice={paydevice}
+                              EnableUpiOptions={EnableUpiOptions}
+                              PaymentgatewayUPI={PaymentgatewayUPI}
+                              PaymentDeviceUPI={PaymentDeviceUPI}
+                              SelectedUpiOption={SelectedUpiOption}
+                              addUpiOption={addUpiOption}
+                              hideDefault={hideDefault}
+                            />
+                          )}
+                        </div>
+                      </button>
                     </div>
-                  </TooltipWrapper>
-                )}
-                {OtherServicesglobal && OrderCardDetail.length >= 1 && (
-                  <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
-                    {' '}
-                    <div
-                      className="BSBillingNav-icon-table-icon"
-                      onClick={
-                        // CheckBookingStatus != 'Close' && !addnewAccess?
-                        Otherservicesvehicleno
-                        // : ''
-                      }
-                      style={{
-                        width: '1.5rem',
-                        cursor:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'not-allowed'
-                            : 'pointer',
-                        color:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'gray'
-                            : 'rgb(18, 146, 238)',
-                        display: 'flex',
-                        alignItems: 'center',
-                        height: '2.46rem',
-                      }}
-                    >
-                      <TfiClipboard />
+                  ))
+                ) : currentOrderNetAmount < previousNetAmount &&
+                  salesBillEdit &&
+                  refundPayBtns.length > 0 ? (
+                  refundPayBtns.map((payment) => (
+                    <div className="Table3-cash">
+                      <button
+                        className={
+                          refundPaySelected === payment.ConfigId &&
+                          (UpinotSelected || CardoptionnotSelected)
+                            ? 'Btn-payment-mode-notupisel'
+                            : refundPaySelected === payment.ConfigId &&
+                                (!UpinotSelected || !CardoptionnotSelected)
+                              ? 'Btn-payment-mode'
+                              : 'Btn-payment-mode-sel'
+                        }
+                        style={{
+                          fontFamily: FontFamily['para'],
+                          position: 'relative',
+                          animation: blink
+                            ? 'blink-animation 0.5s infinite alternate'
+                            : 'none',
+                        }}
+                        onClick={() =>
+                          handleRefundPaymentMode(
+                            payment?.ConfigId,
+                            payment?.ConfigName
+                          )
+                        }
+                      >
+                        {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+
+                        <div
+                          style={{
+                            display: 'flex',
+                            flexDirection: 'row',
+                            columnGap: '0.5rem',
+                          }}
+                        >
+                          {payment.ConfigName}
+                        </div>
+                      </button>
                     </div>
-                  </TooltipWrapper>
+                  ))
+                ) : (
+                  <div
+                    onClick={handlepaymentoptions}
+                    style={{ cursor: 'pointer' }}
+                    className="payment-error-msg"
+                  >
+                    Please Set Payment Options
+                  </div>
                 )}
               </div>
-            )}
-          </div>
-
-          <div
-            style={{
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'space-around',
-              width: '100%',
-            }}
-          >
-            <BsBill2Sum />
-            {OrderCardDetail?.length > 0 &&
-              ParkingDisplay &&
-              !OtherServicesglobal && (
-                <div
-                  style={{
-                    width: '1.5rem',
-                    color: 'rgb(18, 146, 238)',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                  }}
-                >
-                  <BSOtherServiceClaim />
-                </div>
-              )}
-            {!OtherServicesglobal && unpaidFlow == true ? (
-              <TooltipWrapper title="Print Bill" isMobile={isMobile}>
-                {' '}
-                <PozoBillIcon
-                  className="Hover"
-                  style={{
-                    fontSize: '25px',
-                    cursor: 'pointer',
-                    color: unpaidFlow ? '#52c41a' : '#1292EE',
-                  }}
-                  onClick={() => {
-                    Recipt();
-                  }}
-                />
-              </TooltipWrapper>
-            ) : (
-              ''
-            )}
-            <div className="BsBill-Popover">
-              <Popover
-                content={
-                  <>
-                    <a onClick={hide}>
-                      <AiOutlineClose color="black" />
-                    </a>
-                    {/* <span className="Table3-Price-div-table">
-                      {" "}
-                      <BsBill2 />
-                    </span> */}
-                    <BSSummery1 />
-                  </>
-                }
-                trigger="click"
-                // width={1000}
-                open={open}
-                onOpenChange={handleOpenChange}
-              >
-                <UpCircleOutlined
-                  style={{
-                    fontSize: '25px',
-                    cursor: 'pointer',
-                    color: '#1292EE',
-                  }}
-                />
-              </Popover>
-            </div>
-          </div>
-        </div>
-
-        <div className="BSBillingTable2-pay-btn-div">
-          <TooltipWrapper
-            // title={'Payment Mode (SHIFT + M)'}
-            isMobile={isMobile}
-            placement={'left'}
-          >
-            <div
-              className="pay-options-btns"
-              style={{
-                pointerEvents:
-                  (BookingType === 'Dine In' ||
-                    BookingTypeBoth ||
-                    CheckOrderType?.length > 0) &&
-                    !unpaidFlow &&
-                    OrderStatus
-                    ? 'none'
-                    : 'auto',
-                opacity:
-                  (BookingType === 'Dine In' ||
-                    BookingTypeBoth ||
-                    CheckOrderType?.length > 0) &&
-                    !unpaidFlow &&
-                    OrderStatus
-                    ? 0.5
-                    : 1,
-              }}
-            >
-              {paybtns?.length > 0 && (currentOrderNetAmount >= previousNetAmount) ? (
-                paybtns?.map((payment) => (
-                  <div className="Table3-cash">
-                    <button
-                      className={
-                        paybtnselected === payment.ModeId &&
-                          (UpinotSelected || CardoptionnotSelected)
-                          ? 'Btn-payment-mode-notupisel'
-                          : paybtnselected === payment.ModeId &&
-                            (!UpinotSelected || !CardoptionnotSelected)
-                            ? 'Btn-payment-mode'
-                            : 'Btn-payment-mode-sel'
-                      }
-                      style={{
-                        fontFamily: FontFamily['para'],
-                        position: 'relative',
-                        animation: blink
-                          ? 'blink-animation 0.5s infinite alternate'
-                          : 'none',
-                      }}
-                      onClick={() =>
-                        payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
-                          ? handleUPIButtonClick(
-                            payment.ModeId,
-                            payment.ModeName
-                          )
-                          : handlePaymentMode(payment.ModeId, payment.ModeName)
-                      }
-                    >
-                      <div
-                        style={{
-                          display: 'flex',
-                          flexDirection: 'row',
-                          columnGap: '0.5rem',
-                        }}
-                      >
-                        {payment.ModeName}
-                        {payment?.ModeName?.toLowerCase() === 'card' && (
-                          <CardPopover
-                            CardPayOption={CardPayOption}
-                            SelectedCardOption={SelectedCardOption}
-                            AddCardOption={AddCardOption}
-                            CardOptionOpen={CardOptionOpen}
-                            EnableCardOptions={EnableCardOptions}
-                            paygate={paygate}
-                            paydevice={paydevice}
-                          />
-                        )}
-                        {payment?.ModeName?.toLowerCase() === 'upi' && (
-                          <UpiPopover
-                            defaultPaymentMode={defaultPaymentMode}
-                            defaultEnabled={defaultEnabled}
-                            setDefaultEnabled={setDefaultEnabled}
-                            UpiOptionOpen={UpiOptionOpen}
-                            UpiPayOption={UpiPayOption}
-                            SelectedUPIPayOption={SelectedUPIPayOption}
-                            AddUPIPaymentOption={AddUPIPaymentOption}
-                            PaymentUpiOptions={PaymentUpiOptions}
-                            BusinessPayOption={BusinessPayOption}
-                            UpiOption={UpiOption}
-                            UpiId={UpiId}
-                            paygate={paygate}
-                            paydevice={paydevice}
-                            EnableUpiOptions={EnableUpiOptions}
-                            PaymentgatewayUPI={PaymentgatewayUPI}
-                            PaymentDeviceUPI={PaymentDeviceUPI}
-                            SelectedUpiOption={SelectedUpiOption}
-                            addUpiOption={addUpiOption}
-                            hideDefault={hideDefault}
-                          />
-                        )}
-                      </div>
-                    </button>
-                  </div>
-                ))
-              ) : (currentOrderNetAmount < previousNetAmount && salesBillEdit && refundPayBtns.length > 0) ? (
-                refundPayBtns.map((payment) => (
-                  <div className="Table3-cash">
-                    <button
-                      className={
-                        refundPaySelected === payment.ConfigId &&
-                          (UpinotSelected || CardoptionnotSelected)
-                          ? 'Btn-payment-mode-notupisel'
-                          : refundPaySelected === payment.ConfigId &&
-                            (!UpinotSelected || !CardoptionnotSelected)
-                            ? 'Btn-payment-mode'
-                            : 'Btn-payment-mode-sel'
-                      }
-                      style={{
-                        fontFamily: FontFamily['para'],
-                        position: 'relative',
-                        animation: blink
-                          ? 'blink-animation 0.5s infinite alternate'
-                          : 'none',
-                      }}
-                      onClick={() => handleRefundPaymentMode(payment?.ConfigId, payment?.ConfigName)}
-                    >
-                      {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                      <div
-                        style={{
-                          display: 'flex',
-                          flexDirection: 'row',
-                          columnGap: '0.5rem',
-                        }}
-                      >
-                        {payment.ConfigName}
-                      </div>
-                    </button>
-                  </div>
-                ))
-              ) : (
-                <div
-                  onClick={handlepaymentoptions}
-                  style={{ cursor: 'pointer' }}
-                  className="payment-error-msg"
-                >
-                  Please Set Payment Options
-                </div>
-              )}
-            </div>
-          </TooltipWrapper>
-          {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
-            .length === 1 || navCust === true ? (
-            <div style={{ width: '2rem' }}>
-              {Object.keys(useOptions)?.length > 0 &&
-                useOptions?.some((flow) =>
-                  flow.OptionDetails.some(
-                    (option) =>
-                      option.OptionName === 'Pay at the counter' &&
-                      option.ModeDetails.some(
-                        (mode) => mode.ModeName === 'Credit'
-                      )
-                  )
-                ) && (
-                  <React.Fragment key="CreditCustomerFragment">
-                    {!OtherServicesglobal && (
-                      <TooltipWrapper
-                        title="Advance Amount"
-                        isMobile={isMobile}
-                      >
-                        {' '}
-                        <PozoAdvanceIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={CreditCustomerFun}
-                          style={{
-                            cursor:
-                              OrderCardDetail?.length > 0 && 'not-allowed',
-                            color:
-                              OrderCardDetail?.length > 0 ||
+            </TooltipWrapper>
+            {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
+              .length === 1 || navCust === true ? (
+              <div style={{ width: '2rem' }}>
+                {Object.keys(useOptions)?.length > 0 &&
+                  useOptions?.some((flow) =>
+                    flow.OptionDetails.some(
+                      (option) =>
+                        option.OptionName === 'Pay at the counter' &&
+                        option.ModeDetails.some(
+                          (mode) => mode.ModeName === 'Credit'
+                        )
+                    )
+                  ) && (
+                    <React.Fragment key="CreditCustomerFragment">
+                      {!OtherServicesglobal && (
+                        <TooltipWrapper
+                          title="Advance Amount"
+                          isMobile={isMobile}
+                        >
+                          {' '}
+                          <PozoAdvanceIcon
+                            className="BSBillingNav-icon-table-icon"
+                            onClick={CreditCustomerFun}
+                            style={{
+                              cursor:
+                                OrderCardDetail?.length > 0 && 'not-allowed',
+                              color:
+                                OrderCardDetail?.length > 0 ||
                                 (selOption?.value === undefined &&
                                   GlobalAddCustomerDetails1?.length === 0 &&
                                   GetCustId?.CustMobile === undefined)
-                                ? 'gray'
-                                : 'rgb(18, 146, 238)',
-                            fontSize: '28px',
-                          }}
-                        />
-                      </TooltipWrapper>
-                    )}
-                  </React.Fragment>
-                )}
-            </div>
-          ) : (
-            ''
-          )}
-
-
-          {/* Customer Orders */}
-          {GetCustId && (
-            <Tooltip title="Customer Orders" isMobile={isMobile}>
-              {' '}
-              <div
-                className="BSBillingNav-icon-table-icon"
-                onClick={() => {
-                  if (
-                    CheckBookingStatus !== 'Close' &&
-                    !addnewAccess &&
-                    !(OrderCardDetail?.length > 0)
-                  ) {
-                    setCustomerPreviesOrders(true);
-                  }
-                }}
-                style={{
-                  cursor: OrderCardDetail?.length > 0 && 'not-allowed',
-                  color:
-                    OrderCardDetail?.length > 0 ||
-                      (OrderCardDetail?.length > 0 &&
-                        GetCustId?.CustMobile === undefined)
-                      ? 'gray'
-                      : 'rgb(18, 146, 238)',
-                  fontSize: '25px',
-                  display: 'flex',
-                  alignItems: 'center',
-                  height: '2.46rem',
-                  width: '1.5rem',
-                }}
-              >
-                <FaCartPlus />
-              </div>
-            </Tooltip>
-          )}
-          {tabledata?.length > 0 && (
-            <div style={{ width: '2rem' }}>
-              {tableOptions
-                ?.filter((item) => item.OptionName === 'UnpaidBill')
-                .map((filteredItem) => (
-                  <React.Fragment key={filteredItem.TemplateOptionsId}>
-                    {!OtherServicesglobal && (
-                      <TooltipWrapper title="Unpaid Bills" isMobile={isMobile}>
-                        {' '}
-                        <PozoUnpaidIcon
-                          className="BSBillingNav-icon-table-icon"
-                          style={{
-                            fontSize: '27px',
-                            cursor: 'pointer',
-                            color: unpaidFlow ? '#52c41a' : '#1292EE',
-                          }}
-                          onClick={() => {
-                            (setUnpaidOpen(true), getUnpaiddatas());
-                          }}
-                        />
-                      </TooltipWrapper>
-                    )}
-                  </React.Fragment>
-                ))}
-            </div>
-          )}
-
-          {dinePreference && (
-            <div>
-              {(BookingType === 'Dine In' ||
-                BookingTypeBoth ||
-                CheckOrderType?.length > 0) &&
-                !unpaidFlow &&
-                SelectedTableDetails?.length !== 0 && (
-                  <div style={{ display: 'flex', alignItems: 'center' }}>
-                    <TooltipWrapper title="ORDER" isMobile={isMobile}>
-                      {' '}
-                      <PozoDineInIcon
-                        className={
-                          FirstPaymentclick === false && !addnewAccess
-                            ? OrderStatus
-                              ? 'Dinein-order-btn pulse-element ChairClrRed'
-                              : 'Dinein-order-btn pulse-element ChairClrGreen'
-                            : 'Dinein-order-btn-disabled pulse-element'
-                        }
-                        onClick={() =>
-                          FirstPaymentclick === false && !addnewAccess
-                            ? changeOrderStatus()
-                            : ''
-                        }
-                      />
-                    </TooltipWrapper>
-                    {FirstPaymentclick === false &&
-                      !addnewAccess &&
-                      !OrderStatus && <BSTipAmount />}
-                  </div>
-                )}
-            </div>
-          )}
-          {!OtherServicesglobal && (
-            <div>
-              {tableOptions?.map((item) => (
-                <>
-                  {unpaidFlow == false
-                    ? item?.OptionName == 'Hold' &&
-                    BookingType !== 'Dine In' &&
-                    !BookingTypeBoth &&
-                    OrderCardDetail?.length != 0 &&
-                    !OrderStatus &&
-                    OrderType != 'Failed' &&
-                    paybtns?.length > 0 &&
-                    CheckBookingStatus != 'Close' &&
-                    !addnewAccess && (
-                      <>
-                        <TooltipWrapper title={'Hold'} isMobile={isMobile}>
-                          <button
-                            onClick={() => AddBookingDetails('Hold')}
-                            className={
-                              FirstPaymentclick === false
-                                ? 'hold-btn'
-                                : 'hold-btn-disable'
-                            }
-                          >
-                            <BsPauseFill />
-                            <p
-                              className="hold-btn-txt"
-                              style={{
-                                fontFamily: FontFamily['para'],
-                              }}
-                            >
-                              Hold
-                            </p>
-                          </button>
-                        </TooltipWrapper>
-                      </>
-                    )
-                    : ''}
-                  {unpaidFlow == false
-                    ? item?.OptionName == 'Hold' &&
-                    BookingType !== 'Dine In' &&
-                    !BookingTypeBoth &&
-                    Holddata?.length > 0 &&
-                    OrderCardDetail?.length == 0 &&
-                    CheckBookingStatus != 'Close' &&
-                    paybtns?.length > 0 &&
-                    !addnewAccess && (
-                      <TooltipWrapper title={'Recall'} isMobile={isMobile}>
-                        {' '}
-                        <Badge
-                          count={Holddata?.length}
-                          size={'small'}
-                          offset={[0, 7]}
-                        >
-                          <PozoHoldIcon
-                            className="BSBillingNav-icon-table-icon"
-                            onClick={() => HandleholdModelOpen()}
-                            style={{
+                                  ? 'gray'
+                                  : 'rgb(18, 146, 238)',
                               fontSize: '28px',
-                              cursor: 'pointer',
-                              color: Holddata ? '#52c41a' : 'default',
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
                             }}
                           />
-                        </Badge>
+                        </TooltipWrapper>
+                      )}
+                    </React.Fragment>
+                  )}
+              </div>
+            ) : (
+              ''
+            )}
+
+            {/* Customer Orders */}
+            {GetCustId && (
+              <Tooltip title="Customer Orders" isMobile={isMobile}>
+                {' '}
+                <div
+                  className="BSBillingNav-icon-table-icon"
+                  onClick={() => {
+                    if (
+                      CheckBookingStatus !== 'Close' &&
+                      !addnewAccess &&
+                      !(OrderCardDetail?.length > 0)
+                    ) {
+                      setCustomerPreviesOrders(true);
+                    }
+                  }}
+                  style={{
+                    cursor: OrderCardDetail?.length > 0 && 'not-allowed',
+                    color:
+                      OrderCardDetail?.length > 0 ||
+                      (OrderCardDetail?.length > 0 &&
+                        GetCustId?.CustMobile === undefined)
+                        ? 'gray'
+                        : 'rgb(18, 146, 238)',
+                    fontSize: '25px',
+                    display: 'flex',
+                    alignItems: 'center',
+                    height: '2.46rem',
+                    width: '1.5rem',
+                  }}
+                >
+                  <FaCartPlus />
+                </div>
+              </Tooltip>
+            )}
+            {tabledata?.length > 0 && (
+              <div style={{ width: '2rem' }}>
+                {tableOptions
+                  ?.filter((item) => item.OptionName === 'UnpaidBill')
+                  .map((filteredItem) => (
+                    <React.Fragment key={filteredItem.TemplateOptionsId}>
+                      {!OtherServicesglobal && (
+                        <TooltipWrapper
+                          title="Unpaid Bills"
+                          isMobile={isMobile}
+                        >
+                          {' '}
+                          <PozoUnpaidIcon
+                            className="BSBillingNav-icon-table-icon"
+                            style={{
+                              fontSize: '27px',
+                              cursor: 'pointer',
+                              color: unpaidFlow ? '#52c41a' : '#1292EE',
+                            }}
+                            onClick={() => {
+                              (setUnpaidOpen(true), getUnpaiddatas());
+                            }}
+                          />
+                        </TooltipWrapper>
+                      )}
+                    </React.Fragment>
+                  ))}
+              </div>
+            )}
+
+            {dinePreference && (
+              <div>
+                {(BookingType === 'Dine In' ||
+                  BookingTypeBoth ||
+                  CheckOrderType?.length > 0) &&
+                  !unpaidFlow &&
+                  SelectedTableDetails?.length !== 0 && (
+                    <div style={{ display: 'flex', alignItems: 'center' }}>
+                      <TooltipWrapper title="ORDER" isMobile={isMobile}>
+                        {' '}
+                        <PozoDineInIcon
+                          className={
+                            FirstPaymentclick === false && !addnewAccess
+                              ? OrderStatus
+                                ? 'Dinein-order-btn pulse-element ChairClrRed'
+                                : 'Dinein-order-btn pulse-element ChairClrGreen'
+                              : 'Dinein-order-btn-disabled pulse-element'
+                          }
+                          onClick={() =>
+                            FirstPaymentclick === false && !addnewAccess
+                              ? changeOrderStatus()
+                              : ''
+                          }
+                        />
                       </TooltipWrapper>
-                    )
-                    : ''}
-                </>
-              ))}
-            </div>
-          )}
-        </div>
+                      {FirstPaymentclick === false &&
+                        !addnewAccess &&
+                        !OrderStatus && <BSTipAmount />}
+                    </div>
+                  )}
+              </div>
+            )}
+            {!OtherServicesglobal && (
+              <div>
+                {tableOptions?.map((item) => (
+                  <>
+                    {unpaidFlow == false
+                      ? item?.OptionName == 'Hold' &&
+                        BookingType !== 'Dine In' &&
+                        !BookingTypeBoth &&
+                        OrderCardDetail?.length != 0 &&
+                        !OrderStatus &&
+                        OrderType != 'Failed' &&
+                        paybtns?.length > 0 &&
+                        CheckBookingStatus != 'Close' &&
+                        !addnewAccess && (
+                          <>
+                            <TooltipWrapper title={'Hold'} isMobile={isMobile}>
+                              <button
+                                onClick={() => AddBookingDetails('Hold')}
+                                className={
+                                  FirstPaymentclick === false
+                                    ? 'hold-btn'
+                                    : 'hold-btn-disable'
+                                }
+                              >
+                                <BsPauseFill />
+                                <p
+                                  className="hold-btn-txt"
+                                  style={{
+                                    fontFamily: FontFamily['para'],
+                                  }}
+                                >
+                                  Hold
+                                </p>
+                              </button>
+                            </TooltipWrapper>
+                          </>
+                        )
+                      : ''}
+                    {unpaidFlow == false
+                      ? item?.OptionName == 'Hold' &&
+                        BookingType !== 'Dine In' &&
+                        !BookingTypeBoth &&
+                        Holddata?.length > 0 &&
+                        OrderCardDetail?.length == 0 &&
+                        CheckBookingStatus != 'Close' &&
+                        paybtns?.length > 0 &&
+                        !addnewAccess && (
+                          <TooltipWrapper title={'Recall'} isMobile={isMobile}>
+                            {' '}
+                            <Badge
+                              count={Holddata?.length}
+                              size={'small'}
+                              offset={[0, 7]}
+                            >
+                              <PozoHoldIcon
+                                className="BSBillingNav-icon-table-icon"
+                                onClick={() => HandleholdModelOpen()}
+                                style={{
+                                  fontSize: '28px',
+                                  cursor: 'pointer',
+                                  color: Holddata ? '#52c41a' : 'default',
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
+                                }}
+                              />
+                            </Badge>
+                          </TooltipWrapper>
+                        )
+                      : ''}
+                  </>
+                ))}
+              </div>
+            )}
+          </div>
 
-        <div className="billing-div">
-          <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
-            <button
-              className={
-                // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
-                addnewAccess
-                  ? 'billing-btn-deactive'
-                  : FirstPaymentclick === false &&
-                    OrderCardDetail?.length > 0 &&
-                    paybtnselected &&
-                    CheckBookingStatus != 'Close'
-                    ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ?
-                      'billing-btn'
-                      : 'billing-btn'
-                    : 'billing-btn-deactive'
-              }
-              // onClick={() => {
-              //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
-              // }}
-              onClick={
-                // BranchFinancialStatus==='N'? financialYearError:
-                handleButtonClick
-              }
-            >
-              {!OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <div
-                className="billing-in-style-Order"
-                style={{ fontFamily: FontFamily['head'] }}>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</div> : (
-                <>
-                  <div className="billing-in-style">
-                    <h1 style={{ fontFamily: FontFamily['head'] }}>Total</h1>
-                  </div>
+          <div className="billing-div">
+            <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
+              <button
+                className={
+                  // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
+                  addnewAccess
+                    ? 'billing-btn-deactive'
+                    : FirstPaymentclick === false &&
+                        OrderCardDetail?.length > 0 &&
+                        paybtnselected &&
+                        CheckBookingStatus != 'Close'
+                      ? salesBillEdit &&
+                        currentOrderNetAmount < previousNetAmount
+                        ? 'billing-btn'
+                        : 'billing-btn'
+                      : 'billing-btn-deactive'
+                }
+                // onClick={() => {
+                //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
+                // }}
+                onClick={
+                  // BranchFinancialStatus==='N'? financialYearError:
+                  handleButtonClick
+                }
+              >
+                {!OrderStatus ? (
+                  salesBillEdit && currentOrderNetAmount < previousNetAmount ? (
+                    <div
+                      className="billing-in-style-Order"
+                      style={{ fontFamily: FontFamily['head'] }}
+                    >
+                      Refund: ₹
+                      {(previousNetAmount || 0) - (currentOrderNetAmount || 0)}
+                    </div>
+                  ) : (
+                    <>
+                      <div className="billing-in-style">
+                        <h1 style={{ fontFamily: FontFamily['head'] }}>
+                          Total
+                        </h1>
+                      </div>
 
-                  <div>
-                    <h1 style={{ fontFamily: FontFamily['head'] }}>
-                      {' '}
-                      {isMobile ? (
-                        `₹ ${safeRound(
-                          OrderType === 'Failed'
-                            ? FailedTotalAmt
-                            : credit && overAllBal >= 0
-                              ? Math.max(0, TotalAmount - overAllBal)
-                              : TotalAmount
-                        )}`
-                      ) : (
-                        <div>
-                          ₹{' '}
-                          <CountUp
-                            duration={0.4}
-                            className="counter"
-                            end={safeRound(
+                      <div>
+                        <h1 style={{ fontFamily: FontFamily['head'] }}>
+                          {' '}
+                          {isMobile ? (
+                            `₹ ${safeRound(
                               OrderType === 'Failed'
                                 ? FailedTotalAmt
                                 : credit && overAllBal >= 0
                                   ? Math.max(0, TotalAmount - overAllBal)
                                   : TotalAmount
-                            )}
-                          />
-                        </div>
-                      )}
-                    </h1>
+                            )}`
+                          ) : (
+                            <div>
+                              ₹{' '}
+                              <CountUp
+                                duration={0.4}
+                                className="counter"
+                                end={safeRound(
+                                  OrderType === 'Failed'
+                                    ? FailedTotalAmt
+                                    : credit && overAllBal >= 0
+                                      ? Math.max(0, TotalAmount - overAllBal)
+                                      : TotalAmount
+                                )}
+                              />
+                            </div>
+                          )}
+                        </h1>
+                      </div>
+                    </>
+                  )
+                ) : (
+                  <div
+                    className="billing-in-style-Order"
+                    style={{ fontFamily: FontFamily['head'] }}
+                  >
+                    ORDER
                   </div>
-                </>
-              ) : (
-                <div
-                  className="billing-in-style-Order"
-                  style={{ fontFamily: FontFamily['head'] }}
-                >
-                  ORDER
-                </div>
-              )}
-
-              <ArrowRightOutlined style={{ fontSize: '20px' }} />
-            </button>
-          </TooltipWrapper>
-        </div>
-        {UpiOpen && (
-          <DefaultModal
-            open={UpiOpen}
-            title="UPI PAYMENT"
-            width={500}
-            handleCancel={() => {
-              Upimodel('Cancel');
-            }}
-            footer={false}
-            children={
-              <div style={{ overflow: 'scroll' }}>
-                <div
-                  style={{
-                    display: 'flex',
-                    flexDirection: 'column',
-                    justifyContent: 'space-evenly',
-                    alignItems: 'center',
-                  }}
-                >
-                  <div>
-                    <QrinScreen
-                      Amount={
-                        OrderType === 'Failed'
-                          ? FailedTotalAmt
-                          : Math.round(TotalAmount)
-                      }
-                      UpiId={UpiId}
-                    />
-                  </div>
-
-                  <div>
-                    <h1>
-                      {' '}
-                      RS :
-                      {OrderType === 'Failed'
-                        ? FailedTotalAmt
-                        : Math.round(TotalAmount)}{' '}
-                    </h1>
-                  </div>
-                </div>
-
-                <div className="sentok">
-                  {(selOption || SelCustId) && (
-                    <div className="sentLink" onClick={onFinalSubmit}>
-                      Sent Payment Link
-                      <img
-                        src={WpIcon}
-                        alt="Your Alt Text"
-                        style={{ width: '30px', height: '30px' }}
-                      />
-                    </div>
-                  )}
+                )}
 
+                <ArrowRightOutlined style={{ fontSize: '20px' }} />
+              </button>
+            </TooltipWrapper>
+          </div>
+          {UpiOpen && (
+            <DefaultModal
+              open={UpiOpen}
+              title="UPI PAYMENT"
+              width={500}
+              handleCancel={() => {
+                Upimodel('Cancel');
+              }}
+              footer={false}
+              children={
+                <div style={{ overflow: 'scroll' }}>
                   <div
                     style={{
                       display: 'flex',
-                      flexDirection: 'row-reverse',
-                      width: '100px',
+                      flexDirection: 'column',
+                      justifyContent: 'space-evenly',
+                      alignItems: 'center',
                     }}
                   >
-                    <Buttons
-                      buttonText="OK"
-                      color="901D77"
-                      icon={<ArrowRightOutlined />}
-                      handleSubmit={() => {
-                        Upimodel('Submit');
-                      }}
-                    />
+                    <div>
+                      <QrinScreen
+                        Amount={
+                          OrderType === 'Failed'
+                            ? FailedTotalAmt
+                            : Math.round(TotalAmount)
+                        }
+                        UpiId={UpiId}
+                      />
+                    </div>
+
+                    <div>
+                      <h1>
+                        {' '}
+                        RS :
+                        {OrderType === 'Failed'
+                          ? FailedTotalAmt
+                          : Math.round(TotalAmount)}{' '}
+                      </h1>
+                    </div>
                   </div>
+
+                  <div className="sentok">
+                    {(selOption || SelCustId) && (
+                      <div className="sentLink" onClick={onFinalSubmit}>
+                        Sent Payment Link
+                        <img
+                          src={WpIcon}
+                          alt="Your Alt Text"
+                          style={{ width: '30px', height: '30px' }}
+                        />
+                      </div>
+                    )}
+
+                    <div
+                      style={{
+                        display: 'flex',
+                        flexDirection: 'row-reverse',
+                        width: '100px',
+                      }}
+                    >
+                      <Buttons
+                        buttonText="OK"
+                        color="901D77"
+                        icon={<ArrowRightOutlined />}
+                        handleSubmit={() => {
+                          Upimodel('Submit');
+                        }}
+                      />
+                    </div>
+                  </div>
+                </div>
+              }
+            />
+          )}
+          {PrintOrderDetails?.length > 0 &&
+            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <PaymentPdfBooking
+                  index={index}
+                  table2Data={orderDetail}
+                  singleData2={orderDetail?.productDetails}
+                  orderId={
+                    orderDetail?.OrderId &&
+                    extractLastNumberOrderId(
+                      orderDetail?.OrderId,
+                      orderDetail?.FYStatus
+                    )
+                  }
+                  CreatedDate={orderDetail?.CreatedDate}
+                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                  Preference={SettingDataSelector}
+                  printDatas={printDatas}
+                />
+              </div>
+            ))}
+          {PrintOrderDetails?.length > 0 &&
+            (TokenOnly?.SettingValue === 'Y' ||
+              IndividualToken?.SettingValue === 'Y') &&
+            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <TokensinglePrint
+                  index={index}
+                  table2Data={orderDetail}
+                  singleData2={orderDetail?.productDetails}
+                  orderId={
+                    orderDetail?.OrderId &&
+                    extractLastNumberOrderId(
+                      orderDetail?.OrderId,
+                      orderDetail?.FYStatus
+                    )
+                  }
+                  CreatedDate={orderDetail?.CreatedDate}
+                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                />
+              </div>
+            ))}
+          {CreditCustomer && (
+            <div style={{ display: 'none' }}>
+              <BsBillingCreditCustomer
+                ModalCreditCustomer={CreditCustomer}
+                handlemodalclose={() => {
+                  handleCreditCustomer('Cancel');
+                }}
+                handleOk={() => {
+                  handleCreditCustomer('Submit');
+                }}
+              />
+            </div>
+          )}
+          {unpaidopen && (
+            <DefaultModal
+              open={unpaidopen}
+              title="UNPAID BILL'S"
+              width={1000}
+              handleCancel={() => {
+                setUnpaidOpen(false);
+              }}
+              footer={false}
+              children={
+                <div style={{ height: '400px', overflow: 'scroll' }}>
+                  <Tables
+                    columns={columns}
+                    data={TableData}
+                    dataSource={TableData}
+                  />
+                </div>
+              }
+            />
+          )}
+          {UnpaidConfirmation && (
+            <Modal
+              open={UnpaidConfirmation}
+              width={500}
+              children={
+                <>
+                  <div>
+                    You have already selected a table. If you click 'OK,' the
+                    table selection will be removed, and the unpaid flow will
+                    continue. If you click 'Cancel,' the dine-in flow will
+                    proceed as selected.
+                  </div>
+                </>
+              }
+              onOk={UnpaidOk}
+              onCancel={Unpaidclose}
+            />
+          )}
+          {Splitpayment && (
+            <SplitPayment
+              SplitPaymentModal={Splitpayment}
+              handlesplitpaymentclose={handlesplitpaymentclose}
+              TotalNetAmount={
+                OrderType === 'Failed'
+                  ? FailedTotalAmt
+                  : Math.round(
+                      OrderCardDetail?.reduce(
+                        (acc, data) => data?.TotalAmt + acc,
+                        0
+                      ) -
+                        ((OverAllSales > 0 ? OverAllSales : 0) +
+                          (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                          (Discount > 0 ? Discount : 0))
+                    )
+              }
+              failedOrderData={failedOrderData}
+            />
+          )}
+          {PrintOrderDetails?.length > 0 && (
+            <div
+              style={{
+                display: 'flex',
+                gap: '1rem',
+                justifyContent: 'center',
+                margin: '1rem 0',
+              }}
+            >
+              {filteredSettingNames?.includes('whatsapp') &&
+                MobileNoWhatsApp?.value && (
+                  <FaWhatsapp
+                    size={32}
+                    color="#25D366"
+                    style={{ cursor: 'pointer' }}
+                    onClick={handleWhatsAppClick}
+                    title="Share on WhatsApp"
+                  />
+                )}
+
+              <FaPrint
+                size={32}
+                color="#1292EE"
+                style={{ cursor: 'pointer' }}
+                onClick={handlePrintOrToken}
+                title="Print"
+              />
+
+              {filteredSettingNames?.includes('SMS') && isMobile && (
+                <MdSms
+                  size={32}
+                  color="#FF8800"
+                  style={{ cursor: 'pointer' }}
+                  onClick={handleSMSClick}
+                  title="Send SMS"
+                />
+              )}
+              {/* WhatsAppShare modal/component */}
+              {showWhatsAppShare && (
+                <WhatsAppShare
+                  message={encodedMessage}
+                  mobileNumber={MobileNoWhatsApp?.value}
+                  onClose={() => closePrintOption(false)}
+                />
+              )}
+              {showSMSShare && isMobile && (
+                <SMSShare
+                  message={encodedMessage}
+                  mobileNumber={MobileNoWhatsApp?.value}
+                  onClose={() => closePrintOption(false)}
+                />
+              )}
+            </div>
+          )}
+
+          <DefaultModal
+            className={'paymentoptionsModal'}
+            open={GlobalSalesPaymentoptions}
+            width={500}
+            height={1000}
+            handleCancel={() => {
+              dispatch(changeSalesPaymentoption(false));
+            }}
+            footer={false}
+            children={
+              <div
+                className="paymentoptionsModalContent"
+                style={{ overflow: 'scroll' }}
+              >
+                <Paymentoption onSuccess={getPaymentOptionFeature} />
+              </div>
+            }
+          />
+
+          {
+            OtherServicesPrintDetails?.length > 0 && (
+              // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <OtherServicePrintStyle1
+                  // index={index}
+                  table2Data={OtherServicesPrintDetails}
+                  singleData2={OtherServicesPrintDetails?.productDetails}
+                  orderId={
+                    OtherServicesPrintDetails?.OrderId &&
+                    extractLastNumberOrderId(
+                      OtherServicesPrintDetails?.OrderId,
+                      OtherServicesPrintDetails?.FYStatus
+                    )
+                  }
+                  CreatedDate={OtherServicesPrintDetails?.CreatedDate}
+                  PaymentStatus={
+                    OtherServicesPrintDetails?.[0]?.PaymentOrderDtl
+                  }
+                  Preference={SettingDataSelector}
+                  printDatas={printDatas}
+                />
+              </div>
+            )
+            // ))
+          }
+
+          <DefaultModal
+            className={'paymentoptionsModal'}
+            open={OtherServicesModal}
+            title="Vehicle No"
+            handleCancel={() => {
+              setOtherServicesModal(false);
+            }}
+            // handleSubmit={Handlevehiclenumbers}
+            footer={false}
+            children={
+              <div
+                className="paymentoptionsModalContent"
+                style={{ overflow: 'scroll' }}
+              >
+                {OrderCardDetail.map((item, i) => {
+                  const isGroup = item.ServiceType === 'G';
+                  const groupKey = item.id; // 🔁 using `id` for groups now
+                  const uniqueKey = `${item.ServiceId}__${item.__index}`;
+
+                  // For G-type: render input only once for the group
+                  if (
+                    isGroup &&
+                    i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
+                  ) {
+                    return null;
+                  }
+
+                  const qty = isGroup
+                    ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
+                        (sum, o) => sum + (o.OrderQty || 1),
+                        0
+                      )
+                    : item.OrderQty || 1;
+
+                  return (
+                    <div
+                      key={isGroup ? groupKey : uniqueKey}
+                      style={{ marginBottom: 20 }}
+                    >
+                      <h4>{item.ServiceName}</h4>
+
+                      {Array.from({ length: qty }).map((_, index) => {
+                        const inputKey = isGroup
+                          ? item.id
+                          : `${item.ServiceId}__${item.__index}`;
+                        const value = vehicleInputs[inputKey]?.[index] || '';
+                        const error = errors[inputKey]?.[index] || '';
+
+                        return (
+                          <div
+                            key={`${inputKey}-${index}`}
+                            style={{ marginBottom: 10 }}
+                          >
+                            <input
+                              placeholder={`Vehicle No ${index + 1}`}
+                              value={value}
+                              onChange={(e) =>
+                                handleInputChange(
+                                  isGroup ? item.id : item.ServiceId,
+                                  index,
+                                  e.target.value,
+                                  item.ServiceType,
+                                  item
+                                )
+                              }
+                              onKeyPress={(e) => {
+                                if (!/[A-Za-z0-9]/.test(e.key)) {
+                                  e.preventDefault();
+                                }
+                              }}
+                              style={{
+                                width: '100%',
+                                padding: 8,
+                                borderRadius: 4,
+                                border: error
+                                  ? '1px solid red'
+                                  : '1px solid #ccc',
+                              }}
+                            />
+                            {error && (
+                              <span style={{ color: 'red', fontSize: 12 }}>
+                                {error}
+                              </span>
+                            )}
+                          </div>
+                        );
+                      })}
+                    </div>
+                  );
+                })}
+                <div style={{ textAlign: 'right', marginTop: 16 }}>
+                  <button
+                    type="button"
+                    onClick={Handlevehiclenumbers}
+                    disabled={hasVehicleInputErrors()}
+                    style={{
+                      padding: '8px 24px',
+                      fontFamily: 'Gilroy',
+                      background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
+                      color: '#fff',
+                      border: 'none',
+                      borderRadius: 4,
+                      cursor: hasVehicleInputErrors()
+                        ? 'not-allowed'
+                        : 'pointer',
+                    }}
+                  >
+                    Submit
+                  </button>
                 </div>
               </div>
             }
           />
-        )}
-        {PrintOrderDetails?.length > 0 &&
-          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <PaymentPdfBooking
-                index={index}
-                table2Data={orderDetail}
-                singleData2={orderDetail?.productDetails}
-                orderId={
-                  orderDetail?.OrderId &&
-                  extractLastNumberOrderId(
-                    orderDetail?.OrderId,
-                    orderDetail?.FYStatus
-                  )
-                }
-                CreatedDate={orderDetail?.CreatedDate}
-                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                Preference={SettingDataSelector}
-                printDatas={printDatas}
-              />
-            </div>
-          ))}
-        {PrintOrderDetails?.length > 0 &&
-          (TokenOnly?.SettingValue === 'Y' ||
-            IndividualToken?.SettingValue === 'Y') &&
-          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <TokensinglePrint
-                index={index}
-                table2Data={orderDetail}
-                singleData2={orderDetail?.productDetails}
-                orderId={
-                  orderDetail?.OrderId &&
-                  extractLastNumberOrderId(
-                    orderDetail?.OrderId,
-                    orderDetail?.FYStatus
-                  )
-                }
-                CreatedDate={orderDetail?.CreatedDate}
-                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-              />
-            </div>
-          ))}
-        {CreditCustomer && (
-          <div style={{ display: 'none' }}>
-            <BsBillingCreditCustomer
-              ModalCreditCustomer={CreditCustomer}
-              handlemodalclose={() => {
-                handleCreditCustomer('Cancel');
-              }}
-              handleOk={() => {
-                handleCreditCustomer('Submit');
-              }}
-            />
-          </div>
-        )}
-        {unpaidopen && (
+
           <DefaultModal
-            open={unpaidopen}
-            title="UNPAID BILL'S"
-            width={1000}
-            handleCancel={() => {
-              setUnpaidOpen(false);
-            }}
+            open={businessUPI}
+            handleCancel={() => setShowCancelConfirm(true)}
             footer={false}
-            children={
-              <div style={{ height: '400px', overflow: 'scroll' }}>
-                <Tables
-                  columns={columns}
-                  data={TableData}
-                  dataSource={TableData}
-                />
-              </div>
-            }
-          />
-        )}
-        {UnpaidConfirmation && (
-          <Modal
-            open={UnpaidConfirmation}
             width={500}
             children={
               <>
-                <div>
-                  You have already selected a table. If you click 'OK,' the
-                  table selection will be removed, and the unpaid flow will
-                  continue. If you click 'Cancel,' the dine-in flow will proceed
-                  as selected.
-                </div>
+                <PaymentGatewayEmbedded
+                  orderId={businessUPIOrderId}
+                  setBusinessUPIOrderId={setBusinessUPIOrderId}
+                  businessUPILink={businessUPILink}
+                  setBusinessUPI={setBusinessUPI}
+                  setPaymentSuccess={setPaymentSuccess}
+                  paymentSucess={paymentSucess}
+                  ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
+                  CustomerDisplay={CustomerDisplay}
+                />
               </>
             }
-            onOk={UnpaidOk}
-            onCancel={Unpaidclose}
           />
-        )}
-        {Splitpayment && (
-          <SplitPayment
-            SplitPaymentModal={Splitpayment}
-            handlesplitpaymentclose={handlesplitpaymentclose}
-            TotalNetAmount={
-              OrderType === 'Failed' ? FailedTotalAmt : Math.round(OrderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
-                ((OverAllSales > 0 ? OverAllSales : 0) +
-                  (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                  (Discount > 0 ? Discount : 0)))
-            }
-            failedOrderData={failedOrderData}
-          />
-        )}
-        {PrintOrderDetails?.length > 0 && (
-          <div
-            style={{
-              display: 'flex',
-              gap: '1rem',
-              justifyContent: 'center',
-              margin: '1rem 0',
-            }}
-          >
-            {filteredSettingNames?.includes('whatsapp') &&
-              MobileNoWhatsApp?.value && (
-                <FaWhatsapp
-                  size={32}
-                  color="#25D366"
-                  style={{ cursor: 'pointer' }}
-                  onClick={handleWhatsAppClick}
-                  title="Share on WhatsApp"
-                />
-              )}
-
-            <FaPrint
-              size={32}
-              color="#1292EE"
-              style={{ cursor: 'pointer' }}
-              onClick={handlePrintOrToken}
-              title="Print"
+          {showCancelConfirm && (
+            <Modal
+              open={showCancelConfirm}
+              title="Cancel Payment"
+              onOk={() => {
+                setBusinessUPI(false);
+                setShowCancelConfirm(false);
+                ClearAllGlobalStateDatas();
+                CustomerDisplay();
+              }}
+              onCancel={() => setShowCancelConfirm(false)}
+              okText="Yes"
+              cancelText="No"
+            >
+              Do you want to cancel the payment?
+            </Modal>
+          )}
+          {customerPreviesOrders && (
+            <DefaultModal
+              open={customerPreviesOrders}
+              handleCancel={() => setCustomerPreviesOrders(false)}
+              footer={false}
+              width={700}
+              className={'ModalPaymentGatewayEmbedded'}
+              children={
+                <>
+                  <CustomerOrders
+                    CustomerDetails={selOption}
+                    close={() => setCustomerPreviesOrders(false)}
+                  />
+                </>
+              }
             />
-
-            {filteredSettingNames?.includes('SMS') && isMobile && (
-              <MdSms
-                size={32}
-                color="#FF8800"
-                style={{ cursor: 'pointer' }}
-                onClick={handleSMSClick}
-                title="Send SMS"
-              />
-            )}
-            {/* WhatsAppShare modal/component */}
-            {showWhatsAppShare && (
-              <WhatsAppShare
-                message={encodedMessage}
-                mobileNumber={MobileNoWhatsApp?.value}
-                onClose={() => closePrintOption(false)}
-              />
-            )}
-            {showSMSShare && isMobile && (
-              <SMSShare
-                message={encodedMessage}
-                mobileNumber={MobileNoWhatsApp?.value}
-                onClose={() => closePrintOption(false)}
-              />
-            )}
-          </div>
-        )}
-
-        <DefaultModal
-          className={'paymentoptionsModal'}
-          open={GlobalSalesPaymentoptions}
-          width={500}
-          height={1000}
-          handleCancel={() => {
-            dispatch(changeSalesPaymentoption(false));
-          }}
-          footer={false}
-          children={
-            <div
-              className="paymentoptionsModalContent"
-              style={{ overflow: 'scroll' }}
-            >
-              <Paymentoption onSuccess={getPaymentOptionFeature} />
-            </div>
-          }
-        />
-
-        {
-          OtherServicesPrintDetails?.length > 0 && (
-            // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <OtherServicePrintStyle1
-                // index={index}
-                table2Data={OtherServicesPrintDetails}
-                singleData2={OtherServicesPrintDetails?.productDetails}
-                orderId={
-                  OtherServicesPrintDetails?.OrderId &&
-                  extractLastNumberOrderId(
-                    OtherServicesPrintDetails?.OrderId,
-                    OtherServicesPrintDetails?.FYStatus
-                  )
-                }
-                CreatedDate={OtherServicesPrintDetails?.CreatedDate}
-                PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
-                Preference={SettingDataSelector}
-                printDatas={printDatas}
-              />
-            </div>
-          )
-          // ))
-        }
-
-        <DefaultModal
-          className={'paymentoptionsModal'}
-          open={OtherServicesModal}
-          title="Vehicle No"
-          handleCancel={() => {
-            setOtherServicesModal(false);
-          }}
-          // handleSubmit={Handlevehiclenumbers}
-          footer={false}
-          children={
-            <div
-              className="paymentoptionsModalContent"
-              style={{ overflow: 'scroll' }}
-            >
-              {OrderCardDetail.map((item, i) => {
-                const isGroup = item.ServiceType === 'G';
-                const groupKey = item.id; // 🔁 using `id` for groups now
-                const uniqueKey = `${item.ServiceId}__${item.__index}`;
-
-                // For G-type: render input only once for the group
-                if (
-                  isGroup &&
-                  i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
-                ) {
-                  return null;
-                }
-
-                const qty = isGroup
-                  ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
-                    (sum, o) => sum + (o.OrderQty || 1),
-                    0
-                  )
-                  : item.OrderQty || 1;
-
-                return (
-                  <div
-                    key={isGroup ? groupKey : uniqueKey}
-                    style={{ marginBottom: 20 }}
-                  >
-                    <h4>{item.ServiceName}</h4>
-
-                    {Array.from({ length: qty }).map((_, index) => {
-                      const inputKey = isGroup
-                        ? item.id
-                        : `${item.ServiceId}__${item.__index}`;
-                      const value = vehicleInputs[inputKey]?.[index] || '';
-                      const error = errors[inputKey]?.[index] || '';
-
-                      return (
-                        <div
-                          key={`${inputKey}-${index}`}
-                          style={{ marginBottom: 10 }}
-                        >
-                          <input
-                            placeholder={`Vehicle No ${index + 1}`}
-                            value={value}
-                            onChange={(e) =>
-                              handleInputChange(
-                                isGroup ? item.id : item.ServiceId,
-                                index,
-                                e.target.value,
-                                item.ServiceType,
-                                item
-                              )
-                            }
-                            onKeyPress={(e) => {
-                              if (!/[A-Za-z0-9]/.test(e.key)) {
-                                e.preventDefault();
-                              }
-                            }}
-                            style={{
-                              width: '100%',
-                              padding: 8,
-                              borderRadius: 4,
-                              border: error
-                                ? '1px solid red'
-                                : '1px solid #ccc',
-                            }}
-                          />
-                          {error && (
-                            <span style={{ color: 'red', fontSize: 12 }}>
-                              {error}
-                            </span>
-                          )}
-                        </div>
-                      );
-                    })}
-                  </div>
-                );
-              })}
-              <div style={{ textAlign: 'right', marginTop: 16 }}>
-                <button
-                  type="button"
-                  onClick={Handlevehiclenumbers}
-                  disabled={hasVehicleInputErrors()}
-                  style={{
-                    padding: '8px 24px',
-                    fontFamily: 'Gilroy',
-                    background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
-                    color: '#fff',
-                    border: 'none',
-                    borderRadius: 4,
-                    cursor: hasVehicleInputErrors() ? 'not-allowed' : 'pointer',
-                  }}
-                >
-                  Submit
-                </button>
-              </div>
-            </div>
-          }
-        />
-
-        <DefaultModal
-          open={businessUPI}
-          handleCancel={() => setShowCancelConfirm(true)}
-          footer={false}
-          width={500}
-          children={
-            <>
-              <PaymentGatewayEmbedded
-                orderId={businessUPIOrderId}
-                setBusinessUPIOrderId={setBusinessUPIOrderId}
-                businessUPILink={businessUPILink}
-                setBusinessUPI={setBusinessUPI}
-                setPaymentSuccess={setPaymentSuccess}
-                paymentSucess={paymentSucess}
-                ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
-                CustomerDisplay={CustomerDisplay}
-              />
-            </>
-          }
-        />
-        {showCancelConfirm && (
-          <Modal
-            open={showCancelConfirm}
-            title="Cancel Payment"
-            onOk={() => {
-              setBusinessUPI(false);
-              setShowCancelConfirm(false);
-              ClearAllGlobalStateDatas();
-              CustomerDisplay();
-            }}
-            onCancel={() => setShowCancelConfirm(false)}
-            okText="Yes"
-            cancelText="No"
-          >
-            Do you want to cancel the payment?
-          </Modal>
-        )}
-        {customerPreviesOrders && (
-          <DefaultModal
-            open={customerPreviesOrders}
-            handleCancel={() => setCustomerPreviesOrders(false)}
-            footer={false}
-            width={700}
-            className={'ModalPaymentGatewayEmbedded'}
-            children={
-              <>
-                <CustomerOrders
-                  CustomerDetails={selOption}
-                  close={() => setCustomerPreviesOrders(false)}
-                />
-              </>
-            }
-          />
-        )}
+          )}
+        </div>
       </div>
-    </div>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3.jsx
index 5703160..fe58020 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3.jsx
@@ -10,16 +10,13 @@ import {
   ChangeTotalAmount,
   globalExtraTotalAmount,
 } from '../../../../../Features/ExteraCharges/ExtraCharges.js';
-import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
 import {
   changeholddata,
   gettinghold,
   puttinghold,
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption.js';
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
-import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
 import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
 import {
   getTemplateData,
   SelectedGlobalBillingColorDetail,
@@ -80,6 +77,10 @@ import {
 import { useRemoveProducts } from './RemoveCartWithOffer.jsx';
 import { useUtilsComponent } from '../../../../../Services/utils.js';
 import CustomerPriceHistory from '../../UtillComponents/CustomerPriceHistory.jsx';
+// jsx Files
+import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
+import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
+import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
 
 const BSBillingTable3 = () => {
   const { removeExtraCharge } = useUtilsComponent();
@@ -123,7 +124,6 @@ const BSBillingTable3 = () => {
   const UnpaidData = useSelector(GlobalUnpaidData);
   const GlobProdwisedata = useSelector(GlobalSelProdWiseEst);
   const ReportholdData = useSelector(GlobalReorderHoldDetails);
-  const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const prodCat = useSelector(GlobalProductCategorie);
   const ProdSubCat = useSelector(GlobalProductSubCategorie);
   const [PreviousdataLength, setPreviousdataLength] =
@@ -137,7 +137,8 @@ const BSBillingTable3 = () => {
   const GetCustId = useSelector(GlobalCustId);
   const selectedCustomer = useSelector(GlobalSelOption);
 
-  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] = useState(false);
+  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] =
+    useState(false);
   const [customerProduct, setCustomerProduct] = useState(null);
   const preferenceshortcutkey = preferenceDatas?.[0]?.[
     'SettingDtlDetails'
@@ -154,16 +155,16 @@ const BSBillingTable3 = () => {
     OrderType === 'Hold'
       ? tableData?.filter((a, b) => a.BookingTypeName === 'TakeAway')
       : tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
-      );
+          (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
+        );
   const OldtableDataDinein = tableData?.filter(
     (a, b) => a.BookingTypeName === 'Dine In' && a?.SalesId
   );
   const OldtableDataTakeAway =
     OrderType != 'Hold'
       ? tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
-      )
+          (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
+        )
       : [];
   const [EditQuantity, setEditQuantity] = useState(false);
   const [Modaldata, setModaldata] = useState([]);
@@ -259,7 +260,6 @@ const BSBillingTable3 = () => {
         event.preventDefault();
         handleShortcut('weightAmount');
       }
-
     };
     window.addEventListener('keydown', handleKeyDown);
 
@@ -389,7 +389,7 @@ const BSBillingTable3 = () => {
   const handleCustomerProductPriceHistory = (item) => {
     setCustomerPriceHistoryOpen(true);
     setCustomerProduct(item?.ProdId);
-  }
+  };
 
   function safeRound(amountStr) {
     if (amountStr == null) return allowDecimal ? '0.00' : '0';
@@ -1057,9 +1057,9 @@ const BSBillingTable3 = () => {
             )?.map((item, idx) =>
               idx === 0
                 ? {
-                  ...item,
-                  FreeQty,
-                }
+                    ...item,
+                    FreeQty,
+                  }
                 : item
             ),
           };
@@ -1983,7 +1983,6 @@ const BSBillingTable3 = () => {
         }
       }
     }
-
   };
 
   // const removeFromCart = async (item) => {
@@ -2395,10 +2394,11 @@ const BSBillingTable3 = () => {
             {OldtableDataTakeAway?.map((item, index) => (
               <tr
                 key={index}
-                className={`${item?.SalesId && OrderType !== 'Hold'
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
-                  } 
+                className={`${
+                  item?.SalesId && OrderType !== 'Hold'
+                    ? 'BSBill-Table3-content-Disabled'
+                    : 'BSBill-Table3-content'
+                } 
             
                `}
                 style={{
@@ -2409,15 +2409,15 @@ const BSBillingTable3 = () => {
                       ? item?.SalesId && OrderType !== 'Hold'
                         ? 'rgb(243, 248, 213)'
                         : triggerAnimation &&
-                          index === 0 &&
-                          !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength
+                            index === 0 &&
+                            !item?.SalesId &&
+                            tableDataTakeAway?.length >= PreviousdataLength
                           ? 'wheat'
                           : triggerAnimation &&
-                            index === 0 &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                              index === 0 &&
+                              tableDataTakeAway?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
                             ? 'wheat'
                             : 'inherit'
                       : 'none',
@@ -2425,9 +2425,9 @@ const BSBillingTable3 = () => {
                     item?.SalesId && OrderType !== 'Hold'
                       ? 'rgb(243, 248, 213)'
                       : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
+                          GlobProdwisedata?.includes(
+                            item?.InwardDtlId + ' ' + item?.BookingTypeName
+                          )
                         ? '#b2d1f7'
                         : index % 2 === 0
                           ? 'white'
@@ -2483,7 +2483,7 @@ const BSBillingTable3 = () => {
                           style={{ fontFamily: 'Poppins' }}
                           onClick={() =>
                             item.FullProductIdentifierDtls?.length > 0 ||
-                              item.ProductIdentifierDtls?.length > 0
+                            item.ProductIdentifierDtls?.length > 0
                               ? handleImeiDetails(item)
                               : editField && handleEditQuantity(item)
                           }
@@ -2530,21 +2530,21 @@ const BSBillingTable3 = () => {
                           {productBasedExtraCharges?.find(
                             (find) => find.ProdId === item.ProdId
                           ) !== undefined && (
-                              <div
-                                style={{
-                                  fontSize: '10px',
-                                  fontWeight: '500',
-                                  whiteSpace: 'nowrap',
-                                }}
-                              >
-                                Extra Charges :{' '}
-                                {
-                                  productBasedExtraCharges?.find(
-                                    (find) => find.ProdId === item.ProdId
-                                  )?.TotalAmt
-                                }
-                              </div>
-                            )}
+                            <div
+                              style={{
+                                fontSize: '10px',
+                                fontWeight: '500',
+                                whiteSpace: 'nowrap',
+                              }}
+                            >
+                              Extra Charges :{' '}
+                              {
+                                productBasedExtraCharges?.find(
+                                  (find) => find.ProdId === item.ProdId
+                                )?.TotalAmt
+                              }
+                            </div>
+                          )}
                         </td>
                       </>
                     )}
@@ -2637,8 +2637,8 @@ const BSBillingTable3 = () => {
                       >
                         {allowDecimal
                           ? Number(
-                            item?.TotalAmt - (item?.Offer || 0) || 0
-                          ).toFixed(2)
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            ).toFixed(2)
                           : Number(item?.TotalAmt - (item?.Offer || 0) || 0)}
                       </td>
                     )}
@@ -2673,10 +2673,11 @@ const BSBillingTable3 = () => {
             {OldtableDataDinein?.map((item, index) => (
               <tr
                 key={OldtableDataTakeAway?.length + index}
-                className={`${item?.SalesId
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
-                  } 
+                className={`${
+                  item?.SalesId
+                    ? 'BSBill-Table3-content-Disabled'
+                    : 'BSBill-Table3-content'
+                } 
             
                `}
                 style={{
@@ -2687,26 +2688,26 @@ const BSBillingTable3 = () => {
                       ? item?.SalesId
                         ? 'rgb(243, 248, 213)'
                         : BookingType === 'Dine In' &&
-                          triggerAnimation &&
-                          OldtableDataTakeAway?.length + index === 0 &&
-                          !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
                             triggerAnimation &&
                             OldtableDataTakeAway?.length + index === 0 &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                            !item?.SalesId &&
+                            tableDataDinein?.length >= PreviousdataLength
+                          ? 'wheat'
+                          : BookingType !== 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataTakeAway?.length + index === 0 &&
+                              tableDataDinein?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
                             ? 'wheat'
                             : 'inherit'
                       : 'none',
                   background: item?.SalesId
                     ? 'rgb(243, 248, 213)'
                     : GlobEstBooking === 'ParEst' &&
-                      GlobProdwisedata?.includes(
-                        item?.InwardDtlId + ' ' + item?.BookingTypeName
-                      )
+                        GlobProdwisedata?.includes(
+                          item?.InwardDtlId + ' ' + item?.BookingTypeName
+                        )
                       ? '#b2d1f7'
                       : (OldtableDataTakeAway?.length + index) % 2 === 0
                         ? 'white'
@@ -2807,21 +2808,21 @@ const BSBillingTable3 = () => {
                           {productBasedExtraCharges?.find(
                             (find) => find.ProdId === item.ProdId
                           ) !== undefined && (
-                              <div
-                                style={{
-                                  fontSize: '10px',
-                                  fontWeight: '500',
-                                  whiteSpace: 'nowrap',
-                                }}
-                              >
-                                Extra Charges :{' '}
-                                {
-                                  productBasedExtraCharges?.find(
-                                    (find) => find.ProdId === item.ProdId
-                                  )?.TotalAmt
-                                }
-                              </div>
-                            )}
+                            <div
+                              style={{
+                                fontSize: '10px',
+                                fontWeight: '500',
+                                whiteSpace: 'nowrap',
+                              }}
+                            >
+                              Extra Charges :{' '}
+                              {
+                                productBasedExtraCharges?.find(
+                                  (find) => find.ProdId === item.ProdId
+                                )?.TotalAmt
+                              }
+                            </div>
+                          )}
                         </td>
                       </>
                     )}
@@ -2914,8 +2915,8 @@ const BSBillingTable3 = () => {
                       >
                         {allowDecimal
                           ? Number(
-                            item?.TotalAmt - (item?.Offer || 0) || 0
-                          ).toFixed(2)
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            ).toFixed(2)
                           : Number(item?.TotalAmt - (item?.Offer || 0) || 0)}
                       </td>
                     )}
@@ -2955,10 +2956,11 @@ const BSBillingTable3 = () => {
                   OldtableDataTakeAway?.length +
                   index
                 }
-                className={`${BookingType === 'Dine In' && item?.SalesId
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
-                  } 
+                className={`${
+                  BookingType === 'Dine In' && item?.SalesId
+                    ? 'BSBill-Table3-content-Disabled'
+                    : 'BSBill-Table3-content'
+                } 
             
                `}
                 style={{
@@ -2969,38 +2971,38 @@ const BSBillingTable3 = () => {
                       ? BookingType === 'Dine In' && item?.SalesId
                         ? 'rgb(243, 248, 213)'
                         : BookingType === 'Dine In' &&
-                          triggerAnimation &&
-                          OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
                             triggerAnimation &&
                             OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                              OldtableDataTakeAway?.length +
+                              index ===
+                              0 &&
+                            !item?.SalesId &&
+                            tableDataTakeAway?.length >= PreviousdataLength
+                          ? 'wheat'
+                          : BookingType !== 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataDinein?.length +
+                                OldtableDataTakeAway?.length +
+                                index ===
+                                0 &&
+                              tableDataTakeAway?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
                             ? 'wheat'
                             : (OldtableDataDinein?.length +
-                              OldtableDataTakeAway?.length +
-                              index) %
-                              2 ===
-                              0
+                                  OldtableDataTakeAway?.length +
+                                  index) %
+                                  2 ===
+                                0
                               ? 'white'
                               : SelectedBillColor?.['OverallBackgroundColor']
                                 ? SelectedBillColor?.['OverallBackgroundColor']
                                 : '#d6d6d6'
                       : (OldtableDataDinein?.length +
-                        OldtableDataTakeAway?.length +
-                        index) %
-                        2 ===
-                        0
+                            OldtableDataTakeAway?.length +
+                            index) %
+                            2 ===
+                          0
                         ? 'white'
                         : SelectedBillColor?.['OverallBackgroundColor']
                           ? SelectedBillColor?.['OverallBackgroundColor']
@@ -3009,15 +3011,15 @@ const BSBillingTable3 = () => {
                     BookingType === 'Dine In' && item?.SalesId
                       ? 'rgb(243, 248, 213)'
                       : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
+                          GlobProdwisedata?.includes(
+                            item?.InwardDtlId + ' ' + item?.BookingTypeName
+                          )
                         ? '#b2d1f7'
                         : (OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index) %
-                          2 ===
-                          0
+                              OldtableDataTakeAway?.length +
+                              index) %
+                              2 ===
+                            0
                           ? 'white'
                           : SelectedBillColor?.['OverallBackgroundColor']
                             ? SelectedBillColor?.['OverallBackgroundColor']
@@ -3026,9 +3028,9 @@ const BSBillingTable3 = () => {
                     BillOrderPre === 'Y' && !BookingTypeBoth
                       ? triggerAnimation &&
                         OldtableDataDinein?.length +
-                        OldtableDataTakeAway?.length +
-                        index ===
-                        0 &&
+                          OldtableDataTakeAway?.length +
+                          index ===
+                          0 &&
                         !item?.SalesId &&
                         tableDataTakeAway?.length >= PreviousdataLength &&
                         !HoldOrderDtl &&
@@ -3077,7 +3079,7 @@ const BSBillingTable3 = () => {
                           style={{ fontFamily: 'Poppins' }}
                           onClick={() =>
                             item.FullProductIdentifierDtls?.length > 0 ||
-                              item.ProductIdentifierDtls?.length > 0
+                            item.ProductIdentifierDtls?.length > 0
                               ? handleImeiDetails(item)
                               : editField && handleEditQuantity(item, index)
                           }
@@ -3131,21 +3133,21 @@ const BSBillingTable3 = () => {
                           {productBasedExtraCharges?.find(
                             (find) => find.ProdId === item.ProdId
                           ) !== undefined && (
-                              <div
-                                style={{
-                                  fontSize: '10px',
-                                  fontWeight: '500',
-                                  whiteSpace: 'nowrap',
-                                }}
-                              >
-                                Extra Charges :{' '}
-                                {
-                                  productBasedExtraCharges?.find(
-                                    (find) => find.ProdId === item.ProdId
-                                  )?.TotalAmt
-                                }
-                              </div>
-                            )}
+                            <div
+                              style={{
+                                fontSize: '10px',
+                                fontWeight: '500',
+                                whiteSpace: 'nowrap',
+                              }}
+                            >
+                              Extra Charges :{' '}
+                              {
+                                productBasedExtraCharges?.find(
+                                  (find) => find.ProdId === item.ProdId
+                                )?.TotalAmt
+                              }
+                            </div>
+                          )}
                         </td>
                       </>
                     )}
@@ -3239,8 +3241,8 @@ const BSBillingTable3 = () => {
                       >
                         {allowDecimal
                           ? Number(
-                            item?.TotalAmt - (item?.Offer || 0) || 0
-                          ).toFixed(2)
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            ).toFixed(2)
                           : Number(item?.TotalAmt - (item?.Offer || 0) || 0)}
                       </td>
                     )}
@@ -3280,10 +3282,11 @@ const BSBillingTable3 = () => {
                   tableDataTakeAway?.length +
                   index
                 }
-                className={`${BookingType === 'Dine In' && item?.SalesId
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
-                  } 
+                className={`${
+                  BookingType === 'Dine In' && item?.SalesId
+                    ? 'BSBill-Table3-content-Disabled'
+                    : 'BSBill-Table3-content'
+                } 
             
                `}
                 style={{
@@ -3296,44 +3299,44 @@ const BSBillingTable3 = () => {
                         !BookingTypeBoth
                         ? 'rgb(243, 248, 213)'
                         : BookingType === 'Dine In' &&
-                          triggerAnimation &&
-                          OldtableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          tableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
                             triggerAnimation &&
                             OldtableDataTakeAway?.length +
-                            OldtableDataDinein?.length +
-                            tableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                              OldtableDataDinein?.length +
+                              tableDataTakeAway?.length +
+                              index ===
+                              0 &&
+                            !item?.SalesId &&
+                            tableDataDinein?.length >= PreviousdataLength
+                          ? 'wheat'
+                          : BookingType !== 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataTakeAway?.length +
+                                OldtableDataDinein?.length +
+                                tableDataTakeAway?.length +
+                                index ===
+                                0 &&
+                              tableDataDinein?.length >= PreviousdataLength &&
+                              !HoldOrderDtl &&
+                              !UnpaidData
                             ? 'wheat'
                             : 'inherit'
                       : 'none',
                   background:
                     BookingType === 'Dine In' &&
-                      item?.SalesId &&
-                      !BookingTypeBoth
+                    item?.SalesId &&
+                    !BookingTypeBoth
                       ? 'rgb(243, 248, 213)'
                       : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
+                          GlobProdwisedata?.includes(
+                            item?.InwardDtlId + ' ' + item?.BookingTypeName
+                          )
                         ? '#b2d1f7'
                         : (OldtableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          tableDataTakeAway?.length +
-                          index) %
-                          2 ===
-                          0
+                              OldtableDataDinein?.length +
+                              tableDataTakeAway?.length +
+                              index) %
+                              2 ===
+                            0
                           ? 'white'
                           : SelectedBillColor?.['OverallBackgroundColor']
                             ? SelectedBillColor?.['OverallBackgroundColor']
@@ -3342,10 +3345,10 @@ const BSBillingTable3 = () => {
                     BillOrderPre === 'Y' && !BookingTypeBoth
                       ? triggerAnimation &&
                         OldtableDataTakeAway?.length +
-                        OldtableDataDinein?.length +
-                        tableDataTakeAway?.length +
-                        index ===
-                        0 &&
+                          OldtableDataDinein?.length +
+                          tableDataTakeAway?.length +
+                          index ===
+                          0 &&
                         !item?.SalesId &&
                         tableDataDinein?.length >= PreviousdataLength &&
                         !HoldOrderDtl &&
@@ -3441,21 +3444,21 @@ const BSBillingTable3 = () => {
                           {productBasedExtraCharges?.find(
                             (find) => find.ProdId === item.ProdId
                           ) !== undefined && (
-                              <div
-                                style={{
-                                  fontSize: '10px',
-                                  fontWeight: '500',
-                                  whiteSpace: 'nowrap',
-                                }}
-                              >
-                                Extra Charges :{' '}
-                                {
-                                  productBasedExtraCharges?.find(
-                                    (find) => find.ProdId === item.ProdId
-                                  )?.TotalAmt
-                                }
-                              </div>
-                            )}
+                            <div
+                              style={{
+                                fontSize: '10px',
+                                fontWeight: '500',
+                                whiteSpace: 'nowrap',
+                              }}
+                            >
+                              Extra Charges :{' '}
+                              {
+                                productBasedExtraCharges?.find(
+                                  (find) => find.ProdId === item.ProdId
+                                )?.TotalAmt
+                              }
+                            </div>
+                          )}
                         </td>
                       </>
                     )}
@@ -3548,8 +3551,8 @@ const BSBillingTable3 = () => {
                       >
                         {allowDecimal
                           ? Number(
-                            item?.TotalAmt - (item?.Offer || 0) || 0
-                          ).toFixed(2)
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            ).toFixed(2)
                           : Number(item?.TotalAmt - (item?.Offer || 0) || 0)}
                       </td>
                     )}
@@ -3592,7 +3595,7 @@ const BSBillingTable3 = () => {
           ProductDetail={Modaldata}
         />
       )}
-      {(customerPriceHistoryOpen && GetCustId) &&
+      {customerPriceHistoryOpen && GetCustId && (
         <CustomerPriceHistory
           open={customerPriceHistoryOpen}
           custId={GetCustId}
@@ -3601,7 +3604,7 @@ const BSBillingTable3 = () => {
           setCustomerProduct={setCustomerProduct}
           selectedCustomer={selectedCustomer}
         />
-      }
+      )}
     </div>
   );
 };
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3pay.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3pay.jsx
index 116745e..c02f6e7 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3pay.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3pay.jsx
@@ -1,4 +1,11 @@
-import React, { useCallback, useEffect, useState, useRef } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+  useRef,
+  lazy,
+  Suspense,
+} from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import moment from 'moment';
@@ -6,17 +13,12 @@ import { BiRightArrowAlt } from 'react-icons/bi';
 import { AiOutlineClose } from 'react-icons/ai';
 import { Tables } from '../../../../../Components/Tables/Table';
 import { DefaultModal } from '../../../../../Components/Modal/DefaultModal.jsx';
-import {
-  UpCircleOutlined,
-  DownCircleOutlined,
-  UpOutlined,
-} from '@ant-design/icons';
+import { UpCircleOutlined, DownCircleOutlined } from '@ant-design/icons';
 import { Popover, Badge, Modal, Tooltip } from 'antd';
 import {
   printDiv,
   extractLastNumberOrderId,
   encryptObject,
-  decryptToObject,
 } from '../../../../../Services/Others';
 import { Messages } from '../../../../../Components/Notifications/Messages';
 import BSBillingTable3 from './BSBillingTable3';
@@ -24,9 +26,9 @@ import paygate from '../../../../../Images/paygate.png';
 import defaultupi from '../../../../../Images/defaultupi.png';
 import pozologoimg from '../../../../../Images/pozologoimg.png';
 import paydevice from '../../../../../Images/paydevice.png';
-import BSSummery1 from '../../BSBillingTables/BSBillingTableSummery/BSSummery';
-import QrComponent from '../../BookingFunctionality/DynamicQr.jsx';
-import QrinScreen from '../../BookingFunctionality/DynamicScreenQr.jsx';
+const BSSummery1 = lazy(
+  () => import('../../BSBillingTables/BSBillingTableSummery/BSSummery')
+);
 import { ArrowRightOutlined } from '@ant-design/icons';
 import Buttons from '../../../../../Components/Forms/Buttons';
 import WpIcon from '../../../../../Images/message.png';
@@ -40,6 +42,15 @@ import {
   getPrinterMappingDetails,
   getPrintSelectionComponentData,
 } from '../../../../../Features/ThemeChange/ThemeChange';
+import {
+  ChangeFullFreeProductList,
+  changeFullOfferAppliedProducts,
+  changeLoyaltyConsumedQuantities,
+  GlobalFreeProdList,
+  GlobalOfferAppliedProducts,
+  GlobalOverAllOfferAmt,
+} from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
+
 import {
   GlobalOrderCardDetails,
   changeOrderCardDetails,
@@ -48,7 +59,6 @@ import {
   GlobalSelectedTableDetails,
   GlobalBookingType,
   changeBookingType,
-  getConfigType,
   PutBookingData,
   GlobalReorderHoldDetails,
   getUnpaidData,
@@ -73,8 +83,6 @@ import {
   SendPaymentLink,
   changeSummeryTotalAmount,
   changeUpiIDprint,
-  changeSummeryTotalItems,
-  changeSummeryQty,
   changeSummeryTotalWithoutTaxAmount,
   changeSummeryTotalTaxAmount,
   GlobalEstimateBooking,
@@ -113,7 +121,7 @@ import {
   GlobalOverAllDiscSales,
   ChangeOverAllDiscSales,
   ChangeOverAllDiscEstimate,
-  getAllCustomer,
+  // getAllCustomer,
   GlobalBranchFinancialStatus,
   changeSummeryComboOfferAmount,
   ChangeComboCarddata,
@@ -124,13 +132,11 @@ import {
   changeOtherServiceTicketClaim,
   GlobalRetailWSSalesType,
   GlobalDefaultBookingType,
-  GlobalComboOfferAmount,
   GlobalPaymentTrigger,
   GlobalCurrentOrderId,
   changeCurrentOrderId,
   GlobalCombocarddata,
   getCreditCustomer,
-  GlobalSummeryTotalItems,
   GlobalSalesBillEdit,
   GlobalPreviousOrderPayment,
   GlobalPreviousOrderOfferDetails,
@@ -140,17 +146,19 @@ import {
   changeBillEditingMode,
   changePreviousOrderPayment,
   changePreviousOrderOfferDetail,
+  GlobalAllBookingType,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
 import { PrintStyleFunction } from '../../../../paymentpdfPage/PrintStyleFunction.js';
 import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities';
-import BSCustomerSelect from '../../UtillComponents/BSSelectCustomer.jsx';
+const BSCustomerSelect = lazy(
+  () => import('../../UtillComponents/BSSelectCustomer.jsx')
+);
 import { ChangeTotalAmount } from '../../../../../Features/ExteraCharges/ExtraCharges.js';
 import {
   gettinghold,
   globalholddata,
   changeholddata,
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption';
-import PaymentPdfBooking from '../../../../paymentpdfPage/PaymentPdfBooking';
 import { globalExtraTotalAmount } from '../../../../../Features/ExteraCharges/ExtraCharges';
 import {
   getAddCustomerDetails,
@@ -160,18 +168,20 @@ import {
   triggerCustomerRefresh,
 } from '../../../../../Features/BookingScreen/Customer/addCustomer';
 import PozoHoldIcon from '../../UtillComponents/Pozo retail icons/PozoHoldIcon';
-import PozoDineInIcon from '../../UtillComponents/Pozo retail icons/PozoDineIn.jsx';
 import PozoUnpaidIcon from '../../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
 import PozoBillIcon from '../../UtillComponents/Pozo retail icons/PozoBIllIcon.jsx';
 import PozoAddCustomerIcon from '../../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
-import BsBillingCreditCustomer from '../../BookingFunctionality/BSBillingCreditCustomer.jsx';
-import BSCreditCustomer from '../../UtillComponents/BSCreditCustomer.jsx';
+const BSCreditCustomer = lazy(
+  () => import('../../UtillComponents/BSCreditCustomer.jsx')
+);
 import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
 import { isMobile } from 'react-device-detect';
 import MobilePrint from '../../BookingFunctionality/MobilePrint.jsx';
 import CountUp from 'react-countup';
-import SplitPayment from '../../BookingFunctionality/SplitPayment.jsx';
 import { GlobalpreOrderOpen } from '../../../../../Features/BookingScreen/PreOrder/PreOrder.js';
+const SplitPayment = lazy(
+  () => import('../../BookingFunctionality/SplitPayment.jsx')
+);
 import TokensinglePrint from '../../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx';
 import SingleTokenMobilePrint from '../../BookingFunctionality/SingleTokenMobilePrint.jsx';
 import IndividualTokenMobilePrint from '../../BookingFunctionality/IndividualTokenMobilePrint.jsx';
@@ -180,7 +190,6 @@ import { getEmpAccess } from '../../../../../Features/AppPage/CenterPage.js';
 import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
 import PozoCartIcon from '../../../../../Pages/BookingScreen/Components/UtillComponents/PozoCartIcon.jsx';
 import { Global_OverallOfferAmount } from '../../../../../Features/Offer/Offer.js';
-import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
 import { useAuth } from '../../../../../AuthContext.jsx';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTables3/BSBillingTable3.scss';
@@ -189,45 +198,65 @@ import {
   changeSalesPaymentoption,
   GlobalSalesPaymentoption,
 } from '../../../../../Features/Payment/Paymentoptions/Paymentoptions.js';
-import Paymentoption from '../../../../Payment/PaymentOptions/PaymentOptions.jsx';
 import { getPaymentOptionsData } from '../../../../../Features/BookingScreen/BookingData/KioskBookingData.js';
 import { getCombolist } from '../../../../../Features/ComboMaster/ComboMaster.js';
-import SMSShare from '../../../../WhatsAppShare/SmsShare.jsx';
-import WhatsAppShare from '../../../../WhatsAppShare/whatsAppShare.jsx';
 import { MdSms } from 'react-icons/md';
 import { FaWhatsapp, FaPrint, FaCartPlus } from 'react-icons/fa';
-import BSTipAmount from '../../UtillComponents/BSTipAmount.jsx';
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin.js';
 import { PostOtherServices } from '../../../../../Features/OtherServices/OtherServices.js';
 import { TfiClipboard } from 'react-icons/tfi';
-import OtherServicePrintStyle1 from '../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx';
 import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
-import BSOtherServiceClaim from '../../UtillComponents/BSOtherServiceClaim.jsx';
-import { MobilePdfPrint } from '../../BookingFunctionality/MobilePdfPrint.js';
+const BSOtherServiceClaim = lazy(
+  () => import('../../UtillComponents/BSOtherServiceClaim.jsx')
+);
 import { PublicQrCodepost } from '../../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
-import {
-  ChangeFreeProductList,
-  ChangeFullFreeProductList,
-  changeFullOfferAppliedProducts,
-  changeLoyaltyConsumedQuantities,
-  GlobalFreeProdList,
-  GlobalOfferAppliedProducts,
-  GlobalOverAllOfferAmt,
-} from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import CardPopover from '../StandardTable/Utils/CardPopover.jsx';
 import UpiPopover from '../StandardTable/Utils/UpiPopOver.jsx';
-import PaymentGatewayEmbedded from '../../UtillComponents/PaymentGatewayEmbedded.jsx';
 import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
 import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
-import CustomerOrders from '../../BookingFunctionality/CustomerOrders.jsx';
+const PaymentGatewayEmbedded = lazy(
+  () => import('../../UtillComponents/PaymentGatewayEmbedded.jsx')
+);
+
+const CustomerOrders = lazy(
+  () => import('../../BookingFunctionality/CustomerOrders.jsx')
+);
+// jsx File
+const QrComponent = lazy(
+  () => import('../../BookingFunctionality/DynamicQr.jsx')
+);
+const QrinScreen = lazy(
+  () => import('../../BookingFunctionality/DynamicScreenQr.jsx')
+);
+const PaymentPdfBooking = lazy(
+  () => import('../../../../paymentpdfPage/PaymentPdfBooking')
+);
+const PozoDineInIcon = lazy(
+  () => import('../../UtillComponents/Pozo retail icons/PozoDineIn.jsx')
+);
+const BsBillingCreditCustomer = lazy(
+  () => import('../../BookingFunctionality/BSBillingCreditCustomer.jsx')
+);
+const Paymentoption = lazy(
+  () => import('../../../../Payment/PaymentOptions/PaymentOptions.jsx')
+);
+const SMSShare = lazy(() => import('../../../../WhatsAppShare/SmsShare.jsx'));
+const WhatsAppShare = lazy(
+  () => import('../../../../WhatsAppShare/whatsAppShare.jsx')
+);
+const BSTipAmount = lazy(() => import('../../UtillComponents/BSTipAmount.jsx'));
+const OtherServicePrintStyle1 = lazy(
+  () =>
+    import('../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx')
+);
 
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
-const RetailApiurl = import.meta.env.ENV_API_URL;
+
 const BSBillingTable3Pay = () => {
   const isF4Pressed = useRef(false);
-  const applyOffer = useApplyOfferto_CardDetail();
+  const AllBookingType = useSelector(GlobalAllBookingType);
   const { SadminuserAccess } = useAuth();
   let SAAccessCommonMaster = SadminuserAccess?.find(
     (e) => e?.MenuName === 'Sales'
@@ -236,7 +265,9 @@ const BSBillingTable3Pay = () => {
   const navigate = useNavigate();
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const FreeProdList = useSelector(GlobalFreeProdList);
   const offerAppliedProducts = useSelector(
@@ -289,15 +320,10 @@ const BSBillingTable3Pay = () => {
   const ProdSubCat = useSelector(GlobalProductSubCategorie);
   const BSLayoutData = useSelector(getTemplateData);
   const Combodata = useSelector(GlobalCombocarddata, shallowEqual);
-  const OfferCheckedInSetup = BSLayoutData?.BookingNavbar?.[1].some(
-    (item) => item?.OptionName == 'Offer'
-  );
+
   const Custdisable = useSelector(GlobalSelectedCustDisable);
   const SettingDataSelector = useSelector(PreferenceData);
-  const preferenceOffer =
-    SettingDataSelector?.[0]?.['SettingDtlDetails']?.find(
-      (item) => item.SettingIdName === 'Offer'
-    )?.SettingValue === 'Y';
+
   const allowDecimal = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
     (setting) =>
       setting?.SettingIdName?.toLowerCase() === 'decimal' &&
@@ -316,10 +342,7 @@ const BSBillingTable3Pay = () => {
   const preOrder = useSelector(GlobalpreOrderOpen);
   const OrderType = useSelector(GlobalOrderType);
   const FailedTotalAmt = useSelector(GlobalFailedTotalAmt);
-  const OrderOfferDetail = useSelector(
-    GlobalOfferAppliedProducts,
-    shallowEqual
-  );
+
   const tabledata = useSelector(GlobalUnpaidListData);
   const GlobalSalesPaymentoptions = useSelector(GlobalSalesPaymentoption);
 
@@ -402,6 +425,10 @@ const BSBillingTable3Pay = () => {
   const [Splitpayment, setSplitpayment] = useState(false);
   const [urlData, setUrlData] = useState();
 
+  const holdCheckedSalesSetup = tableOptions?.some(
+    (item) => item?.OptionName === 'Hold'
+  );
+
   const PaymentOptionsModeName =
     PaymentOptions?.find((e) => e.ModeDefault?.toUpperCase() === 'Y')
       ?.ModeName || PaymentOptions?.[0]?.ModeName;
@@ -589,14 +616,21 @@ const BSBillingTable3Pay = () => {
 
       const filteredPayments =
         previousOrderPayment?.filter(
-          p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+          (p) =>
+            p?.LastOrderTran === 'Y' &&
+            p?.AfterAdjustment != null &&
+            p?.AfterAdjustment !== '' &&
+            p?.AfterAdjustment
         ) || [];
 
       const paymentsToUse =
-        filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
+        filteredPayments.length > 0
+          ? filteredPayments
+          : previousOrderPayment || [];
 
       const totalPreviouspayment = paymentsToUse?.reduce(
-        (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+        (acc, payment) =>
+          acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
         0
       );
 
@@ -605,8 +639,7 @@ const BSBillingTable3Pay = () => {
         0
       );
 
-      const previousNetAmount =
-        (totalPreviouspayment) || 0;
+      const previousNetAmount = totalPreviouspayment || 0;
 
       let withdiscTotal =
         Total -
@@ -618,12 +651,26 @@ const BSBillingTable3Pay = () => {
         withdiscTotal >= 0
           ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
           : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      )
+      );
 
-      setTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount);
+      setTotalAmount(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount
+      );
       setCurrentOrderNetAmount(currentOrderNetAmount);
       setPreviousNetAmount(previousNetAmount);
-      dispatch(changeSummeryTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount));
+      dispatch(
+        changeSummeryTotalAmount(
+          salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount
+              ? currentOrderNetAmount - previousNetAmount
+              : 0
+            : currentOrderNetAmount
+        )
+      );
 
       dispatch(changeSummeryComboOfferAmount(withComboSum));
 
@@ -653,8 +700,8 @@ const BSBillingTable3Pay = () => {
       UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // const Data1 = { AppId, CompId, BranchId };
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
 
   useEffect(() => {
@@ -711,8 +758,11 @@ const BSBillingTable3Pay = () => {
   };
   useEffect(() => {
     if (CompId && BranchId && AppId) {
-      getHolddata();
-      getUnpaiddatas();
+      if (holdCheckedSalesSetup) {
+        getHolddata();
+      }
+
+      // getUnpaiddatas();
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -739,7 +789,6 @@ const BSBillingTable3Pay = () => {
   }, [salesBillEdit]);
 
   useEffect(() => {
-
     if (salesBillEdit) {
       if (SelCustId) {
         setRefundPayBtns(AllPaymentOptions);
@@ -754,8 +803,7 @@ const BSBillingTable3Pay = () => {
         setRefundPayBtns(withoutCustomer);
       }
     }
-
-  }, [AllPaymentOptions, SelCustId, salesBillEdit])
+  }, [AllPaymentOptions, SelCustId, salesBillEdit]);
 
   useEffect(() => {
     if (UserType === 'Employee') {
@@ -777,29 +825,6 @@ const BSBillingTable3Pay = () => {
     setaddnewAccess(!hasAccess);
   }, [empData, SAAccessCommonMaster, UserType]);
 
-  // useEffect(() => {
-  //   const handleKeyPress = (event) => {
-  //     if (event.shiftKey && event.code === 'KeyM') {
-  //       if (
-  //         document.activeElement.tagName !== 'INPUT' &&
-  //         document.activeElement.tagName !== 'TEXTAREA'
-  //       ) {
-  //         event.preventDefault();
-  //         setBlink(true);
-  //       }
-  //     }
-  //   };
-  //   const handleClickOutside = (event) => {
-  //     setBlink(false);
-  //   };
-  //   window.addEventListener('keydown', handleKeyPress);
-  //   window.addEventListener('mousedown', handleClickOutside);
-  //   return () => {
-  //     window.removeEventListener('keydown', handleKeyPress);
-  //     window.addEventListener('mousedown', handleClickOutside);
-  //   };
-  // }, []);
-
   const fetchApi = async () => {
     let data = {
       CompId: CompId,
@@ -815,9 +840,9 @@ const BSBillingTable3Pay = () => {
   };
 
   const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
+    // await dispatch(
+    //   getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
+    // );
     await dispatch(
       getAddCustomerDetails({
         CompId: CompId,
@@ -965,7 +990,7 @@ const BSBillingTable3Pay = () => {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
 
     if (selectedStyle) {
@@ -1044,8 +1069,10 @@ const BSBillingTable3Pay = () => {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if (salesBillEdit) {
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger, salesBillEdit]);
 
   const TokenPrint = async (index) => {
     try {
@@ -1488,7 +1515,11 @@ const BSBillingTable3Pay = () => {
   const handleButtonClick = () => {
     if (qrCode && SelectedUPIPayOption === 'Default' && UpiQRPreference) {
       UpiPayment();
-    } else if (salesBillEdit && currentOrderNetAmount < previousNetAmount && !refundPaySelected) {
+    } else if (
+      salesBillEdit &&
+      currentOrderNetAmount < previousNetAmount &&
+      !refundPaySelected
+    ) {
       setMessageType('warning');
       setMessageData('Please Select Refund Payment Method');
       return;
@@ -1700,20 +1731,12 @@ const BSBillingTable3Pay = () => {
   };
 
   const getBookingTypeId = async () => {
-    let tempconfigdata = await dispatch(
-      getConfigType({ TypeName: 'Booking Type' })
-    ).unwrap();
+    setConfigDataList(AllBookingType);
+    let configdata = AllBookingType;
+    let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
 
-    if (tempconfigdata?.data?.statusCode == 1) {
-      setConfigDataList(tempconfigdata?.data?.data);
-      let configdata = tempconfigdata?.data?.data;
-      let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
-
-      let filterconfigdata = configdata?.find(
-        (a) => a?.ConfigName === checkName
-      );
-      setSelectedBookingType(filterconfigdata?.ConfigId);
-    }
+    let filterconfigdata = configdata?.find((a) => a?.ConfigName === checkName);
+    setSelectedBookingType(filterconfigdata?.ConfigId);
   };
 
   const gettodaydate = () => {
@@ -1776,7 +1799,7 @@ const BSBillingTable3Pay = () => {
   const handleRefundPaymentMode = (id, name) => {
     setRefundPaySelected(id);
     setRefundPaySelectedName(name);
-  }
+  };
 
   const addUpiOption = async (id, name, UPIId) => {
     await dispatch(changeUpiIDprint(UPIId));
@@ -1865,14 +1888,6 @@ const BSBillingTable3Pay = () => {
     setUpiOptionOpen(false);
   };
 
-  const handlePopoverVisibleChange = (visible) => {
-    setUpiOptionOpen(visible);
-  };
-
-  const handlePopoverVisibleChangeCard = (visible) => {
-    setCardOptionOpen(visible);
-  };
-
   const ProductSummary = (salesData) => {
     const productMap = new Map();
 
@@ -2006,7 +2021,9 @@ const BSBillingTable3Pay = () => {
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
     setUpinotSelected(false);
-    getHolddata();
+    if (holdCheckedSalesSetup) {
+      getHolddata();
+    }
     if (defaultBookingType === 'Both') {
       await dispatch(changeBookingType('TakeAway'));
     }
@@ -2194,15 +2211,15 @@ const BSBillingTable3Pay = () => {
       OrderStatus: 'O',
       OrderType:
         BookingType === 'Dine In' ||
-          BookingTypeBoth ||
-          Estimation?.SettingValue == 'N'
+        BookingTypeBoth ||
+        Estimation?.SettingValue == 'N'
           ? 'S'
           : GlobEstBooking === 'OvrAllEst'
             ? 'E'
             : GlobEstBooking === 'ParEst'
               ? GlobProdwisedata?.includes(
-                a.InwardDtlId + ' ' + a?.BookingTypeName
-              )
+                  a.InwardDtlId + ' ' + a?.BookingTypeName
+                )
                 ? 'E'
                 : 'S'
               : 'S',
@@ -2294,7 +2311,7 @@ const BSBillingTable3Pay = () => {
           : Paybtnnameselected?.toLowerCase() === 'credit'
             ? 'S'
             : Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
+                SelectedUPIPayOption?.toLowerCase() === 'default'
               ? 'S'
               : 'P',
       OrderDtlDetails:
@@ -2311,85 +2328,113 @@ const BSBillingTable3Pay = () => {
           ? globalTipAmount === 0
             ? SelectedTableDetails
             : SelectedTableDetails?.map((item) => ({
-              ...item,
-              TipsAmount: globalTipAmount,
-            }))
+                ...item,
+                TipsAmount: globalTipAmount,
+              }))
           : null,
       SalesPaymentType: 'normal',
       PaymentDetail: [
         {
-          PaymentType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? refundPaySelected :
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : SelectedUPIPayOption?.toLowerCase() === 'business'
-                    ? BusinessPayOption?.find(
-                      (busupi) => busupi?.ModeId === UpiId
-                    )?.ModeId
-                    : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          Amount: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? previousNetAmount - currentOrderNetAmount : Math.round(TotalAmount),
-          MerchantId: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'business'
-              ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                ?.MerchantId
-              : null,
-          PaymentOptionType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) && (refundPaySelectedName?.toLowerCase() === 'cash' || refundPaySelectedName?.toLowerCase() === 'credit') ? 'PC' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption?.toLowerCase() === 'business'
-                        ? 'BU'
-                        : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                ?.UPIDetailId
-              : SelectedUPIPayOption?.toLowerCase() === 'business'
+          PaymentType:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? refundPaySelected
+              : Paybtnnameselected?.toLowerCase() === 'upi'
+                ? SelectedUPIPayOption?.toLowerCase() === 'pd'
+                  ? PaymentDeviceUPI?.[0]?.ModeId
+                  : SelectedUPIPayOption?.toLowerCase() === 'pg'
+                    ? PaymentgatewayUPI?.[0]?.ModeId
+                    : SelectedUPIPayOption?.toLowerCase() === 'business'
+                      ? BusinessPayOption?.find(
+                          (busupi) => busupi?.ModeId === UpiId
+                        )?.ModeId
+                      : paybtnselected
+                : paybtnselected
+                  ? paybtnselected
+                  : null,
+          Amount:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? previousNetAmount - currentOrderNetAmount
+              : Math.round(TotalAmount),
+          MerchantId:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'business'
                 ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                  ?.MerchantUPIId
+                    ?.MerchantId
                 : null,
-          AccountDtl: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? [] :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.UPIId === UpiId
-              )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                (Paybtnnameselected?.toLowerCase() === 'card' &&
-                  SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'pg') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? 'S' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
+          PaymentOptionType:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            (refundPaySelectedName?.toLowerCase() === 'cash' ||
+              refundPaySelectedName?.toLowerCase() === 'credit')
+              ? 'PC'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'PC'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
+                  ? 'PC'
+                  : Paybtnnameselected?.toLowerCase() === 'card'
+                    ? SelectedCardOption
+                    : Paybtnnameselected?.toLowerCase() === 'upi'
+                      ? SelectedUPIPayOption?.toLowerCase() === 'default'
+                        ? 'PC'
+                        : SelectedUPIPayOption?.toLowerCase() === 'business'
+                          ? 'BU'
+                          : SelectedUPIPayOption
+                      : null,
+          ModeOfPayment:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
+                    ?.UPIDetailId
+                : SelectedUPIPayOption?.toLowerCase() === 'business'
+                  ? BusinessPayOption?.find(
+                      (busupi) => busupi?.ModeId === UpiId
+                    )?.MerchantUPIId
+                  : null,
+          AccountDtl:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? []
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
                   SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
+                    (upipay) => upipay?.UPIId === UpiId
+                  )
+                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'pd') ||
+                    (Paybtnnameselected?.toLowerCase() === 'card' &&
+                      SelectedCardOption?.toLowerCase() === 'pd')
+                  ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                  : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                        SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      (Paybtnnameselected?.toLowerCase() === 'card' &&
+                        SelectedCardOption?.toLowerCase() === 'pg')
+                    ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
+                    : [],
+          PaymentStatus:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? 'S'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'S'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
                   ? 'S'
-                  : 'P',
-          Debit: (salesBillEdit && currentOrderNetAmount < previousNetAmount && refundPaySelectedName?.toLowerCase() === 'credit') ? Math.round(previousNetAmount - currentOrderNetAmount) : 0,
-          Credit: salesBillEdit ? (currentOrderNetAmount > previousNetAmount && Paybtnnameselected?.toLowerCase() === 'credit') ? Math.round(TotalAmount) : 0 :
-            Paybtnnameselected?.toLowerCase() === 'credit'
+                  : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'default'
+                    ? 'S'
+                    : 'P',
+          Debit:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            refundPaySelectedName?.toLowerCase() === 'credit'
+              ? Math.round(previousNetAmount - currentOrderNetAmount)
+              : 0,
+          Credit: salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount &&
+              Paybtnnameselected?.toLowerCase() === 'credit'
+              ? Math.round(TotalAmount)
+              : 0
+            : Paybtnnameselected?.toLowerCase() === 'credit'
               ? Math.round(TotalAmount)
               : 0,
         },
@@ -2459,14 +2504,14 @@ const BSBillingTable3Pay = () => {
         setMessageType('success');
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         response?.data?.OrderDetails?.length > 0 &&
           setPrintOrderDetails([response?.data]);
@@ -2626,14 +2671,14 @@ const BSBillingTable3Pay = () => {
           setMessageType('success');
           setMessageData(
             response?.data?.response +
-            ' ' +
-            (response?.data?.OrderDetails?.length > 0
-              ? response?.data?.OrderId &&
-              extractLastNumberOrderId(
-                response?.data?.OrderId,
-                response?.data?.OrderDetails?.[0]?.FYStatus
-              )
-              : '')
+              ' ' +
+              (response?.data?.OrderDetails?.length > 0
+                ? response?.data?.OrderId &&
+                  extractLastNumberOrderId(
+                    response?.data?.OrderId,
+                    response?.data?.OrderDetails?.[0]?.FYStatus
+                  )
+                : '')
           );
           response?.data?.OrderDetails?.length > 0 &&
             setPrintOrderDetails([response?.data]);
@@ -2736,14 +2781,14 @@ const BSBillingTable3Pay = () => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -2920,14 +2965,14 @@ const BSBillingTable3Pay = () => {
             setMessageType('success');
             setMessageData(
               bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
-                )
-                : '')
+                ' ' +
+                (bookingpaymentupdate?.data?.OrderDetails?.length > 0
+                  ? bookingpaymentupdate?.data?.OrderId &&
+                    extractLastNumberOrderId(
+                      bookingpaymentupdate?.data?.OrderId,
+                      bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
+                    )
+                  : '')
             );
             bookingpaymentupdate?.data?.OrderDetails?.length > 0 &&
               setPrintOrderDetails([bookingpaymentupdate?.data]);
@@ -2946,7 +2991,7 @@ const BSBillingTable3Pay = () => {
         if (
           Date.now() - startTime >
           useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
+            60000
         ) {
           // 60,000 ms = 1 minute
 
@@ -3540,841 +3585,851 @@ const BSBillingTable3Pay = () => {
     );
   };
   return (
-    <>
-      <div className="BSBilling3div">
-        {screenwidth <= 768 && (
-          <div
-            className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
-            style={{
-              transition: 'max-height 0.3s ease-in-out',
-              overflow: 'scroll',
-              maxHeight: responsiveBill ? '180px' : '0px',
-            }}
-          >
-            {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
-              <BSBillingTable3 />
-            )}
-          </div>
-        )}
-
-        <div className="BSBilling3-customer">
-          <Messages
-            messageType={messageType}
-            messageData={messageData}
-            onComplete={onComplete}
-          />
+    <Suspense fallback={<div>Suspense Loading...</div>}>
+      <>
+        <div className="BSBilling3div">
           {screenwidth <= 768 && (
             <div
+              className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
               style={{
-                display: 'flex',
-                alignItems: 'flex-end',
-                justifyContent: 'flex-end',
-                width: '100%',
+                transition: 'max-height 0.3s ease-in-out',
+                overflow: 'scroll',
+                maxHeight: responsiveBill ? '180px' : '0px',
               }}
             >
               {Array.isArray(OrderCardDetail) &&
-                OrderCardDetail?.length >= 1 && (
-                  <div
-                    onClick={() => handleResponsiveBill()}
-                    className="Btn-responsiveBill"
-                    style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
-                  >
-                    {screenwidth <= 768 && (
-                      <div
-                        style={{
-                          width: '28px',
-                          display: 'flex',
-                          alignItems: 'center',
-                          height: '26px',
-                        }}
-                      >
-                        {' '}
-                        <PozoCartIcon />{' '}
-                      </div>
-                    )}
-                  </div>
-                )}
+                OrderCardDetail?.length >= 1 && <BSBillingTable3 />}
             </div>
           )}
-          <div className="BS3hold-sum">
-            {(addcustomer || hold) && (
-              <FeaturesFunctionalities
-                handleAddCustomerCancel={handleAddCustomerCancel}
-                addcustomer={addcustomer}
-                handleHoldCancel={handleHoldCancel}
-                modalOpen={hold}
-              />
-            )}
-            {creditCustomerOpen && (
-              <BSCreditCustomer
-                creditCustomerOpen={creditCustomerOpen}
-                CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-              />
-            )}
-            {TotalAmount == 0 && Success && (
-              <div>
-                <QrComponent com={`WelcomeScreen**${brachName}`} />
+
+          <div className="BSBilling3-customer">
+            <Messages
+              messageType={messageType}
+              messageData={messageData}
+              onComplete={onComplete}
+            />
+            {screenwidth <= 768 && (
+              <div
+                style={{
+                  display: 'flex',
+                  alignItems: 'flex-end',
+                  justifyContent: 'flex-end',
+                  width: '100%',
+                }}
+              >
+                {Array.isArray(OrderCardDetail) &&
+                  OrderCardDetail?.length >= 1 && (
+                    <div
+                      onClick={() => handleResponsiveBill()}
+                      className="Btn-responsiveBill"
+                      style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
+                    >
+                      {screenwidth <= 768 && (
+                        <div
+                          style={{
+                            width: '28px',
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '26px',
+                          }}
+                        >
+                          {' '}
+                          <PozoCartIcon />{' '}
+                        </div>
+                      )}
+                    </div>
+                  )}
               </div>
             )}
-            {TotalAmount > 0 &&
-              qrCode &&
-              PaymentUpiOptions?.length > 0 &&
-              SelectedUpiOption && (
+            <div className="BS3hold-sum">
+              {(addcustomer || hold) && (
+                <FeaturesFunctionalities
+                  handleAddCustomerCancel={handleAddCustomerCancel}
+                  addcustomer={addcustomer}
+                  handleHoldCancel={handleHoldCancel}
+                  modalOpen={hold}
+                />
+              )}
+              {creditCustomerOpen && (
+                <BSCreditCustomer
+                  creditCustomerOpen={creditCustomerOpen}
+                  CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
+                />
+              )}
+              {TotalAmount == 0 && Success && (
+                <div>
+                  <QrComponent com={`WelcomeScreen**${brachName}`} />
+                </div>
+              )}
+              {TotalAmount > 0 &&
+                qrCode &&
+                PaymentUpiOptions?.length > 0 &&
+                SelectedUpiOption && (
+                  <div>
+                    <QrComponent
+                      com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                    />
+                  </div>
+                )}
+
+              {PaymentUpiOptions?.length > 0 && OrderId && (
                 <div>
                   <QrComponent
-                    com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                    com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
                   />
                 </div>
               )}
-
-            {PaymentUpiOptions?.length > 0 && OrderId && (
-              <div>
-                <QrComponent
-                  com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
-                />
-              </div>
-            )}
-            {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
-              .length === 1 || navCust === true ? (
-              <>
-                {Object.keys(useOptions)?.length > 0 &&
-                  useOptions?.some((flow) =>
-                    flow.OptionDetails.some(
-                      (option) =>
-                        option.OptionName === 'Pay at the counter' &&
-                        option.ModeDetails.some(
-                          (mode) => mode.ModeName === 'Credit'
-                        )
-                    )
-                  ) && (
-                    <div style={{ width: '2rem' }}>
-                      <React.Fragment key="CreditCustomerFragment">
-                        {!OtherServicesglobal && (
-                          <TooltipWrapper
-                            title="Advance Amount"
-                            isMobile={isMobile}
-                          >
-                            {' '}
-                            <PozoAdvanceIcon
-                              className="BSBillingNav-icon-table-icon"
-                              onClick={CreditCustomerFun}
-                              style={{
-                                cursor:
-                                  OrderCardDetail?.length > 0 && 'not-allowed',
-                                color:
-                                  OrderCardDetail?.length > 0 ||
+              {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
+                .length === 1 || navCust === true ? (
+                <>
+                  {Object.keys(useOptions)?.length > 0 &&
+                    useOptions?.some((flow) =>
+                      flow.OptionDetails.some(
+                        (option) =>
+                          option.OptionName === 'Pay at the counter' &&
+                          option.ModeDetails.some(
+                            (mode) => mode.ModeName === 'Credit'
+                          )
+                      )
+                    ) && (
+                      <div style={{ width: '2rem' }}>
+                        <React.Fragment key="CreditCustomerFragment">
+                          {!OtherServicesglobal && (
+                            <TooltipWrapper
+                              title="Advance Amount"
+                              isMobile={isMobile}
+                            >
+                              {' '}
+                              <PozoAdvanceIcon
+                                className="BSBillingNav-icon-table-icon"
+                                onClick={CreditCustomerFun}
+                                style={{
+                                  cursor:
+                                    OrderCardDetail?.length > 0 &&
+                                    'not-allowed',
+                                  color:
+                                    OrderCardDetail?.length > 0 ||
                                     (selOption?.value === undefined &&
                                       GlobalAddCustomerDetails1?.length === 0 &&
                                       GetCustId?.CustMobile === undefined)
-                                    ? 'gray'
-                                    : 'rgb(18, 146, 238)',
-                                fontSize: '28px',
-                              }}
-                            />
-                          </TooltipWrapper>
-                        )}
-                      </React.Fragment>
-                    </div>
-                  )}
-              </>
-            ) : (
-              ''
-            )}
-            {paybtns?.length > 1 && (
-              <div
-                style={{
-                  pointerEvents:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 'none'
-                      : 'auto',
-                  opacity:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 0.5
-                      : 1,
-                  width: '2rem',
-                }}
-              >
-                {!OtherServicesglobal && (
-                  <TooltipWrapper
-                    title="Split Payment (Alt+S)"
-                    isMobile={isMobile}
-                  >
-                    {' '}
-                    <div
-                      className="BSBillingNav-icon-table-icon"
-                      onClick={
-                        CheckBookingStatus != 'Close' && !addnewAccess
-                          ? SplitPaymentOpen
-                          : ''
-                      }
-                      style={{
-                        width: '1.5rem',
-                        cursor:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'not-allowed'
-                            : 'pointer',
-                        color:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'gray'
-                            : 'rgb(18, 146, 238)',
-                        display: 'flex',
-                        alignItems: 'center',
-                        height: '2.46rem',
-                      }}
-                    >
-                      <PozoSplitPaymentIcon />
-                    </div>
-                  </TooltipWrapper>
-                )}
-              </div>
-            )}
-            {/* Customer Orders */}
-            {GetCustId && (
-
-              <Tooltip title="Customer Orders" isMobile={isMobile}>
-                {' '}
-                <div
-                  className="BSBillingNav-icon-table-icon"
-                  onClick={() => {
-                    if (
-                      CheckBookingStatus !== 'Close' &&
-                      !addnewAccess &&
-                      !(OrderCardDetail?.length > 0)
-                    ) {
-                      setCustomerPreviesOrders(true);
-                    }
-                  }}
-                  style={{
-                    cursor: OrderCardDetail?.length > 0 && 'not-allowed',
-                    color:
-                      OrderCardDetail?.length > 0 ||
-                        (OrderCardDetail?.length > 0 &&
-                          GetCustId?.CustMobile === undefined)
-                        ? 'gray'
-                        : 'rgb(18, 146, 238)',
-                    fontSize: '25px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                    width: '1.5rem',
-                  }}
-                >
-                  <FaCartPlus />
-                </div>
-              </Tooltip>
-            )}
-            {tabledata?.length > 0 && (
-              <>
-                {tableOptions
-                  .filter((item) => item.OptionName === 'UnpaidBill')
-                  .map((filteredItem) => (
-                    <div style={{ width: '2rem' }}>
-                      <React.Fragment key={filteredItem.TemplateOptionsId}>
-                        {!OtherServicesglobal && (
-                          <TooltipWrapper
-                            title="Unpaid Bills"
-                            isMobile={isMobile}
-                          >
-                            {' '}
-                            <PozoUnpaidIcon
-                              className="BSBillingNav-icon-table-icon"
-                              style={{
-                                fontSize: '27px',
-                                cursor: 'pointer',
-                                color: unpaidFlow ? '#52c41a' : '#1292EE',
-                              }}
-                              onClick={() => {
-                                (setUnpaidOpen(true), getUnpaiddatas());
-                              }}
-                            />
-                          </TooltipWrapper>
-                        )}
-                      </React.Fragment>
-                    </div>
-                  ))}
-              </>
-            )}
-
-            {dinePreference &&
-              (BookingType === 'Dine In' ||
-                BookingTypeBoth ||
-                CheckOrderType?.length > 0) &&
-              !unpaidFlow &&
-              SelectedTableDetails?.length !== 0 && (
-                <div
-                  style={{
-                    width: '4rem',
-                    display: 'flex',
-                    alignItems: 'center',
-                  }}
-                >
-                  <TooltipWrapper title="ORDER" isMobile={isMobile}>
-                    {' '}
-                    <PozoDineInIcon
-                      className={
-                        FirstPaymentclick === false && !addnewAccess
-                          ? OrderStatus
-                            ? 'Dinein-order-btn pulse-element ChairClrRed'
-                            : 'Dinein-order-btn pulse-element ChairClrGreen'
-                          : 'Dinein-order-btn-disabled pulse-element'
-                      }
-                      onClick={() =>
-                        FirstPaymentclick === false && !addnewAccess
-                          ? changeOrderStatus()
-                          : ''
-                      }
-                    />
-                  </TooltipWrapper>
-                  {FirstPaymentclick === false &&
-                    !addnewAccess &&
-                    !OrderStatus && <BSTipAmount />}
-                </div>
-              )}
-            {!OtherServicesglobal && (
-              <div style={{ width: '2rem' }}>
-                {tableOptions?.map((item) => (
-                  <>
-                    {unpaidFlow == false
-                      ? item?.OptionName == 'Hold' &&
-                      BookingType !== 'Dine In' &&
-                      !BookingTypeBoth &&
-                      OrderCardDetail?.length != 0 &&
-                      CheckOrderType?.length === 0 &&
-                      OrderType != 'Failed' &&
-                      CheckBookingStatus != 'Close' &&
-                      paybtns?.length > 0 &&
-                      !addnewAccess && (
-                        <TooltipWrapper
-                          title={'Hold (Alt+W)'}
-                          isMobile={isMobile}
-                        >
-                          {' '}
-                          <PozoHoldIcon
-                            className="BSBillingNav-icon-table-icon"
-                            onClick={() => AddBookingDetails('Hold', false)}
-                            style={{
-                              fontSize: '30px',
-                              cursor: 'pointer',
-                              color: '' ? '#52c41a' : '#1292EE',
-                            }}
-                          />
-                        </TooltipWrapper>
-                      )
-                      : ''}
-                    {unpaidFlow == false
-                      ? item?.OptionName == 'Hold' &&
-                      paybtns?.length > 0 &&
-                      BookingType !== 'Dine In' &&
-                      !BookingTypeBoth &&
-                      Holddata?.length > 0 &&
-                      paybtns?.length > 0 &&
-                      OrderCardDetail?.length == 0 &&
-                      CheckBookingStatus != 'Close' &&
-                      !addnewAccess && (
-                        <TooltipWrapper
-                          title={'Recall (Alt+W)'}
-                          isMobile={isMobile}
-                        >
-                          {' '}
-                          <Badge
-                            count={Holddata?.length}
-                            size={'small'}
-                            offset={[0, 7]}
-                          >
-                            <PozoHoldIcon
-                              className="BSBillingNav-icon-table-icon"
-                              onClick={() => HandleholdModelOpen()}
-                              style={{
-                                fontSize: '28px',
-                                cursor: 'pointer',
-                                color: Holddata ? '#52c41a' : 'default',
-                                pointerEvents:
-                                  OrderType === 'Failed' ? 'none' : 'auto',
-                              }}
-                            />
-                          </Badge>
-                        </TooltipWrapper>
-                      )
-                      : ''}
-                  </>
-                ))}
-              </div>
-            )}
-
-            <div className="Table3-Price-summarypopfullscrn">
-              <Popover
-                content={
-                  <>
-                    <a onClick={hide}>
-                      <AiOutlineClose />
-                    </a>
-
-                    <BSSummery1 />
-                  </>
-                }
-                trigger="click"
-                open={open}
-                onOpenChange={handleOpenChange}
-              >
-                <UpCircleOutlined
-                  style={{
-                    fontSize: '20px',
-                    cursor: 'pointer',
-                    color: '#1292EE',
-                  }}
-                />
-              </Popover>
-            </div>
-
-            {OtherServicesglobal && OrderCardDetail.length >= 1 && (
-              <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
-                {' '}
-                <div
-                  className="BSBillingNav-icon-table-icon"
-                  onClick={
-                    // CheckBookingStatus != 'Close' && !addnewAccess?
-                    Otherservicesvehicleno
-                    // : ''
-                  }
-                  style={{
-                    width: '1.5rem',
-                    cursor:
-                      OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                        ? 'not-allowed'
-                        : 'pointer',
-                    color:
-                      OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                        ? 'gray'
-                        : 'rgb(18, 146, 238)',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                  }}
-                >
-                  <TfiClipboard />
-                </div>
-              </TooltipWrapper>
-            )}
-
-            <div
-              style={{
-                display: 'flex',
-                flexDirection: 'column',
-                rowGap: '0.2rem',
-              }}
-            ></div>
-          </div>
-          <div className="CustomerAddSrch">
-            <div style={{ height: '2.1rem' }}>
-              {tableOptions
-                .filter((item) => item.OptionName === 'AddCustomer')
-                .map((filteredItem) => (
-                  <React.Fragment key={filteredItem.TemplateOptionsId}>
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        columnGap: '0.5rem',
-                      }}
-                    >
-                      <BSCustomerSelect />
-
-                      <TooltipWrapper
-                        title={'Add Customer'}
-                        isMobile={isMobile}
-                      >
-                        {' '}
-                        <PozoAddCustomerIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={handleAddCustomer}
-                          style={{
-                            fontSize: '25px',
-                            color:
-                              selOption || GetCustId ? '#52c41a' : '#1292EE',
-                            cursor: Custdisable ? 'not-allowed' : 'pointer',
-                          }}
-                        />
-                      </TooltipWrapper>
-                    </div>
-                  </React.Fragment>
-                ))}
-            </div>
-          </div>
-          <TooltipWrapper
-            // title={'Payment Mode (SHIFT + M)'}
-            isMobile={isMobile}
-            placement={'left'}
-          >
-            <div className="Table3-payment-mode-tooltip">
-              <div
-                className="Table3-payment-mode"
-                style={{
-                  pointerEvents:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 'none'
-                      : 'auto',
-                  opacity:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 0.5
-                      : 1,
-                }}
-              >
-                {paybtns?.length > 0 && (currentOrderNetAmount >= previousNetAmount) ? (
-                  paybtns?.map((payment) => (
-                    <div className="Table3-cash">
-                      <button
-                        className={
-                          paybtnselected === payment.ModeId &&
-                            (UpinotSelected || CardoptionnotSelected)
-                            ? 'Btn-payment-mode-notupisel'
-                            : paybtnselected === payment.ModeId &&
-                              (!UpinotSelected || !CardoptionnotSelected)
-                              ? 'Btn-payment-mode'
-                              : 'Btn-payment-mode-sel'
-                        }
-                        style={{
-                          fontFamily: FontFamily['para'],
-                          position: 'relative',
-                          animation: blink
-                            ? 'blink-animation 0.5s infinite alternate'
-                            : 'none',
-                        }}
-                        onClick={() =>
-                          payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
-                            ? handleUPIButtonClick(
-                              payment.ModeId,
-                              payment.ModeName
-                            )
-                            : handlePaymentMode(
-                              payment.ModeId,
-                              payment.ModeName
-                            )
-                        }
-                      >
-                        {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                        <div
-                          style={{
-                            display: 'flex',
-                            flexDirection: 'row',
-                            columnGap: '0.5rem',
-                            alignItems: 'center',
-                          }}
-                        >
-                          {payment.ModeName}
-                          {payment?.ModeName?.toLowerCase() === 'card' && (
-                            <CardPopover
-                              CardPayOption={CardPayOption}
-                              SelectedCardOption={SelectedCardOption}
-                              AddCardOption={AddCardOption}
-                              CardOptionOpen={CardOptionOpen}
-                              EnableCardOptions={EnableCardOptions}
-                              paygate={paygate}
-                              paydevice={paydevice}
-                            />
+                                      ? 'gray'
+                                      : 'rgb(18, 146, 238)',
+                                  fontSize: '28px',
+                                }}
+                              />
+                            </TooltipWrapper>
                           )}
-                          {payment?.ModeName?.toLowerCase() === 'upi' && (
-                            <UpiPopover
-                              defaultPaymentMode={defaultPaymentMode}
-                              defaultEnabled={defaultEnabled}
-                              setDefaultEnabled={setDefaultEnabled}
-                              UpiOptionOpen={UpiOptionOpen}
-                              UpiPayOption={UpiPayOption}
-                              SelectedUPIPayOption={SelectedUPIPayOption}
-                              AddUPIPaymentOption={AddUPIPaymentOption}
-                              PaymentUpiOptions={PaymentUpiOptions}
-                              UpiOption={UpiOption}
-                              BusinessPayOption={BusinessPayOption}
-                              UpiId={UpiId}
-                              paygate={paygate}
-                              paydevice={paydevice}
-                              EnableUpiOptions={EnableUpiOptions}
-                              PaymentgatewayUPI={PaymentgatewayUPI}
-                              PaymentDeviceUPI={PaymentDeviceUPI}
-                              SelectedUpiOption={SelectedUpiOption}
-                              addUpiOption={addUpiOption}
-                              hideDefault={hideDefault}
-                            />
-                          )}
-                        </div>
-                      </button>
-                    </div>
-                  ))
-                ) : (currentOrderNetAmount < previousNetAmount && salesBillEdit && refundPayBtns.length > 0) ? (
-                  refundPayBtns.map((payment) => (
-                    <div className="Table3-cash">
-                      <button
-                        className={
-                          refundPaySelected === payment.ConfigId &&
-                            (UpinotSelected || CardoptionnotSelected)
-                            ? 'Btn-payment-mode-notupisel'
-                            : refundPaySelected === payment.ConfigId &&
-                              (!UpinotSelected || !CardoptionnotSelected)
-                              ? 'Btn-payment-mode'
-                              : 'Btn-payment-mode-sel'
-                        }
-                        style={{
-                          fontFamily: FontFamily['para'],
-                          position: 'relative',
-                          animation: blink
-                            ? 'blink-animation 0.5s infinite alternate'
-                            : 'none',
-                        }}
-                        onClick={() => handleRefundPaymentMode(payment?.ConfigId, payment?.ConfigName)}
-                      >
-                        {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                        <div
-                          style={{
-                            display: 'flex',
-                            flexDirection: 'row',
-                            columnGap: '0.5rem',
-                          }}
-                        >
-                          {payment.ConfigName}
-                        </div>
-                      </button>
-                    </div>
-                  ))
-                ) : (
-                  <div
-                    onClick={handlepaymentoptions}
-                    style={{ cursor: 'pointer' }}
-                    className="payment-error-msg"
-                  >
-                    Please Set Payment Options
-                  </div>
-                )}
-              </div>
-              {PrintOrderDetails?.length > 0 && (
-                <div
-                  style={{
-                    display: 'flex',
-                    gap: '1rem',
-                    justifyContent: 'center',
-                  }}
-                >
-                  {filteredSettingNames?.includes('whatsapp') &&
-                    MobileNoWhatsApp?.value && (
-                      <FaWhatsapp
-                        size={32}
-                        color="#25D366"
-                        style={{ cursor: 'pointer' }}
-                        onClick={handleWhatsAppClick}
-                        title="Share on WhatsApp"
-                      />
+                        </React.Fragment>
+                      </div>
                     )}
-                  <FaPrint
-                    size={32}
-                    color="#1292EE"
-                    style={{ cursor: 'pointer' }}
-                    onClick={handlePrintOrToken}
-                    title="Print"
-                  />
-
-                  {filteredSettingNames?.includes('SMS') && isMobile && (
-                    <MdSms
-                      size={32}
-                      color="#FF8800"
-                      style={{ cursor: 'pointer' }}
-                      onClick={handleSMSClick}
-                      title="Send SMS"
-                    />
-                  )}
-                  {/* WhatsAppShare modal/component */}
-                  {showWhatsAppShare && (
-                    <WhatsAppShare
-                      message={encodedMessage}
-                      mobileNumber={MobileNoWhatsApp?.value}
-                      onClose={() => closePrintOption(false)}
-                    />
-                  )}
-                  {showSMSShare && isMobile && (
-                    <SMSShare
-                      message={encodedMessage}
-                      mobileNumber={MobileNoWhatsApp?.value}
-                      onClose={() => closePrintOption(false)}
-                    />
-                  )}
-                </div>
-              )}
-            </div>
-          </TooltipWrapper>
-        </div>
-
-        <vr className="Table3-vertical-line"></vr>
-
-        <div className="Table3-price">
-          <div className="Table3-Price-div">
-            <div>
-              <table className="Table3-total-price">
-                <tr className="Table3-totalprice-row">
-                  <td>
-                    <p
-                      className="Totalpay"
-                      style={{
-                        fontFamily: FontFamily['para'],
-                      }}
-                    >
-                      Items :&nbsp;
-                    </p>
-                  </td>
-                  <td
-                    className="lstamount"
-                    style={{ fontFamily: FontFamily['para'] }}
-                  >
-                    {TotalItems}
-                  </td>
-                </tr>
-                <tr className="Table3-totalprice-row">
-                  <td>
-                    <p
-                      className="Discountpay"
-                      style={{
-                        fontFamily: FontFamily['para'],
-                      }}
-                    >
-                      Qty :&nbsp;
-                    </p>
-                  </td>
-                  <td
-                    className="lstamount"
-                    style={{ fontFamily: FontFamily['para'] }}
-                  >
-                    {' '}
-                    {Qty}
-                  </td>
-                </tr>
-              </table>
-            </div>
-            {OrderCardDetail?.length > 0 &&
-              ParkingDisplay &&
-              !OtherServicesglobal && (
-                <div
-                  style={{
-                    width: '1.5rem',
-                    color: 'rgb(18, 146, 238)',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                  }}
-                >
-                  <BSOtherServiceClaim />
-                </div>
-              )}
-            <div style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>
-              {!OtherServicesglobal && unpaidFlow == true ? (
-                <TooltipWrapper title={'Print Bill'} isMobile={isMobile}>
-                  {' '}
-                  <PozoBillIcon
-                    className="Hover"
-                    style={{
-                      fontSize: '25px',
-                      cursor: 'pointer',
-                      color: unpaidFlow ? '#52c41a' : '#1292EE',
-                    }}
-                    onClick={() => {
-                      Recipt();
-                    }}
-                  />
-                </TooltipWrapper>
+                </>
               ) : (
                 ''
               )}
-              <div className="Table3-Price-summarypopT3">
+              {paybtns?.length > 1 && (
+                <div
+                  style={{
+                    pointerEvents:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 'none'
+                        : 'auto',
+                    opacity:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 0.5
+                        : 1,
+                    width: '2rem',
+                  }}
+                >
+                  {!OtherServicesglobal && (
+                    <TooltipWrapper
+                      title="Split Payment (Alt+S)"
+                      isMobile={isMobile}
+                    >
+                      {' '}
+                      <div
+                        className="BSBillingNav-icon-table-icon"
+                        onClick={
+                          CheckBookingStatus != 'Close' && !addnewAccess
+                            ? SplitPaymentOpen
+                            : ''
+                        }
+                        style={{
+                          width: '1.5rem',
+                          cursor:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'not-allowed'
+                              : 'pointer',
+                          color:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'gray'
+                              : 'rgb(18, 146, 238)',
+                          display: 'flex',
+                          alignItems: 'center',
+                          height: '2.46rem',
+                        }}
+                      >
+                        <PozoSplitPaymentIcon />
+                      </div>
+                    </TooltipWrapper>
+                  )}
+                </div>
+              )}
+              {/* Customer Orders */}
+              {GetCustId && (
+                <Tooltip title="Customer Orders" isMobile={isMobile}>
+                  {' '}
+                  <div
+                    className="BSBillingNav-icon-table-icon"
+                    onClick={() => {
+                      if (
+                        CheckBookingStatus !== 'Close' &&
+                        !addnewAccess &&
+                        !(OrderCardDetail?.length > 0)
+                      ) {
+                        setCustomerPreviesOrders(true);
+                      }
+                    }}
+                    style={{
+                      cursor: OrderCardDetail?.length > 0 && 'not-allowed',
+                      color:
+                        OrderCardDetail?.length > 0 ||
+                        (OrderCardDetail?.length > 0 &&
+                          GetCustId?.CustMobile === undefined)
+                          ? 'gray'
+                          : 'rgb(18, 146, 238)',
+                      fontSize: '25px',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                      width: '1.5rem',
+                    }}
+                  >
+                    <FaCartPlus />
+                  </div>
+                </Tooltip>
+              )}
+              {tabledata?.length > 0 && (
+                <>
+                  {tableOptions
+                    .filter((item) => item.OptionName === 'UnpaidBill')
+                    .map((filteredItem) => (
+                      <div style={{ width: '2rem' }}>
+                        <React.Fragment key={filteredItem.TemplateOptionsId}>
+                          {!OtherServicesglobal && (
+                            <TooltipWrapper
+                              title="Unpaid Bills"
+                              isMobile={isMobile}
+                            >
+                              {' '}
+                              <PozoUnpaidIcon
+                                className="BSBillingNav-icon-table-icon"
+                                style={{
+                                  fontSize: '27px',
+                                  cursor: 'pointer',
+                                  color: unpaidFlow ? '#52c41a' : '#1292EE',
+                                }}
+                                onClick={() => {
+                                  (setUnpaidOpen(true), getUnpaiddatas());
+                                }}
+                              />
+                            </TooltipWrapper>
+                          )}
+                        </React.Fragment>
+                      </div>
+                    ))}
+                </>
+              )}
+
+              {dinePreference &&
+                (BookingType === 'Dine In' ||
+                  BookingTypeBoth ||
+                  CheckOrderType?.length > 0) &&
+                !unpaidFlow &&
+                SelectedTableDetails?.length !== 0 && (
+                  <div
+                    style={{
+                      width: '4rem',
+                      display: 'flex',
+                      alignItems: 'center',
+                    }}
+                  >
+                    <TooltipWrapper title="ORDER" isMobile={isMobile}>
+                      {' '}
+                      <PozoDineInIcon
+                        className={
+                          FirstPaymentclick === false && !addnewAccess
+                            ? OrderStatus
+                              ? 'Dinein-order-btn pulse-element ChairClrRed'
+                              : 'Dinein-order-btn pulse-element ChairClrGreen'
+                            : 'Dinein-order-btn-disabled pulse-element'
+                        }
+                        onClick={() =>
+                          FirstPaymentclick === false && !addnewAccess
+                            ? changeOrderStatus()
+                            : ''
+                        }
+                      />
+                    </TooltipWrapper>
+                    {FirstPaymentclick === false &&
+                      !addnewAccess &&
+                      !OrderStatus && <BSTipAmount />}
+                  </div>
+                )}
+              {!OtherServicesglobal && (
+                <div style={{ width: '2rem' }}>
+                  {tableOptions?.map((item) => (
+                    <>
+                      {unpaidFlow == false
+                        ? item?.OptionName == 'Hold' &&
+                          BookingType !== 'Dine In' &&
+                          !BookingTypeBoth &&
+                          OrderCardDetail?.length != 0 &&
+                          CheckOrderType?.length === 0 &&
+                          OrderType != 'Failed' &&
+                          CheckBookingStatus != 'Close' &&
+                          paybtns?.length > 0 &&
+                          !addnewAccess && (
+                            <TooltipWrapper
+                              title={'Hold (Alt+W)'}
+                              isMobile={isMobile}
+                            >
+                              {' '}
+                              <PozoHoldIcon
+                                className="BSBillingNav-icon-table-icon"
+                                onClick={() => AddBookingDetails('Hold', false)}
+                                style={{
+                                  fontSize: '30px',
+                                  cursor: 'pointer',
+                                  color: '' ? '#52c41a' : '#1292EE',
+                                }}
+                              />
+                            </TooltipWrapper>
+                          )
+                        : ''}
+                      {unpaidFlow == false
+                        ? item?.OptionName == 'Hold' &&
+                          paybtns?.length > 0 &&
+                          BookingType !== 'Dine In' &&
+                          !BookingTypeBoth &&
+                          Holddata?.length > 0 &&
+                          paybtns?.length > 0 &&
+                          OrderCardDetail?.length == 0 &&
+                          CheckBookingStatus != 'Close' &&
+                          !addnewAccess && (
+                            <TooltipWrapper
+                              title={'Recall (Alt+W)'}
+                              isMobile={isMobile}
+                            >
+                              {' '}
+                              <Badge
+                                count={Holddata?.length}
+                                size={'small'}
+                                offset={[0, 7]}
+                              >
+                                <PozoHoldIcon
+                                  className="BSBillingNav-icon-table-icon"
+                                  onClick={() => HandleholdModelOpen()}
+                                  style={{
+                                    fontSize: '28px',
+                                    cursor: 'pointer',
+                                    color: Holddata ? '#52c41a' : 'default',
+                                    pointerEvents:
+                                      OrderType === 'Failed' ? 'none' : 'auto',
+                                  }}
+                                />
+                              </Badge>
+                            </TooltipWrapper>
+                          )
+                        : ''}
+                    </>
+                  ))}
+                </div>
+              )}
+
+              <div className="Table3-Price-summarypopfullscrn">
                 <Popover
                   content={
                     <>
                       <a onClick={hide}>
-                        <AiOutlineClose color="#000" />
+                        <AiOutlineClose />
                       </a>
 
                       <BSSummery1 />
                     </>
                   }
                   trigger="click"
-                  open={open2}
-                  onOpenChange={handleOpenChange2}
+                  open={open}
+                  onOpenChange={handleOpenChange}
                 >
-                  {!isMobile ? (
-                    <TooltipWrapper title="Summary">
-                      {!open2 ? (
-                        <UpCircleOutlined
+                  <UpCircleOutlined
+                    style={{
+                      fontSize: '20px',
+                      cursor: 'pointer',
+                      color: '#1292EE',
+                    }}
+                  />
+                </Popover>
+              </div>
+
+              {OtherServicesglobal && OrderCardDetail.length >= 1 && (
+                <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
+                  {' '}
+                  <div
+                    className="BSBillingNav-icon-table-icon"
+                    onClick={
+                      // CheckBookingStatus != 'Close' && !addnewAccess?
+                      Otherservicesvehicleno
+                      // : ''
+                    }
+                    style={{
+                      width: '1.5rem',
+                      cursor:
+                        OrderCardDetail?.length === 0 ||
+                        CheckBookingStatus == 'Close' ||
+                        addnewAccess
+                          ? 'not-allowed'
+                          : 'pointer',
+                      color:
+                        OrderCardDetail?.length === 0 ||
+                        CheckBookingStatus == 'Close' ||
+                        addnewAccess
+                          ? 'gray'
+                          : 'rgb(18, 146, 238)',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                    }}
+                  >
+                    <TfiClipboard />
+                  </div>
+                </TooltipWrapper>
+              )}
+
+              <div
+                style={{
+                  display: 'flex',
+                  flexDirection: 'column',
+                  rowGap: '0.2rem',
+                }}
+              ></div>
+            </div>
+            <div className="CustomerAddSrch">
+              <div style={{ height: '2.1rem' }}>
+                {tableOptions
+                  .filter((item) => item.OptionName === 'AddCustomer')
+                  .map((filteredItem) => (
+                    <React.Fragment key={filteredItem.TemplateOptionsId}>
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          columnGap: '0.5rem',
+                        }}
+                      >
+                        <BSCustomerSelect />
+
+                        <TooltipWrapper
+                          title={'Add Customer'}
+                          isMobile={isMobile}
+                        >
+                          {' '}
+                          <PozoAddCustomerIcon
+                            className="BSBillingNav-icon-table-icon"
+                            onClick={handleAddCustomer}
+                            style={{
+                              fontSize: '25px',
+                              color:
+                                selOption || GetCustId ? '#52c41a' : '#1292EE',
+                              cursor: Custdisable ? 'not-allowed' : 'pointer',
+                            }}
+                          />
+                        </TooltipWrapper>
+                      </div>
+                    </React.Fragment>
+                  ))}
+              </div>
+            </div>
+            <TooltipWrapper
+              // title={'Payment Mode (SHIFT + M)'}
+              isMobile={isMobile}
+              placement={'left'}
+            >
+              <div className="Table3-payment-mode-tooltip">
+                <div
+                  className="Table3-payment-mode"
+                  style={{
+                    pointerEvents:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 'none'
+                        : 'auto',
+                    opacity:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 0.5
+                        : 1,
+                  }}
+                >
+                  {paybtns?.length > 0 &&
+                  currentOrderNetAmount >= previousNetAmount ? (
+                    paybtns?.map((payment) => (
+                      <div className="Table3-cash">
+                        <button
+                          className={
+                            paybtnselected === payment.ModeId &&
+                            (UpinotSelected || CardoptionnotSelected)
+                              ? 'Btn-payment-mode-notupisel'
+                              : paybtnselected === payment.ModeId &&
+                                  (!UpinotSelected || !CardoptionnotSelected)
+                                ? 'Btn-payment-mode'
+                                : 'Btn-payment-mode-sel'
+                          }
                           style={{
-                            fontSize: '23px',
-                            cursor: 'pointer',
-                            color: '#1292EE',
+                            fontFamily: FontFamily['para'],
+                            position: 'relative',
+                            animation: blink
+                              ? 'blink-animation 0.5s infinite alternate'
+                              : 'none',
                           }}
-                          onClick={() => {
-                            handleOpenChange2;
-                          }}
-                        />
-                      ) : (
-                        <DownCircleOutlined
+                          onClick={() =>
+                            payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
+                              ? handleUPIButtonClick(
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
+                              : handlePaymentMode(
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
+                          }
+                        >
+                          {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+
+                          <div
+                            style={{
+                              display: 'flex',
+                              flexDirection: 'row',
+                              columnGap: '0.5rem',
+                              alignItems: 'center',
+                            }}
+                          >
+                            {payment.ModeName}
+                            {payment?.ModeName?.toLowerCase() === 'card' && (
+                              <CardPopover
+                                CardPayOption={CardPayOption}
+                                SelectedCardOption={SelectedCardOption}
+                                AddCardOption={AddCardOption}
+                                CardOptionOpen={CardOptionOpen}
+                                EnableCardOptions={EnableCardOptions}
+                                paygate={paygate}
+                                paydevice={paydevice}
+                              />
+                            )}
+                            {payment?.ModeName?.toLowerCase() === 'upi' && (
+                              <UpiPopover
+                                defaultPaymentMode={defaultPaymentMode}
+                                defaultEnabled={defaultEnabled}
+                                setDefaultEnabled={setDefaultEnabled}
+                                UpiOptionOpen={UpiOptionOpen}
+                                UpiPayOption={UpiPayOption}
+                                SelectedUPIPayOption={SelectedUPIPayOption}
+                                AddUPIPaymentOption={AddUPIPaymentOption}
+                                PaymentUpiOptions={PaymentUpiOptions}
+                                UpiOption={UpiOption}
+                                BusinessPayOption={BusinessPayOption}
+                                UpiId={UpiId}
+                                paygate={paygate}
+                                paydevice={paydevice}
+                                EnableUpiOptions={EnableUpiOptions}
+                                PaymentgatewayUPI={PaymentgatewayUPI}
+                                PaymentDeviceUPI={PaymentDeviceUPI}
+                                SelectedUpiOption={SelectedUpiOption}
+                                addUpiOption={addUpiOption}
+                                hideDefault={hideDefault}
+                              />
+                            )}
+                          </div>
+                        </button>
+                      </div>
+                    ))
+                  ) : currentOrderNetAmount < previousNetAmount &&
+                    salesBillEdit &&
+                    refundPayBtns.length > 0 ? (
+                    refundPayBtns.map((payment) => (
+                      <div className="Table3-cash">
+                        <button
+                          className={
+                            refundPaySelected === payment.ConfigId &&
+                            (UpinotSelected || CardoptionnotSelected)
+                              ? 'Btn-payment-mode-notupisel'
+                              : refundPaySelected === payment.ConfigId &&
+                                  (!UpinotSelected || !CardoptionnotSelected)
+                                ? 'Btn-payment-mode'
+                                : 'Btn-payment-mode-sel'
+                          }
                           style={{
-                            fontSize: '23px',
-                            cursor: 'pointer',
-                            color: '#1292EE',
+                            fontFamily: FontFamily['para'],
+                            position: 'relative',
+                            animation: blink
+                              ? 'blink-animation 0.5s infinite alternate'
+                              : 'none',
                           }}
-                          onClick={() => {
-                            handleOpenChange2;
-                          }}
-                        />
-                      )}
-                    </TooltipWrapper>
+                          onClick={() =>
+                            handleRefundPaymentMode(
+                              payment?.ConfigId,
+                              payment?.ConfigName
+                            )
+                          }
+                        >
+                          {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+
+                          <div
+                            style={{
+                              display: 'flex',
+                              flexDirection: 'row',
+                              columnGap: '0.5rem',
+                            }}
+                          >
+                            {payment.ConfigName}
+                          </div>
+                        </button>
+                      </div>
+                    ))
                   ) : (
-                    <div>
-                      {!open2 ? (
-                        <UpCircleOutlined
-                          style={{
-                            fontSize: '23px',
-                            cursor: 'pointer',
-                            color: '#1292EE',
-                          }}
-                          onClick={() => {
-                            handleOpenChange2;
-                          }}
-                        />
-                      ) : (
-                        <DownCircleOutlined
-                          style={{
-                            fontSize: '23px',
-                            cursor: 'pointer',
-                            color: '#1292EE',
-                          }}
-                          onClick={() => {
-                            handleOpenChange2;
-                          }}
-                        />
-                      )}
+                    <div
+                      onClick={handlepaymentoptions}
+                      style={{ cursor: 'pointer' }}
+                      className="payment-error-msg"
+                    >
+                      Please Set Payment Options
                     </div>
                   )}
+                </div>
+                {PrintOrderDetails?.length > 0 && (
+                  <div
+                    style={{
+                      display: 'flex',
+                      gap: '1rem',
+                      justifyContent: 'center',
+                    }}
+                  >
+                    {filteredSettingNames?.includes('whatsapp') &&
+                      MobileNoWhatsApp?.value && (
+                        <FaWhatsapp
+                          size={32}
+                          color="#25D366"
+                          style={{ cursor: 'pointer' }}
+                          onClick={handleWhatsAppClick}
+                          title="Share on WhatsApp"
+                        />
+                      )}
+                    <FaPrint
+                      size={32}
+                      color="#1292EE"
+                      style={{ cursor: 'pointer' }}
+                      onClick={handlePrintOrToken}
+                      title="Print"
+                    />
 
-                  {/* <TooltipWrapper title="Summary" isMobile={isMobile}>
+                    {filteredSettingNames?.includes('SMS') && isMobile && (
+                      <MdSms
+                        size={32}
+                        color="#FF8800"
+                        style={{ cursor: 'pointer' }}
+                        onClick={handleSMSClick}
+                        title="Send SMS"
+                      />
+                    )}
+                    {/* WhatsAppShare modal/component */}
+                    {showWhatsAppShare && (
+                      <WhatsAppShare
+                        message={encodedMessage}
+                        mobileNumber={MobileNoWhatsApp?.value}
+                        onClose={() => closePrintOption(false)}
+                      />
+                    )}
+                    {showSMSShare && isMobile && (
+                      <SMSShare
+                        message={encodedMessage}
+                        mobileNumber={MobileNoWhatsApp?.value}
+                        onClose={() => closePrintOption(false)}
+                      />
+                    )}
+                  </div>
+                )}
+              </div>
+            </TooltipWrapper>
+          </div>
+
+          <vr className="Table3-vertical-line"></vr>
+
+          <div className="Table3-price">
+            <div className="Table3-Price-div">
+              <div>
+                <table className="Table3-total-price">
+                  <tr className="Table3-totalprice-row">
+                    <td>
+                      <p
+                        className="Totalpay"
+                        style={{
+                          fontFamily: FontFamily['para'],
+                        }}
+                      >
+                        Items :&nbsp;
+                      </p>
+                    </td>
+                    <td
+                      className="lstamount"
+                      style={{ fontFamily: FontFamily['para'] }}
+                    >
+                      {TotalItems}
+                    </td>
+                  </tr>
+                  <tr className="Table3-totalprice-row">
+                    <td>
+                      <p
+                        className="Discountpay"
+                        style={{
+                          fontFamily: FontFamily['para'],
+                        }}
+                      >
+                        Qty :&nbsp;
+                      </p>
+                    </td>
+                    <td
+                      className="lstamount"
+                      style={{ fontFamily: FontFamily['para'] }}
+                    >
+                      {' '}
+                      {Qty}
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              {OrderCardDetail?.length > 0 &&
+                ParkingDisplay &&
+                !OtherServicesglobal && (
+                  <div
+                    style={{
+                      width: '1.5rem',
+                      color: 'rgb(18, 146, 238)',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                    }}
+                  >
+                    <BSOtherServiceClaim />
+                  </div>
+                )}
+              <div
+                style={{ display: 'flex', alignItems: 'center', gap: '6px' }}
+              >
+                {!OtherServicesglobal && unpaidFlow == true ? (
+                  <TooltipWrapper title={'Print Bill'} isMobile={isMobile}>
+                    {' '}
+                    <PozoBillIcon
+                      className="Hover"
+                      style={{
+                        fontSize: '25px',
+                        cursor: 'pointer',
+                        color: unpaidFlow ? '#52c41a' : '#1292EE',
+                      }}
+                      onClick={() => {
+                        Recipt();
+                      }}
+                    />
+                  </TooltipWrapper>
+                ) : (
+                  ''
+                )}
+                <div className="Table3-Price-summarypopT3">
+                  <Popover
+                    content={
+                      <>
+                        <a onClick={hide}>
+                          <AiOutlineClose color="#000" />
+                        </a>
+
+                        <BSSummery1 />
+                      </>
+                    }
+                    trigger="click"
+                    open={open2}
+                    onOpenChange={handleOpenChange2}
+                  >
+                    {!isMobile ? (
+                      <TooltipWrapper title="Summary">
+                        {!open2 ? (
+                          <UpCircleOutlined
+                            style={{
+                              fontSize: '23px',
+                              cursor: 'pointer',
+                              color: '#1292EE',
+                            }}
+                            onClick={() => {
+                              handleOpenChange2;
+                            }}
+                          />
+                        ) : (
+                          <DownCircleOutlined
+                            style={{
+                              fontSize: '23px',
+                              cursor: 'pointer',
+                              color: '#1292EE',
+                            }}
+                            onClick={() => {
+                              handleOpenChange2;
+                            }}
+                          />
+                        )}
+                      </TooltipWrapper>
+                    ) : (
+                      <div>
+                        {!open2 ? (
+                          <UpCircleOutlined
+                            style={{
+                              fontSize: '23px',
+                              cursor: 'pointer',
+                              color: '#1292EE',
+                            }}
+                            onClick={() => {
+                              handleOpenChange2;
+                            }}
+                          />
+                        ) : (
+                          <DownCircleOutlined
+                            style={{
+                              fontSize: '23px',
+                              cursor: 'pointer',
+                              color: '#1292EE',
+                            }}
+                            onClick={() => {
+                              handleOpenChange2;
+                            }}
+                          />
+                        )}
+                      </div>
+                    )}
+
+                    {/* <TooltipWrapper title="Summary" isMobile={isMobile}>
                                     {!open2 ? (
                                         <UpCircleOutlined
                                             style={{ fontSize: '23px', cursor: 'pointer', color: '#1292EE' }}
@@ -4387,466 +4442,487 @@ const BSBillingTable3Pay = () => {
                                         />
                                     )}
                                 </TooltipWrapper> */}
-                </Popover>
+                  </Popover>
+                </div>
               </div>
             </div>
-          </div>
-          <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
-            <div
-              className={
-                // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
-                addnewAccess
-                  ? 'BSBillingTable3-paybtn-deactive'
-                  : FirstPaymentclick === false &&
-                    OrderCardDetail?.length > 0 &&
-                    paybtnselected &&
-                    CheckBookingStatus != 'Close'
-                    ? !OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ?
-                      'BSBillingTable3-paybtn'
-                      : 'BSBillingTable3-paybtn'
-                      : 'BSBillingTable3-paybtn Order'
-                    : 'BSBillingTable3-paybtn-deactive'
-              }
-              //dhana
-              // onClick={() => {
-              //     (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In", false) : AddBookingDetails(BookingType, true);
-              // }}
-              onClick={
-                // BranchFinancialStatus==='N'?
-                // financialYearError:
-                handleButtonClick
-              }
-            //dhana
-            >
-              {!OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <p className="Table4-Order">Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</p> : (
-                <>
-                  <p style={{ fontFamily: FontFamily['head'] }}>
-                    {' '}
-                    {isMobile ? (
-                      `₹ ${safeRound(
-                        OrderType === 'Failed'
-                          ? FailedTotalAmt
-                          : credit && overAllBal >= 0
-                            ? Math.max(0, TotalAmount - overAllBal)
-                            : TotalAmount
-                      )}`
-                    ) : (
-                      <div>
-                        ₹{' '}
-                        <CountUp
-                          duration={0.4}
-                          className="counter"
-                          end={safeRound(
+            <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
+              <div
+                className={
+                  // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
+                  addnewAccess
+                    ? 'BSBillingTable3-paybtn-deactive'
+                    : FirstPaymentclick === false &&
+                        OrderCardDetail?.length > 0 &&
+                        paybtnselected &&
+                        CheckBookingStatus != 'Close'
+                      ? !OrderStatus
+                        ? salesBillEdit &&
+                          currentOrderNetAmount < previousNetAmount
+                          ? 'BSBillingTable3-paybtn'
+                          : 'BSBillingTable3-paybtn'
+                        : 'BSBillingTable3-paybtn Order'
+                      : 'BSBillingTable3-paybtn-deactive'
+                }
+                //dhana
+                // onClick={() => {
+                //     (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In", false) : AddBookingDetails(BookingType, true);
+                // }}
+                onClick={
+                  // BranchFinancialStatus==='N'?
+                  // financialYearError:
+                  handleButtonClick
+                }
+                //dhana
+              >
+                {!OrderStatus ? (
+                  salesBillEdit && currentOrderNetAmount < previousNetAmount ? (
+                    <p className="Table4-Order">
+                      Refund: ₹
+                      {(previousNetAmount || 0) - (currentOrderNetAmount || 0)}
+                    </p>
+                  ) : (
+                    <>
+                      <p style={{ fontFamily: FontFamily['head'] }}>
+                        {' '}
+                        {isMobile ? (
+                          `₹ ${safeRound(
                             OrderType === 'Failed'
                               ? FailedTotalAmt
                               : credit && overAllBal >= 0
                                 ? Math.max(0, TotalAmount - overAllBal)
                                 : TotalAmount
-                          )}
-                        />
+                          )}`
+                        ) : (
+                          <div>
+                            ₹{' '}
+                            <CountUp
+                              duration={0.4}
+                              className="counter"
+                              end={safeRound(
+                                OrderType === 'Failed'
+                                  ? FailedTotalAmt
+                                  : credit && overAllBal >= 0
+                                    ? Math.max(0, TotalAmount - overAllBal)
+                                    : TotalAmount
+                              )}
+                            />
+                          </div>
+                        )}
+                      </p>
+
+                      <div className="BSBillingTable3-pay">
+                        <BiRightArrowAlt />
                       </div>
-                    )}
-                  </p>
-
-                  <div className="BSBillingTable3-pay">
-                    <BiRightArrowAlt />
-                  </div>
-                </>
-              ) : (
-                <div>ORDER</div>
-              )}
-            </div>
-          </TooltipWrapper>
-          {UpiOpen && (
-            <DefaultModal
-              open={UpiOpen}
-              title="UPI PAYMENT"
-              width={500}
-              handleCancel={() => {
-                Upimodel('Cancel');
-              }}
-              footer={false}
-              children={
-                <div style={{ overflow: 'scroll' }}>
-                  <div
-                    style={{
-                      display: 'flex',
-                      flexDirection: 'column',
-                      justifyContent: 'space-evenly',
-                      alignItems: 'center',
-                    }}
-                  >
-                    <div>
-                      <QrinScreen
-                        Amount={
-                          OrderType === 'Failed'
-                            ? FailedTotalAmt
-                            : Math.round(TotalAmount)
-                        }
-                        UpiId={UpiId}
-                      />
-                    </div>
-
-                    <div>
-                      <h1>
-                        {' '}
-                        RS :
-                        {OrderType === 'Failed'
-                          ? FailedTotalAmt
-                          : Math.round(TotalAmount)}{' '}
-                      </h1>
-                    </div>
-                  </div>
-
-                  <div className="sentok">
-                    {(selOption || SelCustId) && (
-                      <div className="sentLink" onClick={onFinalSubmit}>
-                        Sent Payment Link
-                        <img
-                          src={WpIcon}
-                          alt="Your Alt Text"
-                          style={{ width: '30px', height: '30px' }}
-                        />
-                      </div>
-                    )}
-
+                    </>
+                  )
+                ) : (
+                  <div>ORDER</div>
+                )}
+              </div>
+            </TooltipWrapper>
+            {UpiOpen && (
+              <DefaultModal
+                open={UpiOpen}
+                title="UPI PAYMENT"
+                width={500}
+                handleCancel={() => {
+                  Upimodel('Cancel');
+                }}
+                footer={false}
+                children={
+                  <div style={{ overflow: 'scroll' }}>
                     <div
                       style={{
                         display: 'flex',
-                        flexDirection: 'row-reverse',
-                        width: '100px',
+                        flexDirection: 'column',
+                        justifyContent: 'space-evenly',
+                        alignItems: 'center',
                       }}
                     >
-                      <Buttons
-                        buttonText="OK"
-                        color="901D77"
-                        icon={<ArrowRightOutlined />}
-                        handleSubmit={() => {
-                          Upimodel('Submit');
+                      <div>
+                        <QrinScreen
+                          Amount={
+                            OrderType === 'Failed'
+                              ? FailedTotalAmt
+                              : Math.round(TotalAmount)
+                          }
+                          UpiId={UpiId}
+                        />
+                      </div>
+
+                      <div>
+                        <h1>
+                          {' '}
+                          RS :
+                          {OrderType === 'Failed'
+                            ? FailedTotalAmt
+                            : Math.round(TotalAmount)}{' '}
+                        </h1>
+                      </div>
+                    </div>
+
+                    <div className="sentok">
+                      {(selOption || SelCustId) && (
+                        <div className="sentLink" onClick={onFinalSubmit}>
+                          Sent Payment Link
+                          <img
+                            src={WpIcon}
+                            alt="Your Alt Text"
+                            style={{ width: '30px', height: '30px' }}
+                          />
+                        </div>
+                      )}
+
+                      <div
+                        style={{
+                          display: 'flex',
+                          flexDirection: 'row-reverse',
+                          width: '100px',
                         }}
-                      />
+                      >
+                        <Buttons
+                          buttonText="OK"
+                          color="901D77"
+                          icon={<ArrowRightOutlined />}
+                          handleSubmit={() => {
+                            Upimodel('Submit');
+                          }}
+                        />
+                      </div>
                     </div>
                   </div>
-                </div>
-              }
-            />
-          )}
-          {PrintOrderDetails?.length > 0 &&
-            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-              <div style={{ display: 'none' }}>
-                <PaymentPdfBooking
-                  index={index}
-                  table2Data={orderDetail}
-                  singleData2={orderDetail?.productDetails}
-                  orderId={
-                    orderDetail?.OrderId &&
-                    extractLastNumberOrderId(
-                      orderDetail?.OrderId,
-                      orderDetail?.FYStatus
-                    )
-                  }
-                  CreatedDate={orderDetail?.CreatedDate}
-                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                  Preference={SettingDataSelector}
-                  printDatas={printDatas}
-                />
-              </div>
-            ))}
-          {PrintOrderDetails?.length > 0 &&
-            (TokenOnly?.SettingValue === 'Y' ||
-              IndividualToken?.SettingValue === 'Y') &&
-            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-              <div style={{ display: 'none' }}>
-                <TokensinglePrint
-                  index={index}
-                  table2Data={orderDetail}
-                  singleData2={orderDetail?.productDetails}
-                  orderId={
-                    orderDetail?.OrderId &&
-                    extractLastNumberOrderId(
-                      orderDetail?.OrderId,
-                      orderDetail?.FYStatus
-                    )
-                  }
-                  CreatedDate={orderDetail?.CreatedDate}
-                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                />
-              </div>
-            ))}
-          {CreditCustomer && (
-            <div style={{ display: 'none' }}>
-              <BsBillingCreditCustomer
-                ModalCreditCustomer={CreditCustomer}
-                handlemodalclose={() => {
-                  handleCreditCustomer('Cancel');
-                }}
-                handleOk={() => {
-                  handleCreditCustomer('Submit');
-                }}
+                }
               />
-            </div>
-          )}
+            )}
+            {PrintOrderDetails?.length > 0 &&
+              PrintOrderDetails?.[0]?.OrderDetails?.map(
+                (orderDetail, index) => (
+                  <div style={{ display: 'none' }}>
+                    <PaymentPdfBooking
+                      index={index}
+                      table2Data={orderDetail}
+                      singleData2={orderDetail?.productDetails}
+                      orderId={
+                        orderDetail?.OrderId &&
+                        extractLastNumberOrderId(
+                          orderDetail?.OrderId,
+                          orderDetail?.FYStatus
+                        )
+                      }
+                      CreatedDate={orderDetail?.CreatedDate}
+                      PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                      Preference={SettingDataSelector}
+                      printDatas={printDatas}
+                    />
+                  </div>
+                )
+              )}
+            {PrintOrderDetails?.length > 0 &&
+              (TokenOnly?.SettingValue === 'Y' ||
+                IndividualToken?.SettingValue === 'Y') &&
+              PrintOrderDetails?.[0]?.OrderDetails?.map(
+                (orderDetail, index) => (
+                  <div style={{ display: 'none' }}>
+                    <TokensinglePrint
+                      index={index}
+                      table2Data={orderDetail}
+                      singleData2={orderDetail?.productDetails}
+                      orderId={
+                        orderDetail?.OrderId &&
+                        extractLastNumberOrderId(
+                          orderDetail?.OrderId,
+                          orderDetail?.FYStatus
+                        )
+                      }
+                      CreatedDate={orderDetail?.CreatedDate}
+                      PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                    />
+                  </div>
+                )
+              )}
+            {CreditCustomer && (
+              <div style={{ display: 'none' }}>
+                <BsBillingCreditCustomer
+                  ModalCreditCustomer={CreditCustomer}
+                  handlemodalclose={() => {
+                    handleCreditCustomer('Cancel');
+                  }}
+                  handleOk={() => {
+                    handleCreditCustomer('Submit');
+                  }}
+                />
+              </div>
+            )}
+          </div>
         </div>
-      </div>
-      {unpaidopen && (
+        {unpaidopen && (
+          <DefaultModal
+            open={unpaidopen}
+            title="UNPAID BILL'S"
+            width={1000}
+            handleCancel={() => {
+              setUnpaidOpen(false);
+            }}
+            footer={false}
+            children={
+              <div style={{ height: '400px', overflow: 'scroll' }}>
+                <Tables
+                  columns={columns}
+                  data={TableData}
+                  dataSource={TableData}
+                />
+              </div>
+            }
+          />
+        )}
+        {UnpaidConfirmation && (
+          <Modal
+            open={UnpaidConfirmation}
+            width={500}
+            children={
+              <>
+                <div>
+                  You have already selected a table. If you click 'OK,' the
+                  table selection will be removed, and the unpaid flow will
+                  continue. If you click 'Cancel,' the dine-in flow will proceed
+                  as selected.
+                </div>
+              </>
+            }
+            onOk={UnpaidOk}
+            onCancel={Unpaidclose}
+          />
+        )}
+        {Splitpayment && (
+          <SplitPayment
+            SplitPaymentModal={Splitpayment}
+            handlesplitpaymentclose={handlesplitpaymentclose}
+            TotalNetAmount={
+              OrderType === 'Failed'
+                ? FailedTotalAmt
+                : Math.round(
+                    OrderCardDetail?.reduce(
+                      (acc, data) => data?.TotalAmt + acc,
+                      0
+                    ) -
+                      ((OverAllSales > 0 ? OverAllSales : 0) +
+                        (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                        (Discount > 0 ? Discount : 0))
+                  )
+            }
+            failedOrderData={failedOrderData}
+          />
+        )}
+
         <DefaultModal
-          open={unpaidopen}
-          title="UNPAID BILL'S"
-          width={1000}
+          className={'paymentoptionsModal'}
+          open={GlobalSalesPaymentoptions}
+          width={500}
+          height={1000}
           handleCancel={() => {
-            setUnpaidOpen(false);
+            dispatch(changeSalesPaymentoption(false));
           }}
           footer={false}
           children={
-            <div style={{ height: '400px', overflow: 'scroll' }}>
-              <Tables
-                columns={columns}
-                data={TableData}
-                dataSource={TableData}
-              />
+            <div
+              className="paymentoptionsModalContent"
+              style={{ overflow: 'scroll' }}
+            >
+              <Paymentoption onSuccess={getPaymentOptionFeature} />
             </div>
           }
         />
-      )}
-      {UnpaidConfirmation && (
-        <Modal
-          open={UnpaidConfirmation}
+
+        {
+          OtherServicesPrintDetails?.length > 0 && (
+            <div style={{ display: 'none' }}>
+              <OtherServicePrintStyle1
+                table2Data={OtherServicesPrintDetails}
+                singleData2={OtherServicesPrintDetails?.productDetails}
+                orderId={
+                  OtherServicesPrintDetails?.OrderId &&
+                  extractLastNumberOrderId(
+                    OtherServicesPrintDetails?.OrderId,
+                    OtherServicesPrintDetails?.FYStatus
+                  )
+                }
+                CreatedDate={OtherServicesPrintDetails?.CreatedDate}
+                PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
+                Preference={SettingDataSelector}
+                printDatas={printDatas}
+              />
+            </div>
+          )
+          // ))
+        }
+
+        <DefaultModal
+          className={'paymentoptionsModal'}
+          open={OtherServicesModal}
+          title="Vehicle No"
+          handleCancel={() => {
+            setOtherServicesModal(false);
+          }}
+          footer={false}
+          children={
+            <div
+              className="paymentoptionsModalContent"
+              style={{ overflow: 'scroll' }}
+            >
+              {OrderCardDetail.map((item, i) => {
+                const isGroup = item.ServiceType === 'G';
+                const groupKey = item.id; // 🔁 using `id` for groups now
+                const uniqueKey = `${item.ServiceId}__${item.__index}`;
+
+                // For G-type: render input only once for the group
+                if (
+                  isGroup &&
+                  i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
+                ) {
+                  return null;
+                }
+
+                const qty = isGroup
+                  ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
+                      (sum, o) => sum + (o.OrderQty || 1),
+                      0
+                    )
+                  : item.OrderQty || 1;
+
+                return (
+                  <div
+                    key={isGroup ? groupKey : uniqueKey}
+                    style={{ marginBottom: 20 }}
+                  >
+                    <h4>{item.ServiceName}</h4>
+
+                    {Array.from({ length: qty }).map((_, index) => {
+                      const inputKey = isGroup
+                        ? item.id
+                        : `${item.ServiceId}__${item.__index}`;
+                      const value = vehicleInputs[inputKey]?.[index] || '';
+                      const error = errors[inputKey]?.[index] || '';
+
+                      return (
+                        <div
+                          key={`${inputKey}-${index}`}
+                          style={{ marginBottom: 10 }}
+                        >
+                          <input
+                            placeholder={`Vehicle No ${index + 1}`}
+                            value={value}
+                            onChange={(e) =>
+                              handleInputChange(
+                                isGroup ? item.id : item.ServiceId,
+                                index,
+                                e.target.value,
+                                item.ServiceType,
+                                item
+                              )
+                            }
+                            onKeyPress={(e) => {
+                              if (!/[A-Za-z0-9]/.test(e.key)) {
+                                e.preventDefault();
+                              }
+                            }}
+                            style={{
+                              width: '100%',
+                              padding: 8,
+                              borderRadius: 4,
+                              border: error
+                                ? '1px solid red'
+                                : '1px solid #ccc',
+                            }}
+                          />
+                          {error && (
+                            <span style={{ color: 'red', fontSize: 12 }}>
+                              {error}
+                            </span>
+                          )}
+                        </div>
+                      );
+                    })}
+                  </div>
+                );
+              })}
+              <div style={{ textAlign: 'right', marginTop: 16 }}>
+                <button
+                  type="button"
+                  onClick={Handlevehiclenumbers}
+                  disabled={hasVehicleInputErrors()}
+                  style={{
+                    padding: '8px 24px',
+                    fontFamily: 'Gilroy',
+                    background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
+                    color: '#fff',
+                    border: 'none',
+                    borderRadius: 4,
+                    cursor: hasVehicleInputErrors() ? 'not-allowed' : 'pointer',
+                  }}
+                >
+                  Submit
+                </button>
+              </div>
+            </div>
+          }
+        />
+        <DefaultModal
+          open={businessUPI}
+          handleCancel={() => setShowCancelConfirm(true)}
+          footer={false}
           width={500}
           children={
             <>
-              <div>
-                You have already selected a table. If you click 'OK,' the table
-                selection will be removed, and the unpaid flow will continue. If
-                you click 'Cancel,' the dine-in flow will proceed as selected.
-              </div>
-            </>
-          }
-          onOk={UnpaidOk}
-          onCancel={Unpaidclose}
-        />
-      )}
-      {Splitpayment && (
-        <SplitPayment
-          SplitPaymentModal={Splitpayment}
-          handlesplitpaymentclose={handlesplitpaymentclose}
-          TotalNetAmount={
-            OrderType === 'Failed' ? FailedTotalAmt : Math.round(OrderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
-              ((OverAllSales > 0 ? OverAllSales : 0) +
-                (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                (Discount > 0 ? Discount : 0)))
-          }
-          failedOrderData={failedOrderData}
-        />
-      )}
-
-      <DefaultModal
-        className={'paymentoptionsModal'}
-        open={GlobalSalesPaymentoptions}
-        width={500}
-        height={1000}
-        handleCancel={() => {
-          dispatch(changeSalesPaymentoption(false));
-        }}
-        footer={false}
-        children={
-          <div
-            className="paymentoptionsModalContent"
-            style={{ overflow: 'scroll' }}
-          >
-            <Paymentoption onSuccess={getPaymentOptionFeature} />
-          </div>
-        }
-      />
-
-      {
-        OtherServicesPrintDetails?.length > 0 && (
-          // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-          <div style={{ display: 'none' }}>
-            <OtherServicePrintStyle1
-              // index={index}
-              table2Data={OtherServicesPrintDetails}
-              singleData2={OtherServicesPrintDetails?.productDetails}
-              orderId={
-                OtherServicesPrintDetails?.OrderId &&
-                extractLastNumberOrderId(
-                  OtherServicesPrintDetails?.OrderId,
-                  OtherServicesPrintDetails?.FYStatus
-                )
-              }
-              CreatedDate={OtherServicesPrintDetails?.CreatedDate}
-              PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
-              Preference={SettingDataSelector}
-              printDatas={printDatas}
-            />
-          </div>
-        )
-        // ))
-      }
-
-      <DefaultModal
-        className={'paymentoptionsModal'}
-        open={OtherServicesModal}
-        title="Vehicle No"
-        handleCancel={() => {
-          setOtherServicesModal(false);
-        }}
-        // handleSubmit={Handlevehiclenumbers}
-        footer={false}
-        children={
-          <div
-            className="paymentoptionsModalContent"
-            style={{ overflow: 'scroll' }}
-          >
-            {OrderCardDetail.map((item, i) => {
-              const isGroup = item.ServiceType === 'G';
-              const groupKey = item.id; // 🔁 using `id` for groups now
-              const uniqueKey = `${item.ServiceId}__${item.__index}`;
-
-              // For G-type: render input only once for the group
-              if (
-                isGroup &&
-                i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
-              ) {
-                return null;
-              }
-
-              const qty = isGroup
-                ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
-                  (sum, o) => sum + (o.OrderQty || 1),
-                  0
-                )
-                : item.OrderQty || 1;
-
-              return (
-                <div
-                  key={isGroup ? groupKey : uniqueKey}
-                  style={{ marginBottom: 20 }}
-                >
-                  <h4>{item.ServiceName}</h4>
-
-                  {Array.from({ length: qty }).map((_, index) => {
-                    const inputKey = isGroup
-                      ? item.id
-                      : `${item.ServiceId}__${item.__index}`;
-                    const value = vehicleInputs[inputKey]?.[index] || '';
-                    const error = errors[inputKey]?.[index] || '';
-
-                    return (
-                      <div
-                        key={`${inputKey}-${index}`}
-                        style={{ marginBottom: 10 }}
-                      >
-                        <input
-                          placeholder={`Vehicle No ${index + 1}`}
-                          value={value}
-                          onChange={(e) =>
-                            handleInputChange(
-                              isGroup ? item.id : item.ServiceId,
-                              index,
-                              e.target.value,
-                              item.ServiceType,
-                              item
-                            )
-                          }
-                          onKeyPress={(e) => {
-                            if (!/[A-Za-z0-9]/.test(e.key)) {
-                              e.preventDefault();
-                            }
-                          }}
-                          style={{
-                            width: '100%',
-                            padding: 8,
-                            borderRadius: 4,
-                            border: error ? '1px solid red' : '1px solid #ccc',
-                          }}
-                        />
-                        {error && (
-                          <span style={{ color: 'red', fontSize: 12 }}>
-                            {error}
-                          </span>
-                        )}
-                      </div>
-                    );
-                  })}
-                </div>
-              );
-            })}
-            <div style={{ textAlign: 'right', marginTop: 16 }}>
-              <button
-                type="button"
-                onClick={Handlevehiclenumbers}
-                disabled={hasVehicleInputErrors()}
-                style={{
-                  padding: '8px 24px',
-                  fontFamily: 'Gilroy',
-                  background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
-                  color: '#fff',
-                  border: 'none',
-                  borderRadius: 4,
-                  cursor: hasVehicleInputErrors() ? 'not-allowed' : 'pointer',
-                }}
-              >
-                Submit
-              </button>
-            </div>
-          </div>
-        }
-      />
-      <DefaultModal
-        open={businessUPI}
-        handleCancel={() => setShowCancelConfirm(true)}
-        footer={false}
-        width={500}
-        children={
-          <>
-            <PaymentGatewayEmbedded
-              orderId={businessUPIOrderId}
-              setBusinessUPIOrderId={setBusinessUPIOrderId}
-              businessUPILink={businessUPILink}
-              setBusinessUPI={setBusinessUPI}
-              setPaymentSuccess={setPaymentSuccess}
-              paymentSucess={paymentSucess}
-              ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
-              CustomerDisplay={CustomerDisplay}
-            />
-          </>
-        }
-      />
-      {showCancelConfirm && (
-        <Modal
-          open={showCancelConfirm}
-          title="Cancel Payment"
-          onOk={() => {
-            setBusinessUPI(false);
-            setShowCancelConfirm(false);
-            ClearAllGlobalStateDatas();
-            CustomerDisplay();
-          }}
-          onCancel={() => setShowCancelConfirm(false)}
-          okText="Yes"
-          cancelText="No"
-        >
-          Do you want to cancel the payment?
-        </Modal>
-      )}
-      {customerPreviesOrders && (
-        <DefaultModal
-          open={customerPreviesOrders}
-          handleCancel={() => setCustomerPreviesOrders(false)}
-          footer={false}
-          width={700}
-          className={'ModalPaymentGatewayEmbedded'}
-          children={
-            <>
-              <CustomerOrders
-                CustomerDetails={selOption}
-                close={() => setCustomerPreviesOrders(false)}
+              <PaymentGatewayEmbedded
+                orderId={businessUPIOrderId}
+                setBusinessUPIOrderId={setBusinessUPIOrderId}
+                businessUPILink={businessUPILink}
+                setBusinessUPI={setBusinessUPI}
+                setPaymentSuccess={setPaymentSuccess}
+                paymentSucess={paymentSucess}
+                ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
+                CustomerDisplay={CustomerDisplay}
               />
             </>
           }
         />
-      )}
-    </>
+        {showCancelConfirm && (
+          <Modal
+            open={showCancelConfirm}
+            title="Cancel Payment"
+            onOk={() => {
+              setBusinessUPI(false);
+              setShowCancelConfirm(false);
+              ClearAllGlobalStateDatas();
+              CustomerDisplay();
+            }}
+            onCancel={() => setShowCancelConfirm(false)}
+            okText="Yes"
+            cancelText="No"
+          >
+            Do you want to cancel the payment?
+          </Modal>
+        )}
+        {customerPreviesOrders && (
+          <DefaultModal
+            open={customerPreviesOrders}
+            handleCancel={() => setCustomerPreviesOrders(false)}
+            footer={false}
+            width={700}
+            className={'ModalPaymentGatewayEmbedded'}
+            children={
+              <>
+                <CustomerOrders
+                  CustomerDetails={selOption}
+                  close={() => setCustomerPreviesOrders(false)}
+                />
+              </>
+            }
+          />
+        )}
+      </>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBilling4Payment.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBilling4Payment.jsx
index 9cee205..67afd93 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBilling4Payment.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBilling4Payment.jsx
@@ -1,19 +1,28 @@
-import React, { useEffect, useState, useRef } from 'react';
+import React, { useEffect, useState, useRef, lazy, Suspense } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import moment from 'moment';
 import { Badge, Modal, Popover, Tooltip } from 'antd';
 import { BiRightArrowAlt } from 'react-icons/bi';
 import { AiOutlineClose } from 'react-icons/ai';
-import BSSummery from '../BSBillingTableSummery/BSSummery';
 import BSBillingTable4 from './BSBillingTable4';
-import { UpCircleOutlined, UpOutlined } from '@ant-design/icons';
-import QrComponent from '../../BookingFunctionality/DynamicQr.jsx';
-import QrinScreen from '../../BookingFunctionality/DynamicScreenQr.jsx';
+import { UpCircleOutlined } from '@ant-design/icons';
+const BSSummery = lazy(() => import('../BSBillingTableSummery/BSSummery'));
+
+const QrComponent = lazy(
+  () => import('../../BookingFunctionality/DynamicQr.jsx')
+);
+
+const QrinScreen = lazy(
+  () => import('../../BookingFunctionality/DynamicScreenQr.jsx')
+);
 import { ArrowRightOutlined } from '@ant-design/icons';
 import Buttons from '../../../../../Components/Forms/Buttons';
 import WpIcon from '../../../../../Images/message.png';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBillingTable4.scss';
+import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTables3/BSBillingTable3.scss';
+import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable2/BSBillingTable2.scss';
+
 import {
   GlobalSelectedFont,
   getTemplateData,
@@ -22,11 +31,17 @@ import {
   GlobalprintDatas,
   GlobalPrinterMappingDtls,
   getPrinterMappingDetails,
-  getPrintSelectionComponentData,
+  // getPrintSelectionComponentData,
 } from '../../../../../Features/ThemeChange/ThemeChange';
-import SplitPayment from '../../BookingFunctionality/SplitPayment.jsx';
 import { PrintStyleFunction } from '../../../../paymentpdfPage/PrintStyleFunction.js';
-import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities';
+
+const SplitPayment = lazy(
+  () => import('../../BookingFunctionality/SplitPayment.jsx')
+);
+
+const FeaturesFunctionalities = lazy(
+  () => import('../../BookingFunctionality/FeaturesFunctionalities')
+);
 import {
   ChangeNavHoldData,
   GlobalBookingType,
@@ -162,10 +177,18 @@ import PozoHoldIcon from '../../UtillComponents/Pozo retail icons/PozoHoldIcon';
 import PozoDineInIcon from '../../UtillComponents/Pozo retail icons/PozoDineIn.jsx';
 import PozoUnpaidIcon from '../../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
 import PozoBillIcon from '../../UtillComponents/Pozo retail icons/PozoBIllIcon.jsx';
-import PozoAddCustomerIcon from '../../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
-import BsBillingCreditCustomer from '../../BookingFunctionality/BSBillingCreditCustomer.jsx';
+const PozoAddCustomerIcon = lazy(
+  () =>
+    import('../../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx')
+);
+
+const BsBillingCreditCustomer = lazy(
+  () => import('../../BookingFunctionality/BSBillingCreditCustomer.jsx')
+);
 import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
-import BSCreditCustomer from '../../UtillComponents/BSCreditCustomer.jsx';
+const BSCreditCustomer = lazy(
+  () => import('../../UtillComponents/BSCreditCustomer.jsx')
+);
 import { isMobile } from 'react-device-detect';
 import MobilePrint from '../../BookingFunctionality/MobilePrint.jsx';
 import CountUp from 'react-countup';
@@ -178,13 +201,9 @@ import { getEmpAccess } from '../../../../../Features/AppPage/CenterPage.js';
 import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
 import PozoCartIcon from '../../../../../Pages/BookingScreen/Components/UtillComponents/PozoCartIcon.jsx';
 import {
-  Global_CoupenCodeAmount,
-  Global_loyaltyPointsDiscountAmount,
   Global_OrderOfferDetail,
   Global_OverallOfferAmount,
-  Global_SalesWiseOfferAmount,
 } from '../../../../../Features/Offer/Offer.js';
-import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
 import { useAuth } from '../../../../../AuthContext.jsx';
 import { GlobalBookingStatus } from '../../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail.js';
@@ -192,24 +211,24 @@ import {
   changeSalesPaymentoption,
   GlobalSalesPaymentoption,
 } from '../../../../../Features/Payment/Paymentoptions/Paymentoptions.js';
-import Paymentoption from '../../../../Payment/PaymentOptions/PaymentOptions.jsx';
+const Paymentoption = lazy(
+  () => import('../../../../Payment/PaymentOptions/PaymentOptions.jsx')
+);
 import { getPaymentOptionsData } from '../../../../../Features/BookingScreen/BookingData/KioskBookingData.js';
 import { getCombolist } from '../../../../../Features/ComboMaster/ComboMaster.js';
-import WhatsAppShare from '../../../../WhatsAppShare/whatsAppShare.jsx';
-import SMSShare from '../../../../WhatsAppShare/SmsShare.jsx';
+const WhatsAppShare = lazy(
+  () => import('../../../../WhatsAppShare/whatsAppShare.jsx')
+);
+
+const SMSShare = lazy(() => import('../../../../WhatsAppShare/SmsShare.jsx'));
 import { MdSms } from 'react-icons/md';
 import { FaWhatsapp, FaPrint, FaCartPlus } from 'react-icons/fa';
-import BSTipAmount from '../../UtillComponents/BSTipAmount.jsx';
+const BSTipAmount = lazy(() => import('../../UtillComponents/BSTipAmount.jsx'));
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin.js';
 import { PostOtherServices } from '../../../../../Features/OtherServices/OtherServices.js';
 import { TfiClipboard } from 'react-icons/tfi';
-import OtherServicePrintStyle1 from '../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx';
-import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
-import BSOtherServiceClaim from '../../UtillComponents/BSOtherServiceClaim.jsx';
-import { MobilePdfPrint } from '../../BookingFunctionality/MobilePdfPrint.js';
 import { PublicQrCodepost } from '../../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
 import {
-  ChangeFreeProductList,
   ChangeFullFreeProductList,
   changeFullOfferAppliedProducts,
   changeLoyaltyConsumedQuantities,
@@ -220,15 +239,27 @@ import {
 import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
 import UpiPopover from '../StandardTable/Utils/UpiPopOver.jsx';
 import CardPopover from '../StandardTable/Utils/CardPopover.jsx';
-import PaymentGatewayEmbedded from '../../UtillComponents/PaymentGatewayEmbedded.jsx';
 import pozologoimg from '../../../../../Images/pozologoimg.png';
 import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
-import CustomerOrders from '../../BookingFunctionality/CustomerOrders.jsx';
+const PaymentGatewayEmbedded = lazy(
+  () => import('../../UtillComponents/PaymentGatewayEmbedded.jsx')
+);
 
+const CustomerOrders = lazy(
+  () => import('../../BookingFunctionality/CustomerOrders.jsx')
+); // jsx File
+const BSOtherServiceClaim = lazy(
+  () => import('../../UtillComponents/BSOtherServiceClaim.jsx')
+);
+const OtherServiceMobilePrint = lazy(
+  () => import('../../BookingFunctionality/OtherServiceMobilePrint.jsx')
+);
+const OtherServicePrintStyle1 = lazy(
+  () =>
+    import('../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx')
+);
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
-const RetailApiurl = import.meta.env.ENV_API_URL;
-
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
 
 const BSBilling4Payment = () => {
@@ -241,7 +272,9 @@ const BSBilling4Payment = () => {
   const navigate = useNavigate();
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const FreeProdList = useSelector(GlobalFreeProdList);
   const offerAppliedProducts = useSelector(GlobalOfferAppliedProducts);
@@ -271,7 +304,6 @@ const BSBilling4Payment = () => {
   const GlobalExtraCharge = useSelector(globalExtraTotalAmount);
   const NavHoldData = useSelector(GlobalNavHoldData);
   const SettingDataSelector = useSelector(PreferenceData);
-  const BranchFinancialStatus = useSelector(GlobalBranchFinancialStatus);
   const RetailWSSalesType = useSelector(GlobalRetailWSSalesType);
   const appPreferences = useSelector(ApplicationPreferences);
   const bookingTypePreference = appPreferences?.find(
@@ -282,10 +314,6 @@ const BSBilling4Payment = () => {
       type?.PreferredSubCatName?.toLowerCase() === 'dine in' &&
       type?.PreferredStatus === 'Y'
   );
-  const preferenceOffer =
-    SettingDataSelector?.[0]?.['SettingDtlDetails']?.find(
-      (item) => item.SettingIdName === 'Offer'
-    )?.SettingValue === 'Y';
   const allowDecimal = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
     (setting) =>
       setting?.SettingIdName?.toLowerCase() === 'decimal' &&
@@ -305,9 +333,6 @@ const BSBilling4Payment = () => {
   const ProdSubCat = useSelector(GlobalProductSubCategorie);
   const templateData = useSelector(getTemplateData);
   const [urlData, setUrlData] = useState();
-  const OfferCheckedInSetup = templateData?.BookingNavbar?.[1].some(
-    (item) => item?.OptionName == 'Offer'
-  );
 
   // for customised invoice number
   const { selectedDate, invoiceDate, clearInvoiceDate } = useDateStore();
@@ -339,8 +364,6 @@ const BSBilling4Payment = () => {
   const BranchId = SessionData?.BranchId;
   const UserId = SessionData?.UserId;
   const UserType = SessionData?.UserType;
-  const AuthToken = SessionData?.AuthToken;
-  const SessionMobileNo = SessionData?.SessionMobileNo;
   const [refundPayBtns, setRefundPayBtns] = useState([]);
   const [refundPaySelected, setRefundPaySelected] = useState();
   const [refundPaySelectedName, setRefundPaySelectedName] = useState(null);
@@ -485,8 +508,10 @@ const BSBilling4Payment = () => {
   );
   const PrinterDetails = useSelector(GlobalPrinterMappingDtls);
   const [showCancelConfirm, setShowCancelConfirm] = useState(false);
+  const holdCheckedSalesSetup = tableOptions?.some(
+    (item) => item?.OptionName === 'Hold'
+  );
 
-  console.log(PrinterDetails, 'PrinterDetailsPrinterDetails');
   const filteredSettingNames = SettingDataSelector?.[0]?.['SettingDtlDetails']
     ?.filter(
       (item) =>
@@ -521,7 +546,7 @@ const BSBilling4Payment = () => {
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
     const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
 
   useEffect(() => {
@@ -531,7 +556,6 @@ const BSBilling4Payment = () => {
   }, [salesBillEdit]);
 
   useEffect(() => {
-
     if (salesBillEdit) {
       if (SelCustId) {
         setRefundPayBtns(AllPaymentOptions);
@@ -546,8 +570,7 @@ const BSBilling4Payment = () => {
         setRefundPayBtns(withoutCustomer);
       }
     }
-
-  }, [AllPaymentOptions, SelCustId, salesBillEdit])
+  }, [AllPaymentOptions, SelCustId, salesBillEdit]);
 
   useEffect(() => {
     const fetchCreditCustomer = async () => {
@@ -648,14 +671,21 @@ const BSBilling4Payment = () => {
 
       const filteredPayments =
         previousOrderPayment?.filter(
-          p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+          (p) =>
+            p?.LastOrderTran === 'Y' &&
+            p?.AfterAdjustment != null &&
+            p?.AfterAdjustment !== '' &&
+            p?.AfterAdjustment
         ) || [];
 
       const paymentsToUse =
-        filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
+        filteredPayments.length > 0
+          ? filteredPayments
+          : previousOrderPayment || [];
 
       const totalPreviouspayment = paymentsToUse?.reduce(
-        (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+        (acc, payment) =>
+          acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
         0
       );
 
@@ -664,8 +694,7 @@ const BSBilling4Payment = () => {
         0
       );
 
-      const previousNetAmount =
-        (totalPreviouspayment) || 0;
+      const previousNetAmount = totalPreviouspayment || 0;
 
       let withdiscTotal =
         Total -
@@ -677,12 +706,26 @@ const BSBilling4Payment = () => {
         withdiscTotal >= 0
           ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
           : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      )
+      );
 
-      setTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount);
+      setTotalAmount(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount
+      );
       setCurrentOrderNetAmount(currentOrderNetAmount);
       setPreviousNetAmount(previousNetAmount);
-      dispatch(changeSummeryTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount));
+      dispatch(
+        changeSummeryTotalAmount(
+          salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount
+              ? currentOrderNetAmount - previousNetAmount
+              : 0
+            : currentOrderNetAmount
+        )
+      );
 
       dispatch(changeSummeryComboOfferAmount(withComboSum));
 
@@ -1235,8 +1278,10 @@ const BSBilling4Payment = () => {
   }, [OrderCardDetail]);
   useEffect(() => {
     if (CompId && BranchId && AppId) {
-      getHolddata();
-      getUnpaiddatas();
+      if (holdCheckedSalesSetup) {
+        getHolddata();
+      }
+      // getUnpaiddatas();
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -1369,7 +1414,11 @@ const BSBilling4Payment = () => {
   const handleButtonClick = () => {
     if (qrCode && SelectedUPIPayOption === 'Default' && UpiQRPreference) {
       UpiPayment();
-    } else if (salesBillEdit && currentOrderNetAmount < previousNetAmount && !refundPaySelected) {
+    } else if (
+      salesBillEdit &&
+      currentOrderNetAmount < previousNetAmount &&
+      !refundPaySelected
+    ) {
       setMessageType('warning');
       setMessageData('Please Select Refund Payment Method');
       return;
@@ -1680,7 +1729,7 @@ const BSBilling4Payment = () => {
   const handleRefundPaymentMode = (id, name) => {
     setRefundPaySelected(id);
     setRefundPaySelectedName(name);
-  }
+  };
 
   const addUpiOption = async (id, name, UPIId) => {
     await dispatch(changeUpiIDprint(UPIId));
@@ -1899,7 +1948,9 @@ const BSBilling4Payment = () => {
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
     setUpinotSelected(false);
-    getHolddata();
+    if (holdCheckedSalesSetup) {
+      getHolddata();
+    }
     if (defaultBookingType === 'Both') {
       await dispatch(changeBookingType('TakeAway'));
     }
@@ -2201,78 +2252,106 @@ const BSBilling4Payment = () => {
       SalesPaymentType: 'normal',
       PaymentDetail: [
         {
-          PaymentType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? refundPaySelected :
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : SelectedUPIPayOption?.toLowerCase() === 'business'
-                    ? BusinessPayOption?.find(
-                        (busupi) => busupi?.ModeId === UpiId
-                      )?.ModeId
-                    : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          Amount: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? previousNetAmount - currentOrderNetAmount : Math.round(TotalAmount),
-          MerchantId: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-            SelectedUPIPayOption?.toLowerCase() === 'business'
-              ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                  ?.MerchantId
-              : null,
-          PaymentOptionType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) && (refundPaySelectedName?.toLowerCase() === 'cash' || refundPaySelectedName?.toLowerCase() === 'credit') ? 'PC' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption?.toLowerCase() === 'business'
-                        ? 'BU'
-                        : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                  ?.UPIDetailId
-              : SelectedUPIPayOption?.toLowerCase() === 'business'
+          PaymentType:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? refundPaySelected
+              : Paybtnnameselected?.toLowerCase() === 'upi'
+                ? SelectedUPIPayOption?.toLowerCase() === 'pd'
+                  ? PaymentDeviceUPI?.[0]?.ModeId
+                  : SelectedUPIPayOption?.toLowerCase() === 'pg'
+                    ? PaymentgatewayUPI?.[0]?.ModeId
+                    : SelectedUPIPayOption?.toLowerCase() === 'business'
+                      ? BusinessPayOption?.find(
+                          (busupi) => busupi?.ModeId === UpiId
+                        )?.ModeId
+                      : paybtnselected
+                : paybtnselected
+                  ? paybtnselected
+                  : null,
+          Amount:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? previousNetAmount - currentOrderNetAmount
+              : Math.round(TotalAmount),
+          MerchantId:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'business'
                 ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                    ?.MerchantUPIId
+                    ?.MerchantId
                 : null,
-          AccountDtl: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? [] :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                  (upipay) => upipay?.UPIId === UpiId
-                )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                    SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+          PaymentOptionType:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            (refundPaySelectedName?.toLowerCase() === 'cash' ||
+              refundPaySelectedName?.toLowerCase() === 'credit')
+              ? 'PC'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'PC'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
+                  ? 'PC'
+                  : Paybtnnameselected?.toLowerCase() === 'card'
+                    ? SelectedCardOption
+                    : Paybtnnameselected?.toLowerCase() === 'upi'
+                      ? SelectedUPIPayOption?.toLowerCase() === 'default'
+                        ? 'PC'
+                        : SelectedUPIPayOption?.toLowerCase() === 'business'
+                          ? 'BU'
+                          : SelectedUPIPayOption
+                      : null,
+          ModeOfPayment:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
+                    ?.UPIDetailId
+                : SelectedUPIPayOption?.toLowerCase() === 'business'
+                  ? BusinessPayOption?.find(
+                      (busupi) => busupi?.ModeId === UpiId
+                    )?.MerchantUPIId
+                  : null,
+          AccountDtl:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? []
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
+                    (upipay) => upipay?.UPIId === UpiId
+                  )
                 : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                      SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      SelectedUPIPayOption?.toLowerCase() === 'pd') ||
                     (Paybtnnameselected?.toLowerCase() === 'card' &&
-                      SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? 'S' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
+                      SelectedCardOption?.toLowerCase() === 'pd')
+                  ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                  : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                        SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      (Paybtnnameselected?.toLowerCase() === 'card' &&
+                        SelectedCardOption?.toLowerCase() === 'pg')
+                    ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
+                    : [],
+          PaymentStatus:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
               ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
                 ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
-                    SelectedUPIPayOption?.toLowerCase() === 'default'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
                   ? 'S'
-                  : 'P',
-          Debit: (salesBillEdit && currentOrderNetAmount < previousNetAmount && refundPaySelectedName?.toLowerCase() === 'credit') ? Math.round(previousNetAmount - currentOrderNetAmount) : 0,
-          Credit: salesBillEdit ? (currentOrderNetAmount > previousNetAmount && Paybtnnameselected?.toLowerCase() === 'credit') ? Math.round(TotalAmount) : 0 :
-            Paybtnnameselected?.toLowerCase() === 'credit'
+                  : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'default'
+                    ? 'S'
+                    : 'P',
+          Debit:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            refundPaySelectedName?.toLowerCase() === 'credit'
+              ? Math.round(previousNetAmount - currentOrderNetAmount)
+              : 0,
+          Credit: salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount &&
+              Paybtnnameselected?.toLowerCase() === 'credit'
+              ? Math.round(TotalAmount)
+              : 0
+            : Paybtnnameselected?.toLowerCase() === 'credit'
               ? Math.round(TotalAmount)
               : 0,
         },
@@ -3385,8 +3464,10 @@ const BSBilling4Payment = () => {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if (salesBillEdit) {
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger, salesBillEdit]);
 
   const Otherserviceprint = async () => {
     if (OtherServicesPrintDetails?.length > 0) {
@@ -3541,202 +3622,483 @@ const BSBilling4Payment = () => {
   };
 
   return (
-    <div className="BSBilling4-price-full">
-      <div className="BSBilling4-price-content">
-        <div className="Table4-price-icon-container">
-          <Messages messageType={messageType} messageData={messageData} />
-          {screenwidth <= 768 && (
-            <div
-              className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
-              style={{
-                transition: 'max-height 0.3s ease-in-out',
-                overflow: 'scroll',
-                maxHeight: responsiveBill ? '200px' : '0px',
-              }}
-            >
-              {Array.isArray(OrderCardDetail) &&
-                OrderCardDetail?.length >= 1 && (
-                  <BSBillingTable4 optionNames={tableOptions} />
-                )}
-            </div>
-          )}
-          {/* {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
+    <Suspense fallback={<span>Loading ...</span>}>
+      <div className="BSBilling4-price-full">
+        <div className="BSBilling4-price-content">
+          <div className="Table4-price-icon-container">
+            <Messages messageType={messageType} messageData={messageData} />
+            {screenwidth <= 768 && (
+              <div
+                className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
+                style={{
+                  transition: 'max-height 0.3s ease-in-out',
+                  overflow: 'scroll',
+                  maxHeight: responsiveBill ? '200px' : '0px',
+                }}
+              >
+                {Array.isArray(OrderCardDetail) &&
+                  OrderCardDetail?.length >= 1 && (
+                    <BSBillingTable4 optionNames={tableOptions} />
+                  )}
+              </div>
+            )}
+            {/* {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
             <span className="Table3-Price-div-table">
               {" "}
               <BSBillingTable4 optionNames={tableOptions} />
             </span>
           )} */}
-          <div
-            className="billFooter-Section"
-            style={{
-              display: 'flex',
-              flexDirection: 'column',
-              alignItems: 'center',
-              paddingTop: '5px',
-              width: '100%',
-              gap: '4px',
-            }}
-          >
-            <div className="CustomerAddSrch">
-              <div style={{ height: '2.1rem' }}>
-                {tableOptions
-                  .filter((item) => item.OptionName === 'AddCustomer')
-                  .map((filteredItem) => (
-                    <React.Fragment key={filteredItem.TemplateOptionsId}>
-                      <div
-                        style={{
-                          display: 'flex',
-                          alignItems: 'center',
-                          columnGap: '0.5rem',
-                        }}
-                      >
-                        <BSCustomerSelect />
-
-                        <TooltipWrapper
-                          title={'Add Customer'}
-                          isMobile={isMobile}
+            <div
+              className="billFooter-Section"
+              style={{
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+                paddingTop: '5px',
+                width: '100%',
+                gap: '4px',
+              }}
+            >
+              <div className="CustomerAddSrch">
+                <div style={{ height: '2.1rem' }}>
+                  {tableOptions
+                    .filter((item) => item.OptionName === 'AddCustomer')
+                    .map((filteredItem) => (
+                      <React.Fragment key={filteredItem.TemplateOptionsId}>
+                        <div
+                          style={{
+                            display: 'flex',
+                            alignItems: 'center',
+                            columnGap: '0.5rem',
+                          }}
                         >
-                          <PozoAddCustomerIcon
-                            className="BSBillingNav-icon-table-icon"
-                            onClick={handleAddCustomer}
-                            style={{
-                              fontSize: '25px',
-                              color:
-                                selOption || GetCustId ? '#52c41a' : '#1292EE',
-                              cursor: Custdisable ? 'not-allowed' : 'pointer',
-                            }}
-                          />
-                        </TooltipWrapper>
-                      </div>
-                    </React.Fragment>
-                  ))}
-              </div>
+                          <BSCustomerSelect />
 
-              {screenwidth <= 768 && (
-                <>
-                  {Array.isArray(OrderCardDetail) &&
-                    OrderCardDetail?.length >= 1 && (
-                      <div
-                        onClick={handleResponsiveBill}
-                        className="Btn-responsiveBill"
-                        style={{
-                          color: responsiveBill ? '#52c41a' : '#1292ee',
-                        }}
-                      >
-                        {responsiveBill ? (
-                          <div
-                            style={{
-                              width: '28px',
-                              display: 'flex',
-                              alignItems: 'center',
-                              height: '26px',
-                            }}
-                          >
-                            {' '}
-                            <PozoCartIcon />{' '}
-                          </div>
-                        ) : (
-                          <div
-                            style={{
-                              width: '28px',
-                              display: 'flex',
-                              alignItems: 'center',
-                              height: '26px',
-                            }}
-                          >
-                            {' '}
-                            <PozoCartIcon />{' '}
-                          </div>
-                        )}
-                      </div>
-                    )}
-                </>
-              )}
-            </div>
-            <div className="BS3hold-sum">
-              {(addcustomer || hold) && (
-                <FeaturesFunctionalities
-                  handleAddCustomerCancel={handleAddCustomerCancel}
-                  addcustomer={addcustomer}
-                  handleHoldCancel={handleHoldCancel}
-                  modalOpen={hold}
-                />
-              )}
-              {creditCustomerOpen && (
-                <BSCreditCustomer
-                  creditCustomerOpen={creditCustomerOpen}
-                  CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-                />
-              )}
-              {TotalAmount == 0 && Success && (
-                <div>
-                  <QrComponent com={`WelcomeScreen**${brachName}`} />
-                </div>
-              )}
-              {TotalAmount > 0 &&
-                qrCode &&
-                PaymentUpiOptions?.length > 0 &&
-                SelectedUpiOption && (
-                  <div>
-                    <QrComponent
-                      com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
-                    />
-                  </div>
-                )}
-
-              {PaymentUpiOptions?.length > 0 && OrderId && (
-                <div>
-                  <QrComponent
-                    com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
-                  />
-                </div>
-              )}
-              {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
-                .length === 1 || navCust === true ? (
-                <div style={{ width: '2rem' }}>
-                  {Object.keys(useOptions)?.length > 0 &&
-                    useOptions?.some((flow) =>
-                      flow.OptionDetails.some(
-                        (option) =>
-                          option.OptionName === 'Pay at the counter' &&
-                          option.ModeDetails.some(
-                            (mode) => mode.ModeName === 'Credit'
-                          )
-                      )
-                    ) && (
-                      <React.Fragment key="CreditCustomerFragment">
-                        {!OtherServicesglobal && (
                           <TooltipWrapper
-                            title="Advance Amount"
+                            title={'Add Customer'}
                             isMobile={isMobile}
                           >
-                            {' '}
-                            <PozoAdvanceIcon
+                            <PozoAddCustomerIcon
                               className="BSBillingNav-icon-table-icon"
-                              onClick={CreditCustomerFun}
+                              onClick={handleAddCustomer}
                               style={{
-                                cursor:
-                                  OrderCardDetail?.length > 0 && 'not-allowed',
+                                fontSize: '25px',
                                 color:
-                                  OrderCardDetail?.length > 0 ||
-                                  (selOption?.value === undefined &&
-                                    GlobalAddCustomerDetails1?.length === 0 &&
-                                    GetCustId?.CustMobile === undefined)
-                                    ? 'gray'
-                                    : 'rgb(18, 146, 238)',
-                                fontSize: '28px',
+                                  selOption || GetCustId
+                                    ? '#52c41a'
+                                    : '#1292EE',
+                                cursor: Custdisable ? 'not-allowed' : 'pointer',
                               }}
                             />
                           </TooltipWrapper>
-                        )}
+                        </div>
                       </React.Fragment>
-                    )}
+                    ))}
                 </div>
-              ) : (
-                ''
-              )}
-              {paybtns?.length > 1 && (
+
+                {screenwidth <= 768 && (
+                  <>
+                    {Array.isArray(OrderCardDetail) &&
+                      OrderCardDetail?.length >= 1 && (
+                        <div
+                          onClick={handleResponsiveBill}
+                          className="Btn-responsiveBill"
+                          style={{
+                            color: responsiveBill ? '#52c41a' : '#1292ee',
+                          }}
+                        >
+                          {responsiveBill ? (
+                            <div
+                              style={{
+                                width: '28px',
+                                display: 'flex',
+                                alignItems: 'center',
+                                height: '26px',
+                              }}
+                            >
+                              {' '}
+                              <PozoCartIcon />{' '}
+                            </div>
+                          ) : (
+                            <div
+                              style={{
+                                width: '28px',
+                                display: 'flex',
+                                alignItems: 'center',
+                                height: '26px',
+                              }}
+                            >
+                              {' '}
+                              <PozoCartIcon />{' '}
+                            </div>
+                          )}
+                        </div>
+                      )}
+                  </>
+                )}
+              </div>
+              <div className="BS3hold-sum">
+                {(addcustomer || hold) && (
+                  <FeaturesFunctionalities
+                    handleAddCustomerCancel={handleAddCustomerCancel}
+                    addcustomer={addcustomer}
+                    handleHoldCancel={handleHoldCancel}
+                    modalOpen={hold}
+                  />
+                )}
+                {creditCustomerOpen && (
+                  <BSCreditCustomer
+                    creditCustomerOpen={creditCustomerOpen}
+                    CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
+                  />
+                )}
+                {TotalAmount == 0 && Success && (
+                  <div>
+                    <QrComponent com={`WelcomeScreen**${brachName}`} />
+                  </div>
+                )}
+                {TotalAmount > 0 &&
+                  qrCode &&
+                  PaymentUpiOptions?.length > 0 &&
+                  SelectedUpiOption && (
+                    <div>
+                      <QrComponent
+                        com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                      />
+                    </div>
+                  )}
+
+                {PaymentUpiOptions?.length > 0 && OrderId && (
+                  <div>
+                    <QrComponent
+                      com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
+                    />
+                  </div>
+                )}
+                {tableOptions?.filter(
+                  (item) => item.OptionName === 'AddCustomer'
+                ).length === 1 || navCust === true ? (
+                  <div style={{ width: '2rem' }}>
+                    {Object.keys(useOptions)?.length > 0 &&
+                      useOptions?.some((flow) =>
+                        flow.OptionDetails.some(
+                          (option) =>
+                            option.OptionName === 'Pay at the counter' &&
+                            option.ModeDetails.some(
+                              (mode) => mode.ModeName === 'Credit'
+                            )
+                        )
+                      ) && (
+                        <React.Fragment key="CreditCustomerFragment">
+                          {!OtherServicesglobal && (
+                            <TooltipWrapper
+                              title="Advance Amount"
+                              isMobile={isMobile}
+                            >
+                              {' '}
+                              <PozoAdvanceIcon
+                                className="BSBillingNav-icon-table-icon"
+                                onClick={CreditCustomerFun}
+                                style={{
+                                  cursor:
+                                    OrderCardDetail?.length > 0 &&
+                                    'not-allowed',
+                                  color:
+                                    OrderCardDetail?.length > 0 ||
+                                    (selOption?.value === undefined &&
+                                      GlobalAddCustomerDetails1?.length === 0 &&
+                                      GetCustId?.CustMobile === undefined)
+                                      ? 'gray'
+                                      : 'rgb(18, 146, 238)',
+                                  fontSize: '28px',
+                                }}
+                              />
+                            </TooltipWrapper>
+                          )}
+                        </React.Fragment>
+                      )}
+                  </div>
+                ) : (
+                  ''
+                )}
+                {paybtns?.length > 1 && (
+                  <div
+                    style={{
+                      pointerEvents:
+                        (BookingType === 'Dine In' ||
+                          BookingTypeBoth ||
+                          CheckOrderType?.length > 0) &&
+                        !unpaidFlow &&
+                        OrderStatus
+                          ? 'none'
+                          : 'auto',
+                      opacity:
+                        (BookingType === 'Dine In' ||
+                          BookingTypeBoth ||
+                          CheckOrderType?.length > 0) &&
+                        !unpaidFlow &&
+                        OrderStatus
+                          ? 0.5
+                          : 1,
+                      width: '2rem',
+                    }}
+                  >
+                    {/* <React.Fragment key={filteredItem.TemplateOptionsId}> */}
+                    {!OtherServicesglobal && (
+                      <TooltipWrapper title="Split Payment" isMobile={isMobile}>
+                        {' '}
+                        <div
+                          className="BSBillingNav-icon-table-icon"
+                          onClick={
+                            CheckBookingStatus != 'Close' && !addnewAccess
+                              ? SplitPaymentOpen
+                              : ''
+                          }
+                          style={{
+                            width: '1.5rem',
+                            cursor:
+                              OrderCardDetail?.length === 0 ||
+                              CheckBookingStatus == 'Close' ||
+                              addnewAccess
+                                ? 'not-allowed'
+                                : 'pointer',
+                            color:
+                              OrderCardDetail?.length === 0 ||
+                              CheckBookingStatus == 'Close' ||
+                              addnewAccess
+                                ? 'gray'
+                                : 'rgb(18, 146, 238)',
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '2.46rem',
+                          }}
+                        >
+                          <PozoSplitPaymentIcon />
+                        </div>
+                      </TooltipWrapper>
+                    )}
+
+                    {OtherServicesglobal && OrderCardDetail.length >= 1 && (
+                      <TooltipWrapper
+                        title="Vehicle Number"
+                        isMobile={isMobile}
+                      >
+                        {' '}
+                        <div
+                          className="BSBillingNav-icon-table-icon"
+                          onClick={
+                            // CheckBookingStatus != 'Close' && !addnewAccess?
+                            Otherservicesvehicleno
+                            // : ''
+                          }
+                          style={{
+                            width: '1.5rem',
+                            cursor:
+                              OrderCardDetail?.length === 0 ||
+                              CheckBookingStatus == 'Close' ||
+                              addnewAccess
+                                ? 'not-allowed'
+                                : 'pointer',
+                            color:
+                              OrderCardDetail?.length === 0 ||
+                              CheckBookingStatus == 'Close' ||
+                              addnewAccess
+                                ? 'gray'
+                                : 'rgb(18, 146, 238)',
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '2.46rem',
+                          }}
+                        >
+                          <TfiClipboard />
+                        </div>
+                      </TooltipWrapper>
+                    )}
+                    {/* </React.Fragment> */}
+                  </div>
+                )}
+
+                {/* Customer Orders */}
+                {GetCustId && (
+                  <Tooltip title="Customer Orders" isMobile={isMobile}>
+                    {' '}
+                    <div
+                      className="BSBillingNav-icon-table-icon"
+                      onClick={() => {
+                        if (
+                          CheckBookingStatus !== 'Close' &&
+                          !addnewAccess &&
+                          !(OrderCardDetail?.length > 0)
+                        ) {
+                          setCustomerPreviesOrders(true);
+                        }
+                      }}
+                      style={{
+                        cursor: OrderCardDetail?.length > 0 && 'not-allowed',
+                        color:
+                          OrderCardDetail?.length > 0 ||
+                          (OrderCardDetail?.length > 0 &&
+                            GetCustId?.CustMobile === undefined)
+                            ? 'gray'
+                            : 'rgb(18, 146, 238)',
+                        fontSize: '25px',
+                        display: 'flex',
+                        alignItems: 'center',
+                        height: '2.46rem',
+                        width: '1.5rem',
+                      }}
+                    >
+                      <FaCartPlus />
+                    </div>
+                  </Tooltip>
+                )}
+                {tabledata?.length > 0 && (
+                  <div style={{ width: '2rem' }}>
+                    {tableOptions
+                      .filter((item) => item.OptionName === 'UnpaidBill')
+                      .map((filteredItem) => (
+                        <React.Fragment key={filteredItem.TemplateOptionsId}>
+                          {!OtherServicesglobal && (
+                            <TooltipWrapper
+                              title="Unpaid Bills"
+                              isMobile={isMobile}
+                            >
+                              {' '}
+                              <PozoUnpaidIcon
+                                className="BSBillingNav-icon-table-icon"
+                                style={{
+                                  fontSize: '27px',
+                                  cursor: 'pointer',
+                                  color: unpaidFlow ? '#52c41a' : '#1292EE',
+                                }}
+                                onClick={() => {
+                                  (setUnpaidOpen(true), getUnpaiddatas());
+                                }}
+                              />
+                            </TooltipWrapper>
+                          )}
+                        </React.Fragment>
+                      ))}
+                  </div>
+                )}
+                {dinePreference && (
+                  <div style={{ width: '2rem' }}>
+                    {(BookingType === 'Dine In' ||
+                      BookingTypeBoth ||
+                      CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      SelectedTableDetails?.length !== 0 && (
+                        <>
+                          <TooltipWrapper title="ORDER" isMobile={isMobile}>
+                            {' '}
+                            <PozoDineInIcon
+                              className={
+                                FirstPaymentclick === false && !addnewAccess
+                                  ? OrderStatus
+                                    ? 'Dinein-order-btn pulse-element ChairClrRed'
+                                    : 'Dinein-order-btn pulse-element ChairClrGreen'
+                                  : 'Dinein-order-btn-disabled pulse-element'
+                              }
+                              onClick={() =>
+                                FirstPaymentclick === false && !addnewAccess
+                                  ? changeOrderStatus()
+                                  : ''
+                              }
+                            />
+                          </TooltipWrapper>
+                          {FirstPaymentclick === false &&
+                            !addnewAccess &&
+                            !OrderStatus && <BSTipAmount />}
+                        </>
+                      )}
+                  </div>
+                )}
+                {!OtherServicesglobal && (
+                  <div style={{ width: '2rem' }}>
+                    {tableOptions?.map((item) => (
+                      <>
+                        {unpaidFlow == false
+                          ? item?.OptionName == 'Hold' &&
+                            BookingType !== 'Dine In' &&
+                            !BookingTypeBoth &&
+                            OrderCardDetail?.length != 0 &&
+                            CheckOrderType?.length === 0 &&
+                            OrderType != 'Failed' &&
+                            paybtns?.length > 0 &&
+                            CheckBookingStatus != 'Close' &&
+                            !addnewAccess && (
+                              <TooltipWrapper
+                                title={'Hold'}
+                                isMobile={isMobile}
+                              >
+                                {' '}
+                                <PozoHoldIcon
+                                  className="BSBillingNav-icon-table-icon"
+                                  onClick={() => AddBookingDetails('Hold')}
+                                  style={{
+                                    fontSize: '30px',
+                                    cursor: 'pointer',
+                                    color: '' ? '#52c41a' : '#1292EE',
+                                  }}
+                                />
+                              </TooltipWrapper>
+                            )
+                          : ''}
+                        {unpaidFlow == false
+                          ? item?.OptionName == 'Hold' &&
+                            BookingType !== 'Dine In' &&
+                            !BookingTypeBoth &&
+                            Holddata?.length > 0 &&
+                            OrderCardDetail?.length == 0 &&
+                            paybtns?.length > 0 &&
+                            CheckBookingStatus != 'Close' &&
+                            !addnewAccess && (
+                              <TooltipWrapper
+                                title={'Recall'}
+                                isMobile={isMobile}
+                              >
+                                {' '}
+                                <Badge
+                                  count={Holddata?.length}
+                                  size={'small'}
+                                  offset={[0, 7]}
+                                >
+                                  <PozoHoldIcon
+                                    className="BSBillingNav-icon-table-icon"
+                                    onClick={() => HandleholdModelOpen()}
+                                    style={{
+                                      fontSize: '28px',
+                                      cursor: 'pointer',
+                                      color: Holddata ? '#52c41a' : 'default',
+                                      pointerEvents:
+                                        OrderType === 'Failed'
+                                          ? 'none'
+                                          : 'auto',
+                                    }}
+                                  />
+                                </Badge>
+                              </TooltipWrapper>
+                            )
+                          : ''}
+                      </>
+                    ))}
+                  </div>
+                )}
                 <div
+                  style={{
+                    display: 'flex',
+                    flexDirection: 'column',
+                    rowGap: '0.2rem',
+                  }}
+                ></div>
+              </div>
+              <TooltipWrapper
+                // title={'Payment Mode (SHIFT + M)'}
+                isMobile={isMobile}
+                placement={'left'}
+              >
+                <div
+                  className="Table4-payment-mode"
                   style={{
                     pointerEvents:
                       (BookingType === 'Dine In' ||
@@ -3754,604 +4116,309 @@ const BSBilling4Payment = () => {
                       OrderStatus
                         ? 0.5
                         : 1,
-                    width: '2rem',
                   }}
                 >
-                  {/* <React.Fragment key={filteredItem.TemplateOptionsId}> */}
-                  {!OtherServicesglobal && (
-                    <TooltipWrapper title="Split Payment" isMobile={isMobile}>
-                      {' '}
-                      <div
-                        className="BSBillingNav-icon-table-icon"
-                        onClick={
-                          CheckBookingStatus != 'Close' && !addnewAccess
-                            ? SplitPaymentOpen
-                            : ''
-                        }
-                        style={{
-                          width: '1.5rem',
-                          cursor:
-                            OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                              ? 'not-allowed'
-                              : 'pointer',
-                          color:
-                            OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                              ? 'gray'
-                              : 'rgb(18, 146, 238)',
-                          display: 'flex',
-                          alignItems: 'center',
-                          height: '2.46rem',
-                        }}
-                      >
-                        <PozoSplitPaymentIcon />
-                      </div>
-                    </TooltipWrapper>
-                  )}
-
-                  {OtherServicesglobal && OrderCardDetail.length >= 1 && (
-                    <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
-                      {' '}
-                      <div
-                        className="BSBillingNav-icon-table-icon"
-                        onClick={
-                          // CheckBookingStatus != 'Close' && !addnewAccess?
-                          Otherservicesvehicleno
-                          // : ''
-                        }
-                        style={{
-                          width: '1.5rem',
-                          cursor:
-                            OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                              ? 'not-allowed'
-                              : 'pointer',
-                          color:
-                            OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                              ? 'gray'
-                              : 'rgb(18, 146, 238)',
-                          display: 'flex',
-                          alignItems: 'center',
-                          height: '2.46rem',
-                        }}
-                      >
-                        <TfiClipboard />
-                      </div>
-                    </TooltipWrapper>
-                  )}
-                  {/* </React.Fragment> */}
-                </div>
-              )}
-
-              {/* Customer Orders */}
-              {GetCustId && (
-                <Tooltip title="Customer Orders" isMobile={isMobile}>
-                  {' '}
-                  <div
-                    className="BSBillingNav-icon-table-icon"
-                    onClick={() => {
-                      if (
-                        CheckBookingStatus !== 'Close' &&
-                        !addnewAccess &&
-                        !(OrderCardDetail?.length > 0)
-                      ) {
-                        setCustomerPreviesOrders(true);
-                      }
-                    }}
-                    style={{
-                      cursor: OrderCardDetail?.length > 0 && 'not-allowed',
-                      color:
-                        OrderCardDetail?.length > 0 ||
-                        (OrderCardDetail?.length > 0 &&
-                          GetCustId?.CustMobile === undefined)
-                          ? 'gray'
-                          : 'rgb(18, 146, 238)',
-                      fontSize: '25px',
-                      display: 'flex',
-                      alignItems: 'center',
-                      height: '2.46rem',
-                      width: '1.5rem',
-                    }}
-                  >
-                    <FaCartPlus />
-                  </div>
-                </Tooltip>
-              )}
-              {tabledata?.length > 0 && (
-                <div style={{ width: '2rem' }}>
-                  {tableOptions
-                    .filter((item) => item.OptionName === 'UnpaidBill')
-                    .map((filteredItem) => (
-                      <React.Fragment key={filteredItem.TemplateOptionsId}>
-                        {!OtherServicesglobal && (
-                          <TooltipWrapper
-                            title="Unpaid Bills"
-                            isMobile={isMobile}
-                          >
-                            {' '}
-                            <PozoUnpaidIcon
-                              className="BSBillingNav-icon-table-icon"
-                              style={{
-                                fontSize: '27px',
-                                cursor: 'pointer',
-                                color: unpaidFlow ? '#52c41a' : '#1292EE',
-                              }}
-                              onClick={() => {
-                                (setUnpaidOpen(true), getUnpaiddatas());
-                              }}
-                            />
-                          </TooltipWrapper>
-                        )}
-                      </React.Fragment>
-                    ))}
-                </div>
-              )}
-              {dinePreference && (
-                <div style={{ width: '2rem' }}>
-                  {(BookingType === 'Dine In' ||
-                    BookingTypeBoth ||
-                    CheckOrderType?.length > 0) &&
-                    !unpaidFlow &&
-                    SelectedTableDetails?.length !== 0 && (
-                      <>
-                        <TooltipWrapper title="ORDER" isMobile={isMobile}>
-                          {' '}
-                          <PozoDineInIcon
-                            className={
-                              FirstPaymentclick === false && !addnewAccess
-                                ? OrderStatus
-                                  ? 'Dinein-order-btn pulse-element ChairClrRed'
-                                  : 'Dinein-order-btn pulse-element ChairClrGreen'
-                                : 'Dinein-order-btn-disabled pulse-element'
-                            }
-                            onClick={() =>
-                              FirstPaymentclick === false && !addnewAccess
-                                ? changeOrderStatus()
-                                : ''
-                            }
-                          />
-                        </TooltipWrapper>
-                        {FirstPaymentclick === false &&
-                          !addnewAccess &&
-                          !OrderStatus && <BSTipAmount />}
-                      </>
-                    )}
-                </div>
-              )}
-              {!OtherServicesglobal && (
-                <div style={{ width: '2rem' }}>
-                  {tableOptions?.map((item) => (
-                    <>
-                      {unpaidFlow == false
-                        ? item?.OptionName == 'Hold' &&
-                          BookingType !== 'Dine In' &&
-                          !BookingTypeBoth &&
-                          OrderCardDetail?.length != 0 &&
-                          CheckOrderType?.length === 0 &&
-                          OrderType != 'Failed' &&
-                          paybtns?.length > 0 &&
-                          CheckBookingStatus != 'Close' &&
-                          !addnewAccess && (
-                            <TooltipWrapper title={'Hold'} isMobile={isMobile}>
-                              {' '}
-                              <PozoHoldIcon
-                                className="BSBillingNav-icon-table-icon"
-                                onClick={() => AddBookingDetails('Hold')}
-                                style={{
-                                  fontSize: '30px',
-                                  cursor: 'pointer',
-                                  color: '' ? '#52c41a' : '#1292EE',
-                                }}
-                              />
-                            </TooltipWrapper>
-                          )
-                        : ''}
-                      {unpaidFlow == false
-                        ? item?.OptionName == 'Hold' &&
-                          BookingType !== 'Dine In' &&
-                          !BookingTypeBoth &&
-                          Holddata?.length > 0 &&
-                          OrderCardDetail?.length == 0 &&
-                          paybtns?.length > 0 &&
-                          CheckBookingStatus != 'Close' &&
-                          !addnewAccess && (
-                            <TooltipWrapper
-                              title={'Recall'}
-                              isMobile={isMobile}
-                            >
-                              {' '}
-                              <Badge
-                                count={Holddata?.length}
-                                size={'small'}
-                                offset={[0, 7]}
-                              >
-                                <PozoHoldIcon
-                                  className="BSBillingNav-icon-table-icon"
-                                  onClick={() => HandleholdModelOpen()}
-                                  style={{
-                                    fontSize: '28px',
-                                    cursor: 'pointer',
-                                    color: Holddata ? '#52c41a' : 'default',
-                                    pointerEvents:
-                                      OrderType === 'Failed' ? 'none' : 'auto',
-                                  }}
-                                />
-                              </Badge>
-                            </TooltipWrapper>
-                          )
-                        : ''}
-                    </>
-                  ))}
-                </div>
-              )}
-              <div
-                style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  rowGap: '0.2rem',
-                }}
-              ></div>
-            </div>
-            <TooltipWrapper
-              // title={'Payment Mode (SHIFT + M)'}
-              isMobile={isMobile}
-              placement={'left'}
-            >
-              <div
-                className="Table4-payment-mode"
-                style={{
-                  pointerEvents:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                    !unpaidFlow &&
-                    OrderStatus
-                      ? 'none'
-                      : 'auto',
-                  opacity:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                    !unpaidFlow &&
-                    OrderStatus
-                      ? 0.5
-                      : 1,
-                }}
-              >
-                {paybtns?.length > 0 && (currentOrderNetAmount >= previousNetAmount) ? (
-                  paybtns?.map((payment) => (
-                    <div className="Table3-cash">
-                      <button
-                        className={
-                          paybtnselected === payment.ModeId &&
-                          (UpinotSelected || CardoptionnotSelected)
-                            ? 'Btn-payment-mode-notupisel'
-                            : paybtnselected === payment.ModeId &&
-                                (!UpinotSelected || !CardoptionnotSelected)
-                              ? 'Btn-payment-mode'
-                              : 'Btn-payment-mode-sel'
-                        }
-                        style={{
-                          fontFamily: FontFamily['para'],
-                          position: 'relative',
-                          animation: blink
-                            ? 'blink-animation 0.5s infinite alternate'
-                            : 'none',
-                        }}
-                        onClick={() =>
-                          payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
-                            ? handleUPIButtonClick(
-                                payment.ModeId,
-                                payment.ModeName
-                              )
-                            : handlePaymentMode(
-                                payment.ModeId,
-                                payment.ModeName
-                              )
-                        }
-                      >
-                        {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                        <div
-                          style={{
-                            display: 'flex',
-                            flexDirection: 'row',
-                            columnGap: '0.5rem',
-                          }}
-                        >
-                          {payment.ModeName}
-                          {payment?.ModeName?.toLowerCase() === 'card' && (
-                            <CardPopover
-                              CardPayOption={CardPayOption}
-                              SelectedCardOption={SelectedCardOption}
-                              AddCardOption={AddCardOption}
-                              CardOptionOpen={CardOptionOpen}
-                              EnableCardOptions={EnableCardOptions}
-                              paygate={paygate}
-                              paydevice={paydevice}
-                            />
-                          )}
-                          {payment?.ModeName?.toLowerCase() === 'upi' && (
-                            <UpiPopover
-                              defaultPaymentMode={defaultPaymentMode}
-                              defaultEnabled={defaultEnabled}
-                              setDefaultEnabled={setDefaultEnabled}
-                              UpiOptionOpen={UpiOptionOpen}
-                              UpiPayOption={UpiPayOption}
-                              SelectedUPIPayOption={SelectedUPIPayOption}
-                              AddUPIPaymentOption={AddUPIPaymentOption}
-                              PaymentUpiOptions={PaymentUpiOptions}
-                              UpiOption={UpiOption}
-                              UpiId={UpiId}
-                              paygate={paygate}
-                              paydevice={paydevice}
-                              EnableUpiOptions={EnableUpiOptions}
-                              BusinessPayOption={BusinessPayOption}
-                              PaymentgatewayUPI={PaymentgatewayUPI}
-                              PaymentDeviceUPI={PaymentDeviceUPI}
-                              SelectedUpiOption={SelectedUpiOption}
-                              addUpiOption={addUpiOption}
-                              hideDefault={hideDefault}
-                            />
-                          )}
-                        </div>
-                      </button>
-                    </div>
-                  ))
-                ) : (currentOrderNetAmount < previousNetAmount && salesBillEdit && refundPayBtns.length > 0) ? (
-                  refundPayBtns.map((payment) => (
-                    <div className="Table3-cash">
-                      <button
-                        className={
-                          refundPaySelected === payment.ConfigId &&
+                  {paybtns?.length > 0 &&
+                  currentOrderNetAmount >= previousNetAmount ? (
+                    paybtns?.map((payment) => (
+                      <div className="Table3-cash">
+                        <button
+                          className={
+                            paybtnselected === payment.ModeId &&
                             (UpinotSelected || CardoptionnotSelected)
-                            ? 'Btn-payment-mode-notupisel'
-                            : refundPaySelected === payment.ConfigId &&
-                              (!UpinotSelected || !CardoptionnotSelected)
-                              ? 'Btn-payment-mode'
-                              : 'Btn-payment-mode-sel'
-                        }
-                        style={{
-                          fontFamily: FontFamily['para'],
-                          position: 'relative',
-                          animation: blink
-                            ? 'blink-animation 0.5s infinite alternate'
-                            : 'none',
-                        }}
-                        onClick={() => handleRefundPaymentMode(payment?.ConfigId, payment?.ConfigName)}
-                      >
-                        {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                        <div
+                              ? 'Btn-payment-mode-notupisel'
+                              : paybtnselected === payment.ModeId &&
+                                  (!UpinotSelected || !CardoptionnotSelected)
+                                ? 'Btn-payment-mode'
+                                : 'Btn-payment-mode-sel'
+                          }
                           style={{
-                            display: 'flex',
-                            flexDirection: 'row',
-                            columnGap: '0.5rem',
+                            fontFamily: FontFamily['para'],
+                            position: 'relative',
+                            animation: blink
+                              ? 'blink-animation 0.5s infinite alternate'
+                              : 'none',
                           }}
+                          onClick={() =>
+                            payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
+                              ? handleUPIButtonClick(
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
+                              : handlePaymentMode(
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
+                          }
                         >
-                          {payment.ConfigName}
-                        </div>
-                      </button>
-                    </div>
-                  ))
-                ) : (
-                  <div
-                    onClick={handlepaymentoptions}
-                    style={{ cursor: 'pointer' }}
-                    className="payment-error-msg"
-                  >
-                    Please Set Payment Options
-                  </div>
-                )}
-              </div>
-            </TooltipWrapper>
-            {PrintOrderDetails?.length > 0 && (
-              <div
-                style={{
-                  display: 'flex',
-                  gap: '1rem',
-                  justifyContent: 'center',
-                  margin: '4px 0',
-                  alignItems: 'center',
-                }}
-              >
-                {filteredSettingNames?.includes('whatsapp') &&
-                  MobileNoWhatsApp?.value && (
-                    <FaWhatsapp
-                      size={32}
-                      color="#25D366"
+                          {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+
+                          <div
+                            style={{
+                              display: 'flex',
+                              flexDirection: 'row',
+                              columnGap: '0.5rem',
+                            }}
+                          >
+                            {payment.ModeName}
+                            {payment?.ModeName?.toLowerCase() === 'card' && (
+                              <CardPopover
+                                CardPayOption={CardPayOption}
+                                SelectedCardOption={SelectedCardOption}
+                                AddCardOption={AddCardOption}
+                                CardOptionOpen={CardOptionOpen}
+                                EnableCardOptions={EnableCardOptions}
+                                paygate={paygate}
+                                paydevice={paydevice}
+                              />
+                            )}
+                            {payment?.ModeName?.toLowerCase() === 'upi' && (
+                              <UpiPopover
+                                defaultPaymentMode={defaultPaymentMode}
+                                defaultEnabled={defaultEnabled}
+                                setDefaultEnabled={setDefaultEnabled}
+                                UpiOptionOpen={UpiOptionOpen}
+                                UpiPayOption={UpiPayOption}
+                                SelectedUPIPayOption={SelectedUPIPayOption}
+                                AddUPIPaymentOption={AddUPIPaymentOption}
+                                PaymentUpiOptions={PaymentUpiOptions}
+                                UpiOption={UpiOption}
+                                UpiId={UpiId}
+                                paygate={paygate}
+                                paydevice={paydevice}
+                                EnableUpiOptions={EnableUpiOptions}
+                                BusinessPayOption={BusinessPayOption}
+                                PaymentgatewayUPI={PaymentgatewayUPI}
+                                PaymentDeviceUPI={PaymentDeviceUPI}
+                                SelectedUpiOption={SelectedUpiOption}
+                                addUpiOption={addUpiOption}
+                                hideDefault={hideDefault}
+                              />
+                            )}
+                          </div>
+                        </button>
+                      </div>
+                    ))
+                  ) : currentOrderNetAmount < previousNetAmount &&
+                    salesBillEdit &&
+                    refundPayBtns.length > 0 ? (
+                    refundPayBtns.map((payment) => (
+                      <div className="Table3-cash">
+                        <button
+                          className={
+                            refundPaySelected === payment.ConfigId &&
+                            (UpinotSelected || CardoptionnotSelected)
+                              ? 'Btn-payment-mode-notupisel'
+                              : refundPaySelected === payment.ConfigId &&
+                                  (!UpinotSelected || !CardoptionnotSelected)
+                                ? 'Btn-payment-mode'
+                                : 'Btn-payment-mode-sel'
+                          }
+                          style={{
+                            fontFamily: FontFamily['para'],
+                            position: 'relative',
+                            animation: blink
+                              ? 'blink-animation 0.5s infinite alternate'
+                              : 'none',
+                          }}
+                          onClick={() =>
+                            handleRefundPaymentMode(
+                              payment?.ConfigId,
+                              payment?.ConfigName
+                            )
+                          }
+                        >
+                          {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+
+                          <div
+                            style={{
+                              display: 'flex',
+                              flexDirection: 'row',
+                              columnGap: '0.5rem',
+                            }}
+                          >
+                            {payment.ConfigName}
+                          </div>
+                        </button>
+                      </div>
+                    ))
+                  ) : (
+                    <div
+                      onClick={handlepaymentoptions}
                       style={{ cursor: 'pointer' }}
-                      onClick={handleWhatsAppClick}
-                      title="Share on WhatsApp"
+                      className="payment-error-msg"
+                    >
+                      Please Set Payment Options
+                    </div>
+                  )}
+                </div>
+              </TooltipWrapper>
+              {PrintOrderDetails?.length > 0 && (
+                <div
+                  style={{
+                    display: 'flex',
+                    gap: '1rem',
+                    justifyContent: 'center',
+                    margin: '4px 0',
+                    alignItems: 'center',
+                  }}
+                >
+                  {filteredSettingNames?.includes('whatsapp') &&
+                    MobileNoWhatsApp?.value && (
+                      <FaWhatsapp
+                        size={32}
+                        color="#25D366"
+                        style={{ cursor: 'pointer' }}
+                        onClick={handleWhatsAppClick}
+                        title="Share on WhatsApp"
+                      />
+                    )}
+
+                  <FaPrint
+                    size={26}
+                    color="#1292EE"
+                    style={{ cursor: 'pointer' }}
+                    onClick={handlePrintOrToken}
+                    title="Print"
+                  />
+
+                  {filteredSettingNames?.includes('SMS') && isMobile && (
+                    <MdSms
+                      size={32}
+                      color="#FF8800"
+                      style={{ cursor: 'pointer' }}
+                      onClick={handleSMSClick}
+                      title="Send SMS"
                     />
                   )}
+                  {/* WhatsAppShare modal/component */}
+                  {showWhatsAppShare && (
+                    <WhatsAppShare
+                      message={encodedMessage}
+                      mobileNumber={MobileNoWhatsApp?.value}
+                      onClose={() => closePrintOption(false)}
+                    />
+                  )}
+                  {showSMSShare && isMobile && (
+                    <SMSShare
+                      message={encodedMessage}
+                      mobileNumber={MobileNoWhatsApp?.value}
+                      onClose={() => closePrintOption(false)}
+                    />
+                  )}
+                </div>
+              )}
+            </div>
 
-                <FaPrint
-                  size={26}
-                  color="#1292EE"
-                  style={{ cursor: 'pointer' }}
-                  onClick={handlePrintOrToken}
-                  title="Print"
-                />
-
-                {filteredSettingNames?.includes('SMS') && isMobile && (
-                  <MdSms
-                    size={32}
-                    color="#FF8800"
-                    style={{ cursor: 'pointer' }}
-                    onClick={handleSMSClick}
-                    title="Send SMS"
-                  />
-                )}
-                {/* WhatsAppShare modal/component */}
-                {showWhatsAppShare && (
-                  <WhatsAppShare
-                    message={encodedMessage}
-                    mobileNumber={MobileNoWhatsApp?.value}
-                    onClose={() => closePrintOption(false)}
-                  />
-                )}
-                {showSMSShare && isMobile && (
-                  <SMSShare
-                    message={encodedMessage}
-                    mobileNumber={MobileNoWhatsApp?.value}
-                    onClose={() => closePrintOption(false)}
-                  />
-                )}
-              </div>
-            )}
-          </div>
-
-          {/* {(selectCustomerDisplay === true || paymentModeDisplay === true) && (
+            {/* {(selectCustomerDisplay === true || paymentModeDisplay === true) && (
             <div className="BSBilling4-vertical-line"></div>
           )} */}
 
-          <div
-            className={
-              selectCustomerDisplay === true || paymentModeDisplay === true
-                ? 'Table4-price'
-                : 'Table4-price-fullflex'
-            }
-          >
-            <div className="Table4-price-btn-master">
-              <div className="Table4-Price-div">
-                <div className="T4PTable" style={{ display: 'contents' }}>
-                  <table className="Table4-total-price">
-                    <tr className="Table4-totalprice-row">
-                      <td
-                        className="Table4-td-names"
-                        style={{ fontFamily: FontFamily['para'] }}
-                      >
-                        Items:
-                      </td>
-                      <td
-                        className="Table4-td-values"
-                        style={{ fontFamily: FontFamily['para'] }}
-                      >
-                        {TotalItems}
-                      </td>
-                    </tr>
+            <div
+              className={
+                selectCustomerDisplay === true || paymentModeDisplay === true
+                  ? 'Table4-price'
+                  : 'Table4-price-fullflex'
+              }
+            >
+              <div className="Table4-price-btn-master">
+                <div className="Table4-Price-div">
+                  <div className="T4PTable" style={{ display: 'contents' }}>
+                    <table className="Table4-total-price">
+                      <tr className="Table4-totalprice-row">
+                        <td
+                          className="Table4-td-names"
+                          style={{ fontFamily: FontFamily['para'] }}
+                        >
+                          Items:
+                        </td>
+                        <td
+                          className="Table4-td-values"
+                          style={{ fontFamily: FontFamily['para'] }}
+                        >
+                          {TotalItems}
+                        </td>
+                      </tr>
 
-                    <tr className="Table4-totalprice-row">
-                      <td
-                        className="Table4-td-names"
-                        style={{ fontFamily: FontFamily['para'] }}
-                      >
-                        Qty:
-                      </td>
-                      <td
-                        className="Table4-td-values"
-                        style={{ fontFamily: FontFamily['para'] }}
-                      >
-                        {Qty}
-                      </td>
-                    </tr>
-                  </table>
-                </div>
-                <div style={{ display: 'flex', gap: '1rem' }}>
-                  {OrderCardDetail?.length > 0 &&
-                    ParkingDisplay &&
-                    !OtherServicesglobal && (
-                      <div
-                        style={{
-                          width: '1.5rem',
-                          color: 'rgb(18, 146, 238)',
-                          display: 'flex',
-                          alignItems: 'center',
-                          height: '2.46rem',
-                        }}
-                      >
-                        <BSOtherServiceClaim />
-                      </div>
-                    )}
-                  <div>
-                    {' '}
-                    {!OtherServicesglobal && unpaidFlow == true ? (
-                      <TooltipWrapper title="Print Bill" isMobile={isMobile}>
-                        {' '}
-                        <PozoBillIcon
-                          className="Hover"
-                          style={{
-                            fontSize: '25px',
-                            cursor: 'pointer',
-                            color: unpaidFlow ? '#52c41a' : '#1292EE',
-                          }}
-                          onClick={() => {
-                            Recipt();
-                          }}
-                        />
-                      </TooltipWrapper>
-                    ) : (
-                      ''
-                    )}
+                      <tr className="Table4-totalprice-row">
+                        <td
+                          className="Table4-td-names"
+                          style={{ fontFamily: FontFamily['para'] }}
+                        >
+                          Qty:
+                        </td>
+                        <td
+                          className="Table4-td-values"
+                          style={{ fontFamily: FontFamily['para'] }}
+                        >
+                          {Qty}
+                        </td>
+                      </tr>
+                    </table>
                   </div>
+                  <div style={{ display: 'flex', gap: '1rem' }}>
+                    {OrderCardDetail?.length > 0 &&
+                      ParkingDisplay &&
+                      !OtherServicesglobal && (
+                        <div
+                          style={{
+                            width: '1.5rem',
+                            color: 'rgb(18, 146, 238)',
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '2.46rem',
+                          }}
+                        >
+                          <BSOtherServiceClaim />
+                        </div>
+                      )}
+                    <div>
+                      {' '}
+                      {!OtherServicesglobal && unpaidFlow == true ? (
+                        <TooltipWrapper title="Print Bill" isMobile={isMobile}>
+                          {' '}
+                          <PozoBillIcon
+                            className="Hover"
+                            style={{
+                              fontSize: '25px',
+                              cursor: 'pointer',
+                              color: unpaidFlow ? '#52c41a' : '#1292EE',
+                            }}
+                            onClick={() => {
+                              Recipt();
+                            }}
+                          />
+                        </TooltipWrapper>
+                      ) : (
+                        ''
+                      )}
+                    </div>
 
-                  <div className="Table3-Price-summarypopfullscrn">
-                    <Popover
-                      content={
-                        <>
-                          <a onClick={hide}>
-                            <AiOutlineClose color="black" />
-                          </a>
-                          {/* <span className="Table3-Price-div-table">
+                    <div className="Table3-Price-summarypopfullscrn">
+                      <Popover
+                        content={
+                          <>
+                            <a onClick={hide}>
+                              <AiOutlineClose color="black" />
+                            </a>
+                            {/* <span className="Table3-Price-div-table">
                           {" "}
                           <BSBillingTable4 optionNames={tableOptions} />
                         </span> */}
-                          <BSSummery
-                          // Qty={Qty}
-                          // Totalitems={TotalItems}
-                          // TotalAmount={TotalAmount}
-                          // TotalTaxAmount={TotalTaxAmount}
-                          // TotalWithoutTaxAmount={TotalWithoutTaxAmount}
-                          />
-                        </>
-                      }
-                      trigger="click"
-                      // width={1000}
-                      open={open}
-                      onOpenChange={handleOpenChange}
-                    >
-                      <UpCircleOutlined
-                        style={{
-                          fontSize: '25px',
-                          cursor: 'pointer',
-                          color: '' ? '#52c41a' : '#1292EE',
-                        }}
-                      />
-                    </Popover>
-                  </div>
-
-                  <div className="Table4-Price-summarypop">
-                    <Popover
-                      content={
-                        <>
-                          <a onClick={hide}>
-                            <AiOutlineClose color="black" />
-                          </a>
-                          {/* <span className="Table3-Price-div-table">
-                          <BSBillingTable4 optionNames={tableOptions} />
-                        </span> */}
-                          <BSSummery
-                          // Qty={Qty}
-                          // Totalitems={TotalItems}
-                          // TotalAmount={TotalAmount}
-                          // TotalTaxAmount={TotalTaxAmount}
-                          // TotalWithoutTaxAmount={TotalWithoutTaxAmount}
-                          />
-                        </>
-                      }
-                      trigger="click"
-                      // width={1000}
-                      open={open2}
-                      onOpenChange={handleOpenChange2}
-                    >
-                      <TooltipWrapper title="Summary" isMobile={isMobile}>
+                            <BSSummery
+                            // Qty={Qty}
+                            // Totalitems={TotalItems}
+                            // TotalAmount={TotalAmount}
+                            // TotalTaxAmount={TotalTaxAmount}
+                            // TotalWithoutTaxAmount={TotalWithoutTaxAmount}
+                            />
+                          </>
+                        }
+                        trigger="click"
+                        // width={1000}
+                        open={open}
+                        onOpenChange={handleOpenChange}
+                      >
                         <UpCircleOutlined
                           style={{
                             fontSize: '25px',
@@ -4359,477 +4426,541 @@ const BSBilling4Payment = () => {
                             color: '' ? '#52c41a' : '#1292EE',
                           }}
                         />
-                      </TooltipWrapper>
-                    </Popover>
+                      </Popover>
+                    </div>
+
+                    <div className="Table4-Price-summarypop">
+                      <Popover
+                        content={
+                          <>
+                            <a onClick={hide}>
+                              <AiOutlineClose color="black" />
+                            </a>
+                            {/* <span className="Table3-Price-div-table">
+                          <BSBillingTable4 optionNames={tableOptions} />
+                        </span> */}
+                            <BSSummery
+                            // Qty={Qty}
+                            // Totalitems={TotalItems}
+                            // TotalAmount={TotalAmount}
+                            // TotalTaxAmount={TotalTaxAmount}
+                            // TotalWithoutTaxAmount={TotalWithoutTaxAmount}
+                            />
+                          </>
+                        }
+                        trigger="click"
+                        // width={1000}
+                        open={open2}
+                        onOpenChange={handleOpenChange2}
+                      >
+                        <TooltipWrapper title="Summary" isMobile={isMobile}>
+                          <UpCircleOutlined
+                            style={{
+                              fontSize: '25px',
+                              cursor: 'pointer',
+                              color: '' ? '#52c41a' : '#1292EE',
+                            }}
+                          />
+                        </TooltipWrapper>
+                      </Popover>
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div className="Table4-finalprice">
-                <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
-                  <button
-                    className={
-                      // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
-                      addnewAccess
-                        ? 'Table4-Btn-final-price-disabled'
-                        : FirstPaymentclick === false &&
-                          OrderCardDetail?.length > 0 &&
-                          paybtnselected &&
-                          CheckBookingStatus != 'Close'
-                          ? !OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ?
-                            'Table4-Btn-final-price'
-                            : 'Table4-Btn-final-price'
-                            : 'Table4-Btn-final-price order'
-                          : 'Table4-Btn-final-price-disabled'
-                    }
-                    // onClick={() => {
-                    //   (qrCode && SelectedUPIPayOption === "Default")
-                    //     ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
-                    // }}
-                    onClick={
-                      // BranchFinancialStatus==='N'? financialYearError:
-                      handleButtonClick
-                    }
-                  >
-                    {!OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <p className="Table4-Order">Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</p> : (
-                      <div className="Table4-fullrate">
-                        <div
-                          className="Table4-rate"
-                          style={{ fontFamily: FontFamily['head'] }}
-                          // onClick={() => AddBookingDetails(BookingType, true)}
-                        >
-                          {isMobile ? (
-                            `₹ ${Math.round(
-                              OrderType === 'Failed'
-                                ? FailedTotalAmt
-                                : credit && overAllBal >= 0
-                                  ? Math.max(0, TotalAmount - overAllBal)
-                                  : TotalAmount
-                            )}`
-                          ) : (
-                            <div>
-                              ₹{' '}
-                              <CountUp
-                                duration={0.4}
-                                className="counter"
-                                end={Math.round(
+                <div className="Table4-finalprice">
+                  <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
+                    <button
+                      className={
+                        // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
+                        addnewAccess
+                          ? 'Table4-Btn-final-price-disabled'
+                          : FirstPaymentclick === false &&
+                              OrderCardDetail?.length > 0 &&
+                              paybtnselected &&
+                              CheckBookingStatus != 'Close'
+                            ? !OrderStatus
+                              ? salesBillEdit &&
+                                currentOrderNetAmount < previousNetAmount
+                                ? 'Table4-Btn-final-price'
+                                : 'Table4-Btn-final-price'
+                              : 'Table4-Btn-final-price order'
+                            : 'Table4-Btn-final-price-disabled'
+                      }
+                      // onClick={() => {
+                      //   (qrCode && SelectedUPIPayOption === "Default")
+                      //     ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
+                      // }}
+                      onClick={
+                        // BranchFinancialStatus==='N'? financialYearError:
+                        handleButtonClick
+                      }
+                    >
+                      {!OrderStatus ? (
+                        salesBillEdit &&
+                        currentOrderNetAmount < previousNetAmount ? (
+                          <p className="Table4-Order">
+                            Refund: ₹
+                            {(previousNetAmount || 0) -
+                              (currentOrderNetAmount || 0)}
+                          </p>
+                        ) : (
+                          <div className="Table4-fullrate">
+                            <div
+                              className="Table4-rate"
+                              style={{ fontFamily: FontFamily['head'] }}
+                              // onClick={() => AddBookingDetails(BookingType, true)}
+                            >
+                              {isMobile ? (
+                                `₹ ${Math.round(
                                   OrderType === 'Failed'
                                     ? FailedTotalAmt
                                     : credit && overAllBal >= 0
                                       ? Math.max(0, TotalAmount - overAllBal)
                                       : TotalAmount
-                                )}
-                              />
+                                )}`
+                              ) : (
+                                <div>
+                                  ₹{' '}
+                                  <CountUp
+                                    duration={0.4}
+                                    className="counter"
+                                    end={Math.round(
+                                      OrderType === 'Failed'
+                                        ? FailedTotalAmt
+                                        : credit && overAllBal >= 0
+                                          ? Math.max(
+                                              0,
+                                              TotalAmount - overAllBal
+                                            )
+                                          : TotalAmount
+                                    )}
+                                  />
+                                </div>
+                              )}
+                              {/* ₹ {Math.round(TotalAmount)} */}
                             </div>
-                          )}
-                          {/* ₹ {Math.round(TotalAmount)} */}
-                        </div>
-                        <div className="Table4-rate">
-                          <BiRightArrowAlt />
-                        </div>
-                      </div>
-                    ) : (
-                      <div className="billing-in-style-Order4">ORDER</div>
-                    )}
-                  </button>
-                </TooltipWrapper>
-              </div>
-              <DefaultModal
-                open={UpiOpen}
-                title="UPI PAYMENT"
-                width={500}
-                handleCancel={() => {
-                  Upimodel('Cancel');
-                }}
-                footer={false}
-                children={
-                  <div style={{ overflow: 'scroll' }}>
-                    {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
-
-                    <div
-                      style={{
-                        display: 'flex',
-                        flexDirection: 'column',
-                        justifyContent: 'space-evenly',
-                        alignItems: 'center',
-                      }}
-                    >
-                      <div>
-                        <QrinScreen
-                          Amount={
-                            OrderType === 'Failed'
-                              ? FailedTotalAmt
-                              : Math.round(TotalAmount)
-                          }
-                          UpiId={UpiId}
-                        />
-                      </div>
-
-                      <div>
-                        <h1>
-                          {' '}
-                          RS :
-                          {OrderType === 'Failed'
-                            ? FailedTotalAmt
-                            : Math.round(TotalAmount)}{' '}
-                        </h1>
-                      </div>
-                    </div>
-
-                    <div className="sentok">
-                      {(selOption || SelCustId) && (
-                        <div className="sentLink" onClick={onFinalSubmit}>
-                          Sent Payment Link
-                          <img
-                            src={WpIcon}
-                            alt="Your Alt Text"
-                            style={{ width: '30px', height: '30px' }}
-                          />
-                          {/* <ArrowRightOutlined /> */}
-                        </div>
+                            <div className="Table4-rate">
+                              <BiRightArrowAlt />
+                            </div>
+                          </div>
+                        )
+                      ) : (
+                        <div className="billing-in-style-Order4">ORDER</div>
                       )}
+                    </button>
+                  </TooltipWrapper>
+                </div>
+                <DefaultModal
+                  open={UpiOpen}
+                  title="UPI PAYMENT"
+                  width={500}
+                  handleCancel={() => {
+                    Upimodel('Cancel');
+                  }}
+                  footer={false}
+                  children={
+                    <div style={{ overflow: 'scroll' }}>
+                      {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
 
                       <div
                         style={{
                           display: 'flex',
-                          flexDirection: 'row-reverse',
-                          width: '100px',
+                          flexDirection: 'column',
+                          justifyContent: 'space-evenly',
+                          alignItems: 'center',
                         }}
                       >
-                        <Buttons
-                          buttonText="OK"
-                          color="901D77"
-                          icon={<ArrowRightOutlined />}
-                          handleSubmit={() => {
-                            Upimodel('Submit');
+                        <div>
+                          <QrinScreen
+                            Amount={
+                              OrderType === 'Failed'
+                                ? FailedTotalAmt
+                                : Math.round(TotalAmount)
+                            }
+                            UpiId={UpiId}
+                          />
+                        </div>
+
+                        <div>
+                          <h1>
+                            {' '}
+                            RS :
+                            {OrderType === 'Failed'
+                              ? FailedTotalAmt
+                              : Math.round(TotalAmount)}{' '}
+                          </h1>
+                        </div>
+                      </div>
+
+                      <div className="sentok">
+                        {(selOption || SelCustId) && (
+                          <div className="sentLink" onClick={onFinalSubmit}>
+                            Sent Payment Link
+                            <img
+                              src={WpIcon}
+                              alt="Your Alt Text"
+                              style={{ width: '30px', height: '30px' }}
+                            />
+                            {/* <ArrowRightOutlined /> */}
+                          </div>
+                        )}
+
+                        <div
+                          style={{
+                            display: 'flex',
+                            flexDirection: 'row-reverse',
+                            width: '100px',
                           }}
-                        />
+                        >
+                          <Buttons
+                            buttonText="OK"
+                            color="901D77"
+                            icon={<ArrowRightOutlined />}
+                            handleSubmit={() => {
+                              Upimodel('Submit');
+                            }}
+                          />
+                        </div>
                       </div>
                     </div>
+                  }
+                />
+                {PrintOrderDetails?.length > 0 &&
+                  PrintOrderDetails?.[0]?.OrderDetails?.map(
+                    (orderDetail, index) => (
+                      <div style={{ display: 'none' }}>
+                        <PaymentPdfBooking
+                          index={index}
+                          table2Data={orderDetail}
+                          singleData2={orderDetail?.productDetails}
+                          orderId={
+                            orderDetail?.OrderId &&
+                            extractLastNumberOrderId(
+                              orderDetail?.OrderId,
+                              orderDetail?.FYStatus
+                            )
+                          }
+                          CreatedDate={orderDetail?.CreatedDate}
+                          PaymentStatus={
+                            PrintOrderDetails?.[0]?.PaymentOrderDtl
+                          }
+                          Preference={SettingDataSelector}
+                          printDatas={printDatas}
+                        />
+                      </div>
+                    )
+                  )}
+                {PrintOrderDetails?.length > 0 &&
+                  (TokenOnly?.SettingValue === 'Y' ||
+                    IndividualToken?.SettingValue === 'Y') &&
+                  PrintOrderDetails?.[0]?.OrderDetails?.map(
+                    (orderDetail, index) => (
+                      <div style={{ display: 'none' }}>
+                        <TokensinglePrint
+                          index={index}
+                          table2Data={orderDetail}
+                          singleData2={orderDetail?.productDetails}
+                          orderId={
+                            orderDetail?.OrderId &&
+                            extractLastNumberOrderId(
+                              orderDetail?.OrderId,
+                              orderDetail?.FYStatus
+                            )
+                          }
+                          CreatedDate={orderDetail?.CreatedDate}
+                          PaymentStatus={
+                            PrintOrderDetails?.[0]?.PaymentOrderDtl
+                          }
+                        />
+                      </div>
+                    )
+                  )}
+                {CreditCustomer && (
+                  <div style={{ display: 'none' }}>
+                    <BsBillingCreditCustomer
+                      ModalCreditCustomer={CreditCustomer}
+                      handlemodalclose={() => {
+                        handleCreditCustomer('Cancel');
+                      }}
+                      handleOk={() => {
+                        handleCreditCustomer('Submit');
+                      }}
+                    />
                   </div>
-                }
-              />
-              {PrintOrderDetails?.length > 0 &&
-                PrintOrderDetails?.[0]?.OrderDetails?.map(
-                  (orderDetail, index) => (
-                    <div style={{ display: 'none' }}>
-                      <PaymentPdfBooking
-                        index={index}
-                        table2Data={orderDetail}
-                        singleData2={orderDetail?.productDetails}
-                        orderId={
-                          orderDetail?.OrderId &&
-                          extractLastNumberOrderId(
-                            orderDetail?.OrderId,
-                            orderDetail?.FYStatus
-                          )
-                        }
-                        CreatedDate={orderDetail?.CreatedDate}
-                        PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                        Preference={SettingDataSelector}
-                        printDatas={printDatas}
-                      />
-                    </div>
-                  )
                 )}
-              {PrintOrderDetails?.length > 0 &&
-                (TokenOnly?.SettingValue === 'Y' ||
-                  IndividualToken?.SettingValue === 'Y') &&
-                PrintOrderDetails?.[0]?.OrderDetails?.map(
-                  (orderDetail, index) => (
-                    <div style={{ display: 'none' }}>
-                      <TokensinglePrint
-                        index={index}
-                        table2Data={orderDetail}
-                        singleData2={orderDetail?.productDetails}
-                        orderId={
-                          orderDetail?.OrderId &&
-                          extractLastNumberOrderId(
-                            orderDetail?.OrderId,
-                            orderDetail?.FYStatus
-                          )
-                        }
-                        CreatedDate={orderDetail?.CreatedDate}
-                        PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                      />
-                    </div>
-                  )
-                )}
-              {CreditCustomer && (
-                <div style={{ display: 'none' }}>
-                  <BsBillingCreditCustomer
-                    ModalCreditCustomer={CreditCustomer}
-                    handlemodalclose={() => {
-                      handleCreditCustomer('Cancel');
-                    }}
-                    handleOk={() => {
-                      handleCreditCustomer('Submit');
-                    }}
-                  />
-                </div>
-              )}
+              </div>
             </div>
           </div>
         </div>
-      </div>
 
-      <DefaultModal
-        open={unpaidopen}
-        title="UNPAID BILL'S"
-        width={1000}
-        handleCancel={() => {
-          setUnpaidOpen(false);
-        }}
-        footer={false}
-        children={
-          <div style={{ height: '400px', overflow: 'scroll' }}>
-            <Tables
-              columns={columns}
-              data={TableData}
-              dataSource={TableData}
-              // pagination={handlePageChange}
-              // onChange={handleChange}
-            />
-          </div>
+        <DefaultModal
+          open={unpaidopen}
+          title="UNPAID BILL'S"
+          width={1000}
+          handleCancel={() => {
+            setUnpaidOpen(false);
+          }}
+          footer={false}
+          children={
+            <div style={{ height: '400px', overflow: 'scroll' }}>
+              <Tables
+                columns={columns}
+                data={TableData}
+                dataSource={TableData}
+                // pagination={handlePageChange}
+                // onChange={handleChange}
+              />
+            </div>
+          }
+        />
+        {UnpaidConfirmation && (
+          <Modal
+            open={UnpaidConfirmation}
+            width={500}
+            children={
+              <>
+                <div>
+                  You have already selected a table. If you click 'OK,' the
+                  table selection will be removed, and the unpaid flow will
+                  continue. If you click 'Cancel,' the dine-in flow will proceed
+                  as selected.
+                </div>
+              </>
+            }
+            onOk={UnpaidOk}
+            onCancel={Unpaidclose}
+          />
+        )}
+        {Splitpayment && (
+          <SplitPayment
+            SplitPaymentModal={Splitpayment}
+            handlesplitpaymentclose={handlesplitpaymentclose}
+            TotalNetAmount={
+              OrderType === 'Failed'
+                ? FailedTotalAmt
+                : Math.round(
+                    OrderCardDetail?.reduce(
+                      (acc, data) => data?.TotalAmt + acc,
+                      0
+                    ) -
+                      ((OverAllSales > 0 ? OverAllSales : 0) +
+                        (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                        (Discount > 0 ? Discount : 0))
+                  )
+            }
+            failedOrderData={failedOrderData}
+          />
+        )}
+        <DefaultModal
+          className={'paymentoptionsModal'}
+          open={GlobalSalesPaymentoptions}
+          width={500}
+          height={1000}
+          handleCancel={() => {
+            dispatch(changeSalesPaymentoption(false));
+          }}
+          footer={false}
+          children={
+            <div
+              className="paymentoptionsModalContent"
+              style={{ overflow: 'scroll' }}
+            >
+              <Paymentoption onSuccess={getPaymentOptionFeature} />
+            </div>
+          }
+        />
+
+        {
+          OtherServicesPrintDetails?.length > 0 && (
+            // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+            <div style={{ display: 'none' }}>
+              <OtherServicePrintStyle1
+                // index={index}
+                table2Data={OtherServicesPrintDetails}
+                singleData2={OtherServicesPrintDetails?.productDetails}
+                orderId={
+                  OtherServicesPrintDetails?.OrderId &&
+                  extractLastNumberOrderId(
+                    OtherServicesPrintDetails?.OrderId,
+                    OtherServicesPrintDetails?.FYStatus
+                  )
+                }
+                CreatedDate={OtherServicesPrintDetails?.CreatedDate}
+                PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
+                Preference={SettingDataSelector}
+                printDatas={printDatas}
+              />
+            </div>
+          )
+          // ))
         }
-      />
-      {UnpaidConfirmation && (
-        <Modal
-          open={UnpaidConfirmation}
+
+        <DefaultModal
+          className={'paymentoptionsModal'}
+          open={OtherServicesModal}
+          title="Vehicle No"
+          handleCancel={() => {
+            setOtherServicesModal(false);
+          }}
+          // handleSubmit={Handlevehiclenumbers}
+          footer={false}
+          children={
+            <div
+              className="paymentoptionsModalContent"
+              style={{ overflow: 'scroll' }}
+            >
+              {OrderCardDetail.map((item, i) => {
+                const isGroup = item.ServiceType === 'G';
+                const groupKey = item.id; // 🔁 using `id` for groups now
+                const uniqueKey = `${item.ServiceId}__${item.__index}`;
+
+                // For G-type: render input only once for the group
+                if (
+                  isGroup &&
+                  i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
+                ) {
+                  return null;
+                }
+
+                const qty = isGroup
+                  ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
+                      (sum, o) => sum + (o.OrderQty || 1),
+                      0
+                    )
+                  : item.OrderQty || 1;
+
+                return (
+                  <div
+                    key={isGroup ? groupKey : uniqueKey}
+                    style={{ marginBottom: 20 }}
+                  >
+                    <h4>{item.ServiceName}</h4>
+
+                    {Array.from({ length: qty }).map((_, index) => {
+                      const inputKey = isGroup
+                        ? item.id
+                        : `${item.ServiceId}__${item.__index}`;
+                      const value = vehicleInputs[inputKey]?.[index] || '';
+                      const error = errors[inputKey]?.[index] || '';
+
+                      return (
+                        <div
+                          key={`${inputKey}-${index}`}
+                          style={{ marginBottom: 10 }}
+                        >
+                          <input
+                            placeholder={`Vehicle No ${index + 1}`}
+                            value={value}
+                            onChange={(e) =>
+                              handleInputChange(
+                                isGroup ? item.id : item.ServiceId,
+                                index,
+                                e.target.value,
+                                item.ServiceType,
+                                item
+                              )
+                            }
+                            onKeyPress={(e) => {
+                              if (!/[A-Za-z0-9]/.test(e.key)) {
+                                e.preventDefault();
+                              }
+                            }}
+                            style={{
+                              width: '100%',
+                              padding: 8,
+                              borderRadius: 4,
+                              border: error
+                                ? '1px solid red'
+                                : '1px solid #ccc',
+                            }}
+                          />
+                          {error && (
+                            <span style={{ color: 'red', fontSize: 12 }}>
+                              {error}
+                            </span>
+                          )}
+                        </div>
+                      );
+                    })}
+                  </div>
+                );
+              })}
+              <div style={{ textAlign: 'right', marginTop: 16 }}>
+                <button
+                  type="button"
+                  onClick={Handlevehiclenumbers}
+                  disabled={hasVehicleInputErrors()}
+                  style={{
+                    padding: '8px 24px',
+                    fontFamily: 'Gilroy',
+                    background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
+                    color: '#fff',
+                    border: 'none',
+                    borderRadius: 4,
+                    cursor: hasVehicleInputErrors() ? 'not-allowed' : 'pointer',
+                  }}
+                >
+                  Submit
+                </button>
+              </div>
+            </div>
+          }
+        />
+        <DefaultModal
+          open={businessUPI}
+          handleCancel={() => setShowCancelConfirm(true)}
+          footer={false}
           width={500}
           children={
             <>
-              <div>
-                You have already selected a table. If you click 'OK,' the table
-                selection will be removed, and the unpaid flow will continue. If
-                you click 'Cancel,' the dine-in flow will proceed as selected.
-              </div>
-            </>
-          }
-          onOk={UnpaidOk}
-          onCancel={Unpaidclose}
-        />
-      )}
-      {Splitpayment && (
-        <SplitPayment
-          SplitPaymentModal={Splitpayment}
-          handlesplitpaymentclose={handlesplitpaymentclose}
-          TotalNetAmount={
-            OrderType === 'Failed' ? FailedTotalAmt : Math.round(OrderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
-              ((OverAllSales > 0 ? OverAllSales : 0) +
-                (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                (Discount > 0 ? Discount : 0)))
-          }
-          failedOrderData={failedOrderData}
-        />
-      )}
-      <DefaultModal
-        className={'paymentoptionsModal'}
-        open={GlobalSalesPaymentoptions}
-        width={500}
-        height={1000}
-        handleCancel={() => {
-          dispatch(changeSalesPaymentoption(false));
-        }}
-        footer={false}
-        children={
-          <div
-            className="paymentoptionsModalContent"
-            style={{ overflow: 'scroll' }}
-          >
-            <Paymentoption onSuccess={getPaymentOptionFeature} />
-          </div>
-        }
-      />
-
-      {
-        OtherServicesPrintDetails?.length > 0 && (
-          // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-          <div style={{ display: 'none' }}>
-            <OtherServicePrintStyle1
-              // index={index}
-              table2Data={OtherServicesPrintDetails}
-              singleData2={OtherServicesPrintDetails?.productDetails}
-              orderId={
-                OtherServicesPrintDetails?.OrderId &&
-                extractLastNumberOrderId(
-                  OtherServicesPrintDetails?.OrderId,
-                  OtherServicesPrintDetails?.FYStatus
-                )
-              }
-              CreatedDate={OtherServicesPrintDetails?.CreatedDate}
-              PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
-              Preference={SettingDataSelector}
-              printDatas={printDatas}
-            />
-          </div>
-        )
-        // ))
-      }
-
-      <DefaultModal
-        className={'paymentoptionsModal'}
-        open={OtherServicesModal}
-        title="Vehicle No"
-        handleCancel={() => {
-          setOtherServicesModal(false);
-        }}
-        // handleSubmit={Handlevehiclenumbers}
-        footer={false}
-        children={
-          <div
-            className="paymentoptionsModalContent"
-            style={{ overflow: 'scroll' }}
-          >
-            {OrderCardDetail.map((item, i) => {
-              const isGroup = item.ServiceType === 'G';
-              const groupKey = item.id; // 🔁 using `id` for groups now
-              const uniqueKey = `${item.ServiceId}__${item.__index}`;
-
-              // For G-type: render input only once for the group
-              if (
-                isGroup &&
-                i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
-              ) {
-                return null;
-              }
-
-              const qty = isGroup
-                ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
-                    (sum, o) => sum + (o.OrderQty || 1),
-                    0
-                  )
-                : item.OrderQty || 1;
-
-              return (
-                <div
-                  key={isGroup ? groupKey : uniqueKey}
-                  style={{ marginBottom: 20 }}
-                >
-                  <h4>{item.ServiceName}</h4>
-
-                  {Array.from({ length: qty }).map((_, index) => {
-                    const inputKey = isGroup
-                      ? item.id
-                      : `${item.ServiceId}__${item.__index}`;
-                    const value = vehicleInputs[inputKey]?.[index] || '';
-                    const error = errors[inputKey]?.[index] || '';
-
-                    return (
-                      <div
-                        key={`${inputKey}-${index}`}
-                        style={{ marginBottom: 10 }}
-                      >
-                        <input
-                          placeholder={`Vehicle No ${index + 1}`}
-                          value={value}
-                          onChange={(e) =>
-                            handleInputChange(
-                              isGroup ? item.id : item.ServiceId,
-                              index,
-                              e.target.value,
-                              item.ServiceType,
-                              item
-                            )
-                          }
-                          onKeyPress={(e) => {
-                            if (!/[A-Za-z0-9]/.test(e.key)) {
-                              e.preventDefault();
-                            }
-                          }}
-                          style={{
-                            width: '100%',
-                            padding: 8,
-                            borderRadius: 4,
-                            border: error ? '1px solid red' : '1px solid #ccc',
-                          }}
-                        />
-                        {error && (
-                          <span style={{ color: 'red', fontSize: 12 }}>
-                            {error}
-                          </span>
-                        )}
-                      </div>
-                    );
-                  })}
-                </div>
-              );
-            })}
-            <div style={{ textAlign: 'right', marginTop: 16 }}>
-              <button
-                type="button"
-                onClick={Handlevehiclenumbers}
-                disabled={hasVehicleInputErrors()}
-                style={{
-                  padding: '8px 24px',
-                  fontFamily: 'Gilroy',
-                  background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
-                  color: '#fff',
-                  border: 'none',
-                  borderRadius: 4,
-                  cursor: hasVehicleInputErrors() ? 'not-allowed' : 'pointer',
-                }}
-              >
-                Submit
-              </button>
-            </div>
-          </div>
-        }
-      />
-      <DefaultModal
-        open={businessUPI}
-        handleCancel={() => setShowCancelConfirm(true)}
-        footer={false}
-        width={500}
-        children={
-          <>
-            <PaymentGatewayEmbedded
-              orderId={businessUPIOrderId}
-              setBusinessUPIOrderId={setBusinessUPIOrderId}
-              businessUPILink={businessUPILink}
-              setBusinessUPI={setBusinessUPI}
-              setPaymentSuccess={setPaymentSuccess}
-              paymentSucess={paymentSucess}
-              ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
-              CustomerDisplay={CustomerDisplay}
-            />
-          </>
-        }
-      />
-      {showCancelConfirm && (
-        <Modal
-          open={showCancelConfirm}
-          title="Cancel Payment"
-          onOk={() => {
-            setBusinessUPI(false);
-            setShowCancelConfirm(false);
-            ClearAllGlobalStateDatas();
-            CustomerDisplay();
-          }}
-          onCancel={() => setShowCancelConfirm(false)}
-          okText="Yes"
-          cancelText="No"
-        >
-          Do you want to cancel the payment?
-        </Modal>
-      )}
-      {customerPreviesOrders && (
-        <DefaultModal
-          open={customerPreviesOrders}
-          handleCancel={() => setCustomerPreviesOrders(false)}
-          footer={false}
-          width={700}
-          className={'ModalPaymentGatewayEmbedded'}
-          children={
-            <>
-              <CustomerOrders
-                CustomerDetails={selOption}
-                close={() => setCustomerPreviesOrders(false)}
+              <PaymentGatewayEmbedded
+                orderId={businessUPIOrderId}
+                setBusinessUPIOrderId={setBusinessUPIOrderId}
+                businessUPILink={businessUPILink}
+                setBusinessUPI={setBusinessUPI}
+                setPaymentSuccess={setPaymentSuccess}
+                paymentSucess={paymentSucess}
+                ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
+                CustomerDisplay={CustomerDisplay}
               />
             </>
           }
         />
-      )}
-    </div>
+        {showCancelConfirm && (
+          <Modal
+            open={showCancelConfirm}
+            title="Cancel Payment"
+            onOk={() => {
+              setBusinessUPI(false);
+              setShowCancelConfirm(false);
+              ClearAllGlobalStateDatas();
+              CustomerDisplay();
+            }}
+            onCancel={() => setShowCancelConfirm(false)}
+            okText="Yes"
+            cancelText="No"
+          >
+            Do you want to cancel the payment?
+          </Modal>
+        )}
+        {customerPreviesOrders && (
+          <DefaultModal
+            open={customerPreviesOrders}
+            handleCancel={() => setCustomerPreviesOrders(false)}
+            footer={false}
+            width={700}
+            className={'ModalPaymentGatewayEmbedded'}
+            children={
+              <>
+                <CustomerOrders
+                  CustomerDetails={selOption}
+                  close={() => setCustomerPreviesOrders(false)}
+                />
+              </>
+            }
+          />
+        )}
+      </div>
+    </Suspense>
   );
 };
 export default BSBilling4Payment;
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBillingTable4.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBillingTable4.jsx
index 5e70f81..d393c8a 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBillingTable4.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBillingTable4.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { lazy, useEffect, useState, Suspense } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { isMobile } from 'react-device-detect';
 import { AiFillDelete, AiOutlineClose } from 'react-icons/ai';
@@ -55,7 +55,9 @@ import {
   ChangeTotalAmount,
   globalExtraTotalAmount,
 } from '../../../../../Features/ExteraCharges/ExtraCharges.js'; //Shifayath Date:27/12/2023
-import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
+const BSBillingEditQuantity = lazy(
+  () => import('../BSBillingEditQuantity/BSBillingEditQuantity')
+);
 import dineInIcon from '../../../../../Images/Dine In.svg';
 import TakeAwayIcon from '../../../../../Images/Take away.svg';
 import WebFont from 'webfontloader';
@@ -66,8 +68,11 @@ import {
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption.js';
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
 import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
-import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
+const BSEditTotalAmt = lazy(
+  () => import('../BSEditTotalAmount/BSEditTotalAmt.jsx')
+);
+
+const BSImeiDetails = lazy(() => import('../BSImeiDetails/BSImeiDetails.jsx'));
 import {
   ChangeFullFreeProductList,
   changeFullOfferAppliedProducts,
@@ -78,8 +83,9 @@ import {
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin.js';
 import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
 import { useUtilsComponent } from '../../../../../Services/utils.js';
-import CustomerPriceHistory from '../../UtillComponents/CustomerPriceHistory.jsx';
-
+const CustomerPriceHistory = lazy(
+  () => import('../../UtillComponents/CustomerPriceHistory.jsx')
+);
 const BSBillingTable4 = () => {
   const { removeExtraCharge } = useUtilsComponent();
   const dispatch = useDispatch();
@@ -117,7 +123,6 @@ const BSBillingTable4 = () => {
   const UnpaidData = useSelector(GlobalUnpaidData);
   const tableData = useSelector(GlobalOrderCardDetails);
   console.log(tableData, 'tableDatatableData');
-  const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const ReportholdData = useSelector(GlobalReorderHoldDetails);
   const PreviousOrderLength = useSelector(GlobalPreviousOrderLength);
   const HoldOrderDtl = useSelector(GlobalHoldOrderDtl);
@@ -146,7 +151,8 @@ const BSBillingTable4 = () => {
   const GetCustId = useSelector(GlobalCustId);
   const selectedCustomer = useSelector(GlobalSelOption);
 
-  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] = useState(false);
+  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] =
+    useState(false);
   const [customerProduct, setCustomerProduct] = useState(null);
   const [OpenEditTotalAmt, setOpenEditTotalAmt] = useState(false);
   const [OpenImeiDetail, setOpenImeiDetail] = useState(false);
@@ -183,16 +189,16 @@ const BSBillingTable4 = () => {
     OrderType === 'Hold'
       ? tableData?.filter((a, b) => a.BookingTypeName === 'TakeAway')
       : tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
-      );
+          (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
+        );
   const OldtableDataDinein = tableData?.filter(
     (a, b) => a.BookingTypeName === 'Dine In' && a?.SalesId
   );
   const OldtableDataTakeAway =
     OrderType != 'Hold'
       ? tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
-      )
+          (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
+        )
       : [];
 
   useEffect(() => {
@@ -312,7 +318,6 @@ const BSBillingTable4 = () => {
         event.preventDefault();
         handleShortcut('weightAmount');
       }
-
     };
 
     window.addEventListener('keydown', handleKeyDown);
@@ -329,142 +334,6 @@ const BSBillingTable4 = () => {
   const handleImeiDetailClose = () => {
     setOpenImeiDetail(false);
   };
-  // const removeFromCart = async (item) => {
-  //   setPreviousdataLength(tableData?.length);
-  //   if (item?.BookingTypeName !== 'Dine In' && OrderType !== 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName !== 'Dine In' && OrderType === 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName === 'Dine In') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     ); // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(ChangeSelectedCustDisable(false));
-  //       await dispatch(changeSelectedOption(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   }
-  // };
 
   const calculateAmounts = (
     OrderQty,
@@ -1133,9 +1002,9 @@ const BSBillingTable4 = () => {
             )?.map((item, idx) =>
               idx === 0
                 ? {
-                  ...item,
-                  FreeQty,
-                }
+                    ...item,
+                    FreeQty,
+                  }
                 : item
             ),
           };
@@ -2083,7 +1952,6 @@ const BSBillingTable4 = () => {
         }
       }
     }
-
   };
   const UnblockSlots = async (newCartItem) => {
     let BlockPostdata = {
@@ -2145,7 +2013,7 @@ const BSBillingTable4 = () => {
   const handleCustomerProductPriceHistory = (item) => {
     setCustomerPriceHistoryOpen(true);
     setCustomerProduct(item?.ProdId);
-  }
+  };
 
   const getstockbadge = async () => {
     let data = {
@@ -2154,9 +2022,9 @@ const BSBillingTable4 = () => {
       AppId: AppId,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
     await dispatch(getSelectedFavItems(data)).unwrap();
@@ -2168,9 +2036,9 @@ const BSBillingTable4 = () => {
       ProdSubCat: ProdSubCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -2181,9 +2049,9 @@ const BSBillingTable4 = () => {
       prodCat: prodCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -2306,184 +2174,200 @@ const BSBillingTable4 = () => {
   };
 
   return (
-    <div
-      className={
-        isMobile ? 'BSBilling4-tablediv-mobile' : 'BSBilling4-tablediv'
-      }
-    >
-      <table className="BSBill-Table4">
-        <thead>
-          <tr
-            className="BSBill-Table4-throw"
-            style={{
-              backgroundColor: SelectedBillColor?.['BackgroundColor'],
-              color: SelectedBillColor?.['FontColor'],
-              fontFamily: SelectedFont,
-            }}
-          >
-            {tableOptions?.map((item) => (
-              <>
-                {item.OptionName == 'Sl.No' && BookingTypeBoth && (
-                  <th
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '13px',
-                      width: '15px',
-                      padding: '1px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Serial Number">{''}</Tooltip>
-                    ) : (
-                      <div>{''}</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Sl.No' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      width: '10px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Serial Number">Sl.No</Tooltip>
-                    ) : (
-                      <div>Sl.No</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Item' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Item Name">Item</Tooltip>
-                    ) : (
-                      <div> Item </div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'MRP' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="MRP">MRP</Tooltip>
-                    ) : (
-                      <div>MRP</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Discount' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Discount">₹/%</Tooltip>
-                    ) : (
-                      <div>₹/% </div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Quantity' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      width: '20px',
-                    }}
-                    onClick={() => {
-                      if (tableData?.length > 0) {
-                        OpenEditTotalAmount();
-                      }
-                    }}
-                  // onClick={tableData?.length>0? OpenEditTotalAmount :""}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Quantity">Qty</Tooltip>
-                    ) : (
-                      <div>Qty</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Rate' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Rate">Rt</Tooltip>
-                    ) : (
-                      <div> Rt </div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Amount' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Amount">Amt</Tooltip>
-                    ) : (
-                      <div>Amt</div>
-                    )}
-                  </th>
-                )}
+    <Suspense fallback={<div>Loading...</div>}>
+      <div
+        className={
+          isMobile ? 'BSBilling4-tablediv-mobile' : 'BSBilling4-tablediv'
+        }
+      >
+        <table className="BSBill-Table4">
+          <thead>
+            <tr
+              className="BSBill-Table4-throw"
+              style={{
+                backgroundColor: SelectedBillColor?.['BackgroundColor'],
+                color: SelectedBillColor?.['FontColor'],
+                fontFamily: SelectedFont,
+              }}
+            >
+              {tableOptions?.map((item) => (
+                <>
+                  {item.OptionName == 'Sl.No' && BookingTypeBoth && (
+                    <th
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '13px',
+                        width: '15px',
+                        padding: '1px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Serial Number">{''}</Tooltip>
+                      ) : (
+                        <div>{''}</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Sl.No' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        width: '10px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Serial Number">Sl.No</Tooltip>
+                      ) : (
+                        <div>Sl.No</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Item' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Item Name">Item</Tooltip>
+                      ) : (
+                        <div> Item </div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'MRP' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="MRP">MRP</Tooltip>
+                      ) : (
+                        <div>MRP</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Discount' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Discount">₹/%</Tooltip>
+                      ) : (
+                        <div>₹/% </div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Quantity' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        width: '20px',
+                      }}
+                      onClick={() => {
+                        if (tableData?.length > 0) {
+                          OpenEditTotalAmount();
+                        }
+                      }}
+                      // onClick={tableData?.length>0? OpenEditTotalAmount :""}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Quantity">Qty</Tooltip>
+                      ) : (
+                        <div>Qty</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Rate' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Rate">Rt</Tooltip>
+                      ) : (
+                        <div> Rt </div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Amount' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Amount">Amt</Tooltip>
+                      ) : (
+                        <div>Amt</div>
+                      )}
+                    </th>
+                  )}
 
-                {item.OptionName == 'Delete' && (
-                  <th
-                    className="BSBill-table4-itemtext-th"
-                    style={{
-                      width: '10px',
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                    }}
-                  >
-                    {tableData?.length > 0 ? (
-                      <Popconfirm
-                        title="Delete the items"
-                        description="Are you sure you want to clear these items?"
-                        okText="Yes"
-                        placement="leftTop"
-                        cancelText="No"
-                        onConfirm={() => {
-                          Clearall();
-                        }}
-                      >
+                  {item.OptionName == 'Delete' && (
+                    <th
+                      className="BSBill-table4-itemtext-th"
+                      style={{
+                        width: '10px',
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                      }}
+                    >
+                      {tableData?.length > 0 ? (
+                        <Popconfirm
+                          title="Delete the items"
+                          description="Are you sure you want to clear these items?"
+                          okText="Yes"
+                          placement="leftTop"
+                          cancelText="No"
+                          onConfirm={() => {
+                            Clearall();
+                          }}
+                        >
+                          <div className="del-all-btn">
+                            {' '}
+                            {!isMobile ? (
+                              <Tooltip title="Delete All" placement="left">
+                                {' '}
+                                <AiFillDelete />{' '}
+                              </Tooltip>
+                            ) : (
+                              <div>
+                                {' '}
+                                <AiFillDelete />{' '}
+                              </div>
+                            )}{' '}
+                          </div>
+                        </Popconfirm>
+                      ) : (
                         <div className="del-all-btn">
                           {' '}
                           {!isMobile ? (
-                            <Tooltip title="Delete All" placement="left">
-                              {' '}
-                              <AiFillDelete />{' '}
+                            <Tooltip title="Delete" placement="left">
+                              <AiFillDelete />
                             </Tooltip>
                           ) : (
                             <div>
@@ -2492,449 +2376,439 @@ const BSBillingTable4 = () => {
                             </div>
                           )}{' '}
                         </div>
-                      </Popconfirm>
-                    ) : (
-                      <div className="del-all-btn">
-                        {' '}
-                        {!isMobile ? (
-                          <Tooltip title="Delete" placement="left">
-                            <AiFillDelete />
-                          </Tooltip>
-                        ) : (
-                          <div>
-                            {' '}
-                            <AiFillDelete />{' '}
-                          </div>
-                        )}{' '}
-                      </div>
-                    )}
-                  </th>
-                )}
-              </>
-            ))}
-          </tr>
-        </thead>
+                      )}
+                    </th>
+                  )}
+                </>
+              ))}
+            </tr>
+          </thead>
 
-        {OldtableDataTakeAway?.length > 0 && (
-          <tbody className="Table4-tbody">
-            {OldtableDataTakeAway?.map((item, index) => (
-              <tr
-                key={index}
-                className={`${item?.SalesId && OrderType !== 'Hold'
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
+          {OldtableDataTakeAway?.length > 0 && (
+            <tbody className="Table4-tbody">
+              {OldtableDataTakeAway?.map((item, index) => (
+                <tr
+                  key={index}
+                  className={`${
+                    item?.SalesId && OrderType !== 'Hold'
+                      ? 'BSBill-Table3-content-Disabled'
+                      : 'BSBill-Table3-content'
                   } 
            
               `}
-                style={{
-                  fontFamily: SelectedFont ? SelectedFont : '',
-                  backgroundColor:
-                    BillOrderPre === 'Y'
-                      ? item?.SalesId && OrderType !== 'Hold'
+                  style={{
+                    fontFamily: SelectedFont ? SelectedFont : '',
+                    backgroundColor:
+                      BillOrderPre === 'Y'
+                        ? item?.SalesId && OrderType !== 'Hold'
+                          ? 'rgb(243, 248, 213)'
+                          : BookingType === 'Dine In' &&
+                              triggerAnimation &&
+                              index === 0 &&
+                              !item?.SalesId &&
+                              tableDataTakeAway?.length >= PreviousdataLength
+                            ? 'wheat'
+                            : BookingType !== 'Dine In' &&
+                                triggerAnimation &&
+                                index === 0 &&
+                                tableDataTakeAway?.length >=
+                                  PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : 'inherit'
+                        : 'none',
+                    background:
+                      item?.SalesId && OrderType !== 'Hold'
                         ? 'rgb(243, 248, 213)'
-                        : BookingType === 'Dine In' &&
-                          triggerAnimation &&
+                        : GlobEstBooking === 'ParEst' &&
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
+                          ? '#b2d1f7'
+                          : index % 2 === 0
+                            ? 'white'
+                            : SelectedBillColor?.['OverallBackgroundColor']
+                              ? SelectedBillColor?.['OverallBackgroundColor']
+                              : '#d6d6d6',
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
                           index === 0 &&
                           !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
-                            triggerAnimation &&
-                            index === 0 &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                          tableDataTakeAway?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#CFB59D' }}
+                          >
+                            <img width="30px" alt="" src={TakeAwayIcon} />
+                          </td>
+                        )}
+                      {tableitem.OptionName == 'Sl.No' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '0px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {index + 1}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Item' && (
+                        <td
+                          className="Table4-items for-combo"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() =>
+                            item.FullProductIdentifierDtls?.length > 0 ||
+                            item.ProductIdentifierDtls?.length > 0
+                              ? handleImeiDetails(item)
+                              : editField && handleEditQuantity(item)
+                          }
+                        >
+                          {item.ProdName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl4-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                (
+                                {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                  'variant'
+                                ) && <span>{item?.ProdVariantName} </span>}
+                                {AvailableDate ? (
+                                  <>
+                                    {' '}
+                                    (
+                                    {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
+                                    ) &nbsp;
+                                    {item?.SinglePc == 'Y' && 'Single'}
+                                  </>
+                                ) : (
+                                  <>
+                                    {item?.Size}
+                                    {item?.SinglePc == 'Y'
+                                      ? 'Single'
+                                      : item?.UomName}
+                                  </>
+                                )}
+                                )
+                              </p>
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
+                              className="Tbl4-Variant"
+                              style={{ fontFamily: 'Poppins' }}
+                            >
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
+                                </p>
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
+                            <div
+                              style={{
+                                fontSize: '10px',
+                                fontWeight: '500',
+                                whiteSpace: 'nowrap',
+                              }}
+                            >
+                              Extra Charges :{' '}
+                              {
+                                productBasedExtraCharges?.find(
+                                  (find) => find.ProdId === item.ProdId
+                                )?.TotalAmt
+                              }
+                            </div>
+                          )}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          style={{ width: '40px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
+                            ? item.Offer && item.Offer > 0
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="Table4-item-price"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {Number(
+                            item?.TotalAmt - (item?.Offer || 0) || 0
+                          ).toFixed(2)}
+                        </td>
+                      )}
+
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="Table4-editicon"
+                          style={{ cursor: 'pointer' }}
+                        >
+                          <AiOutlineClose
+                            onClick={() => removeFromCart(item)}
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
+
+              {EditQuantity && OldtableDataTakeAway?.length > 0 && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+          {OldtableDataDinein?.length > 0 && (
+            <tbody className="Table4-tbody">
+              {OldtableDataDinein?.map((item, index) => (
+                <tr
+                  key={OldtableDataTakeAway?.length + index}
+                  className={`${
+                    item?.SalesId
+                      ? 'BSBill-Table3-content-Disabled'
+                      : 'BSBill-Table3-content'
+                  } 
+           
+              `}
+                  style={{
+                    fontFamily: SelectedFont ? SelectedFont : '',
+                    backgroundColor:
+                      BillOrderPre === 'Y'
+                        ? item?.SalesId
+                          ? 'rgb(243, 248, 213)'
+                          : BookingType === 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataTakeAway?.length + index === 0 &&
+                              !item?.SalesId &&
+                              tableDataDinein?.length >= PreviousdataLength
                             ? 'wheat'
-                            : 'inherit'
-                      : 'none',
-                  background:
-                    item?.SalesId && OrderType !== 'Hold'
+                            : BookingType !== 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataTakeAway?.length + index === 0 &&
+                                tableDataDinein?.length >= PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : 'inherit'
+                        : 'none',
+                    background: item?.SalesId
                       ? 'rgb(243, 248, 213)'
                       : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
+                          GlobProdwisedata?.includes(
+                            item?.InwardDtlId + ' ' + item?.BookingTypeName
+                          )
                         ? '#b2d1f7'
-                        : index % 2 === 0
+                        : (OldtableDataTakeAway?.length + index) % 2 === 0
                           ? 'white'
                           : SelectedBillColor?.['OverallBackgroundColor']
                             ? SelectedBillColor?.['OverallBackgroundColor']
                             : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        index === 0 &&
-                        !item?.SalesId &&
-                        tableDataTakeAway?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
-                        <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#CFB59D' }}
-                        >
-                          <img width="30px" alt="" src={TakeAwayIcon} />
-                        </td>
-                      )}
-                    {tableitem.OptionName == 'Sl.No' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '0px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {index + 1}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Item' && (
-                      <td
-                        className="Table4-items for-combo"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() =>
-                          item.FullProductIdentifierDtls?.length > 0 ||
-                            item.ProductIdentifierDtls?.length > 0
-                            ? handleImeiDetails(item)
-                            : editField && handleEditQuantity(item)
-                        }
-                      >
-                        {item.ProdName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
-                              className="Tbl4-Variant"
-                              style={{ fontFamily: 'Poppins' }}
-                            >
-                              (
-                              {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                'variant'
-                              ) && <span>{item?.ProdVariantName} </span>}
-                              {AvailableDate ? (
-                                <>
-                                  {' '}
-                                  (
-                                  {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
-                                  ) &nbsp;
-                                  {item?.SinglePc == 'Y' && 'Single'}
-                                </>
-                              ) : (
-                                <>
-                                  {item?.Size}
-                                  {item?.SinglePc == 'Y'
-                                    ? 'Single'
-                                    : item?.UomName}
-                                </>
-                              )}
-                              )
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
-                                </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl4-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
-                              </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
-                            <div
-                              style={{
-                                fontSize: '10px',
-                                fontWeight: '500',
-                                whiteSpace: 'nowrap',
-                              }}
-                            >
-                              Extra Charges :{' '}
-                              {
-                                productBasedExtraCharges?.find(
-                                  (find) => find.ProdId === item.ProdId
-                                )?.TotalAmt
-                              }
-                            </div>
-                          )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        style={{ width: '40px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer && item.Offer > 0
-                            ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="Table4-item-price"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {Number(
-                          item?.TotalAmt - (item?.Offer || 0) || 0
-                        ).toFixed(2)}
-                      </td>
-                    )}
-
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="Table4-editicon"
-                        style={{ cursor: 'pointer' }}
-                      >
-                        <AiOutlineClose
-                          onClick={() => removeFromCart(item)}
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
-
-            {EditQuantity && OldtableDataTakeAway?.length > 0 && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
-        )}
-        {OldtableDataDinein?.length > 0 && (
-          <tbody className="Table4-tbody">
-            {OldtableDataDinein?.map((item, index) => (
-              <tr
-                key={OldtableDataTakeAway?.length + index}
-                className={`${item?.SalesId
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
-                  } 
-           
-              `}
-                style={{
-                  fontFamily: SelectedFont ? SelectedFont : '',
-                  backgroundColor:
-                    BillOrderPre === 'Y'
-                      ? item?.SalesId
-                        ? 'rgb(243, 248, 213)'
-                        : BookingType === 'Dine In' &&
-                          triggerAnimation &&
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
                           OldtableDataTakeAway?.length + index === 0 &&
                           !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
-                            triggerAnimation &&
-                            OldtableDataTakeAway?.length + index === 0 &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'wheat'
-                            : 'inherit'
-                      : 'none',
-                  background: item?.SalesId
-                    ? 'rgb(243, 248, 213)'
-                    : GlobEstBooking === 'ParEst' &&
-                      GlobProdwisedata?.includes(
-                        item?.InwardDtlId + ' ' + item?.BookingTypeName
-                      )
-                      ? '#b2d1f7'
-                      : (OldtableDataTakeAway?.length + index) % 2 === 0
-                        ? 'white'
-                        : SelectedBillColor?.['OverallBackgroundColor']
-                          ? SelectedBillColor?.['OverallBackgroundColor']
-                          : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        OldtableDataTakeAway?.length + index === 0 &&
-                        !item?.SalesId &&
-                        tableDataDinein?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
+                          tableDataDinein?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#A2C3CD' }}
+                          >
+                            <img width="30px" alt="" src={dineInIcon} />
+                          </td>
+                        )}
+                      {tableitem.OptionName == 'Sl.No' && (
                         <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#A2C3CD' }}
+                          className="Table-4_qty"
+                          style={{ width: '0px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
                         >
-                          <img width="30px" alt="" src={dineInIcon} />
+                          {OldtableDataTakeAway?.length + index + 1}
                         </td>
                       )}
-                    {tableitem.OptionName == 'Sl.No' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '0px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {OldtableDataTakeAway?.length + index + 1}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Item' && (
-                      <td
-                        className="Table4-items for-combo"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.ProdName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
+                      {tableitem.OptionName == 'Item' && (
+                        <td
+                          className="Table4-items for-combo"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.ProdName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl4-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                (
+                                {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                  'variant'
+                                ) && <span>{item?.ProdVariantName} </span>}
+                                {AvailableDate ? (
+                                  <>
+                                    {' '}
+                                    (
+                                    {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
+                                    ) &nbsp;
+                                    {item?.SinglePc == 'Y' && 'Single'}
+                                  </>
+                                ) : (
+                                  <>
+                                    {item?.Size}
+                                    {item?.SinglePc == 'Y'
+                                      ? 'Single'
+                                      : item?.UomName}
+                                  </>
+                                )}
+                                )
+                              </p>
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
                               className="Tbl4-Variant"
                               style={{ fontFamily: 'Poppins' }}
                             >
-                              (
-                              {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                'variant'
-                              ) && <span>{item?.ProdVariantName} </span>}
-                              {AvailableDate ? (
-                                <>
-                                  {' '}
-                                  (
-                                  {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
-                                  ) &nbsp;
-                                  {item?.SinglePc == 'Y' && 'Single'}
-                                </>
-                              ) : (
-                                <>
-                                  {item?.Size}
-                                  {item?.SinglePc == 'Y'
-                                    ? 'Single'
-                                    : item?.UomName}
-                                </>
-                              )}
-                              )
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
                                 </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl4-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
-                              </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
                             <div
                               style={{
                                 fontSize: '10px',
@@ -2950,309 +2824,316 @@ const BSBillingTable4 = () => {
                               }
                             </div>
                           )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        style={{ width: '40px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer && item.Offer > 0
-                            ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="Table4-item-price"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {Number(
-                          item?.TotalAmt - (item?.Offer || 0) || 0
-                        ).toFixed(2)}
-                      </td>
-                    )}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          style={{ width: '40px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
+                            ? item.Offer && item.Offer > 0
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="Table4-item-price"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {Number(
+                            item?.TotalAmt - (item?.Offer || 0) || 0
+                          ).toFixed(2)}
+                        </td>
+                      )}
 
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="Table4-editicon"
-                        style={{ cursor: 'pointer' }}
-                      >
-                        <AiOutlineClose
-                          onClick={() => removeFromCart(item)}
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="Table4-editicon"
+                          style={{ cursor: 'pointer' }}
+                        >
+                          <AiOutlineClose
+                            onClick={() => removeFromCart(item)}
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
 
-            {OldtableDataDinein?.length > 0 && EditQuantity && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
-        )}
-        {tableDataTakeAway?.length > 0 && (
-          <tbody className="Table4-tbody">
-            {tableDataTakeAway?.map((item, index) => (
-              <tr
-                key={
-                  OldtableDataDinein?.length +
-                  OldtableDataTakeAway?.length +
-                  index
-                }
-                className={`${BookingType === 'Dine In' && item?.SalesId
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
+              {OldtableDataDinein?.length > 0 && EditQuantity && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+          {tableDataTakeAway?.length > 0 && (
+            <tbody className="Table4-tbody">
+              {tableDataTakeAway?.map((item, index) => (
+                <tr
+                  key={
+                    OldtableDataDinein?.length +
+                    OldtableDataTakeAway?.length +
+                    index
+                  }
+                  className={`${
+                    BookingType === 'Dine In' && item?.SalesId
+                      ? 'BSBill-Table3-content-Disabled'
+                      : 'BSBill-Table3-content'
                   } 
            
               `}
-                style={{
-                  fontFamily: SelectedFont ? SelectedFont : '',
-                  backgroundColor:
-                    BillOrderPre === 'Y'
-                      ? BookingType === 'Dine In' && item?.SalesId
-                        ? 'rgb(243, 248, 213)'
-                        : BookingType === 'Dine In' &&
-                          triggerAnimation &&
-                          OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
-                            triggerAnimation &&
-                            OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                  style={{
+                    fontFamily: SelectedFont ? SelectedFont : '',
+                    backgroundColor:
+                      BillOrderPre === 'Y'
+                        ? BookingType === 'Dine In' && item?.SalesId
+                          ? 'rgb(243, 248, 213)'
+                          : BookingType === 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataDinein?.length +
+                                OldtableDataTakeAway?.length +
+                                index ===
+                                0 &&
+                              !item?.SalesId &&
+                              tableDataTakeAway?.length >= PreviousdataLength
                             ? 'wheat'
-                            : (OldtableDataDinein?.length +
+                            : BookingType !== 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataDinein?.length +
+                                  OldtableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                tableDataTakeAway?.length >=
+                                  PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : (OldtableDataDinein?.length +
+                                    OldtableDataTakeAway?.length +
+                                    index) %
+                                    2 ===
+                                  0
+                                ? 'white'
+                                : SelectedBillColor?.['OverallBackgroundColor']
+                                  ? SelectedBillColor?.[
+                                      'OverallBackgroundColor'
+                                    ]
+                                  : '#d6d6d6'
+                        : (OldtableDataDinein?.length +
                               OldtableDataTakeAway?.length +
                               index) %
                               2 ===
-                              0
-                              ? 'white'
-                              : SelectedBillColor?.['OverallBackgroundColor']
-                                ? SelectedBillColor?.['OverallBackgroundColor']
-                                : '#d6d6d6'
-                      : (OldtableDataDinein?.length +
-                        OldtableDataTakeAway?.length +
-                        index) %
-                        2 ===
-                        0
-                        ? 'white'
-                        : SelectedBillColor?.['OverallBackgroundColor']
-                          ? SelectedBillColor?.['OverallBackgroundColor']
-                          : '#d6d6d6',
-                  //change
-                  background:
-                    BookingType === 'Dine In' && item?.SalesId
-                      ? 'rgb(243, 248, 213)'
-                      : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
-                        ? '#b2d1f7'
-                        : (OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index) %
-                          2 ===
-                          0
+                            0
                           ? 'white'
                           : SelectedBillColor?.['OverallBackgroundColor']
                             ? SelectedBillColor?.['OverallBackgroundColor']
                             : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        OldtableDataDinein?.length +
-                        OldtableDataTakeAway?.length +
-                        index ===
-                        0 &&
-                        !item?.SalesId &&
-                        tableDataTakeAway?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
+                    //change
+                    background:
+                      BookingType === 'Dine In' && item?.SalesId
+                        ? 'rgb(243, 248, 213)'
+                        : GlobEstBooking === 'ParEst' &&
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
+                          ? '#b2d1f7'
+                          : (OldtableDataDinein?.length +
+                                OldtableDataTakeAway?.length +
+                                index) %
+                                2 ===
+                              0
+                            ? 'white'
+                            : SelectedBillColor?.['OverallBackgroundColor']
+                              ? SelectedBillColor?.['OverallBackgroundColor']
+                              : '#d6d6d6',
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
+                          OldtableDataDinein?.length +
+                            OldtableDataTakeAway?.length +
+                            index ===
+                            0 &&
+                          !item?.SalesId &&
+                          tableDataTakeAway?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#CFB59D' }}
+                          >
+                            <img width="30px" alt="" src={TakeAwayIcon} />
+                          </td>
+                        )}
+                      {tableitem?.OptionName == 'Sl.No' && (
                         <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#CFB59D' }}
+                          className="Table-4_qty"
+                          style={{ width: '0px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
                         >
-                          <img width="30px" alt="" src={TakeAwayIcon} />
+                          {OldtableDataDinein?.length +
+                            OldtableDataTakeAway?.length +
+                            index +
+                            1}
                         </td>
                       )}
-                    {tableitem?.OptionName == 'Sl.No' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '0px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index +
-                          1}
-                      </td>
-                    )}
-                    {tableitem?.OptionName == 'Item' && (
-                      <td
-                        className="Table4-items for-combo"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() =>
-                          item.FullProductIdentifierDtls?.length > 0 ||
+                      {tableitem?.OptionName == 'Item' && (
+                        <td
+                          className="Table4-items for-combo"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() =>
+                            item.FullProductIdentifierDtls?.length > 0 ||
                             item.ProductIdentifierDtls?.length > 0
-                            ? handleImeiDetails(item)
-                            : editField && handleEditQuantity(item, index)
-                        }
-                      >
-                        {item?.Type !== 'OS' ? item.ProdName : item.ServiceName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
-                              className="Tbl4-Variant"
-                              style={{ fontFamily: 'Poppins' }}
-                            >
-                              {/* (
+                              ? handleImeiDetails(item)
+                              : editField && handleEditQuantity(item, index)
+                          }
+                        >
+                          {item?.Type !== 'OS'
+                            ? item.ProdName
+                            : item.ServiceName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl4-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                {/* (
                             {!item?.ProdVariantName?.toLowerCase()?.includes(
                               'variant'
                             ) && <span>{item?.ProdVariantName} </span>}
                             {item?.Size}
                             {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName}) */}
-                              {item?.Type !== 'OS' && (
-                                <>
-                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                    'variant'
-                                  ) && <span>{item?.ProdVariantName} </span>}
+                                {item?.Type !== 'OS' && (
+                                  <>
+                                    {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                      'variant'
+                                    ) && <span>{item?.ProdVariantName} </span>}
 
-                                  {AvailableDate ? (
-                                    <>
-                                      {' '}
-                                      (
-                                      {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
-                                      ) &nbsp;
-                                      {item?.SinglePc == 'Y' && 'Single'}
-                                    </>
-                                  ) : (
-                                    <>
-                                      {item?.Size}
-                                      {item?.SinglePc == 'Y'
-                                        ? 'Single'
-                                        : item?.UomName}
-                                    </>
-                                  )}
-                                </>
-                              )}
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
-                                </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl4-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
+                                    {AvailableDate ? (
+                                      <>
+                                        {' '}
+                                        (
+                                        {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
+                                        ) &nbsp;
+                                        {item?.SinglePc == 'Y' && 'Single'}
+                                      </>
+                                    ) : (
+                                      <>
+                                        {item?.Size}
+                                        {item?.SinglePc == 'Y'
+                                          ? 'Single'
+                                          : item?.UomName}
+                                      </>
+                                    )}
+                                  </>
+                                )}
                               </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
+                              className="Tbl4-Variant"
+                              style={{ fontFamily: 'Poppins' }}
+                            >
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
+                                </p>
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
                             <div
                               style={{
                                 fontSize: '10px',
@@ -3268,292 +3149,294 @@ const BSBillingTable4 = () => {
                               }
                             </div>
                           )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        style={{ width: '40px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer && item.Offer > 0
-                            ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item?.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="Table4-item-price"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item, index);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {Number(
-                          item?.TotalAmt - (item?.Offer || 0) || 0
-                        ).toFixed(2)}
-                      </td>
-                    )}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          style={{ width: '40px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
+                            ? item.Offer && item.Offer > 0
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item?.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="Table4-item-price"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item, index);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {Number(
+                            item?.TotalAmt - (item?.Offer || 0) || 0
+                          ).toFixed(2)}
+                        </td>
+                      )}
 
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="Table4-editicon"
-                        style={{ cursor: 'pointer' }}
-                      >
-                        <AiOutlineClose
-                          onClick={() => removeFromCart(item)}
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="Table4-editicon"
+                          style={{ cursor: 'pointer' }}
+                        >
+                          <AiOutlineClose
+                            onClick={() => removeFromCart(item)}
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
 
-            {tableDataTakeAway?.length > 0 && EditQuantity && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
-        )}
-        {tableDataDinein?.length > 0 && (
-          <tbody className="Table4-tbody">
-            {tableDataDinein?.map((item, index) => (
-              <tr
-                key={
-                  tableDataTakeAway?.length +
-                  OldtableDataDinein?.length +
-                  OldtableDataTakeAway?.length +
-                  index
-                }
-                className={`${item?.SalesId && OrderType !== 'Hold'
-                  ? 'BSBill-Table3-content-Disabled'
-                  : 'BSBill-Table3-content'
+              {tableDataTakeAway?.length > 0 && EditQuantity && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+          {tableDataDinein?.length > 0 && (
+            <tbody className="Table4-tbody">
+              {tableDataDinein?.map((item, index) => (
+                <tr
+                  key={
+                    tableDataTakeAway?.length +
+                    OldtableDataDinein?.length +
+                    OldtableDataTakeAway?.length +
+                    index
+                  }
+                  className={`${
+                    item?.SalesId && OrderType !== 'Hold'
+                      ? 'BSBill-Table3-content-Disabled'
+                      : 'BSBill-Table3-content'
                   } 
            
               `}
-                style={{
-                  fontFamily: SelectedFont ? SelectedFont : '',
-                  backgroundColor:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? BookingType === 'Dine In' &&
-                        item?.SalesId &&
-                        !BookingTypeBoth
+                  style={{
+                    fontFamily: SelectedFont ? SelectedFont : '',
+                    backgroundColor:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? BookingType === 'Dine In' &&
+                          item?.SalesId &&
+                          !BookingTypeBoth
+                          ? 'rgb(243, 248, 213)'
+                          : BookingType === 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataTakeAway?.length +
+                                OldtableDataDinein?.length +
+                                tableDataTakeAway?.length +
+                                index ===
+                                0 &&
+                              !item?.SalesId &&
+                              tableDataDinein?.length >= PreviousdataLength
+                            ? 'wheat'
+                            : BookingType !== 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataTakeAway?.length +
+                                  OldtableDataDinein?.length +
+                                  tableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                tableDataDinein?.length >= PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : 'inherit'
+                        : 'none',
+                    background:
+                      BookingType === 'Dine In' &&
+                      item?.SalesId &&
+                      !BookingTypeBoth
                         ? 'rgb(243, 248, 213)'
-                        : BookingType === 'Dine In' &&
-                          triggerAnimation &&
+                        : GlobEstBooking === 'ParEst' &&
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
+                          ? '#b2d1f7'
+                          : (OldtableDataTakeAway?.length +
+                                OldtableDataDinein?.length +
+                                tableDataTakeAway?.length +
+                                index) %
+                                2 ===
+                              0
+                            ? 'white'
+                            : SelectedBillColor?.['OverallBackgroundColor']
+                              ? SelectedBillColor?.['OverallBackgroundColor']
+                              : '#d6d6d6',
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
                           OldtableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          tableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
-                            triggerAnimation &&
-                            OldtableDataTakeAway?.length +
                             OldtableDataDinein?.length +
                             tableDataTakeAway?.length +
                             index ===
                             0 &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'wheat'
-                            : 'inherit'
-                      : 'none',
-                  background:
-                    BookingType === 'Dine In' &&
-                      item?.SalesId &&
-                      !BookingTypeBoth
-                      ? 'rgb(243, 248, 213)'
-                      : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
-                        ? '#b2d1f7'
-                        : (OldtableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          tableDataTakeAway?.length +
-                          index) %
-                          2 ===
-                          0
-                          ? 'white'
-                          : SelectedBillColor?.['OverallBackgroundColor']
-                            ? SelectedBillColor?.['OverallBackgroundColor']
-                            : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        OldtableDataTakeAway?.length +
-                        OldtableDataDinein?.length +
-                        tableDataTakeAway?.length +
-                        index ===
-                        0 &&
-                        !item?.SalesId &&
-                        tableDataDinein?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
+                          !item?.SalesId &&
+                          tableDataDinein?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#A2C3CD' }}
+                          >
+                            <img width="30px" alt="" src={dineInIcon} />
+                          </td>
+                        )}
+                      {tableitem.OptionName == 'Sl.No' && (
                         <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#A2C3CD' }}
+                          className="Table-4_qty"
+                          style={{ width: '0px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
                         >
-                          <img width="30px" alt="" src={dineInIcon} />
+                          {tableDataTakeAway?.length +
+                            OldtableDataDinein?.length +
+                            OldtableDataTakeAway?.length +
+                            index +
+                            1}
                         </td>
                       )}
-                    {tableitem.OptionName == 'Sl.No' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '0px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {tableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index +
-                          1}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Item' && (
-                      <td
-                        className="Table4-items for-combo"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item.ProdName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
+                      {tableitem.OptionName == 'Item' && (
+                        <td
+                          className="Table4-items for-combo"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item.ProdName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl3-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                (
+                                {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                  'variant'
+                                ) && <span>{item?.ProdVariantName} </span>}
+                                {AvailableDate ? (
+                                  <>
+                                    {' '}
+                                    (
+                                    {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
+                                    ) &nbsp;
+                                    {item?.SinglePc == 'Y' && 'Single'}
+                                  </>
+                                ) : (
+                                  <>
+                                    {item?.Size}
+                                    {item?.SinglePc == 'Y'
+                                      ? 'Single'
+                                      : item?.UomName}
+                                  </>
+                                )}
+                                )
+                              </p>
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
                               className="Tbl3-Variant"
                               style={{ fontFamily: 'Poppins' }}
                             >
-                              (
-                              {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                'variant'
-                              ) && <span>{item?.ProdVariantName} </span>}
-                              {AvailableDate ? (
-                                <>
-                                  {' '}
-                                  (
-                                  {`${to12Hour(item?.VariantAvailableFrom)} - ${to12Hour(item?.VariantAvailableTo)}`}
-                                  ) &nbsp;
-                                  {item?.SinglePc == 'Y' && 'Single'}
-                                </>
-                              ) : (
-                                <>
-                                  {item?.Size}
-                                  {item?.SinglePc == 'Y'
-                                    ? 'Single'
-                                    : item?.UomName}
-                                </>
-                              )}
-                              )
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
                                 </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl3-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
-                              </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
                             <div
                               style={{
                                 fontSize: '10px',
@@ -3569,138 +3452,139 @@ const BSBillingTable4 = () => {
                               }
                             </div>
                           )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        style={{ width: '40px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer && item.Offer > 0
-                            ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="Table-4_qty"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item, index);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="Table4-item-price"
-                        style={{ width: '30px', fontFamily: 'Poppins' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {Number(
-                          item?.TotalAmt - (item?.Offer || 0) || 0
-                        ).toFixed(2)}
-                      </td>
-                    )}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          style={{ width: '40px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
+                            ? item.Offer && item.Offer > 0
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="Table-4_qty"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item, index);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="Table4-item-price"
+                          style={{ width: '30px', fontFamily: 'Poppins' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {Number(
+                            item?.TotalAmt - (item?.Offer || 0) || 0
+                          ).toFixed(2)}
+                        </td>
+                      )}
 
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="Table4-editicon"
-                        style={{ cursor: 'pointer' }}
-                      >
-                        <AiOutlineClose
-                          onClick={() => removeFromCart(item)}
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="Table4-editicon"
+                          style={{ cursor: 'pointer' }}
+                        >
+                          <AiOutlineClose
+                            onClick={() => removeFromCart(item)}
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
 
-            {tableDataDinein?.length > 0 && EditQuantity && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
+              {tableDataDinein?.length > 0 && EditQuantity && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+        </table>
+        {OpenEditTotalAmt && (
+          <BSEditTotalAmt
+            EditTotalOpen={OpenEditTotalAmt}
+            EditTotalClose={handleEditTotalAmountCancel}
+          />
         )}
-      </table>
-      {OpenEditTotalAmt && (
-        <BSEditTotalAmt
-          EditTotalOpen={OpenEditTotalAmt}
-          EditTotalClose={handleEditTotalAmountCancel}
-        />
-      )}
-      {OpenImeiDetail && (
-        <BSImeiDetails
-          DeviceDetails={OpenImeiDetail}
-          handleDeviceDetailClose={handleImeiDetailClose}
-          ProductDetail={Modaldata}
-        />
-      )}
-      {(customerPriceHistoryOpen && GetCustId) &&
-        <CustomerPriceHistory
-          open={customerPriceHistoryOpen}
-          custId={GetCustId}
-          setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
-          customerProduct={customerProduct}
-          setCustomerProduct={setCustomerProduct}
-          selectedCustomer={selectedCustomer}
-        />
-      }
-    </div>
+        {OpenImeiDetail && (
+          <BSImeiDetails
+            DeviceDetails={OpenImeiDetail}
+            handleDeviceDetailClose={handleImeiDetailClose}
+            ProductDetail={Modaldata}
+          />
+        )}
+        {customerPriceHistoryOpen && GetCustId && (
+          <CustomerPriceHistory
+            open={customerPriceHistoryOpen}
+            custId={GetCustId}
+            setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
+            customerProduct={customerProduct}
+            setCustomerProduct={setCustomerProduct}
+            selectedCustomer={selectedCustomer}
+          />
+        )}
+      </div>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable5/BSBillingTable5.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable5/BSBillingTable5.jsx
index c4ee9cb..e99b170 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable5/BSBillingTable5.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable5/BSBillingTable5.jsx
@@ -1,10 +1,9 @@
-import React, { useEffect, useState, useRef } from 'react';
+import React, { useEffect, useState, useRef, lazy, Suspense } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import moment from 'moment';
 import { Popover, Badge, Modal, Tooltip } from 'antd';
 import { useNavigate } from 'react-router-dom';
 import {
-  UpOutlined,
   ArrowRightOutlined,
   UpCircleOutlined,
   DownCircleOutlined,
@@ -15,7 +14,6 @@ import defaultupi from '../../../../../Images/defaultupi.png';
 import pozologoimg from '../../../../../Images/pozologoimg.png';
 import paydevice from '../../../../../Images/paydevice.png';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable5/BSBillingTable15.scss';
-import BsBill from './BsBill';
 import { isMobile } from 'react-device-detect';
 import {
   GlobalSelectedFont,
@@ -29,7 +27,9 @@ import {
 } from '../../../../../Features/ThemeChange/ThemeChange';
 import { PrintStyleFunction } from '../../../../paymentpdfPage/PrintStyleFunction.js';
 import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities';
-import BSSummery1 from '../../BSBillingTables/BSBillingTableSummery/BSSummery';
+const BSSummery1 = lazy(
+  () => import('../../BSBillingTables/BSBillingTableSummery/BSSummery')
+);
 import { Messages } from '../../../../../Components/Notifications/Messages';
 import {
   GlobalOrderCardDetails,
@@ -105,7 +105,6 @@ import {
   GlobalOverAllDiscSales,
   ChangeOverAllDiscSales,
   ChangeOverAllDiscEstimate,
-  getAllCustomer,
   GlobalBranchFinancialStatus,
   changeSummeryComboOfferAmount,
   ChangeComboCarddata,
@@ -130,6 +129,7 @@ import {
   changeBillEditingMode,
   changePreviousOrderPayment,
   changePreviousOrderOfferDetail,
+  GlobalAllBookingType,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
 import { ChangeTotalAmount } from '../../../../../Features/ExteraCharges/ExtraCharges.js'; //Shifayth Date:27/12/2023
 import {
@@ -137,7 +137,6 @@ import {
   globalholddata,
   changeholddata,
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption';
-import PaymentPdfBooking from '../../../../paymentpdfPage/PaymentPdfBooking';
 import { globalExtraTotalAmount } from '../../../../../Features/ExteraCharges/ExtraCharges';
 import {
   encryptObject,
@@ -154,34 +153,21 @@ import {
   triggerCustomerRefresh,
 } from '../../../../../Features/BookingScreen/Customer/addCustomer';
 import BSCustomerSelect from '../../UtillComponents/BSSelectCustomer.jsx';
-import PozoDineInIcon from '../../UtillComponents/Pozo retail icons/PozoDineIn.jsx';
 import PozoUnpaidIcon from '../../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
 import PozoBillIcon from '../../UtillComponents/Pozo retail icons/PozoBIllIcon.jsx';
 import PozoAddCustomerIcon from '../../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
-import QrComponent from '../../BookingFunctionality/DynamicQr.jsx';
-import QrinScreen from '../../BookingFunctionality/DynamicScreenQr.jsx';
 import Buttons from '../../../../../Components/Forms/Buttons';
 import WpIcon from '../../../../../Images/message.png';
-import BsBillingCreditCustomer from '../../BookingFunctionality/BSBillingCreditCustomer.jsx';
-import BSCreditCustomer from '../../UtillComponents/BSCreditCustomer.jsx';
 import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
-import MobilePrint from '../../BookingFunctionality/MobilePrint.jsx';
 import CountUp from 'react-countup';
 import { GlobalpreOrderOpen } from '../../../../../Features/BookingScreen/PreOrder/PreOrder.js';
-import SplitPayment from '../../BookingFunctionality/SplitPayment.jsx';
-import TokensinglePrint from '../../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx';
-import SingleTokenMobilePrint from '../../BookingFunctionality/SingleTokenMobilePrint.jsx';
-import IndividualTokenMobilePrint from '../../BookingFunctionality/IndividualTokenMobilePrint.jsx';
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
 import { getEmpAccess } from '../../../../../Features/AppPage/CenterPage.js';
 import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
 import PozoCartIcon from '../../../../../Pages/BookingScreen/Components/UtillComponents/PozoCartIcon.jsx';
 import {
-  Global_CoupenCodeAmount,
-  Global_loyaltyPointsDiscountAmount,
   Global_OrderOfferDetail,
   Global_OverallOfferAmount,
-  Global_SalesWiseOfferAmount,
 } from '../../../../../Features/Offer/Offer.js';
 import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
@@ -191,21 +177,13 @@ import {
   changeSalesPaymentoption,
   GlobalSalesPaymentoption,
 } from '../../../../../Features/Payment/Paymentoptions/Paymentoptions.js';
-import Paymentoption from '../../../../Payment/PaymentOptions/PaymentOptions.jsx';
 import { getPaymentOptionsData } from '../../../../../Features/BookingScreen/BookingData/KioskBookingData.js';
 import { getCombolist } from '../../../../../Features/ComboMaster/ComboMaster.js';
-import WhatsAppShare from '../../../../WhatsAppShare/whatsAppShare.jsx';
-import SMSShare from '../../../../WhatsAppShare/SmsShare.jsx';
 import { MdSms } from 'react-icons/md';
 import { FaWhatsapp, FaPrint, FaCartPlus } from 'react-icons/fa';
-import BSTipAmount from '../../UtillComponents/BSTipAmount.jsx';
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin.js';
 import { PostOtherServices } from '../../../../../Features/OtherServices/OtherServices.js';
 import { TfiClipboard } from 'react-icons/tfi';
-import OtherServicePrintStyle1 from '../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx';
-import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
-import BSOtherServiceClaim from '../../UtillComponents/BSOtherServiceClaim.jsx';
-import { MobilePdfPrint } from '../../BookingFunctionality/MobilePdfPrint.js';
 import { PublicQrCodepost } from '../../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
 import {
   ChangeFullFreeProductList,
@@ -217,14 +195,75 @@ import {
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import CardPopover from '../StandardTable/Utils/CardPopover.jsx';
 import UpiPopover from '../StandardTable/Utils/UpiPopOver.jsx';
-import PaymentGatewayEmbedded from '../../UtillComponents/PaymentGatewayEmbedded.jsx';
-import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
 import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
-import CustomerOrders from '../../BookingFunctionality/CustomerOrders.jsx';
+// Jsx Files
+const OtherServicePrintStyle1 = lazy(
+  () =>
+    import('../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx')
+);
+const OtherServiceMobilePrint = lazy(
+  () => import('../../BookingFunctionality/OtherServiceMobilePrint.jsx')
+);
+const BSOtherServiceClaim = lazy(
+  () => import('../../UtillComponents/BSOtherServiceClaim.jsx')
+);
+const WhatsAppShare = lazy(
+  () => import('../../../../WhatsAppShare/whatsAppShare.jsx')
+);
+const BsBill = lazy(() => import('./BsBill'));
+
+const SMSShare = lazy(() => import('../../../../WhatsAppShare/SmsShare.jsx'));
+
+const PaymentPdfBooking = lazy(
+  () => import('../../../../paymentpdfPage/PaymentPdfBooking')
+);
+const PozoDineInIcon = lazy(
+  () => import('../../UtillComponents/Pozo retail icons/PozoDineIn.jsx')
+);
+const QrComponent = lazy(
+  () => import('../../BookingFunctionality/DynamicQr.jsx')
+);
+const QrinScreen = lazy(
+  () => import('../../BookingFunctionality/DynamicScreenQr.jsx')
+);
+const BsBillingCreditCustomer = lazy(
+  () => import('../../BookingFunctionality/BSBillingCreditCustomer.jsx')
+);
+const BSCreditCustomer = lazy(
+  () => import('../../UtillComponents/BSCreditCustomer.jsx')
+);
+const MobilePrint = lazy(
+  () => import('../../BookingFunctionality/MobilePrint.jsx')
+);
+const SplitPayment = lazy(
+  () => import('../../BookingFunctionality/SplitPayment.jsx')
+);
+const TokensinglePrint = lazy(
+  () =>
+    import('../../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx')
+);
+const SingleTokenMobilePrint = lazy(
+  () => import('../../BookingFunctionality/SingleTokenMobilePrint.jsx')
+);
+const IndividualTokenMobilePrint = lazy(
+  () => import('../../BookingFunctionality/IndividualTokenMobilePrint.jsx')
+);
+const MobileMultiPdfPrintTrigger = lazy(
+  () => import('../../UtillComponents/MobileMultiPdfPrintTrigger.jsx')
+);
+const CustomerOrders = lazy(
+  () => import('../../BookingFunctionality/CustomerOrders.jsx')
+);
+const Paymentoption = lazy(
+  () => import('../../../../Payment/PaymentOptions/PaymentOptions.jsx')
+);
+const BSTipAmount = lazy(() => import('../../UtillComponents/BSTipAmount.jsx'));
+const PaymentGatewayEmbedded = lazy(
+  () => import('../../UtillComponents/PaymentGatewayEmbedded.jsx')
+);
 
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
-const RetailApiurl = import.meta.env.ENV_API_URL;
 
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
 
@@ -244,11 +283,12 @@ const BSBillingTable5 = () => {
   const BranchId = SessionData?.BranchId;
   const UserId = SessionData?.UserId;
   const UserType = SessionData?.UserType;
-  const AuthToken = SessionData?.AuthToken;
-  const SessionMobileNo = SessionData?.SessionMobileNo;
+  const AllBookingType = useSelector(GlobalAllBookingType);
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const Discount = useSelector(GlobalOverAllOfferAmt);
   const FreeProdList = useSelector(GlobalFreeProdList);
@@ -485,6 +525,10 @@ const BSBillingTable5 = () => {
   // for customised invoice number
   const { invoiceDate, clearInvoiceDate } = useDateStore();
   const CurrentOrderId = useSelector(GlobalCurrentOrderId);
+  const holdCheckedSalesSetup = tableOptions?.some(
+    (item) => item?.OptionName === 'Hold'
+  );
+
   useEffect(() => {
     if (salesBillEdit) {
       dispatch(getPaymentOptions()).unwrap();
@@ -492,7 +536,6 @@ const BSBillingTable5 = () => {
   }, [salesBillEdit]);
 
   useEffect(() => {
-
     if (salesBillEdit) {
       if (SelCustId) {
         setRefundPayBtns(AllPaymentOptions);
@@ -507,8 +550,7 @@ const BSBillingTable5 = () => {
         setRefundPayBtns(withoutCustomer);
       }
     }
-
-  }, [AllPaymentOptions, SelCustId, salesBillEdit])
+  }, [AllPaymentOptions, SelCustId, salesBillEdit]);
 
   useEffect(() => {
     if (
@@ -529,8 +571,8 @@ const BSBillingTable5 = () => {
       UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // const Data1 = { AppId, CompId, BranchId };
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
   useEffect(() => {
     if (selOption) {
@@ -634,17 +676,23 @@ const BSBillingTable5 = () => {
         );
       }
 
-
       const filteredPayments =
         previousOrderPayment?.filter(
-          p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+          (p) =>
+            p?.LastOrderTran === 'Y' &&
+            p?.AfterAdjustment != null &&
+            p?.AfterAdjustment !== '' &&
+            p?.AfterAdjustment
         ) || [];
 
       const paymentsToUse =
-        filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
+        filteredPayments.length > 0
+          ? filteredPayments
+          : previousOrderPayment || [];
 
       const totalPreviouspayment = paymentsToUse?.reduce(
-        (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+        (acc, payment) =>
+          acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
         0
       );
 
@@ -653,8 +701,7 @@ const BSBillingTable5 = () => {
         0
       );
 
-      const previousNetAmount =
-        (totalPreviouspayment) || 0;
+      const previousNetAmount = totalPreviouspayment || 0;
 
       let withdiscTotal =
         Total -
@@ -666,12 +713,26 @@ const BSBillingTable5 = () => {
         withdiscTotal >= 0
           ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
           : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      )
+      );
 
-      setTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount);
+      setTotalAmount(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount
+      );
       setCurrentOrderNetAmount(currentOrderNetAmount);
       setPreviousNetAmount(previousNetAmount);
-      dispatch(changeSummeryTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount));
+      dispatch(
+        changeSummeryTotalAmount(
+          salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount
+              ? currentOrderNetAmount - previousNetAmount
+              : 0
+            : currentOrderNetAmount
+        )
+      );
 
       dispatch(changeSummeryComboOfferAmount(withComboSum));
 
@@ -696,8 +757,9 @@ const BSBillingTable5 = () => {
 
   useEffect(() => {
     if (CompId && BranchId && AppId) {
-      getHolddata();
-      getUnpaiddatas();
+      if (holdCheckedSalesSetup) {
+        getHolddata();
+      }
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -728,28 +790,6 @@ const BSBillingTable5 = () => {
 
     setaddnewAccess(!hasAccess);
   }, [empData, SAAccessCommonMaster, UserType]);
-  // useEffect(() => {
-  //   const handleKeyPress = (event) => {
-  //     if (event.shiftKey && event.code === 'KeyM') {
-  //       if (
-  //         document.activeElement.tagName !== 'INPUT' &&
-  //         document.activeElement.tagName !== 'TEXTAREA'
-  //       ) {
-  //         event.preventDefault();
-  //         setBlink(true);
-  //       }
-  //     }
-  //   };
-  //   const handleClickOutside = (event) => {
-  //     setBlink(false);
-  //   };
-  //   window.addEventListener('keydown', handleKeyPress);
-  //   window.addEventListener('mousedown', handleClickOutside);
-  //   return () => {
-  //     window.removeEventListener('keydown', handleKeyPress);
-  //     window.addEventListener('mousedown', handleClickOutside);
-  //   };
-  // }, []);
   const formatAmount = (value) => {
     return allowDecimal
       ? parseFloat(value || 0).toFixed(2)
@@ -769,9 +809,6 @@ const BSBillingTable5 = () => {
     setEmpData(datas?.[0]);
   };
   const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
     await dispatch(
       getAddCustomerDetails({
         CompId: CompId,
@@ -908,7 +945,11 @@ const BSBillingTable5 = () => {
   const handleButtonClick = () => {
     if (qrCode && SelectedUPIPayOption === 'Default' && UpiQRPreference) {
       UpiPayment();
-    } else if (salesBillEdit && currentOrderNetAmount < previousNetAmount && !refundPaySelected) {
+    } else if (
+      salesBillEdit &&
+      currentOrderNetAmount < previousNetAmount &&
+      !refundPaySelected
+    ) {
       setMessageType('warning');
       setMessageData('Please Select Refund Payment Method');
       return;
@@ -1124,7 +1165,7 @@ const BSBillingTable5 = () => {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
 
     if (selectedStyle) {
@@ -1554,20 +1595,12 @@ const BSBillingTable5 = () => {
   };
 
   const getBookingTypeId = async () => {
-    let tempconfigdata = await dispatch(
-      getConfigType({ TypeName: 'Booking Type' })
-    ).unwrap();
+    setConfigDataList(AllBookingType);
+    let configdata = AllBookingType;
+    let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
 
-    if (tempconfigdata?.data?.statusCode == 1) {
-      setConfigDataList(tempconfigdata?.data?.data);
-      let configdata = tempconfigdata?.data?.data;
-      let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
-
-      let filterconfigdata = configdata?.find(
-        (a) => a?.ConfigName === checkName
-      );
-      setSelectedBookingType(filterconfigdata?.ConfigId);
-    }
+    let filterconfigdata = configdata?.find((a) => a?.ConfigName === checkName);
+    setSelectedBookingType(filterconfigdata?.ConfigId);
   };
   const TotalItemsCalculation = async () => {
     let tempTotalitems = OrderCardDetail?.length;
@@ -1751,7 +1784,7 @@ const BSBillingTable5 = () => {
   const handleRefundPaymentMode = (id, name) => {
     setRefundPaySelected(id);
     setRefundPaySelectedName(name);
-  }
+  };
 
   const addUpiOption = async (id, name, UPIId) => {
     await dispatch(changeUpiIDprint(UPIId));
@@ -1814,12 +1847,7 @@ const BSBillingTable5 = () => {
   const hideDefault = () => {
     setUpiOptionOpen(false);
   };
-  const handlePopoverVisibleChange = (visible) => {
-    setUpiOptionOpen(visible);
-  };
-  const handlePopoverVisibleChangeCard = (visible) => {
-    setCardOptionOpen(visible);
-  };
+
   const getHolddata = async () => {
     const data = { CompId: CompId, BranchId: BranchId, AppId: AppId };
     let response = await dispatch(gettinghold(data)).unwrap();
@@ -1915,7 +1943,9 @@ const BSBillingTable5 = () => {
     setUpinotSelected(false);
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
-    getHolddata();
+    if (holdCheckedSalesSetup) {
+      getHolddata();
+    }
     if (defaultBookingType === 'Both') {
       await dispatch(changeBookingType('TakeAway'));
     }
@@ -2091,15 +2121,15 @@ const BSBillingTable5 = () => {
       OrderStatus: 'O',
       OrderType:
         BookingType === 'Dine In' ||
-          BookingTypeBoth ||
-          Estimation?.SettingValue == 'N'
+        BookingTypeBoth ||
+        Estimation?.SettingValue == 'N'
           ? 'S'
           : GlobEstBooking === 'OvrAllEst'
             ? 'E'
             : GlobEstBooking === 'ParEst'
               ? GlobProdwisedata?.includes(
-                a.InwardDtlId + ' ' + a?.BookingTypeName
-              )
+                  a.InwardDtlId + ' ' + a?.BookingTypeName
+                )
                 ? 'E'
                 : 'S'
               : 'S',
@@ -2190,7 +2220,7 @@ const BSBillingTable5 = () => {
           : Paybtnnameselected?.toLowerCase() === 'credit'
             ? 'S'
             : Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
+                SelectedUPIPayOption?.toLowerCase() === 'default'
               ? 'S'
               : 'P',
       OrderDtlDetails:
@@ -2207,85 +2237,113 @@ const BSBillingTable5 = () => {
           ? globalTipAmount === 0
             ? SelectedTableDetails
             : SelectedTableDetails?.map((item) => ({
-              ...item,
-              TipsAmount: globalTipAmount,
-            }))
+                ...item,
+                TipsAmount: globalTipAmount,
+              }))
           : null,
       SalesPaymentType: 'normal',
       PaymentDetail: [
         {
-          PaymentType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? refundPaySelected :
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : SelectedUPIPayOption?.toLowerCase() === 'business'
-                    ? BusinessPayOption?.find(
-                      (busupi) => busupi?.ModeId === UpiId
-                    )?.ModeId
-                    : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          Amount: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? previousNetAmount - currentOrderNetAmount : Math.round(TotalAmount),
-          MerchantId: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'business'
-              ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                ?.MerchantId
-              : null,
-          PaymentOptionType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) && (refundPaySelectedName?.toLowerCase() === 'cash' || refundPaySelectedName?.toLowerCase() === 'credit') ? 'PC' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption?.toLowerCase() === 'business'
-                        ? 'BU'
-                        : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                ?.UPIDetailId
-              : SelectedUPIPayOption?.toLowerCase() === 'business'
+          PaymentType:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? refundPaySelected
+              : Paybtnnameselected?.toLowerCase() === 'upi'
+                ? SelectedUPIPayOption?.toLowerCase() === 'pd'
+                  ? PaymentDeviceUPI?.[0]?.ModeId
+                  : SelectedUPIPayOption?.toLowerCase() === 'pg'
+                    ? PaymentgatewayUPI?.[0]?.ModeId
+                    : SelectedUPIPayOption?.toLowerCase() === 'business'
+                      ? BusinessPayOption?.find(
+                          (busupi) => busupi?.ModeId === UpiId
+                        )?.ModeId
+                      : paybtnselected
+                : paybtnselected
+                  ? paybtnselected
+                  : null,
+          Amount:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? previousNetAmount - currentOrderNetAmount
+              : Math.round(TotalAmount),
+          MerchantId:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'business'
                 ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                  ?.MerchantUPIId
+                    ?.MerchantId
                 : null,
-          AccountDtl: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? [] :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.UPIId === UpiId
-              )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                (Paybtnnameselected?.toLowerCase() === 'card' &&
-                  SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'pg') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? 'S' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
+          PaymentOptionType:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            (refundPaySelectedName?.toLowerCase() === 'cash' ||
+              refundPaySelectedName?.toLowerCase() === 'credit')
+              ? 'PC'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'PC'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
+                  ? 'PC'
+                  : Paybtnnameselected?.toLowerCase() === 'card'
+                    ? SelectedCardOption
+                    : Paybtnnameselected?.toLowerCase() === 'upi'
+                      ? SelectedUPIPayOption?.toLowerCase() === 'default'
+                        ? 'PC'
+                        : SelectedUPIPayOption?.toLowerCase() === 'business'
+                          ? 'BU'
+                          : SelectedUPIPayOption
+                      : null,
+          ModeOfPayment:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
+                    ?.UPIDetailId
+                : SelectedUPIPayOption?.toLowerCase() === 'business'
+                  ? BusinessPayOption?.find(
+                      (busupi) => busupi?.ModeId === UpiId
+                    )?.MerchantUPIId
+                  : null,
+          AccountDtl:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? []
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
                   SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
+                    (upipay) => upipay?.UPIId === UpiId
+                  )
+                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'pd') ||
+                    (Paybtnnameselected?.toLowerCase() === 'card' &&
+                      SelectedCardOption?.toLowerCase() === 'pd')
+                  ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                  : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                        SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      (Paybtnnameselected?.toLowerCase() === 'card' &&
+                        SelectedCardOption?.toLowerCase() === 'pg')
+                    ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
+                    : [],
+          PaymentStatus:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? 'S'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'S'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
                   ? 'S'
-                  : 'P',
-          Debit: (salesBillEdit && currentOrderNetAmount < previousNetAmount && refundPaySelectedName?.toLowerCase() === 'credit') ? Math.round(previousNetAmount - currentOrderNetAmount) : 0,
-          Credit: salesBillEdit ? (currentOrderNetAmount > previousNetAmount && Paybtnnameselected?.toLowerCase() === 'credit') ? Math.round(TotalAmount) : 0 :
-            Paybtnnameselected?.toLowerCase() === 'credit'
+                  : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'default'
+                    ? 'S'
+                    : 'P',
+          Debit:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            refundPaySelectedName?.toLowerCase() === 'credit'
+              ? Math.round(previousNetAmount - currentOrderNetAmount)
+              : 0,
+          Credit: salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount &&
+              Paybtnnameselected?.toLowerCase() === 'credit'
+              ? Math.round(TotalAmount)
+              : 0
+            : Paybtnnameselected?.toLowerCase() === 'credit'
               ? Math.round(TotalAmount)
               : 0,
         },
@@ -2352,14 +2410,14 @@ const BSBillingTable5 = () => {
         setMessageType('success');
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         response?.data?.OrderDetails?.length > 0 &&
           setPrintOrderDetails([response?.data]);
@@ -2518,14 +2576,14 @@ const BSBillingTable5 = () => {
           setMessageType('success');
           setMessageData(
             response?.data?.response +
-            ' ' +
-            (response?.data?.OrderDetails?.length > 0
-              ? response?.data?.OrderId &&
-              extractLastNumberOrderId(
-                response?.data?.OrderId,
-                response?.data?.OrderDetails?.[0]?.FYStatus
-              )
-              : '')
+              ' ' +
+              (response?.data?.OrderDetails?.length > 0
+                ? response?.data?.OrderId &&
+                  extractLastNumberOrderId(
+                    response?.data?.OrderId,
+                    response?.data?.OrderDetails?.[0]?.FYStatus
+                  )
+                : '')
           );
           response?.data?.OrderDetails?.length > 0 &&
             setPrintOrderDetails([response?.data]);
@@ -2632,14 +2690,14 @@ const BSBillingTable5 = () => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -2815,14 +2873,14 @@ const BSBillingTable5 = () => {
             setMessageType('success');
             setMessageData(
               bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  rbookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
-                )
-                : '')
+                ' ' +
+                (bookingpaymentupdate?.data?.OrderDetails?.length > 0
+                  ? bookingpaymentupdate?.data?.OrderId &&
+                    extractLastNumberOrderId(
+                      bookingpaymentupdate?.data?.OrderId,
+                      rbookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
+                    )
+                  : '')
             );
             bookingpaymentupdate?.data?.OrderDetails?.length > 0 &&
               setPrintOrderDetails([bookingpaymentupdate?.data]);
@@ -2841,7 +2899,7 @@ const BSBillingTable5 = () => {
         if (
           Date.now() - startTime >
           useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
+            60000
         ) {
           // 60,000 ms = 1 minute
 
@@ -3389,8 +3447,10 @@ const BSBillingTable5 = () => {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if (salesBillEdit) {
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger, salesBillEdit]);
 
   const Otherserviceprint = async () => {
     if (OtherServicesPrintDetails?.length > 0) {
@@ -3545,995 +3605,1035 @@ const BSBillingTable5 = () => {
   };
   return (
     <>
-      <div
-        className={
-          templateData?.BookingLayout?.[0] === 'Layout6'
-            ? 'BSBillingTable5-table-master-div BSBillingTable5-table-master-div-6'
-            : 'BSBillingTable5-table-master-div'
-        }
-        style={{ height: containerHeight }}
-      >
-        {(addcustomer || hold) && (
-          <FeaturesFunctionalities
-            handleHoldCancel={handleHoldCancel}
-            modalOpen={hold}
-            handleAddCustomerCancel={handleAddCustomerCancel}
-            addcustomer={addcustomer}
-          />
-        )}
-        {creditCustomerOpen && (
-          <BSCreditCustomer
-            creditCustomerOpen={creditCustomerOpen}
-            CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-          />
-        )}
-        {TotalAmount == 0 && Success && (
-          <div>
-            <QrComponent com={`WelcomeScreen**${brachName}`} />
-          </div>
-        )}
-        {TotalAmount > 0 &&
-          qrCode &&
-          PaymentUpiOptions?.length > 0 &&
-          SelectedUpiOption && (
+      <Suspense fallback={<div>Loading…</div>}>
+        <div
+          className={
+            templateData?.BookingLayout?.[0] === 'Layout6'
+              ? 'BSBillingTable5-table-master-div BSBillingTable5-table-master-div-6'
+              : 'BSBillingTable5-table-master-div'
+          }
+          style={{ height: containerHeight }}
+        >
+          {(addcustomer || hold) && (
+            <FeaturesFunctionalities
+              handleHoldCancel={handleHoldCancel}
+              modalOpen={hold}
+              handleAddCustomerCancel={handleAddCustomerCancel}
+              addcustomer={addcustomer}
+            />
+          )}
+          {creditCustomerOpen && (
+            <BSCreditCustomer
+              creditCustomerOpen={creditCustomerOpen}
+              CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
+            />
+          )}
+          {TotalAmount == 0 && Success && (
+            <div>
+              <QrComponent com={`WelcomeScreen**${brachName}`} />
+            </div>
+          )}
+          {TotalAmount > 0 &&
+            qrCode &&
+            PaymentUpiOptions?.length > 0 &&
+            SelectedUpiOption && (
+              <div>
+                <QrComponent
+                  com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                />
+              </div>
+            )}
+
+          {PaymentUpiOptions?.length > 0 && OrderId && (
             <div>
               <QrComponent
-                com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
               />
             </div>
           )}
 
-        {PaymentUpiOptions?.length > 0 && OrderId && (
-          <div>
-            <QrComponent
-              com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
-            />
-          </div>
-        )}
-
-        {screenwidth > 768 && (
-          <div
-            className="BS5Billtble"
-            style={{ height: 'inherit', overflow: 'auto' }}
-          >
-            <BsBill />
-          </div>
-        )}
-
-        {/* bill table */}
-
-        <div className="BSBillingTable-ftr">
-          {screenwidth <= 768 && (
+          {screenwidth > 768 && (
             <div
-              className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
-              style={{
-                transition: 'max-height 0.3s ease-in-out',
-                overflow: 'scroll',
-                maxHeight: responsiveBill ? '190px' : '0px',
-              }}
+              className="BS5Billtble"
+              style={{ height: 'inherit', overflow: 'auto' }}
             >
-              {Array.isArray(OrderCardDetail) &&
-                OrderCardDetail?.length >= 1 &&
-                (isMobile || screenwidth <= 768) && <BsBill />}
+              <BsBill />
             </div>
           )}
-          {screenwidth <= 768 && (
-            <div
-              style={{
-                display: 'flex',
-                alignItems: 'flex-end',
-                justifyContent: 'flex-end',
-                width: '100%',
-              }}
-            >
-              {Array.isArray(OrderCardDetail) &&
-                OrderCardDetail?.length >= 1 && (
-                  <div
-                    onClick={handleResponsiveBill}
-                    className="Btn-responsiveBill"
-                    style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
-                  >
-                    {responsiveBill ? (
-                      <div
-                        style={{
-                          width: '28px',
-                          display: 'flex',
-                          alignItems: 'center',
-                          height: '26px',
-                        }}
-                      >
-                        {' '}
-                        <PozoCartIcon />{' '}
-                      </div>
-                    ) : (
-                      <div
-                        style={{
-                          width: '28px',
-                          display: 'flex',
-                          alignItems: 'center',
-                          height: '26px',
-                        }}
-                      >
-                        {' '}
-                        <PozoCartIcon />{' '}
-                      </div>
-                    )}
-                  </div>
-                )}
-            </div>
-          )}
-          <div className="BSBillingTable-billtable">
-            <div className="BSBillingTable5-payOpt">
-              <div className="payrow1">
-                <Messages messageType={messageType} messageData={messageData} />
-              </div>
 
-              <div className="payrow2">
-                <TooltipWrapper
-                  // title={'Payment Mode (SHIFT + M)'}
-                  isMobile={isMobile}
-                  placement={'left'}
-                >
-                  <div
-                    className="BSBillingTable5-payOptions"
-                    style={{
-                      pointerEvents:
-                        (BookingType === 'Dine In' ||
-                          BookingTypeBoth ||
-                          CheckOrderType?.length > 0) &&
-                          !unpaidFlow &&
-                          OrderStatus
-                          ? 'none'
-                          : 'auto',
-                      opacity:
-                        (BookingType === 'Dine In' ||
-                          BookingTypeBoth ||
-                          CheckOrderType?.length > 0) &&
-                          !unpaidFlow &&
-                          OrderStatus
-                          ? 0.5
-                          : 1,
-                    }}
-                  >
-                    {paybtns?.length > 0 && (currentOrderNetAmount >= previousNetAmount) ? (
-                      paybtns?.map((payment) => (
-                        <div className="Table3-cash">
-                          <button
-                            className={
-                              paybtnselected === payment.ModeId &&
-                                (UpinotSelected || CardoptionnotSelected)
-                                ? 'Btn-payment-mode-notupisel'
-                                : paybtnselected === payment.ModeId &&
-                                  (!UpinotSelected || !CardoptionnotSelected)
-                                  ? 'Btn-payment-mode'
-                                  : 'Btn-payment-mode-sel'
-                            }
-                            style={{
-                              fontFamily: FontFamily['para'],
-                              position: 'relative',
-                              animation: blink
-                                ? 'blink-animation 0.5s infinite alternate'
-                                : 'none',
-                            }}
-                            onClick={() =>
-                              payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
-                                ? handleUPIButtonClick(
-                                  payment.ModeId,
-                                  payment.ModeName
-                                )
-                                : handlePaymentMode(
-                                  payment.ModeId,
-                                  payment.ModeName
-                                )
-                            }
-                          >
-                            <div
-                              style={{
-                                display: 'flex',
-                                flexDirection: 'row',
-                                columnGap: '0.5rem',
-                              }}
-                            >
-                              {payment.ModeName}
-                              {payment?.ModeName?.toLowerCase() === 'card' && (
-                                <CardPopover
-                                  CardPayOption={CardPayOption}
-                                  SelectedCardOption={SelectedCardOption}
-                                  AddCardOption={AddCardOption}
-                                  CardOptionOpen={CardOptionOpen}
-                                  EnableCardOptions={EnableCardOptions}
-                                  paygate={paygate}
-                                  paydevice={paydevice}
-                                />
-                              )}
-                              {payment?.ModeName?.toLowerCase() === 'upi' && (
-                                <UpiPopover
-                                  defaultPaymentMode={defaultPaymentMode}
-                                  defaultEnabled={defaultEnabled}
-                                  setDefaultEnabled={setDefaultEnabled}
-                                  UpiOptionOpen={UpiOptionOpen}
-                                  UpiPayOption={UpiPayOption}
-                                  SelectedUPIPayOption={SelectedUPIPayOption}
-                                  AddUPIPaymentOption={AddUPIPaymentOption}
-                                  PaymentUpiOptions={PaymentUpiOptions}
-                                  UpiOption={UpiOption}
-                                  UpiId={UpiId}
-                                  paygate={paygate}
-                                  paydevice={paydevice}
-                                  EnableUpiOptions={EnableUpiOptions}
-                                  BusinessPayOption={BusinessPayOption}
-                                  PaymentgatewayUPI={PaymentgatewayUPI}
-                                  PaymentDeviceUPI={PaymentDeviceUPI}
-                                  SelectedUpiOption={SelectedUpiOption}
-                                  addUpiOption={addUpiOption}
-                                  hideDefault={hideDefault}
-                                />
-                              )}
-                            </div>
-                          </button>
-                        </div>
-                      ))
-                    ) : (currentOrderNetAmount < previousNetAmount && salesBillEdit && refundPayBtns.length > 0) ? (
-                      refundPayBtns.map((payment) => (
-                        <div className="Table3-cash">
-                          <button
-                            className={
-                              refundPaySelected === payment.ConfigId &&
-                                (UpinotSelected || CardoptionnotSelected)
-                                ? 'Btn-payment-mode-notupisel'
-                                : refundPaySelected === payment.ConfigId &&
-                                  (!UpinotSelected || !CardoptionnotSelected)
-                                  ? 'Btn-payment-mode'
-                                  : 'Btn-payment-mode-sel'
-                            }
-                            style={{
-                              fontFamily: FontFamily['para'],
-                              position: 'relative',
-                              animation: blink
-                                ? 'blink-animation 0.5s infinite alternate'
-                                : 'none',
-                            }}
-                            onClick={() => handleRefundPaymentMode(payment?.ConfigId, payment?.ConfigName)}
-                          >
-                            {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+          {/* bill table */}
 
-                            <div
-                              style={{
-                                display: 'flex',
-                                flexDirection: 'row',
-                                columnGap: '0.5rem',
-                              }}
-                            >
-                              {payment.ConfigName}
-                            </div>
-                          </button>
-                        </div>
-                      ))
-                    ) : (
-                      <div
-                        onClick={handlepaymentoptions}
-                        style={{ cursor: 'pointer' }}
-                        className="payment-error-msg"
-                      >
-                        Please Set Payment Options
-                      </div>
-                    )}
-                  </div>
-                </TooltipWrapper>
-              </div>
-
-              <div />
-            </div>
-
-            <div className="">
-              <table className="BSBillingTable5-billtablediv ">
-                <tr className="BSBillingTable2-table-tr">
-                  <td
-                    className="BSBillingTable5-billtable-td"
-                    style={{
-                      fontFamily: FontFamily['para'],
-                      textAlign: 'left',
-                    }}
-                  >
-                    Items :&nbsp;
-                  </td>
-                  <td
-                    className="BSBillingTable5-billtable-td"
-                    style={{
-                      fontFamily: FontFamily['para'],
-                      textAlign: 'right',
-                    }}
-                  >
-                    {TotalItems}{' '}
-                  </td>
-                </tr>
-                <tr className="BSBillingTable2-table-tr">
-                  <td
-                    className="BSBillingTable5-billtable-total"
-                    style={{
-                      fontFamily: FontFamily['para'],
-                      textAlign: 'left',
-                    }}
-                  >
-                    Qty :&nbsp;
-                  </td>
-                  <td
-                    className="BSBillingTable5-billtable-total"
-                    style={{
-                      fontFamily: FontFamily['para'],
-                      textAlign: 'right',
-                    }}
-                  >
-                    {Qty}
-                  </td>
-                </tr>
-              </table>
-            </div>
-            <div className="BS3hold-sum">
-              {OrderCardDetail?.length > 0 &&
-                ParkingDisplay &&
-                !OtherServicesglobal && (
-                  <div
-                    style={{
-                      width: '1.5rem',
-                      color: 'rgb(18, 146, 238)',
-                      display: 'flex',
-                      alignItems: 'center',
-                      height: '2.46rem',
-                    }}
-                  >
-                    <BSOtherServiceClaim />
-                  </div>
-                )}
-              {!OtherServicesglobal && unpaidFlow == true ? (
-                <TooltipWrapper title="Print Bill" isMobile={isMobile}>
-                  {' '}
-                  <PozoBillIcon
-                    className="Hover"
-                    style={{
-                      fontSize: '25px',
-                      cursor: 'pointer',
-                      color: unpaidFlow ? '#52c41a' : '#1292EE',
-                    }}
-                    onClick={() => {
-                      Recipt();
-                    }}
-                  />
-                </TooltipWrapper>
-              ) : (
-                ''
-              )}
-              <div className="Table5-Price-summarypop">
-                <Popover
-                  content={
-                    <>
-                      <a onClick={hide}>
-                        <AiOutlineClose color="#000" />
-                      </a>
-
-                      <BSSummery1 />
-                    </>
-                  }
-                  trigger="click"
-                  open={open2}
-                  onOpenChange={handleOpenChange2}
-                >
-                  <TooltipWrapper title="Summary" isMobile={isMobile}>
-                    {!open2 ? (
-                      <UpCircleOutlined
-                        style={{
-                          fontSize: '23px',
-                          cursor: 'pointer',
-                          color: '#1292EE',
-                        }}
-                        onClick={handleIconClick}
-                      />
-                    ) : (
-                      <DownCircleOutlined
-                        style={{
-                          fontSize: '23px',
-                          cursor: 'pointer',
-                          color: '#1292EE',
-                        }}
-                        onClick={handleIconClick}
-                      />
-                    )}
-                  </TooltipWrapper>
-                </Popover>
-              </div>
-            </div>
-          </div>
-          <div style={{ justifyContent: 'center' }} className="CustomerAddSrch">
-            <div style={{ height: '2.1rem' }}>
-              {tableOptions
-                .filter((item) => item.OptionName === 'AddCustomer')
-                .map((filteredItem) => (
-                  <React.Fragment key={filteredItem.TemplateOptionsId}>
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        columnGap: '0.5rem',
-                      }}
-                    >
-                      <BSCustomerSelect />
-
-                      <TooltipWrapper
-                        title={'Add Customer'}
-                        isMobile={isMobile}
-                      >
-                        {' '}
-                        <PozoAddCustomerIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={handleAddCustomer}
-                          style={{
-                            fontSize: '25px',
-                            color:
-                              selOption || GetCustId ? '#52c41a' : '#1292EE',
-                            cursor: Custdisable ? 'not-allowed' : 'pointer',
-                          }}
-                        />
-                      </TooltipWrapper>
-                    </div>
-                  </React.Fragment>
-                ))}
-            </div>
-            {paybtns?.length > 1 && (
+          <div className="BSBillingTable-ftr">
+            {screenwidth <= 768 && (
               <div
+                className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
                 style={{
-                  pointerEvents:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 'none'
-                      : 'auto',
-                  opacity:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 0.5
-                      : 1,
-                  width: '2rem',
+                  transition: 'max-height 0.3s ease-in-out',
+                  overflow: 'scroll',
+                  maxHeight: responsiveBill ? '190px' : '0px',
                 }}
               >
-                {!OtherServicesglobal && (
-                  <TooltipWrapper title="Split Payment" isMobile={isMobile}>
-                    {' '}
+                {Array.isArray(OrderCardDetail) &&
+                  OrderCardDetail?.length >= 1 &&
+                  (isMobile || screenwidth <= 768) && <BsBill />}
+              </div>
+            )}
+            {screenwidth <= 768 && (
+              <div
+                style={{
+                  display: 'flex',
+                  alignItems: 'flex-end',
+                  justifyContent: 'flex-end',
+                  width: '100%',
+                }}
+              >
+                {Array.isArray(OrderCardDetail) &&
+                  OrderCardDetail?.length >= 1 && (
+                    <div
+                      onClick={handleResponsiveBill}
+                      className="Btn-responsiveBill"
+                      style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
+                    >
+                      {responsiveBill ? (
+                        <div
+                          style={{
+                            width: '28px',
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '26px',
+                          }}
+                        >
+                          {' '}
+                          <PozoCartIcon />{' '}
+                        </div>
+                      ) : (
+                        <div
+                          style={{
+                            width: '28px',
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '26px',
+                          }}
+                        >
+                          {' '}
+                          <PozoCartIcon />{' '}
+                        </div>
+                      )}
+                    </div>
+                  )}
+              </div>
+            )}
+            <div className="BSBillingTable-billtable">
+              <div className="BSBillingTable5-payOpt">
+                <div className="payrow1">
+                  <Messages
+                    messageType={messageType}
+                    messageData={messageData}
+                  />
+                </div>
+
+                <div className="payrow2">
+                  <TooltipWrapper
+                    // title={'Payment Mode (SHIFT + M)'}
+                    isMobile={isMobile}
+                    placement={'left'}
+                  >
+                    <div
+                      className="BSBillingTable5-payOptions"
+                      style={{
+                        pointerEvents:
+                          (BookingType === 'Dine In' ||
+                            BookingTypeBoth ||
+                            CheckOrderType?.length > 0) &&
+                          !unpaidFlow &&
+                          OrderStatus
+                            ? 'none'
+                            : 'auto',
+                        opacity:
+                          (BookingType === 'Dine In' ||
+                            BookingTypeBoth ||
+                            CheckOrderType?.length > 0) &&
+                          !unpaidFlow &&
+                          OrderStatus
+                            ? 0.5
+                            : 1,
+                      }}
+                    >
+                      {paybtns?.length > 0 &&
+                      currentOrderNetAmount >= previousNetAmount ? (
+                        paybtns?.map((payment) => (
+                          <div className="Table3-cash">
+                            <button
+                              className={
+                                paybtnselected === payment.ModeId &&
+                                (UpinotSelected || CardoptionnotSelected)
+                                  ? 'Btn-payment-mode-notupisel'
+                                  : paybtnselected === payment.ModeId &&
+                                      (!UpinotSelected ||
+                                        !CardoptionnotSelected)
+                                    ? 'Btn-payment-mode'
+                                    : 'Btn-payment-mode-sel'
+                              }
+                              style={{
+                                fontFamily: FontFamily['para'],
+                                position: 'relative',
+                                animation: blink
+                                  ? 'blink-animation 0.5s infinite alternate'
+                                  : 'none',
+                              }}
+                              onClick={() =>
+                                payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
+                                  ? handleUPIButtonClick(
+                                      payment.ModeId,
+                                      payment.ModeName
+                                    )
+                                  : handlePaymentMode(
+                                      payment.ModeId,
+                                      payment.ModeName
+                                    )
+                              }
+                            >
+                              <div
+                                style={{
+                                  display: 'flex',
+                                  flexDirection: 'row',
+                                  columnGap: '0.5rem',
+                                }}
+                              >
+                                {payment.ModeName}
+                                {payment?.ModeName?.toLowerCase() ===
+                                  'card' && (
+                                  <CardPopover
+                                    CardPayOption={CardPayOption}
+                                    SelectedCardOption={SelectedCardOption}
+                                    AddCardOption={AddCardOption}
+                                    CardOptionOpen={CardOptionOpen}
+                                    EnableCardOptions={EnableCardOptions}
+                                    paygate={paygate}
+                                    paydevice={paydevice}
+                                  />
+                                )}
+                                {payment?.ModeName?.toLowerCase() === 'upi' && (
+                                  <UpiPopover
+                                    defaultPaymentMode={defaultPaymentMode}
+                                    defaultEnabled={defaultEnabled}
+                                    setDefaultEnabled={setDefaultEnabled}
+                                    UpiOptionOpen={UpiOptionOpen}
+                                    UpiPayOption={UpiPayOption}
+                                    SelectedUPIPayOption={SelectedUPIPayOption}
+                                    AddUPIPaymentOption={AddUPIPaymentOption}
+                                    PaymentUpiOptions={PaymentUpiOptions}
+                                    UpiOption={UpiOption}
+                                    UpiId={UpiId}
+                                    paygate={paygate}
+                                    paydevice={paydevice}
+                                    EnableUpiOptions={EnableUpiOptions}
+                                    BusinessPayOption={BusinessPayOption}
+                                    PaymentgatewayUPI={PaymentgatewayUPI}
+                                    PaymentDeviceUPI={PaymentDeviceUPI}
+                                    SelectedUpiOption={SelectedUpiOption}
+                                    addUpiOption={addUpiOption}
+                                    hideDefault={hideDefault}
+                                  />
+                                )}
+                              </div>
+                            </button>
+                          </div>
+                        ))
+                      ) : currentOrderNetAmount < previousNetAmount &&
+                        salesBillEdit &&
+                        refundPayBtns.length > 0 ? (
+                        refundPayBtns.map((payment) => (
+                          <div className="Table3-cash">
+                            <button
+                              className={
+                                refundPaySelected === payment.ConfigId &&
+                                (UpinotSelected || CardoptionnotSelected)
+                                  ? 'Btn-payment-mode-notupisel'
+                                  : refundPaySelected === payment.ConfigId &&
+                                      (!UpinotSelected ||
+                                        !CardoptionnotSelected)
+                                    ? 'Btn-payment-mode'
+                                    : 'Btn-payment-mode-sel'
+                              }
+                              style={{
+                                fontFamily: FontFamily['para'],
+                                position: 'relative',
+                                animation: blink
+                                  ? 'blink-animation 0.5s infinite alternate'
+                                  : 'none',
+                              }}
+                              onClick={() =>
+                                handleRefundPaymentMode(
+                                  payment?.ConfigId,
+                                  payment?.ConfigName
+                                )
+                              }
+                            >
+                              {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+
+                              <div
+                                style={{
+                                  display: 'flex',
+                                  flexDirection: 'row',
+                                  columnGap: '0.5rem',
+                                }}
+                              >
+                                {payment.ConfigName}
+                              </div>
+                            </button>
+                          </div>
+                        ))
+                      ) : (
+                        <div
+                          onClick={handlepaymentoptions}
+                          style={{ cursor: 'pointer' }}
+                          className="payment-error-msg"
+                        >
+                          Please Set Payment Options
+                        </div>
+                      )}
+                    </div>
+                  </TooltipWrapper>
+                </div>
+
+                <div />
+              </div>
+
+              <div className="">
+                <table className="BSBillingTable5-billtablediv ">
+                  <tr className="BSBillingTable2-table-tr">
+                    <td
+                      className="BSBillingTable5-billtable-td"
+                      style={{
+                        fontFamily: FontFamily['para'],
+                        textAlign: 'left',
+                      }}
+                    >
+                      Items :&nbsp;
+                    </td>
+                    <td
+                      className="BSBillingTable5-billtable-td"
+                      style={{
+                        fontFamily: FontFamily['para'],
+                        textAlign: 'right',
+                      }}
+                    >
+                      {TotalItems}{' '}
+                    </td>
+                  </tr>
+                  <tr className="BSBillingTable2-table-tr">
+                    <td
+                      className="BSBillingTable5-billtable-total"
+                      style={{
+                        fontFamily: FontFamily['para'],
+                        textAlign: 'left',
+                      }}
+                    >
+                      Qty :&nbsp;
+                    </td>
+                    <td
+                      className="BSBillingTable5-billtable-total"
+                      style={{
+                        fontFamily: FontFamily['para'],
+                        textAlign: 'right',
+                      }}
+                    >
+                      {Qty}
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <div className="BS3hold-sum">
+                {OrderCardDetail?.length > 0 &&
+                  ParkingDisplay &&
+                  !OtherServicesglobal && (
                     <div
-                      className="BSBillingNav-icon-table-icon"
-                      onClick={
-                        CheckBookingStatus != 'Close' && !addnewAccess
-                          ? SplitPaymentOpen
-                          : ''
-                      }
                       style={{
                         width: '1.5rem',
-                        cursor:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'not-allowed'
-                            : 'pointer',
-                        color:
-                          OrderCardDetail?.length === 0 ||
-                            CheckBookingStatus == 'Close' ||
-                            addnewAccess
-                            ? 'gray'
-                            : 'rgb(18, 146, 238)',
+                        color: 'rgb(18, 146, 238)',
                         display: 'flex',
                         alignItems: 'center',
                         height: '2.46rem',
                       }}
                     >
-                      <PozoSplitPaymentIcon />
+                      <BSOtherServiceClaim />
                     </div>
-                  </TooltipWrapper>
-                )}
-              </div>
-            )}
-          </div>
-
-          {/* btns */}
-
-          <div className="BSBIllingTable5-btns">
-            {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
-              .length === 1 || navCust === true ? (
-              <div style={{ width: '2rem' }}>
-                {Object.keys(useOptions)?.length > 0 &&
-                  useOptions?.some((flow) =>
-                    flow.OptionDetails.some(
-                      (option) =>
-                        option.OptionName === 'Pay at the counter' &&
-                        option.ModeDetails.some(
-                          (mode) => mode.ModeName === 'Credit'
-                        )
-                    )
-                  ) &&
-                  !OtherServicesglobal && (
-                    <React.Fragment key="CreditCustomerFragment">
-                      <TooltipWrapper
-                        title="Advance Amount"
-                        isMobile={isMobile}
-                      >
-                        {' '}
-                        <PozoAdvanceIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={CreditCustomerFun}
-                          style={{
-                            cursor:
-                              OrderCardDetail?.length > 0 && 'not-allowed',
-                            color:
-                              OrderCardDetail?.length > 0 ||
-                                (selOption?.value === undefined &&
-                                  GlobalAddCustomerDetails1?.length === 0 &&
-                                  GetCustId?.CustMobile === undefined)
-                                ? 'gray'
-                                : 'rgb(18, 146, 238)',
-                            fontSize: '28px',
-                          }}
-                        />
-                      </TooltipWrapper>
-                    </React.Fragment>
                   )}
-              </div>
-            ) : (
-              ''
-            )}
-            {/* Customer Orders */}
-            {GetCustId && (
-              <Tooltip title="Customer Orders" isMobile={isMobile}>
-                {' '}
-                <div
-                  className="BSBillingNav-icon-table-icon"
-                  onClick={() => {
-                    if (
-                      CheckBookingStatus !== 'Close' &&
-                      !addnewAccess &&
-                      !(OrderCardDetail?.length > 0)
-                    ) {
-                      setCustomerPreviesOrders(true);
+                {!OtherServicesglobal && unpaidFlow == true ? (
+                  <TooltipWrapper title="Print Bill" isMobile={isMobile}>
+                    {' '}
+                    <PozoBillIcon
+                      className="Hover"
+                      style={{
+                        fontSize: '25px',
+                        cursor: 'pointer',
+                        color: unpaidFlow ? '#52c41a' : '#1292EE',
+                      }}
+                      onClick={() => {
+                        Recipt();
+                      }}
+                    />
+                  </TooltipWrapper>
+                ) : (
+                  ''
+                )}
+                <div className="Table5-Price-summarypop">
+                  <Popover
+                    content={
+                      <>
+                        <a onClick={hide}>
+                          <AiOutlineClose color="#000" />
+                        </a>
+
+                        <BSSummery1 />
+                      </>
                     }
-                  }}
-                  style={{
-                    cursor: OrderCardDetail?.length > 0 && 'not-allowed',
-                    color:
-                      OrderCardDetail?.length > 0 ||
-                        (OrderCardDetail?.length > 0 &&
-                          GetCustId?.CustMobile === undefined)
-                        ? 'gray'
-                        : 'rgb(18, 146, 238)',
-                    fontSize: '25px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                    width: '1.5rem',
-                  }}
-                >
-                  <FaCartPlus />
+                    trigger="click"
+                    open={open2}
+                    onOpenChange={handleOpenChange2}
+                  >
+                    <TooltipWrapper title="Summary" isMobile={isMobile}>
+                      {!open2 ? (
+                        <UpCircleOutlined
+                          style={{
+                            fontSize: '23px',
+                            cursor: 'pointer',
+                            color: '#1292EE',
+                          }}
+                          onClick={handleIconClick}
+                        />
+                      ) : (
+                        <DownCircleOutlined
+                          style={{
+                            fontSize: '23px',
+                            cursor: 'pointer',
+                            color: '#1292EE',
+                          }}
+                          onClick={handleIconClick}
+                        />
+                      )}
+                    </TooltipWrapper>
+                  </Popover>
                 </div>
-              </Tooltip>
-            )}
-            {tabledata?.length > 0 && dinePreference && (
-              <div style={{ width: '2rem' }}>
+              </div>
+            </div>
+            <div
+              style={{ justifyContent: 'center' }}
+              className="CustomerAddSrch"
+            >
+              <div style={{ height: '2.1rem' }}>
                 {tableOptions
-                  .filter((item) => item.OptionName === 'UnpaidBill')
+                  .filter((item) => item.OptionName === 'AddCustomer')
                   .map((filteredItem) => (
                     <React.Fragment key={filteredItem.TemplateOptionsId}>
-                      {!OtherServicesglobal && (
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          columnGap: '0.5rem',
+                        }}
+                      >
+                        <BSCustomerSelect />
+
                         <TooltipWrapper
-                          title="Unpaid Bills"
+                          title={'Add Customer'}
                           isMobile={isMobile}
                         >
                           {' '}
-                          <PozoUnpaidIcon
+                          <PozoAddCustomerIcon
                             className="BSBillingNav-icon-table-icon"
+                            onClick={handleAddCustomer}
                             style={{
-                              fontSize: '27px',
-                              cursor: 'pointer',
-                              color: unpaidFlow ? '#52c41a' : '#1292EE',
-                            }}
-                            onClick={() => {
-                              (setUnpaidOpen(true), getUnpaiddatas());
+                              fontSize: '25px',
+                              color:
+                                selOption || GetCustId ? '#52c41a' : '#1292EE',
+                              cursor: Custdisable ? 'not-allowed' : 'pointer',
                             }}
                           />
                         </TooltipWrapper>
-                      )}
+                      </div>
                     </React.Fragment>
                   ))}
               </div>
-            )}
-            {OtherServicesglobal && OrderCardDetail.length >= 1 && (
-              <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
-                {' '}
+              {paybtns?.length > 1 && (
                 <div
-                  className="BSBillingNav-icon-table-icon"
-                  onClick={
-                    // CheckBookingStatus != 'Close' && !addnewAccess?
-                    Otherservicesvehicleno
-                    // : ''
-                  }
                   style={{
-                    width: '1.5rem',
-                    cursor:
-                      OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                        ? 'not-allowed'
-                        : 'pointer',
-                    color:
-                      OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                        ? 'gray'
-                        : 'rgb(18, 146, 238)',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
+                    pointerEvents:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 'none'
+                        : 'auto',
+                    opacity:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 0.5
+                        : 1,
+                    width: '2rem',
                   }}
                 >
-                  <TfiClipboard />
-                </div>
-              </TooltipWrapper>
-            )}
-            {dinePreference && (
-              <div style={{ width: '2rem' }}>
-                {(BookingType === 'Dine In' ||
-                  BookingTypeBoth ||
-                  CheckOrderType?.length > 0) &&
-                  !unpaidFlow &&
-                  SelectedTableDetails?.length !== 0 && (
-                    <>
-                      <TooltipWrapper title="ORDER" isMobile={isMobile}>
-                        {' '}
-                        <PozoDineInIcon
-                          className={
-                            FirstPaymentclick === false && !addnewAccess
-                              ? OrderStatus
-                                ? 'Dinein-order-btn pulse-element ChairClrRed'
-                                : 'Dinein-order-btn pulse-element ChairClrGreen'
-                              : 'Dinein-order-btn-disabled pulse-element'
-                          }
-                          onClick={() =>
-                            FirstPaymentclick === false && !addnewAccess
-                              ? changeOrderStatus()
-                              : ''
-                          }
-                        />
-                      </TooltipWrapper>
-                      {FirstPaymentclick === false &&
-                        !addnewAccess &&
-                        !OrderStatus && <BSTipAmount />}
-                    </>
+                  {!OtherServicesglobal && (
+                    <TooltipWrapper title="Split Payment" isMobile={isMobile}>
+                      {' '}
+                      <div
+                        className="BSBillingNav-icon-table-icon"
+                        onClick={
+                          CheckBookingStatus != 'Close' && !addnewAccess
+                            ? SplitPaymentOpen
+                            : ''
+                        }
+                        style={{
+                          width: '1.5rem',
+                          cursor:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'not-allowed'
+                              : 'pointer',
+                          color:
+                            OrderCardDetail?.length === 0 ||
+                            CheckBookingStatus == 'Close' ||
+                            addnewAccess
+                              ? 'gray'
+                              : 'rgb(18, 146, 238)',
+                          display: 'flex',
+                          alignItems: 'center',
+                          height: '2.46rem',
+                        }}
+                      >
+                        <PozoSplitPaymentIcon />
+                      </div>
+                    </TooltipWrapper>
                   )}
-              </div>
-            )}
-            {!OtherServicesglobal && (
-              <div style={{ width: '6rem' }}>
-                {tableOptions?.map((item) => (
-                  <>
-                    {unpaidFlow == false
-                      ? item?.OptionName == 'Hold' &&
-                      !BookingTypeBoth &&
-                      BookingType !== 'Dine In' &&
-                      OrderCardDetail?.length != 0 &&
-                      CheckOrderType?.length === 0 &&
-                      OrderType != 'Failed' &&
-                      paybtns?.length > 0 &&
-                      CheckBookingStatus != 'Close' &&
-                      !addnewAccess && (
-                        <TooltipWrapper title={'Hold'} isMobile={isMobile}>
-                          <button
-                            className="BSBIllingTable5-cnclbtn"
-                            onClick={() => AddBookingDetails('Hold')}
-                            style={{
-                              color: 'default',
-                              backgroundColor: '#eef3f3',
-                            }}
-                          >
-                            <p className="BigScreen">HOLD ✋</p>
-                            <span className="SmallScreen">✋</span>
-                          </button>
-                        </TooltipWrapper>
+                </div>
+              )}
+            </div>
+
+            {/* btns */}
+
+            <div className="BSBIllingTable5-btns">
+              {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
+                .length === 1 || navCust === true ? (
+                <div style={{ width: '2rem' }}>
+                  {Object.keys(useOptions)?.length > 0 &&
+                    useOptions?.some((flow) =>
+                      flow.OptionDetails.some(
+                        (option) =>
+                          option.OptionName === 'Pay at the counter' &&
+                          option.ModeDetails.some(
+                            (mode) => mode.ModeName === 'Credit'
+                          )
                       )
-                      : ''}
-                    {unpaidFlow === false &&
-                      item?.OptionName === 'Hold' &&
-                      !BookingTypeBoth &&
-                      BookingType !== 'Dine In' &&
-                      Holddata?.length > 0 &&
-                      OrderCardDetail?.length === 0 &&
-                      paybtns?.length > 0 &&
-                      CheckBookingStatus != 'Close' &&
-                      !addnewAccess && (
-                        <TooltipWrapper title={'Recall'} isMobile={isMobile}>
-                          <Badge count={Holddata?.length}>
-                            <button
-                              className="BSBIllingTable5-cnclbtn"
-                              onClick={() => HandleholdModelOpen()}
-                              style={{
-                                color: Holddata ? '#000000' : 'default',
-                                pointerEvents:
-                                  OrderType === 'Failed' ? 'none' : 'auto',
-                              }}
-                            >
-                              <p className="BigScreen">Recall</p>
-                              <span className="SmallScreen">✋</span>
-                            </button>
-                          </Badge>
+                    ) &&
+                    !OtherServicesglobal && (
+                      <React.Fragment key="CreditCustomerFragment">
+                        <TooltipWrapper
+                          title="Advance Amount"
+                          isMobile={isMobile}
+                        >
+                          {' '}
+                          <PozoAdvanceIcon
+                            className="BSBillingNav-icon-table-icon"
+                            onClick={CreditCustomerFun}
+                            style={{
+                              cursor:
+                                OrderCardDetail?.length > 0 && 'not-allowed',
+                              color:
+                                OrderCardDetail?.length > 0 ||
+                                (selOption?.value === undefined &&
+                                  GlobalAddCustomerDetails1?.length === 0 &&
+                                  GetCustId?.CustMobile === undefined)
+                                  ? 'gray'
+                                  : 'rgb(18, 146, 238)',
+                              fontSize: '28px',
+                            }}
+                          />
                         </TooltipWrapper>
-                      )}
-                  </>
-                ))}
-              </div>
-            )}
-            <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
-              <button
-                className={
-                  // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
-                  addnewAccess
-                    ? 'BSBIllingTable5-paybtn-noitems-disable'
-                    : FirstPaymentclick === false &&
-                      OrderCardDetail?.length > 0 &&
-                      paybtnselected &&
-                      CheckBookingStatus != 'Close'
-                      ? !OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ?
-                        'BSBIllingTable5-paybtn-noitems'
-                        : 'BSBIllingTable5-paybtn-noitems'
-                        : 'BSBIllingTable5-paybtn-noitems Order'
-                      : 'BSBIllingTable5-paybtn-noitems-disable'
-                }
-                // onClick={() => {
-                //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
-                // }}
-                onClick={
-                  // BranchFinancialStatus==='N'? financialYearError:
-                  handleButtonClick
-                }
-              >
-                {!OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <div>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</div> : (
-                  <>
-                    {/* ₹ {Math.round(TotalAmount)}  */}
-                    {isMobile ? (
-                      `₹ ${safeRound(
-                        OrderType === 'Failed'
-                          ? FailedTotalAmt
-                          : credit && overAllBal >= 0
-                            ? Math.max(0, TotalAmount - overAllBal)
-                            : TotalAmount
-                      )}`
-                    ) : (
+                      </React.Fragment>
+                    )}
+                </div>
+              ) : (
+                ''
+              )}
+              {/* Customer Orders */}
+              {GetCustId && (
+                <Tooltip title="Customer Orders" isMobile={isMobile}>
+                  {' '}
+                  <div
+                    className="BSBillingNav-icon-table-icon"
+                    onClick={() => {
+                      if (
+                        CheckBookingStatus !== 'Close' &&
+                        !addnewAccess &&
+                        !(OrderCardDetail?.length > 0)
+                      ) {
+                        setCustomerPreviesOrders(true);
+                      }
+                    }}
+                    style={{
+                      cursor: OrderCardDetail?.length > 0 && 'not-allowed',
+                      color:
+                        OrderCardDetail?.length > 0 ||
+                        (OrderCardDetail?.length > 0 &&
+                          GetCustId?.CustMobile === undefined)
+                          ? 'gray'
+                          : 'rgb(18, 146, 238)',
+                      fontSize: '25px',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                      width: '1.5rem',
+                    }}
+                  >
+                    <FaCartPlus />
+                  </div>
+                </Tooltip>
+              )}
+              {tabledata?.length > 0 && dinePreference && (
+                <div style={{ width: '2rem' }}>
+                  {tableOptions
+                    .filter((item) => item.OptionName === 'UnpaidBill')
+                    .map((filteredItem) => (
+                      <React.Fragment key={filteredItem.TemplateOptionsId}>
+                        {!OtherServicesglobal && (
+                          <TooltipWrapper
+                            title="Unpaid Bills"
+                            isMobile={isMobile}
+                          >
+                            {' '}
+                            <PozoUnpaidIcon
+                              className="BSBillingNav-icon-table-icon"
+                              style={{
+                                fontSize: '27px',
+                                cursor: 'pointer',
+                                color: unpaidFlow ? '#52c41a' : '#1292EE',
+                              }}
+                              onClick={() => {
+                                (setUnpaidOpen(true), getUnpaiddatas());
+                              }}
+                            />
+                          </TooltipWrapper>
+                        )}
+                      </React.Fragment>
+                    ))}
+                </div>
+              )}
+              {OtherServicesglobal && OrderCardDetail.length >= 1 && (
+                <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
+                  {' '}
+                  <div
+                    className="BSBillingNav-icon-table-icon"
+                    onClick={
+                      // CheckBookingStatus != 'Close' && !addnewAccess?
+                      Otherservicesvehicleno
+                      // : ''
+                    }
+                    style={{
+                      width: '1.5rem',
+                      cursor:
+                        OrderCardDetail?.length === 0 ||
+                        CheckBookingStatus == 'Close' ||
+                        addnewAccess
+                          ? 'not-allowed'
+                          : 'pointer',
+                      color:
+                        OrderCardDetail?.length === 0 ||
+                        CheckBookingStatus == 'Close' ||
+                        addnewAccess
+                          ? 'gray'
+                          : 'rgb(18, 146, 238)',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                    }}
+                  >
+                    <TfiClipboard />
+                  </div>
+                </TooltipWrapper>
+              )}
+              {dinePreference && (
+                <div style={{ width: '2rem' }}>
+                  {(BookingType === 'Dine In' ||
+                    BookingTypeBoth ||
+                    CheckOrderType?.length > 0) &&
+                    !unpaidFlow &&
+                    SelectedTableDetails?.length !== 0 && (
+                      <>
+                        <TooltipWrapper title="ORDER" isMobile={isMobile}>
+                          {' '}
+                          <PozoDineInIcon
+                            className={
+                              FirstPaymentclick === false && !addnewAccess
+                                ? OrderStatus
+                                  ? 'Dinein-order-btn pulse-element ChairClrRed'
+                                  : 'Dinein-order-btn pulse-element ChairClrGreen'
+                                : 'Dinein-order-btn-disabled pulse-element'
+                            }
+                            onClick={() =>
+                              FirstPaymentclick === false && !addnewAccess
+                                ? changeOrderStatus()
+                                : ''
+                            }
+                          />
+                        </TooltipWrapper>
+                        {FirstPaymentclick === false &&
+                          !addnewAccess &&
+                          !OrderStatus && <BSTipAmount />}
+                      </>
+                    )}
+                </div>
+              )}
+              {!OtherServicesglobal && (
+                <div style={{ width: '6rem' }}>
+                  {tableOptions?.map((item) => (
+                    <>
+                      {unpaidFlow == false
+                        ? item?.OptionName == 'Hold' &&
+                          !BookingTypeBoth &&
+                          BookingType !== 'Dine In' &&
+                          OrderCardDetail?.length != 0 &&
+                          CheckOrderType?.length === 0 &&
+                          OrderType != 'Failed' &&
+                          paybtns?.length > 0 &&
+                          CheckBookingStatus != 'Close' &&
+                          !addnewAccess && (
+                            <TooltipWrapper title={'Hold'} isMobile={isMobile}>
+                              <button
+                                className="BSBIllingTable5-cnclbtn"
+                                onClick={() => AddBookingDetails('Hold')}
+                                style={{
+                                  color: 'default',
+                                  backgroundColor: '#eef3f3',
+                                }}
+                              >
+                                <p className="BigScreen">HOLD ✋</p>
+                                <span className="SmallScreen">✋</span>
+                              </button>
+                            </TooltipWrapper>
+                          )
+                        : ''}
+                      {unpaidFlow === false &&
+                        item?.OptionName === 'Hold' &&
+                        !BookingTypeBoth &&
+                        BookingType !== 'Dine In' &&
+                        Holddata?.length > 0 &&
+                        OrderCardDetail?.length === 0 &&
+                        paybtns?.length > 0 &&
+                        CheckBookingStatus != 'Close' &&
+                        !addnewAccess && (
+                          <TooltipWrapper title={'Recall'} isMobile={isMobile}>
+                            <Badge count={Holddata?.length}>
+                              <button
+                                className="BSBIllingTable5-cnclbtn"
+                                onClick={() => HandleholdModelOpen()}
+                                style={{
+                                  color: Holddata ? '#000000' : 'default',
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
+                                }}
+                              >
+                                <p className="BigScreen">Recall</p>
+                                <span className="SmallScreen">✋</span>
+                              </button>
+                            </Badge>
+                          </TooltipWrapper>
+                        )}
+                    </>
+                  ))}
+                </div>
+              )}
+              <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
+                <button
+                  className={
+                    // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
+                    addnewAccess
+                      ? 'BSBIllingTable5-paybtn-noitems-disable'
+                      : FirstPaymentclick === false &&
+                          OrderCardDetail?.length > 0 &&
+                          paybtnselected &&
+                          CheckBookingStatus != 'Close'
+                        ? !OrderStatus
+                          ? salesBillEdit &&
+                            currentOrderNetAmount < previousNetAmount
+                            ? 'BSBIllingTable5-paybtn-noitems'
+                            : 'BSBIllingTable5-paybtn-noitems'
+                          : 'BSBIllingTable5-paybtn-noitems Order'
+                        : 'BSBIllingTable5-paybtn-noitems-disable'
+                  }
+                  // onClick={() => {
+                  //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
+                  // }}
+                  onClick={
+                    // BranchFinancialStatus==='N'? financialYearError:
+                    handleButtonClick
+                  }
+                >
+                  {!OrderStatus ? (
+                    salesBillEdit &&
+                    currentOrderNetAmount < previousNetAmount ? (
                       <div>
-                        ₹{' '}
-                        <CountUp
-                          duration={0.4}
-                          className="counter"
-                          end={safeRound(
+                        Refund: ₹
+                        {(previousNetAmount || 0) -
+                          (currentOrderNetAmount || 0)}
+                      </div>
+                    ) : (
+                      <>
+                        {/* ₹ {Math.round(TotalAmount)}  */}
+                        {isMobile ? (
+                          `₹ ${safeRound(
                             OrderType === 'Failed'
                               ? FailedTotalAmt
                               : credit && overAllBal >= 0
                                 ? Math.max(0, TotalAmount - overAllBal)
                                 : TotalAmount
-                          )}
-                        />
-                      </div>
-                    )}
-                    <ArrowRightOutlined />
-                  </>
-                ) : (
-                  <div>ORDER</div>
-                )}
-              </button>
-            </TooltipWrapper>
-          </div>
-          <DefaultModal
-            open={UpiOpen}
-            title="UPI PAYMENT"
-            width={500}
-            handleCancel={() => {
-              Upimodel('Cancel');
-            }}
-            footer={false}
-            children={
-              <div style={{ overflow: 'scroll' }}>
-                {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
-
-                <div
-                  style={{
-                    display: 'flex',
-                    flexDirection: 'column',
-                    justifyContent: 'space-evenly',
-                    alignItems: 'center',
-                  }}
-                >
-                  <div>
-                    <QrinScreen
-                      Amount={
-                        OrderType === 'Failed'
-                          ? FailedTotalAmt
-                          : Math.round(TotalAmount)
-                      }
-                      UpiId={UpiId}
-                    />
-                  </div>
-
-                  <div>
-                    <h1>
-                      {' '}
-                      RS :
-                      {OrderType === 'Failed'
-                        ? FailedTotalAmt
-                        : Math.round(TotalAmount)}{' '}
-                    </h1>
-                  </div>
-                </div>
-
-                <div className="sentok">
-                  {(selOption || SelCustId) && (
-                    <div className="sentLink" onClick={onFinalSubmit}>
-                      Sent Payment Link
-                      <img
-                        src={WpIcon}
-                        alt="Your Alt Text"
-                        style={{ width: '30px', height: '30px' }}
-                      />
-                      {/* <ArrowRightOutlined /> */}
-                    </div>
+                          )}`
+                        ) : (
+                          <div>
+                            ₹{' '}
+                            <CountUp
+                              duration={0.4}
+                              className="counter"
+                              end={safeRound(
+                                OrderType === 'Failed'
+                                  ? FailedTotalAmt
+                                  : credit && overAllBal >= 0
+                                    ? Math.max(0, TotalAmount - overAllBal)
+                                    : TotalAmount
+                              )}
+                            />
+                          </div>
+                        )}
+                        <ArrowRightOutlined />
+                      </>
+                    )
+                  ) : (
+                    <div>ORDER</div>
                   )}
+                </button>
+              </TooltipWrapper>
+            </div>
+            <DefaultModal
+              open={UpiOpen}
+              title="UPI PAYMENT"
+              width={500}
+              handleCancel={() => {
+                Upimodel('Cancel');
+              }}
+              footer={false}
+              children={
+                <div style={{ overflow: 'scroll' }}>
+                  {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
 
                   <div
                     style={{
                       display: 'flex',
-                      flexDirection: 'row-reverse',
-                      width: '100px',
+                      flexDirection: 'column',
+                      justifyContent: 'space-evenly',
+                      alignItems: 'center',
                     }}
                   >
-                    <Buttons
-                      buttonText="OK"
-                      color="901D77"
-                      icon={<ArrowRightOutlined />}
-                      handleSubmit={() => {
-                        Upimodel('Submit');
+                    <div>
+                      <QrinScreen
+                        Amount={
+                          OrderType === 'Failed'
+                            ? FailedTotalAmt
+                            : Math.round(TotalAmount)
+                        }
+                        UpiId={UpiId}
+                      />
+                    </div>
+
+                    <div>
+                      <h1>
+                        {' '}
+                        RS :
+                        {OrderType === 'Failed'
+                          ? FailedTotalAmt
+                          : Math.round(TotalAmount)}{' '}
+                      </h1>
+                    </div>
+                  </div>
+
+                  <div className="sentok">
+                    {(selOption || SelCustId) && (
+                      <div className="sentLink" onClick={onFinalSubmit}>
+                        Sent Payment Link
+                        <img
+                          src={WpIcon}
+                          alt="Your Alt Text"
+                          style={{ width: '30px', height: '30px' }}
+                        />
+                        {/* <ArrowRightOutlined /> */}
+                      </div>
+                    )}
+
+                    <div
+                      style={{
+                        display: 'flex',
+                        flexDirection: 'row-reverse',
+                        width: '100px',
                       }}
-                    />
+                    >
+                      <Buttons
+                        buttonText="OK"
+                        color="901D77"
+                        icon={<ArrowRightOutlined />}
+                        handleSubmit={() => {
+                          Upimodel('Submit');
+                        }}
+                      />
+                    </div>
                   </div>
                 </div>
-              </div>
-            }
-          />
-          {PrintOrderDetails?.length > 0 &&
-            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-              <div style={{ display: 'none' }}>
-                <PaymentPdfBooking
-                  index={index}
-                  table2Data={orderDetail}
-                  singleData2={orderDetail?.productDetails}
-                  orderId={
-                    orderDetail?.OrderId &&
-                    extractLastNumberOrderId(
-                      orderDetail?.OrderId,
-                      orderDetail?.FYStatus
-                    )
-                  }
-                  CreatedDate={orderDetail?.CreatedDate}
-                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                  Preference={SettingDataSelector}
-                  printDatas={printDatas}
-                />
-              </div>
-            ))}
-          {PrintOrderDetails?.length > 0 &&
-            (TokenOnly?.SettingValue === 'Y' ||
-              IndividualToken?.SettingValue === 'Y') &&
-            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-              <div style={{ display: 'none' }}>
-                <TokensinglePrint
-                  index={index}
-                  table2Data={orderDetail}
-                  singleData2={orderDetail?.productDetails}
-                  orderId={
-                    orderDetail?.OrderId &&
-                    extractLastNumberOrderId(
-                      orderDetail?.OrderId,
-                      orderDetail?.FYStatus
-                    )
-                  }
-                  CreatedDate={orderDetail?.CreatedDate}
-                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                />
-              </div>
-            ))}
-          {CreditCustomer && (
-            <div style={{ display: 'none' }}>
-              <BsBillingCreditCustomer
-                ModalCreditCustomer={CreditCustomer}
-                handlemodalclose={() => {
-                  handleCreditCustomer('Cancel');
-                }}
-                handleOk={() => {
-                  handleCreditCustomer('Submit');
-                }}
-              />
-            </div>
-          )}
-        </div>
-        {unpaidopen && (
-          <DefaultModal
-            open={unpaidopen}
-            title="UNPAID BILL'S"
-            width={1000}
-            handleCancel={() => {
-              setUnpaidOpen(false);
-            }}
-            footer={false}
-            children={
-              <div style={{ height: '400px', overflow: 'scroll' }}>
-                <Tables
-                  columns={columns}
-                  data={TableDat}
-                  dataSource={TableDat}
-                />
-              </div>
-            }
-          />
-        )}
-        {UnpaidConfirmation && (
-          <Modal
-            open={UnpaidConfirmation}
-            width={500}
-            children={
-              <>
-                <div>
-                  You have already selected a table. If you click 'OK,' the
-                  table selection will be removed, and the unpaid flow will
-                  continue. If you click 'Cancel,' the dine-in flow will proceed
-                  as selected.
-                </div>
-              </>
-            }
-            onOk={UnpaidOk}
-            onCancel={Unpaidclose}
-          />
-        )}
-        {Splitpayment && (
-          <SplitPayment
-            SplitPaymentModal={Splitpayment}
-            handlesplitpaymentclose={handlesplitpaymentclose}
-            TotalNetAmount={
-              OrderType === 'Failed' ? FailedTotalAmt : Math.round(OrderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
-                ((OverAllSales > 0 ? OverAllSales : 0) +
-                  (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                  (Discount > 0 ? Discount : 0)))
-            }
-            failedOrderData={failedOrderData}
-          />
-        )}
-        {PrintOrderDetails?.length > 0 && (
-          <div
-            style={{
-              display: 'flex',
-              gap: '1rem',
-              justifyContent: 'center',
-              margin: '1rem 0',
-            }}
-          >
-            {filteredSettingNames?.includes('whatsapp') &&
-              MobileNoWhatsApp?.value && (
-                <FaWhatsapp
-                  size={32}
-                  color="#25D366"
-                  style={{ cursor: 'pointer' }}
-                  onClick={handleWhatsAppClick}
-                  title="Share on WhatsApp"
-                />
+              }
+            />
+            {PrintOrderDetails?.length > 0 &&
+              PrintOrderDetails?.[0]?.OrderDetails?.map(
+                (orderDetail, index) => (
+                  <div style={{ display: 'none' }}>
+                    <PaymentPdfBooking
+                      index={index}
+                      table2Data={orderDetail}
+                      singleData2={orderDetail?.productDetails}
+                      orderId={
+                        orderDetail?.OrderId &&
+                        extractLastNumberOrderId(
+                          orderDetail?.OrderId,
+                          orderDetail?.FYStatus
+                        )
+                      }
+                      CreatedDate={orderDetail?.CreatedDate}
+                      PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                      Preference={SettingDataSelector}
+                      printDatas={printDatas}
+                    />
+                  </div>
+                )
               )}
+            {PrintOrderDetails?.length > 0 &&
+              (TokenOnly?.SettingValue === 'Y' ||
+                IndividualToken?.SettingValue === 'Y') &&
+              PrintOrderDetails?.[0]?.OrderDetails?.map(
+                (orderDetail, index) => (
+                  <div style={{ display: 'none' }}>
+                    <TokensinglePrint
+                      index={index}
+                      table2Data={orderDetail}
+                      singleData2={orderDetail?.productDetails}
+                      orderId={
+                        orderDetail?.OrderId &&
+                        extractLastNumberOrderId(
+                          orderDetail?.OrderId,
+                          orderDetail?.FYStatus
+                        )
+                      }
+                      CreatedDate={orderDetail?.CreatedDate}
+                      PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                    />
+                  </div>
+                )
+              )}
+            {CreditCustomer && (
+              <div style={{ display: 'none' }}>
+                <BsBillingCreditCustomer
+                  ModalCreditCustomer={CreditCustomer}
+                  handlemodalclose={() => {
+                    handleCreditCustomer('Cancel');
+                  }}
+                  handleOk={() => {
+                    handleCreditCustomer('Submit');
+                  }}
+                />
+              </div>
+            )}
+          </div>
+          {unpaidopen && (
+            <DefaultModal
+              open={unpaidopen}
+              title="UNPAID BILL'S"
+              width={1000}
+              handleCancel={() => {
+                setUnpaidOpen(false);
+              }}
+              footer={false}
+              children={
+                <div style={{ height: '400px', overflow: 'scroll' }}>
+                  <Tables
+                    columns={columns}
+                    data={TableDat}
+                    dataSource={TableDat}
+                  />
+                </div>
+              }
+            />
+          )}
+          {UnpaidConfirmation && (
+            <Modal
+              open={UnpaidConfirmation}
+              width={500}
+              children={
+                <>
+                  <div>
+                    You have already selected a table. If you click 'OK,' the
+                    table selection will be removed, and the unpaid flow will
+                    continue. If you click 'Cancel,' the dine-in flow will
+                    proceed as selected.
+                  </div>
+                </>
+              }
+              onOk={UnpaidOk}
+              onCancel={Unpaidclose}
+            />
+          )}
+          {Splitpayment && (
+            <SplitPayment
+              SplitPaymentModal={Splitpayment}
+              handlesplitpaymentclose={handlesplitpaymentclose}
+              TotalNetAmount={
+                OrderType === 'Failed'
+                  ? FailedTotalAmt
+                  : Math.round(
+                      OrderCardDetail?.reduce(
+                        (acc, data) => data?.TotalAmt + acc,
+                        0
+                      ) -
+                        ((OverAllSales > 0 ? OverAllSales : 0) +
+                          (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                          (Discount > 0 ? Discount : 0))
+                    )
+              }
+              failedOrderData={failedOrderData}
+            />
+          )}
+          {PrintOrderDetails?.length > 0 && (
+            <div
+              style={{
+                display: 'flex',
+                gap: '1rem',
+                justifyContent: 'center',
+                margin: '1rem 0',
+              }}
+            >
+              {filteredSettingNames?.includes('whatsapp') &&
+                MobileNoWhatsApp?.value && (
+                  <FaWhatsapp
+                    size={32}
+                    color="#25D366"
+                    style={{ cursor: 'pointer' }}
+                    onClick={handleWhatsAppClick}
+                    title="Share on WhatsApp"
+                  />
+                )}
 
-            {(filteredSettingNames?.includes('Print') ||
-              !MobileNoWhatsApp ||
-              !MobileNoWhatsApp.value) && (
+              {(filteredSettingNames?.includes('Print') ||
+                !MobileNoWhatsApp ||
+                !MobileNoWhatsApp.value) && (
                 <FaPrint
                   size={32}
                   color="#1292EE"
@@ -4543,240 +4643,245 @@ const BSBillingTable5 = () => {
                 />
               )}
 
-            {filteredSettingNames?.includes('SMS') && isMobile && (
-              <MdSms
-                size={32}
-                color="#FF8800"
-                style={{ cursor: 'pointer' }}
-                onClick={handleSMSClick}
-                title="Send SMS"
-              />
-            )}
-            {/* WhatsAppShare modal/component */}
-            {showWhatsAppShare && (
-              <WhatsAppShare
-                message={encodedMessage}
-                mobileNumber={MobileNoWhatsApp?.value}
-                onClose={() => closePrintOption(false)}
-              />
-            )}
-            {showSMSShare && isMobile && (
-              <SMSShare
-                message={encodedMessage}
-                mobileNumber={MobileNoWhatsApp?.value}
-                onClose={() => closePrintOption(false)}
-              />
-            )}
-          </div>
-        )}
-        {
-          OtherServicesPrintDetails?.length > 0 && (
-            // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <OtherServicePrintStyle1
-                // index={index}
-                table2Data={OtherServicesPrintDetails}
-                singleData2={OtherServicesPrintDetails?.productDetails}
-                orderId={
-                  OtherServicesPrintDetails?.OrderId &&
-                  extractLastNumberOrderId(
-                    OtherServicesPrintDetails?.OrderId,
-                    OtherServicesPrintDetails?.FYStatus
-                  )
-                }
-                CreatedDate={OtherServicesPrintDetails?.CreatedDate}
-                PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
-                Preference={SettingDataSelector}
-                printDatas={printDatas}
-              />
+              {filteredSettingNames?.includes('SMS') && isMobile && (
+                <MdSms
+                  size={32}
+                  color="#FF8800"
+                  style={{ cursor: 'pointer' }}
+                  onClick={handleSMSClick}
+                  title="Send SMS"
+                />
+              )}
+              {/* WhatsAppShare modal/component */}
+              {showWhatsAppShare && (
+                <WhatsAppShare
+                  message={encodedMessage}
+                  mobileNumber={MobileNoWhatsApp?.value}
+                  onClose={() => closePrintOption(false)}
+                />
+              )}
+              {showSMSShare && isMobile && (
+                <SMSShare
+                  message={encodedMessage}
+                  mobileNumber={MobileNoWhatsApp?.value}
+                  onClose={() => closePrintOption(false)}
+                />
+              )}
             </div>
-          )
-          // ))
-        }
-        <DefaultModal
-          className={'paymentoptionsModal'}
-          open={OtherServicesModal}
-          title="Vehicle No"
-          handleCancel={() => {
-            setOtherServicesModal(false);
-          }}
-          // handleSubmit={Handlevehiclenumbers}
-          footer={false}
-          children={
-            <div
-              className="paymentoptionsModalContent"
-              style={{ overflow: 'scroll' }}
-            >
-              {OrderCardDetail.map((item, i) => {
-                const isGroup = item.ServiceType === 'G';
-                const groupKey = item.id; // 🔁 using `id` for groups now
-                const uniqueKey = `${item.ServiceId}__${item.__index}`;
-
-                // For G-type: render input only once for the group
-                if (
-                  isGroup &&
-                  i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
-                ) {
-                  return null;
-                }
-
-                const qty = isGroup
-                  ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
-                    (sum, o) => sum + (o.OrderQty || 1),
-                    0
-                  )
-                  : item.OrderQty || 1;
-
-                return (
-                  <div
-                    key={isGroup ? groupKey : uniqueKey}
-                    style={{ marginBottom: 20 }}
-                  >
-                    <h4>{item.ServiceName}</h4>
-
-                    {Array.from({ length: qty }).map((_, index) => {
-                      const inputKey = isGroup
-                        ? item.id
-                        : `${item.ServiceId}__${item.__index}`;
-                      const value = vehicleInputs[inputKey]?.[index] || '';
-                      const error = errors[inputKey]?.[index] || '';
-
-                      return (
-                        <div
-                          key={`${inputKey}-${index}`}
-                          style={{ marginBottom: 10 }}
-                        >
-                          <input
-                            placeholder={`Vehicle No ${index + 1}`}
-                            value={value}
-                            onChange={(e) =>
-                              handleInputChange(
-                                isGroup ? item.id : item.ServiceId,
-                                index,
-                                e.target.value,
-                                item.ServiceType,
-                                item
-                              )
-                            }
-                            onKeyPress={(e) => {
-                              if (!/[A-Za-z0-9]/.test(e.key)) {
-                                e.preventDefault();
-                              }
-                            }}
-                            style={{
-                              width: '100%',
-                              padding: 8,
-                              borderRadius: 4,
-                              border: error
-                                ? '1px solid red'
-                                : '1px solid #ccc',
-                            }}
-                          />
-                          {error && (
-                            <span style={{ color: 'red', fontSize: 12 }}>
-                              {error}
-                            </span>
-                          )}
-                        </div>
-                      );
-                    })}
-                  </div>
-                );
-              })}
-              <div style={{ textAlign: 'right', marginTop: 16 }}>
-                <button
-                  type="button"
-                  onClick={Handlevehiclenumbers}
-                  disabled={hasVehicleInputErrors()}
-                  style={{
-                    padding: '8px 24px',
-                    fontFamily: 'Gilroy',
-                    background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
-                    color: '#fff',
-                    border: 'none',
-                    borderRadius: 4,
-                    cursor: hasVehicleInputErrors() ? 'not-allowed' : 'pointer',
-                  }}
-                >
-                  Submit
-                </button>
+          )}
+          {
+            OtherServicesPrintDetails?.length > 0 && (
+              // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <OtherServicePrintStyle1
+                  // index={index}
+                  table2Data={OtherServicesPrintDetails}
+                  singleData2={OtherServicesPrintDetails?.productDetails}
+                  orderId={
+                    OtherServicesPrintDetails?.OrderId &&
+                    extractLastNumberOrderId(
+                      OtherServicesPrintDetails?.OrderId,
+                      OtherServicesPrintDetails?.FYStatus
+                    )
+                  }
+                  CreatedDate={OtherServicesPrintDetails?.CreatedDate}
+                  PaymentStatus={
+                    OtherServicesPrintDetails?.[0]?.PaymentOrderDtl
+                  }
+                  Preference={SettingDataSelector}
+                  printDatas={printDatas}
+                />
               </div>
-            </div>
+            )
+            // ))
           }
-        />
-        <DefaultModal
-          className={'paymentoptionsModal'}
-          open={GlobalSalesPaymentoptions}
-          width={500}
-          height={1000}
-          handleCancel={() => {
-            dispatch(changeSalesPaymentoption(false));
-          }}
-          footer={false}
-          children={
-            <div
-              className="paymentoptionsModalContent"
-              style={{ overflow: 'scroll' }}
-            >
-              <Paymentoption onSuccess={getPaymentOptionFeature} />
-            </div>
-          }
-        />
-        <DefaultModal
-          open={businessUPI}
-          handleCancel={() => setShowCancelConfirm(true)}
-          footer={false}
-          width={500}
-          children={
-            <>
-              <PaymentGatewayEmbedded
-                orderId={businessUPIOrderId}
-                setBusinessUPIOrderId={setBusinessUPIOrderId}
-                businessUPILink={businessUPILink}
-                setBusinessUPI={setBusinessUPI}
-                setPaymentSuccess={setPaymentSuccess}
-                paymentSucess={paymentSucess}
-                ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
-                CustomerDisplay={CustomerDisplay}
-              />
-            </>
-          }
-        />
-        {showCancelConfirm && (
-          <Modal
-            open={showCancelConfirm}
-            title="Cancel Payment"
-            onOk={() => {
-              setBusinessUPI(false);
-              setShowCancelConfirm(false);
-              ClearAllGlobalStateDatas();
-              CustomerDisplay();
-            }}
-            onCancel={() => setShowCancelConfirm(false)}
-            okText="Yes"
-            cancelText="No"
-          >
-            Do you want to cancel the payment?
-          </Modal>
-        )}
-        {customerPreviesOrders && (
           <DefaultModal
-            open={customerPreviesOrders}
-            handleCancel={() => setCustomerPreviesOrders(false)}
+            className={'paymentoptionsModal'}
+            open={OtherServicesModal}
+            title="Vehicle No"
+            handleCancel={() => {
+              setOtherServicesModal(false);
+            }}
+            // handleSubmit={Handlevehiclenumbers}
             footer={false}
-            width={700}
-            className={'ModalPaymentGatewayEmbedded'}
+            children={
+              <div
+                className="paymentoptionsModalContent"
+                style={{ overflow: 'scroll' }}
+              >
+                {OrderCardDetail.map((item, i) => {
+                  const isGroup = item.ServiceType === 'G';
+                  const groupKey = item.id; // 🔁 using `id` for groups now
+                  const uniqueKey = `${item.ServiceId}__${item.__index}`;
+
+                  // For G-type: render input only once for the group
+                  if (
+                    isGroup &&
+                    i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
+                  ) {
+                    return null;
+                  }
+
+                  const qty = isGroup
+                    ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
+                        (sum, o) => sum + (o.OrderQty || 1),
+                        0
+                      )
+                    : item.OrderQty || 1;
+
+                  return (
+                    <div
+                      key={isGroup ? groupKey : uniqueKey}
+                      style={{ marginBottom: 20 }}
+                    >
+                      <h4>{item.ServiceName}</h4>
+
+                      {Array.from({ length: qty }).map((_, index) => {
+                        const inputKey = isGroup
+                          ? item.id
+                          : `${item.ServiceId}__${item.__index}`;
+                        const value = vehicleInputs[inputKey]?.[index] || '';
+                        const error = errors[inputKey]?.[index] || '';
+
+                        return (
+                          <div
+                            key={`${inputKey}-${index}`}
+                            style={{ marginBottom: 10 }}
+                          >
+                            <input
+                              placeholder={`Vehicle No ${index + 1}`}
+                              value={value}
+                              onChange={(e) =>
+                                handleInputChange(
+                                  isGroup ? item.id : item.ServiceId,
+                                  index,
+                                  e.target.value,
+                                  item.ServiceType,
+                                  item
+                                )
+                              }
+                              onKeyPress={(e) => {
+                                if (!/[A-Za-z0-9]/.test(e.key)) {
+                                  e.preventDefault();
+                                }
+                              }}
+                              style={{
+                                width: '100%',
+                                padding: 8,
+                                borderRadius: 4,
+                                border: error
+                                  ? '1px solid red'
+                                  : '1px solid #ccc',
+                              }}
+                            />
+                            {error && (
+                              <span style={{ color: 'red', fontSize: 12 }}>
+                                {error}
+                              </span>
+                            )}
+                          </div>
+                        );
+                      })}
+                    </div>
+                  );
+                })}
+                <div style={{ textAlign: 'right', marginTop: 16 }}>
+                  <button
+                    type="button"
+                    onClick={Handlevehiclenumbers}
+                    disabled={hasVehicleInputErrors()}
+                    style={{
+                      padding: '8px 24px',
+                      fontFamily: 'Gilroy',
+                      background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
+                      color: '#fff',
+                      border: 'none',
+                      borderRadius: 4,
+                      cursor: hasVehicleInputErrors()
+                        ? 'not-allowed'
+                        : 'pointer',
+                    }}
+                  >
+                    Submit
+                  </button>
+                </div>
+              </div>
+            }
+          />
+          <DefaultModal
+            className={'paymentoptionsModal'}
+            open={GlobalSalesPaymentoptions}
+            width={500}
+            height={1000}
+            handleCancel={() => {
+              dispatch(changeSalesPaymentoption(false));
+            }}
+            footer={false}
+            children={
+              <div
+                className="paymentoptionsModalContent"
+                style={{ overflow: 'scroll' }}
+              >
+                <Paymentoption onSuccess={getPaymentOptionFeature} />
+              </div>
+            }
+          />
+          <DefaultModal
+            open={businessUPI}
+            handleCancel={() => setShowCancelConfirm(true)}
+            footer={false}
+            width={500}
             children={
               <>
-                <CustomerOrders
-                  CustomerDetails={selOption}
-                  close={() => setCustomerPreviesOrders(false)}
+                <PaymentGatewayEmbedded
+                  orderId={businessUPIOrderId}
+                  setBusinessUPIOrderId={setBusinessUPIOrderId}
+                  businessUPILink={businessUPILink}
+                  setBusinessUPI={setBusinessUPI}
+                  setPaymentSuccess={setPaymentSuccess}
+                  paymentSucess={paymentSucess}
+                  ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
+                  CustomerDisplay={CustomerDisplay}
                 />
               </>
             }
           />
-        )}
-      </div>
+          {showCancelConfirm && (
+            <Modal
+              open={showCancelConfirm}
+              title="Cancel Payment"
+              onOk={() => {
+                setBusinessUPI(false);
+                setShowCancelConfirm(false);
+                ClearAllGlobalStateDatas();
+                CustomerDisplay();
+              }}
+              onCancel={() => setShowCancelConfirm(false)}
+              okText="Yes"
+              cancelText="No"
+            >
+              Do you want to cancel the payment?
+            </Modal>
+          )}
+          {customerPreviesOrders && (
+            <DefaultModal
+              open={customerPreviesOrders}
+              handleCancel={() => setCustomerPreviesOrders(false)}
+              footer={false}
+              width={700}
+              className={'ModalPaymentGatewayEmbedded'}
+              children={
+                <>
+                  <CustomerOrders
+                    CustomerDetails={selOption}
+                    close={() => setCustomerPreviesOrders(false)}
+                  />
+                </>
+              }
+            />
+          )}
+        </div>
+      </Suspense>
     </>
   );
 };
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BSBillingTable6.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BSBillingTable6.jsx
index 9ccb2fb..b8f4595 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BSBillingTable6.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BSBillingTable6.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { Suspense, useEffect, useState } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import { Popconfirm, Tooltip } from 'antd';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable6/BSBillingTable6.scss';
@@ -60,7 +60,9 @@ import {
   GlobalOfferAppliedProducts,
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import { AiOutlineClose, AiFillDelete } from 'react-icons/ai';
-import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
+const BSBillingEditQuantity = lazy(
+  () => import('../BSBillingEditQuantity/BSBillingEditQuantity')
+);
 import { isMobile } from 'react-device-detect';
 import WebFont from 'webfontloader';
 import dineInIcon from '../../../../../Images/Dine In.svg';
@@ -71,11 +73,17 @@ import {
   puttinghold,
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption.js';
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
-import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
-import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
 import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import { useUtilsComponent } from '../../../../../Services/utils.js';
-import CustomerPriceHistory from '../../UtillComponents/CustomerPriceHistory.jsx';
+const BSEditTotalAmt = lazy(
+  () => import('../BSEditTotalAmount/BSEditTotalAmt.jsx')
+);
+
+const BSImeiDetails = lazy(() => import('../BSImeiDetails/BSImeiDetails.jsx'));
+
+const CustomerPriceHistory = lazy(
+  () => import('../../UtillComponents/CustomerPriceHistory.jsx')
+);
 
 const BSBillingTable6 = () => {
   const { removeExtraCharge } = useUtilsComponent();
@@ -134,7 +142,8 @@ const BSBillingTable6 = () => {
   const GetCustId = useSelector(GlobalCustId);
   const selectedCustomer = useSelector(GlobalSelOption);
 
-  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] = useState(false);
+  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] =
+    useState(false);
   const [customerProduct, setCustomerProduct] = useState(null);
   const [OpenImeiDetail, setOpenImeiDetail] = useState(false);
   const [shortKeyMethod, setshortKeyMethod] = useState(null);
@@ -157,16 +166,16 @@ const BSBillingTable6 = () => {
     OrderType === 'Hold'
       ? tableData?.filter((a, b) => a.BookingTypeName === 'TakeAway')
       : tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
-      );
+          (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
+        );
   const OldtableDataDinein = tableData?.filter(
     (a, b) => a.BookingTypeName === 'Dine In' && a?.SalesId
   );
   const OldtableDataTakeAway =
     OrderType != 'Hold'
       ? tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
-      )
+          (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
+        )
       : [];
   const [OpenEditTotalAmt, setOpenEditTotalAmt] = useState(false);
   useEffect(() => {
@@ -221,9 +230,6 @@ const BSBillingTable6 = () => {
     }
   }, [tableData]);
 
-  // useEffect(() => {
-  //   setPreviousdataLength(PreviousOrderLength)
-  // }, [PreviousOrderLength])
   useEffect(() => {
     if (tableOptions?.length > 0) {
       let editFieldValue = tableOptions?.filter(
@@ -285,7 +291,6 @@ const BSBillingTable6 = () => {
         event.preventDefault();
         handleShortcut('weightAmount');
       }
-
     };
     window.addEventListener('keydown', handleKeyDown);
 
@@ -1055,9 +1060,9 @@ const BSBillingTable6 = () => {
             )?.map((item, idx) =>
               idx === 0
                 ? {
-                  ...item,
-                  FreeQty,
-                }
+                    ...item,
+                    FreeQty,
+                  }
                 : item
             ),
           };
@@ -1715,7 +1720,6 @@ const BSBillingTable6 = () => {
                 OfferId: FreeProd?.OfferId,
                 CompleteRemove: true,
               });
-              // await ChangeOfferAppliedProdsFn(isPaidproduct?.InwardDtlId, (isPaidproduct?.OrderRate * isPaidproduct?.OrderQty), isPaidproduct?.OrderQty, true, insideinwardDtlId true)
               await ChangeOfferAppliedProdsFn({
                 inwardDtlId: item?.InwardDtlId,
                 OfferAmount: isPaidproduct?.OrderRate * isPaidproduct?.OrderQty,
@@ -1725,8 +1729,6 @@ const BSBillingTable6 = () => {
               });
             }
           } else {
-            //have to find if thereis two Booking Type is there
-            //Convert That Free Product To Paid Product
             let ischeckBothBookingType = tableData?.find(
               (e) =>
                 e?.InwardDtlId == inward &&
@@ -1741,12 +1743,6 @@ const BSBillingTable6 = () => {
                 e?.BookingTypeName == item?.BookingTypeName
             );
             if (ischeckBothBookingType) {
-              //Convert That Free Product To Paid Product
-
-              //merge that paid product with same booking type
-              //decrease free prod list qty
-              //change offer applied product qty
-              // await ChangeOrderCardDetailsFn(item?.BookingTypeName, null, ischeckBothBookingType?.OrderQty + FreeProductSameBookingType?.OrderQty, false, ischeckBothBookingType?.InwardDtlId, item?.InwardDtlId, item?.Offer, true)
               if (FreeProductSameBookingType?.OrderQty >= item?.OrderQty) {
                 await ChangeFreeprodlistFn({
                   OverAllFreeQty: FreeProd?.OverAllFreeQty - item?.OrderQty,
@@ -1779,7 +1775,6 @@ const BSBillingTable6 = () => {
                 });
               } else {
                 let data = isCheckFreeProductOutside?.FreeQty - item?.OrderQty;
-                //First i Calculate Another Booking Type Qty
                 let anotherBookingType = tableData?.find(
                   (e) =>
                     e?.InwardDtlId == item?.InwardDtlId &&
@@ -1796,24 +1791,10 @@ const BSBillingTable6 = () => {
                 let diff =
                   item?.OrderQty - FreeProductSameBookingType?.OrderQty;
 
-                //SameBookingFreeQty
-                //FreeProductSameBookingType?.OrderQty
-
-                //Another BookingType Paid Qty
-                //anotherBookingType
-
-                //anotherBookingType?.Free OrderQty
-                //ischeckBothBookingType
-
-                //anotherBookingType?.OrderQty-ischeckBothBookingType?.OrderQty
-                //convert another Booking Type Qty also Free to Paid
-
                 if (
                   (anotherBookingType?.OrderQty || 0) <
                   anotherBookingTypeOffer?.OrderQty
                 ) {
-                  //paidproduct                         ischeckBothBookingType?.OrderQty-anotherBookingType?.OrderQty
-                  //PaidProdcut Current BookingType    FreeProductSameBookingType?.OrderQty
                   let paidproductAnotherType =
                     ischeckBothBookingType?.OrderQty -
                     anotherBookingType?.OrderQty;
@@ -1965,144 +1946,7 @@ const BSBillingTable6 = () => {
         }
       }
     }
-
   };
-  // const removeFromCart = async (item) => {
-  //   setPreviousdataLength(tableData?.length);
-  //   if (item?.BookingTypeName !== 'Dine In' && OrderType !== 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName !== 'Dine In' && OrderType === 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName === 'Dine In') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     ); // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderProductDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(ChangeSelectedCustDisable(false));
-  //       await dispatch(changeSelectedOption(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   }
-  // };
 
   function safeRound(amountStr) {
     if (amountStr == null) return allowDecimal ? '0.00' : '0';
@@ -2118,7 +1962,7 @@ const BSBillingTable6 = () => {
   const handleCustomerProductPriceHistory = (item) => {
     setCustomerPriceHistoryOpen(true);
     setCustomerProduct(item?.ProdId);
-  }
+  };
 
   const OpenEditTotalAmount = () => {
     setOpenEditTotalAmt(true);
@@ -2142,612 +1986,616 @@ const BSBillingTable6 = () => {
   };
 
   return (
-    <div
-      className={
-        true
-          ? 'BillingTable6-Structure2 BillingTable6-Structure'
-          : 'BillingTable6-Structure'
-      }
-    >
-      <table className="BillingTable6-Table1">
-        <thead className="BillingTable6Table1-head">
-          <tr
-            style={{
-              color: SelectedBillColor?.['FontColor'],
-              backgroundColor: SelectedBillColor?.['BackgroundColor'],
-              fontFamily: SelectedFont,
-            }}
-          >
-            {tableOptions?.map((item) => (
-              <>
-                {item.OptionName == 'Sl.No' && BookingTypeBoth && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '10px',
-                      padding: '1px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Serial Number">{''}</Tooltip>
-                    ) : (
-                      <div>{''}</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Sl.No' && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '10px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Serial Number">Sl.No</Tooltip>
-                    ) : (
-                      <div>Sl.No</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Item' && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Item Name">Item</Tooltip>
-                    ) : (
-                      <div> Item </div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'MRP' && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="MRP">MRP</Tooltip>
-                    ) : (
-                      <div>MRP</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Discount' && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Discount">₹/%</Tooltip>
-                    ) : (
-                      <div>₹/% </div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Quantity' && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '20px',
-                    }}
-                    // onClick={tableData?.length > 0 ? OpenEditTotalAmount : ""}
-                    onClick={() => {
-                      if (tableData?.length > 0) {
-                        OpenEditTotalAmount();
-                      }
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Quantity">Qty</Tooltip>
-                    ) : (
-                      <div>Qty</div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Rate' && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Rate">Rt</Tooltip>
-                    ) : (
-                      <div> Rt </div>
-                    )}
-                  </th>
-                )}
-                {item.OptionName == 'Amount' && (
-                  <th
-                    className="BillingTable6-table-th"
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '20px',
-                    }}
-                  >
-                    {!isMobile ? (
-                      <Tooltip title="Amount">Amt</Tooltip>
-                    ) : (
-                      <div>Amt</div>
-                    )}
-                  </th>
-                )}
+    <Suspense fallback={<div>Loading...</div>}>
+      <div
+        className={
+          true
+            ? 'BillingTable6-Structure2 BillingTable6-Structure'
+            : 'BillingTable6-Structure'
+        }
+      >
+        <table className="BillingTable6-Table1">
+          <thead className="BillingTable6Table1-head">
+            <tr
+              style={{
+                color: SelectedBillColor?.['FontColor'],
+                backgroundColor: SelectedBillColor?.['BackgroundColor'],
+                fontFamily: SelectedFont,
+              }}
+            >
+              {tableOptions?.map((item) => (
+                <>
+                  {item.OptionName == 'Sl.No' && BookingTypeBoth && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '10px',
+                        padding: '1px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Serial Number">{''}</Tooltip>
+                      ) : (
+                        <div>{''}</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Sl.No' && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '10px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Serial Number">Sl.No</Tooltip>
+                      ) : (
+                        <div>Sl.No</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Item' && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Item Name">Item</Tooltip>
+                      ) : (
+                        <div> Item </div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'MRP' && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="MRP">MRP</Tooltip>
+                      ) : (
+                        <div>MRP</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Discount' && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Discount">₹/%</Tooltip>
+                      ) : (
+                        <div>₹/% </div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Quantity' && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '20px',
+                      }}
+                      // onClick={tableData?.length > 0 ? OpenEditTotalAmount : ""}
+                      onClick={() => {
+                        if (tableData?.length > 0) {
+                          OpenEditTotalAmount();
+                        }
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Quantity">Qty</Tooltip>
+                      ) : (
+                        <div>Qty</div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Rate' && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Rate">Rt</Tooltip>
+                      ) : (
+                        <div> Rt </div>
+                      )}
+                    </th>
+                  )}
+                  {item.OptionName == 'Amount' && (
+                    <th
+                      className="BillingTable6-table-th"
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '20px',
+                      }}
+                    >
+                      {!isMobile ? (
+                        <Tooltip title="Amount">Amt</Tooltip>
+                      ) : (
+                        <div>Amt</div>
+                      )}
+                    </th>
+                  )}
 
-                {item.OptionName == 'Delete' && (
-                  <th
-                    style={{
-                      fontFamily: SelectedFont,
-                      fontWeight: '600',
-                      fontSize: '16px',
-                      width: '10px',
-                    }}
-                    className="BillingTable6-table-th"
-                  >
-                    {tableData?.length > 0 ? (
-                      <Popconfirm
-                        title="Delete the items"
-                        description="Are you sure you want to clear these items?"
-                        okText="Yes"
-                        placement="leftTop"
-                        cancelText="No"
-                        onConfirm={() => {
-                          Clearall();
-                        }}
-                      >
+                  {item.OptionName == 'Delete' && (
+                    <th
+                      style={{
+                        fontFamily: SelectedFont,
+                        fontWeight: '600',
+                        fontSize: '16px',
+                        width: '10px',
+                      }}
+                      className="BillingTable6-table-th"
+                    >
+                      {tableData?.length > 0 ? (
+                        <Popconfirm
+                          title="Delete the items"
+                          description="Are you sure you want to clear these items?"
+                          okText="Yes"
+                          placement="leftTop"
+                          cancelText="No"
+                          onConfirm={() => {
+                            Clearall();
+                          }}
+                        >
+                          <div className="del-all-btn">
+                            {' '}
+                            {!isMobile ? (
+                              <Tooltip title="Delete All" placement="left">
+                                {' '}
+                                <AiFillDelete />{' '}
+                              </Tooltip>
+                            ) : (
+                              <div>
+                                {' '}
+                                <AiFillDelete />{' '}
+                              </div>
+                            )}{' '}
+                          </div>
+                        </Popconfirm>
+                      ) : (
                         <div className="del-all-btn">
-                          {' '}
                           {!isMobile ? (
-                            <Tooltip title="Delete All" placement="left">
-                              {' '}
-                              <AiFillDelete />{' '}
+                            <Tooltip title="Delete" placement="left">
+                              <AiFillDelete />
                             </Tooltip>
                           ) : (
                             <div>
                               {' '}
                               <AiFillDelete />{' '}
                             </div>
-                          )}{' '}
+                          )}
                         </div>
-                      </Popconfirm>
-                    ) : (
-                      <div className="del-all-btn">
-                        {!isMobile ? (
-                          <Tooltip title="Delete" placement="left">
-                            <AiFillDelete />
-                          </Tooltip>
-                        ) : (
-                          <div>
-                            {' '}
-                            <AiFillDelete />{' '}
-                          </div>
-                        )}
-                      </div>
-                    )}
-                  </th>
-                )}
-              </>
-            ))}
-          </tr>
-        </thead>
-        {/* For Reorder TakeWay */}
-        {OldtableDataTakeAway?.length > 0 && (
-          <tbody className="BillingTable6Table1-body">
-            {OldtableDataTakeAway?.map((item, index) => (
-              <tr
-                key={index}
-                className={
-                  item?.SalesId && OrderType !== 'Hold'
-                    ? 'BillingTable6-Table1-row-disabled'
-                    : 'BillingTable6-Table1-row'
-                }
-                style={{
-                  fontFamily: SelectedFont ? SelectedFont : '',
+                      )}
+                    </th>
+                  )}
+                </>
+              ))}
+            </tr>
+          </thead>
+          {/* For Reorder TakeWay */}
+          {OldtableDataTakeAway?.length > 0 && (
+            <tbody className="BillingTable6Table1-body">
+              {OldtableDataTakeAway?.map((item, index) => (
+                <tr
+                  key={index}
+                  className={
+                    item?.SalesId && OrderType !== 'Hold'
+                      ? 'BillingTable6-Table1-row-disabled'
+                      : 'BillingTable6-Table1-row'
+                  }
+                  style={{
+                    fontFamily: SelectedFont ? SelectedFont : '',
 
-                  backgroundColor:
-                    BillOrderPre === 'Y'
-                      ? item?.SalesId && OrderType !== 'Hold'
+                    backgroundColor:
+                      BillOrderPre === 'Y'
+                        ? item?.SalesId && OrderType !== 'Hold'
+                          ? 'rgb(243, 248, 213)'
+                          : triggerAnimation &&
+                              index === 0 &&
+                              !item?.SalesId &&
+                              tableDataTakeAway?.length >= PreviousdataLength
+                            ? 'wheat'
+                            : triggerAnimation &&
+                                index === 0 &&
+                                tableDataTakeAway?.length >=
+                                  PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : 'inherit'
+                        : 'none',
+                    background:
+                      item?.SalesId && OrderType !== 'Hold'
                         ? 'rgb(243, 248, 213)'
-                        : triggerAnimation &&
+                        : GlobEstBooking === 'ParEst' &&
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
+                          ? '#b2d1f7'
+                          : index % 2 === 0
+                            ? 'white'
+                            : SelectedBillColor?.['OverallBackgroundColor']
+                              ? SelectedBillColor?.['OverallBackgroundColor']
+                              : '#d6d6d6',
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
                           index === 0 &&
                           !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : triggerAnimation &&
-                            index === 0 &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                          tableDataTakeAway?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#CFB59D' }}
+                          >
+                            <img width="30px" alt="" src={TakeAwayIcon} />
+                          </td>
+                        )}
+
+                      {tableitem.OptionName == 'Sl.No' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {index + 1}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Item' && (
+                        <td
+                          className="BillingTable6-table-td for-combo"
+                          style={{ fontFamily: 'Poppins', textAlign: 'left' }}
+                          onClick={() =>
+                            item.FullProductIdentifierDtls?.length > 0 ||
+                            item.ProductIdentifierDtls?.length > 0
+                              ? handleImeiDetails(item)
+                              : editField && handleEditQuantity(item)
+                          }
+                        >
+                          {item.ProdName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl6-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                (
+                                {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                  'variant'
+                                ) && <span>{item?.ProdVariantName} </span>}
+                                {item?.Size}
+                                {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
+                              </p>
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
+                              className="Tbl6-Variant"
+                              style={{ fontFamily: 'Poppins' }}
+                            >
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
+                                </p>
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
+                            <div
+                              style={{
+                                fontSize: '10px',
+                                fontWeight: '500',
+                                whiteSpace: 'nowrap',
+                              }}
+                            >
+                              Extra Charges :{' '}
+                              {
+                                productBasedExtraCharges?.find(
+                                  (find) => find.ProdId === item.ProdId
+                                )?.TotalAmt
+                              }
+                            </div>
+                          )}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
+                            ? item.Offer
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {item.TotalAmt}
+                        </td>
+                      )}
+
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() => removeFromCart(item)}
+                        >
+                          <AiOutlineClose
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
+              {EditQuantity && OldtableDataTakeAway?.length > 0 && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+          {/* Reorder DineIn */}
+          {OldtableDataDinein?.length > 0 && (
+            <tbody className="BillingTable6Table1-body">
+              {OldtableDataDinein?.map((item, index) => (
+                <tr
+                  key={OldtableDataTakeAway?.length + index}
+                  className={
+                    item?.SalesId
+                      ? 'BillingTable6-Table1-row-disabled'
+                      : 'BillingTable6-Table1-row'
+                  }
+                  style={{
+                    fontFamily: SelectedFont ? SelectedFont : '',
+
+                    backgroundColor:
+                      BillOrderPre === 'Y'
+                        ? item?.SalesId
+                          ? 'rgb(243, 248, 213)'
+                          : BookingType === 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataTakeAway?.length + index === 0 &&
+                              !item?.SalesId &&
+                              tableDataDinein?.length >= PreviousdataLength
                             ? 'wheat'
-                            : 'inherit'
-                      : 'none',
-                  background:
-                    item?.SalesId && OrderType !== 'Hold'
+                            : BookingType !== 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataTakeAway?.length + index === 0 &&
+                                tableDataDinein?.length >= PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : 'inherit'
+                        : 'none',
+                    background: item?.SalesId
                       ? 'rgb(243, 248, 213)'
                       : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
+                          GlobProdwisedata?.includes(
+                            item?.InwardDtlId + ' ' + item?.BookingTypeName
+                          )
                         ? '#b2d1f7'
-                        : index % 2 === 0
+                        : (OldtableDataTakeAway?.length + index) % 2 === 0
                           ? 'white'
                           : SelectedBillColor?.['OverallBackgroundColor']
                             ? SelectedBillColor?.['OverallBackgroundColor']
                             : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        index === 0 &&
-                        !item?.SalesId &&
-                        tableDataTakeAway?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
-                        <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#CFB59D' }}
-                        >
-                          <img width="30px" alt="" src={TakeAwayIcon} />
-                        </td>
-                      )}
-
-                    {tableitem.OptionName == 'Sl.No' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {index + 1}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Item' && (
-                      <td
-                        className="BillingTable6-table-td for-combo"
-                        style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                        onClick={() =>
-                          item.FullProductIdentifierDtls?.length > 0 ||
-                            item.ProductIdentifierDtls?.length > 0
-                            ? handleImeiDetails(item)
-                            : editField && handleEditQuantity(item)
-                        }
-                      >
-                        {item.ProdName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
-                              className="Tbl6-Variant"
-                              style={{ fontFamily: 'Poppins' }}
-                            >
-                              (
-                              {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                'variant'
-                              ) && <span>{item?.ProdVariantName} </span>}
-                              {item?.Size}
-                              {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
-                                </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl6-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
-                              </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
-                            <div
-                              style={{
-                                fontSize: '10px',
-                                fontWeight: '500',
-                                whiteSpace: 'nowrap',
-                              }}
-                            >
-                              Extra Charges :{' '}
-                              {
-                                productBasedExtraCharges?.find(
-                                  (find) => find.ProdId === item.ProdId
-                                )?.TotalAmt
-                              }
-                            </div>
-                          )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer
-                            ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {item.TotalAmt}
-                      </td>
-                    )}
-
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() => removeFromCart(item)}
-                      >
-                        <AiOutlineClose
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
-            {EditQuantity && OldtableDataTakeAway?.length > 0 && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
-        )}
-        {/* Reorder DineIn */}
-        {OldtableDataDinein?.length > 0 && (
-          <tbody className="BillingTable6Table1-body">
-            {OldtableDataDinein?.map((item, index) => (
-              <tr
-                key={OldtableDataTakeAway?.length + index}
-                className={
-                  item?.SalesId
-                    ? 'BillingTable6-Table1-row-disabled'
-                    : 'BillingTable6-Table1-row'
-                }
-                style={{
-                  fontFamily: SelectedFont ? SelectedFont : '',
-
-                  backgroundColor:
-                    BillOrderPre === 'Y'
-                      ? item?.SalesId
-                        ? 'rgb(243, 248, 213)'
-                        : BookingType === 'Dine In' &&
-                          triggerAnimation &&
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
                           OldtableDataTakeAway?.length + index === 0 &&
                           !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
-                            triggerAnimation &&
-                            OldtableDataTakeAway?.length + index === 0 &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'wheat'
-                            : 'inherit'
-                      : 'none',
-                  background: item?.SalesId
-                    ? 'rgb(243, 248, 213)'
-                    : GlobEstBooking === 'ParEst' &&
-                      GlobProdwisedata?.includes(
-                        item?.InwardDtlId + ' ' + item?.BookingTypeName
-                      )
-                      ? '#b2d1f7'
-                      : (OldtableDataTakeAway?.length + index) % 2 === 0
-                        ? 'white'
-                        : SelectedBillColor?.['OverallBackgroundColor']
-                          ? SelectedBillColor?.['OverallBackgroundColor']
-                          : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        OldtableDataTakeAway?.length + index === 0 &&
-                        !item?.SalesId &&
-                        tableDataDinein?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
+                          tableDataDinein?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#A2C3CD' }}
+                          >
+                            <img width="30px" alt="" src={dineInIcon} />
+                          </td>
+                        )}
+                      {tableitem.OptionName == 'Sl.No' && (
                         <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#A2C3CD' }}
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
                         >
-                          <img width="30px" alt="" src={dineInIcon} />
+                          {OldtableDataTakeAway?.length + index + 1}
                         </td>
                       )}
-                    {tableitem.OptionName == 'Sl.No' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {OldtableDataTakeAway?.length + index + 1}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Item' && (
-                      <td
-                        className="BillingTable6-table-td for-combo"
-                        style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.ProdName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
+                      {tableitem.OptionName == 'Item' && (
+                        <td
+                          className="BillingTable6-table-td for-combo"
+                          style={{ fontFamily: 'Poppins', textAlign: 'left' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.ProdName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl6-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                (
+                                {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                  'variant'
+                                ) && <span>{item?.ProdVariantName} </span>}
+                                {item?.Size}
+                                {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
+                              </p>
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
                               className="Tbl6-Variant"
                               style={{ fontFamily: 'Poppins' }}
                             >
-                              (
-                              {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                'variant'
-                              ) && <span>{item?.ProdVariantName} </span>}
-                              {item?.Size}
-                              {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
                                 </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl6-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
-                              </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
                             <div
                               style={{
                                 fontSize: '10px',
@@ -2763,288 +2611,292 @@ const BSBillingTable6 = () => {
                               }
                             </div>
                           )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
                             ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {item.TotalAmt}
-                      </td>
-                    )}
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {item.TotalAmt}
+                        </td>
+                      )}
 
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() => removeFromCart(item)}
-                      >
-                        <AiOutlineClose
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
-            {OldtableDataDinein?.length > 0 && EditQuantity && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
-        )}
-        {/* TakeWay */}
-        {tableDataTakeAway?.length > 0 && (
-          <tbody className="BillingTable6Table1-body">
-            {tableDataTakeAway?.map((item, index) => (
-              <tr
-                key={
-                  OldtableDataDinein?.length +
-                  OldtableDataTakeAway?.length +
-                  index
-                }
-                className={
-                  BookingType === 'Dine In' && item?.SalesId
-                    ? 'BillingTable6-Table1-row-disabled'
-                    : 'BillingTable6-Table1-row'
-                }
-                style={{
-                  fontFamily: SelectedFont,
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() => removeFromCart(item)}
+                        >
+                          <AiOutlineClose
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
+              {OldtableDataDinein?.length > 0 && EditQuantity && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+          {/* TakeWay */}
+          {tableDataTakeAway?.length > 0 && (
+            <tbody className="BillingTable6Table1-body">
+              {tableDataTakeAway?.map((item, index) => (
+                <tr
+                  key={
+                    OldtableDataDinein?.length +
+                    OldtableDataTakeAway?.length +
+                    index
+                  }
+                  className={
+                    BookingType === 'Dine In' && item?.SalesId
+                      ? 'BillingTable6-Table1-row-disabled'
+                      : 'BillingTable6-Table1-row'
+                  }
+                  style={{
+                    fontFamily: SelectedFont,
 
-                  backgroundColor:
-                    BillOrderPre === 'Y'
-                      ? BookingType === 'Dine In' && item?.SalesId
-                        ? 'rgb(243, 248, 213)'
-                        : BookingType === 'Dine In' &&
-                          triggerAnimation &&
-                          OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
-                            triggerAnimation &&
-                            OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            tableDataTakeAway?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
+                    backgroundColor:
+                      BillOrderPre === 'Y'
+                        ? BookingType === 'Dine In' && item?.SalesId
+                          ? 'rgb(243, 248, 213)'
+                          : BookingType === 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataDinein?.length +
+                                OldtableDataTakeAway?.length +
+                                index ===
+                                0 &&
+                              !item?.SalesId &&
+                              tableDataTakeAway?.length >= PreviousdataLength
                             ? 'wheat'
-                            : (OldtableDataDinein?.length +
+                            : BookingType !== 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataDinein?.length +
+                                  OldtableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                tableDataTakeAway?.length >=
+                                  PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : (OldtableDataDinein?.length +
+                                    OldtableDataTakeAway?.length +
+                                    index) %
+                                    2 ===
+                                  0
+                                ? 'white'
+                                : SelectedBillColor?.['OverallBackgroundColor']
+                                  ? SelectedBillColor?.[
+                                      'OverallBackgroundColor'
+                                    ]
+                                  : '#d6d6d6'
+                        : (OldtableDataDinein?.length +
                               OldtableDataTakeAway?.length +
                               index) %
                               2 ===
-                              0
-                              ? 'white'
-                              : SelectedBillColor?.['OverallBackgroundColor']
-                                ? SelectedBillColor?.['OverallBackgroundColor']
-                                : '#d6d6d6'
-                      : (OldtableDataDinein?.length +
-                        OldtableDataTakeAway?.length +
-                        index) %
-                        2 ===
-                        0
-                        ? 'white'
-                        : SelectedBillColor?.['OverallBackgroundColor']
-                          ? SelectedBillColor?.['OverallBackgroundColor']
-                          : '#d6d6d6',
-                  background:
-                    BookingType === 'Dine In' && item?.SalesId
-                      ? 'rgb(243, 248, 213)'
-                      : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
-                        ? '#b2d1f7'
-                        : (OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index) %
-                          2 ===
-                          0
+                            0
                           ? 'white'
                           : SelectedBillColor?.['OverallBackgroundColor']
                             ? SelectedBillColor?.['OverallBackgroundColor']
                             : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        OldtableDataDinein?.length +
-                        OldtableDataTakeAway?.length +
-                        index ===
-                        0 &&
-                        !item?.SalesId &&
-                        tableDataTakeAway?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
+                    background:
+                      BookingType === 'Dine In' && item?.SalesId
+                        ? 'rgb(243, 248, 213)'
+                        : GlobEstBooking === 'ParEst' &&
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
+                          ? '#b2d1f7'
+                          : (OldtableDataDinein?.length +
+                                OldtableDataTakeAway?.length +
+                                index) %
+                                2 ===
+                              0
+                            ? 'white'
+                            : SelectedBillColor?.['OverallBackgroundColor']
+                              ? SelectedBillColor?.['OverallBackgroundColor']
+                              : '#d6d6d6',
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
+                          OldtableDataDinein?.length +
+                            OldtableDataTakeAway?.length +
+                            index ===
+                            0 &&
+                          !item?.SalesId &&
+                          tableDataTakeAway?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#CFB59D' }}
+                          >
+                            <img width="30px" alt="" src={TakeAwayIcon} />
+                          </td>
+                        )}
+                      {tableitem.OptionName == 'Sl.No' && (
                         <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#CFB59D' }}
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
                         >
-                          <img width="30px" alt="" src={TakeAwayIcon} />
+                          {OldtableDataDinein?.length +
+                            OldtableDataTakeAway?.length +
+                            index +
+                            1}
                         </td>
                       )}
-                    {tableitem.OptionName == 'Sl.No' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index +
-                          1}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Item' && (
-                      <td
-                        className="BillingTable6-table-td for-combo"
-                        style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                        onClick={() =>
-                          item.FullProductIdentifierDtls?.length > 0 ||
+                      {tableitem.OptionName == 'Item' && (
+                        <td
+                          className="BillingTable6-table-td for-combo"
+                          style={{ fontFamily: 'Poppins', textAlign: 'left' }}
+                          onClick={() =>
+                            item.FullProductIdentifierDtls?.length > 0 ||
                             item.ProductIdentifierDtls?.length > 0
-                            ? handleImeiDetails(item)
-                            : editField && handleEditQuantity(item)
-                        }
-                      >
-                        {item.ProdName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
+                              ? handleImeiDetails(item)
+                              : editField && handleEditQuantity(item)
+                          }
+                        >
+                          {item.ProdName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl6-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                {item?.Type !== 'OS' && (
+                                  <>
+                                    {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                      'variant'
+                                    ) && <span>{item?.ProdVariantName} </span>}
+                                    {item?.Size}
+                                    {item?.SinglePc == 'Y'
+                                      ? 'PCS'
+                                      : item?.UomName}
+                                  </>
+                                )}
+                              </p>
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
                               className="Tbl6-Variant"
                               style={{ fontFamily: 'Poppins' }}
                             >
-                              {item?.Type !== 'OS' && (
-                                <>
-                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                    'variant'
-                                  ) && <span>{item?.ProdVariantName} </span>}
-                                  {item?.Size}
-                                  {item?.SinglePc == 'Y'
-                                    ? 'PCS'
-                                    : item?.UomName}
-                                </>
-                              )}
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
                                 </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl6-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
-                              </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
                             <div
                               style={{
                                 fontSize: '10px',
@@ -3060,274 +2912,275 @@ const BSBillingTable6 = () => {
                               }
                             </div>
                           )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
                             ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {item.TotalAmt}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() => removeFromCart(item)}
-                      >
-                        <AiOutlineClose
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
-            {tableDataTakeAway?.length > 0 && EditQuantity && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
-        )}
-        {/* DineIn */}
-        {tableDataDinein?.length > 0 && (
-          <tbody className="BillingTable6Table1-body">
-            {tableDataDinein?.map((item, index) => (
-              <tr
-                key={
-                  OldtableDataTakeAway?.length +
-                  OldtableDataDinein?.length +
-                  tableDataTakeAway?.length +
-                  index
-                }
-                className={
-                  BookingType === 'Dine In' && item?.SalesId
-                    ? 'BillingTable6-Table1-row-disabled'
-                    : 'BillingTable6-Table1-row'
-                }
-                style={{
-                  fontFamily: SelectedFont,
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {item.TotalAmt}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() => removeFromCart(item)}
+                        >
+                          <AiOutlineClose
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
+              {tableDataTakeAway?.length > 0 && EditQuantity && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+          {/* DineIn */}
+          {tableDataDinein?.length > 0 && (
+            <tbody className="BillingTable6Table1-body">
+              {tableDataDinein?.map((item, index) => (
+                <tr
+                  key={
+                    OldtableDataTakeAway?.length +
+                    OldtableDataDinein?.length +
+                    tableDataTakeAway?.length +
+                    index
+                  }
+                  className={
+                    BookingType === 'Dine In' && item?.SalesId
+                      ? 'BillingTable6-Table1-row-disabled'
+                      : 'BillingTable6-Table1-row'
+                  }
+                  style={{
+                    fontFamily: SelectedFont,
 
-                  backgroundColor:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? BookingType === 'Dine In' &&
-                        item?.SalesId &&
-                        !BookingTypeBoth
+                    backgroundColor:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? BookingType === 'Dine In' &&
+                          item?.SalesId &&
+                          !BookingTypeBoth
+                          ? 'rgb(243, 248, 213)'
+                          : BookingType === 'Dine In' &&
+                              triggerAnimation &&
+                              OldtableDataTakeAway?.length +
+                                OldtableDataDinein?.length +
+                                tableDataTakeAway?.length +
+                                index ===
+                                0 &&
+                              !item?.SalesId &&
+                              tableDataDinein?.length >= PreviousdataLength
+                            ? 'wheat'
+                            : BookingType !== 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataTakeAway?.length +
+                                  OldtableDataDinein?.length +
+                                  tableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                tableDataDinein?.length >= PreviousdataLength &&
+                                !HoldOrderDtl &&
+                                !UnpaidData
+                              ? 'wheat'
+                              : 'inherit'
+                        : 'none',
+                    background:
+                      BookingType === 'Dine In' &&
+                      item?.SalesId &&
+                      !BookingTypeBoth
                         ? 'rgb(243, 248, 213)'
-                        : BookingType === 'Dine In' &&
-                          triggerAnimation &&
+                        : GlobEstBooking === 'ParEst' &&
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
+                          ? '#b2d1f7'
+                          : (OldtableDataTakeAway?.length +
+                                OldtableDataDinein?.length +
+                                tableDataTakeAway?.length +
+                                index) %
+                                2 ===
+                              0
+                            ? 'white'
+                            : SelectedBillColor?.['OverallBackgroundColor']
+                              ? SelectedBillColor?.['OverallBackgroundColor']
+                              : '#d6d6d6',
+                    animation:
+                      BillOrderPre === 'Y' && !BookingTypeBoth
+                        ? triggerAnimation &&
                           OldtableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          tableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength
-                          ? 'wheat'
-                          : BookingType !== 'Dine In' &&
-                            triggerAnimation &&
-                            OldtableDataTakeAway?.length +
                             OldtableDataDinein?.length +
                             tableDataTakeAway?.length +
                             index ===
                             0 &&
-                            tableDataDinein?.length >= PreviousdataLength &&
-                            !HoldOrderDtl &&
-                            !UnpaidData
-                            ? 'wheat'
-                            : 'inherit'
-                      : 'none',
-                  background:
-                    BookingType === 'Dine In' &&
-                      item?.SalesId &&
-                      !BookingTypeBoth
-                      ? 'rgb(243, 248, 213)'
-                      : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
-                        ? '#b2d1f7'
-                        : (OldtableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          tableDataTakeAway?.length +
-                          index) %
-                          2 ===
-                          0
-                          ? 'white'
-                          : SelectedBillColor?.['OverallBackgroundColor']
-                            ? SelectedBillColor?.['OverallBackgroundColor']
-                            : '#d6d6d6',
-                  animation:
-                    BillOrderPre === 'Y' && !BookingTypeBoth
-                      ? triggerAnimation &&
-                        OldtableDataTakeAway?.length +
-                        OldtableDataDinein?.length +
-                        tableDataTakeAway?.length +
-                        index ===
-                        0 &&
-                        !item?.SalesId &&
-                        tableDataDinein?.length >= PreviousdataLength &&
-                        !HoldOrderDtl &&
-                        !UnpaidData
-                        ? 'splashAnimation 0.5s ease-in-out'
-                        : 'none'
-                      : 'none',
-                }}
-              >
-                {tableOptions?.map((tableitem) => (
-                  <>
-                    {BookingTypeBoth &&
-                      index == 0 &&
-                      tableitem.OptionName == 'Sl.No' && (
+                          !item?.SalesId &&
+                          tableDataDinein?.length >= PreviousdataLength &&
+                          !HoldOrderDtl &&
+                          !UnpaidData
+                          ? 'splashAnimation 0.5s ease-in-out'
+                          : 'none'
+                        : 'none',
+                  }}
+                >
+                  {tableOptions?.map((tableitem) => (
+                    <>
+                      {BookingTypeBoth &&
+                        index == 0 &&
+                        tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            rowspan={tableData.length}
+                            style={{ backgroundColor: '#A2C3CD' }}
+                          >
+                            <img width="30px" alt="" src={dineInIcon} />
+                          </td>
+                        )}
+                      {tableitem.OptionName == 'Sl.No' && (
                         <td
-                          rowspan={tableData.length}
-                          style={{ backgroundColor: '#A2C3CD' }}
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
                         >
-                          <img width="30px" alt="" src={dineInIcon} />
+                          {OldtableDataDinein?.length +
+                            OldtableDataTakeAway?.length +
+                            index +
+                            1}
                         </td>
                       )}
-                    {tableitem.OptionName == 'Sl.No' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index +
-                          1}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Item' && (
-                      <td
-                        className="BillingTable6-table-td for-combo"
-                        style={{ fontFamily: 'Poppins', textAlign: 'left' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.ProdName}
-                        &nbsp; {item?.BrandName !== null ? item?.BrandName : ''}
-                        {item?.Type != 'C' && (
-                          <>
-                            <p
+                      {tableitem.OptionName == 'Item' && (
+                        <td
+                          className="BillingTable6-table-td for-combo"
+                          style={{ fontFamily: 'Poppins', textAlign: 'left' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.ProdName}
+                          &nbsp;{' '}
+                          {item?.BrandName !== null ? item?.BrandName : ''}
+                          {item?.Type != 'C' && (
+                            <>
+                              <p
+                                className="Tbl6-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                (
+                                {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                  'variant'
+                                ) && <span>{item?.ProdVariantName} </span>}
+                                {item?.Size}
+                                {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
+                              </p>
+                              {item?.OfferMessage &&
+                                !Array.isArray(item.OfferMessage) && (
+                                  <p
+                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                  >
+                                    {item.OfferMessage?.split('>')?.[0] +
+                                      `> ${item?.OrderQty} Eligible Free`}
+                                  </p>
+                                )}
+                            </>
+                          )}
+                          {item?.Type === 'C' && (
+                            <div
                               className="Tbl6-Variant"
                               style={{ fontFamily: 'Poppins' }}
                             >
-                              (
-                              {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                'variant'
-                              ) && <span>{item?.ProdVariantName} </span>}
-                              {item?.Size}
-                              {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
-                            </p>
-                            {item?.OfferMessage &&
-                              !Array.isArray(item.OfferMessage) && (
-                                <p
-                                  className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                >
-                                  {item.OfferMessage?.split('>')?.[0] +
-                                    `> ${item?.OrderQty} Eligible Free`}
+                              {item.ProdDetail?.map((prod, index) => (
+                                <p key={index}>
+                                  {prod.ProdName} - {prod.Size} {prod.UomName}
                                 </p>
-                              )}
-                          </>
-                        )}
-                        {item?.Type === 'C' && (
-                          <div
-                            className="Tbl6-Variant"
-                            style={{ fontFamily: 'Poppins' }}
-                          >
-                            {item.ProdDetail?.map((prod, index) => (
-                              <p key={index}>
-                                {prod.ProdName} - {prod.Size} {prod.UomName}
-                              </p>
-                            ))}
-                          </div>
-                        )}
-                        {productBasedExtraCharges?.find(
-                          (find) => find.ProdId === item.ProdId
-                        ) !== undefined && (
+                              ))}
+                            </div>
+                          )}
+                          {productBasedExtraCharges?.find(
+                            (find) => find.ProdId === item.ProdId
+                          ) !== undefined && (
                             <div
                               style={{
                                 fontSize: '10px',
@@ -3343,136 +3196,137 @@ const BSBillingTable6 = () => {
                               }
                             </div>
                           )}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'MRP' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.MRP}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Discount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.Type != 'C'
-                          ? item.Offer
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'MRP' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.MRP}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Discount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.Type != 'C'
                             ? item.Offer
-                            : '-'
-                          : item?.OfferPrice && item?.OfferPrice > 0
-                            ? item?.OfferType === 'F'
-                              ? `₹${safeRound(item.OfferPrice)}`
-                              : `${item.OfferPrice}%`
-                            : '-'}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Quantity' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item.OrderQty}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Rate' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          if (editField) {
-                            handleEditQuantity(item);
-                          }
-                        }}
-                      >
-                        {item?.OrderRate}
-                      </td>
-                    )}
-                    {tableitem.OptionName == 'Amount' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins', textAlign: 'center' }}
-                        onClick={() => {
-                          // if (editField) {
-                          //   handleEditQuantity(item);
-                          // }
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }}
-                      >
-                        {item.TotalAmt}
-                      </td>
-                    )}
+                              ? item.Offer
+                              : '-'
+                            : item?.OfferPrice && item?.OfferPrice > 0
+                              ? item?.OfferType === 'F'
+                                ? `₹${safeRound(item.OfferPrice)}`
+                                : `${item.OfferPrice}%`
+                              : '-'}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Quantity' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item.OrderQty}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Rate' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            if (editField) {
+                              handleEditQuantity(item);
+                            }
+                          }}
+                        >
+                          {item?.OrderRate}
+                        </td>
+                      )}
+                      {tableitem.OptionName == 'Amount' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins', textAlign: 'center' }}
+                          onClick={() => {
+                            // if (editField) {
+                            //   handleEditQuantity(item);
+                            // }
+                            if (GetCustId) {
+                              handleCustomerProductPriceHistory(item);
+                            }
+                          }}
+                        >
+                          {item.TotalAmt}
+                        </td>
+                      )}
 
-                    {tableitem.OptionName == 'Delete' && (
-                      <td
-                        className="BillingTable6-table-td"
-                        style={{ fontFamily: 'Poppins' }}
-                        onClick={() => removeFromCart(item)}
-                      >
-                        <AiOutlineClose
-                          style={{ color: '#FF4D4F', cursor: 'pointer' }}
-                        />
-                      </td>
-                    )}
-                  </>
-                ))}
-              </tr>
-            ))}
-            {tableDataDinein?.length > 0 && EditQuantity && (
-              <BSBillingEditQuantity
-                handleEditQuantityCancel={handleEditQuantityCancel}
-                BSBillingEditQuantity={EditQuantity}
-                Productdata={Modaldata}
-                Index={Index}
-                shortKeyMethod={shortKeyMethod}
-              />
-            )}
-          </tbody>
+                      {tableitem.OptionName == 'Delete' && (
+                        <td
+                          className="BillingTable6-table-td"
+                          style={{ fontFamily: 'Poppins' }}
+                          onClick={() => removeFromCart(item)}
+                        >
+                          <AiOutlineClose
+                            style={{ color: '#FF4D4F', cursor: 'pointer' }}
+                          />
+                        </td>
+                      )}
+                    </>
+                  ))}
+                </tr>
+              ))}
+              {tableDataDinein?.length > 0 && EditQuantity && (
+                <BSBillingEditQuantity
+                  handleEditQuantityCancel={handleEditQuantityCancel}
+                  BSBillingEditQuantity={EditQuantity}
+                  Productdata={Modaldata}
+                  Index={Index}
+                  shortKeyMethod={shortKeyMethod}
+                />
+              )}
+            </tbody>
+          )}
+        </table>
+        {OpenEditTotalAmt && (
+          <BSEditTotalAmt
+            EditTotalOpen={OpenEditTotalAmt}
+            EditTotalClose={handleEditTotalAmountCancel}
+          />
         )}
-      </table>
-      {OpenEditTotalAmt && (
-        <BSEditTotalAmt
-          EditTotalOpen={OpenEditTotalAmt}
-          EditTotalClose={handleEditTotalAmountCancel}
-        />
-      )}
-      {OpenImeiDetail && (
-        <BSImeiDetails
-          DeviceDetails={OpenImeiDetail}
-          handleDeviceDetailClose={handleImeiDetailClose}
-          ProductDetail={Modaldata}
-        />
-      )}
-      {(customerPriceHistoryOpen && GetCustId) &&
-        <CustomerPriceHistory
-          open={customerPriceHistoryOpen}
-          custId={GetCustId}
-          setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
-          customerProduct={customerProduct}
-          setCustomerProduct={setCustomerProduct}
-          selectedCustomer={selectedCustomer}
-        />
-      }
-    </div>
+        {OpenImeiDetail && (
+          <BSImeiDetails
+            DeviceDetails={OpenImeiDetail}
+            handleDeviceDetailClose={handleImeiDetailClose}
+            ProductDetail={Modaldata}
+          />
+        )}
+        {customerPriceHistoryOpen && GetCustId && (
+          <CustomerPriceHistory
+            open={customerPriceHistoryOpen}
+            custId={GetCustId}
+            setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
+            customerProduct={customerProduct}
+            setCustomerProduct={setCustomerProduct}
+            selectedCustomer={selectedCustomer}
+          />
+        )}
+      </div>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BST6Payment.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BST6Payment.jsx
index 9a02c94..7c5658e 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BST6Payment.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable6/BST6Payment.jsx
@@ -1,11 +1,11 @@
-import React, { useEffect, useState, useRef } from 'react';
+import React, { useEffect, useState, useRef, lazy } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import moment from 'moment';
 import { AiOutlineClose, AiOutlineArrowRight } from 'react-icons/ai';
 import { Tables } from '../../../../../Components/Tables/Table';
 import { DefaultModal } from '../../../../../Components/Modal/DefaultModal.jsx';
-import { UpCircleOutlined, UpOutlined } from '@ant-design/icons';
+import { UpCircleOutlined } from '@ant-design/icons';
 import { Popover, Badge, Modal, Tooltip } from 'antd';
 import {
   printDiv,
@@ -38,7 +38,6 @@ import {
   GlobalSelectedTableDetails,
   GlobalBookingType,
   changeBookingType,
-  getConfigType,
   PutBookingData,
   GlobalReorderHoldDetails,
   getUnpaidData,
@@ -61,7 +60,6 @@ import {
   changeCustomerID,
   changeSelectedCustId,
   GlobalSelOption,
-  changefocusStatusBalrec,
   changeUnpaidData,
   ChangeSelectedCustDisable,
   getSalesDetailData,
@@ -104,7 +102,6 @@ import {
   ChangeOverAllDiscEstimate,
   GlobalScreenSize,
   GlobalUnpaidListData,
-  getAllCustomer,
   GlobalBranchFinancialStatus,
   changeSummeryComboOfferAmount,
   ChangeComboCarddata,
@@ -129,6 +126,7 @@ import {
   changeBillEditingMode,
   changePreviousOrderPayment,
   changePreviousOrderOfferDetail,
+  GlobalAllBookingType,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
 import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities';
 import {
@@ -159,7 +157,6 @@ import QrinScreen from '../../BookingFunctionality/DynamicScreenQr.jsx';
 import { ArrowRightOutlined } from '@ant-design/icons';
 import Buttons from '../../../../../Components/Forms/Buttons';
 import WpIcon from '../../../../../Images/message.png';
-import BsBillingCreditCustomer from '../../BookingFunctionality/BSBillingCreditCustomer.jsx';
 import BSCreditCustomer from '../../UtillComponents/BSCreditCustomer.jsx';
 import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
 import { isMobile } from 'react-device-detect';
@@ -174,17 +171,10 @@ import { getCustomerDisplayWindow } from '../../../../../Features/customerDispla
 import { getEmpAccess } from '../../../../../Features/AppPage/CenterPage.js';
 import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
 import PozoCartIcon from '../../../../../Pages/BookingScreen/Components/UtillComponents/PozoCartIcon.jsx';
-import {
-  Global_CoupenCodeAmount,
-  Global_loyaltyPointsDiscountAmount,
-  Global_OrderOfferDetail,
-  Global_OverallOfferAmount,
-  Global_SalesWiseOfferAmount,
-} from '../../../../../Features/Offer/Offer.js';
+import { Global_OverallOfferAmount } from '../../../../../Features/Offer/Offer.js';
 import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
 import { useAuth } from '../../../../../AuthContext.jsx';
-import PaymentInput from '../BSBillingTable1/BalanceAndReceived.jsx';
 import { GlobalBookingStatus } from '../../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail.js';
 import {
   changeSalesPaymentoption,
@@ -193,15 +183,11 @@ import {
 import Paymentoption from '../../../../Payment/PaymentOptions/PaymentOptions.jsx';
 import { getPaymentOptionsData } from '../../../../../Features/BookingScreen/BookingData/KioskBookingData.js';
 import { getCombolist } from '../../../../../Features/ComboMaster/ComboMaster.js';
-import WhatsAppShare from '../../../../WhatsAppShare/whatsAppShare.jsx';
-import SMSShare from '../../../../WhatsAppShare/SmsShare.jsx';
 import { MdSms } from 'react-icons/md';
 import { FaWhatsapp, FaPrint, FaCartPlus } from 'react-icons/fa';
-import BSTipAmount from '../../UtillComponents/BSTipAmount.jsx';
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin.js';
 import { TfiClipboard } from 'react-icons/tfi';
 import { PostOtherServices } from '../../../../../Features/OtherServices/OtherServices.js';
-import OtherServicePrintStyle1 from '../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx';
 import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
 import BSOtherServiceClaim from '../../UtillComponents/BSOtherServiceClaim.jsx';
 import { MobilePdfPrint } from '../../BookingFunctionality/MobilePdfPrint.js';
@@ -221,10 +207,24 @@ import pozologoimg from '../../../../../Images/pozologoimg.png';
 import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
 import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
 import CustomerOrders from '../../BookingFunctionality/CustomerOrders.jsx';
-
+// jsx Files
+const BsBillingCreditCustomer = lazy(
+  () => import('../../BookingFunctionality/BSBillingCreditCustomer.jsx')
+);
+const PaymentInput = lazy(
+  () => import('../BSBillingTable1/BalanceAndReceived.jsx')
+);
+const WhatsAppShare = lazy(
+  () => import('../../../../WhatsAppShare/whatsAppShare.jsx')
+);
+const SMSShare = lazy(() => import('../../../../WhatsAppShare/SmsShare.jsx'));
+const BSTipAmount = lazy(() => import('../../UtillComponents/BSTipAmount.jsx'));
+const OtherServicePrintStyle1 = lazy(
+  () =>
+    import('../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx')
+);
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
-const RetailApiurl = import.meta.env.ENV_API_URL;
 
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
 
@@ -239,6 +239,7 @@ const BST6Payment = () => {
   const navigate = useNavigate();
   const FreeProdList = useSelector(GlobalFreeProdList);
   const offerAppliedProducts = useSelector(GlobalOfferAppliedProducts);
+  const AllBookingType = useSelector(GlobalAllBookingType);
   const defaultBookingType = useSelector(GlobalDefaultBookingType);
   const appPreferences = useSelector(ApplicationPreferences);
   const bookingTypePreference = appPreferences?.find(
@@ -251,7 +252,9 @@ const BST6Payment = () => {
   );
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const screenwidth = useSelector(GlobalScreenSize);
   const printerTemplateStyle = useSelector(SelectedPrintTemplate);
@@ -298,7 +301,9 @@ const BST6Payment = () => {
   const prodCat = useSelector(GlobalProductCategorie);
   const ProdSubCat = useSelector(GlobalProductSubCategorie);
   const templateData = useSelector(getTemplateData);
-  const BranchFinancialStatus = useSelector(GlobalBranchFinancialStatus);
+  const holdCheckedSalesSetup = tableOptions?.some(
+    (item) => item?.OptionName === 'Hold'
+  );
   const tableOptions = templateData?.BookingBilling?.[1];
   const OfferCheckedInSetup = templateData?.BookingNavbar?.[1].some(
     (item) => item?.OptionName == 'Offer'
@@ -484,7 +489,6 @@ const BST6Payment = () => {
   }, [salesBillEdit]);
 
   useEffect(() => {
-
     if (salesBillEdit) {
       if (SelCustId) {
         setRefundPayBtns(AllPaymentOptions);
@@ -499,8 +503,7 @@ const BST6Payment = () => {
         setRefundPayBtns(withoutCustomer);
       }
     }
-
-  }, [AllPaymentOptions, SelCustId, salesBillEdit])
+  }, [AllPaymentOptions, SelCustId, salesBillEdit]);
   console.log(PrintOrderDetails, 'PrintOrderDetails');
   useEffect(() => {
     if (selOption) {
@@ -552,7 +555,7 @@ const BST6Payment = () => {
     if (!preOrder) {
       const totalSum = OrderCardDetail?.reduce(
         // (acc, card) => acc + parseFloat(card.OrderRate * card.OrderQty || 0),
-         (acc, card) => acc + parseFloat(card.TotalAmt || 0),
+        (acc, card) => acc + parseFloat(card.TotalAmt || 0),
         0
       );
 
@@ -608,14 +611,21 @@ const BST6Payment = () => {
 
       const filteredPayments =
         previousOrderPayment?.filter(
-          p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+          (p) =>
+            p?.LastOrderTran === 'Y' &&
+            p?.AfterAdjustment != null &&
+            p?.AfterAdjustment !== '' &&
+            p?.AfterAdjustment
         ) || [];
 
       const paymentsToUse =
-        filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
+        filteredPayments.length > 0
+          ? filteredPayments
+          : previousOrderPayment || [];
 
       const totalPreviouspayment = paymentsToUse?.reduce(
-        (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+        (acc, payment) =>
+          acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
         0
       );
 
@@ -624,8 +634,7 @@ const BST6Payment = () => {
         0
       );
 
-      const previousNetAmount =
-        (totalPreviouspayment) || 0;
+      const previousNetAmount = totalPreviouspayment || 0;
 
       let withdiscTotal =
         Total -
@@ -637,12 +646,26 @@ const BST6Payment = () => {
         withdiscTotal >= 0
           ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
           : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      )
+      );
 
-      setTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount);
+      setTotalAmount(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount
+      );
       setCurrentOrderNetAmount(currentOrderNetAmount);
       setPreviousNetAmount(previousNetAmount);
-      dispatch(changeSummeryTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount));
+      dispatch(
+        changeSummeryTotalAmount(
+          salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount
+              ? currentOrderNetAmount - previousNetAmount
+              : 0
+            : currentOrderNetAmount
+        )
+      );
 
       dispatch(changeSummeryComboOfferAmount(withComboSum));
 
@@ -672,8 +695,8 @@ const BST6Payment = () => {
       UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // const Data1 = { AppId, CompId, BranchId };
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
   //mohan stoped data
   useEffect(() => {
@@ -734,7 +757,7 @@ const BST6Payment = () => {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
 
     if (selectedStyle) {
@@ -919,27 +942,6 @@ const BST6Payment = () => {
     }
   };
 
-  // useEffect(() => {
-  //   if (
-  //     PrintOrderDetails?.length > 0 &&
-  //     (!filteredSettingNames ||
-  //       filteredSettingNames?.includes('Print') ||
-  //       filteredSettingNames?.length === 0) &&
-  //     (
-  //       (!filteredSettingNames?.includes('whatsapp') &&
-  //         (!isMobile || !filteredSettingNames?.includes('SMS'))) ||
-  //       (
-  //         (filteredSettingNames?.includes('whatsapp') ||
-  //           (isMobile && filteredSettingNames?.includes('SMS'))) &&
-  //         (!MobileNoWhatsApp || Object.keys(MobileNoWhatsApp).length === 0)
-  //       )
-  //     )
-  //   ) {
-
-  //     handlePrintOrToken();
-  //   }
-  // }, [PrintOrderDetails]);
-
   useEffect(() => {
     if (!PrintOrderDetails?.length) return;
 
@@ -1047,8 +1049,10 @@ const BST6Payment = () => {
   };
   useEffect(() => {
     if (CompId && BranchId && AppId) {
-      getHolddata();
-      getUnpaiddatas();
+      if (holdCheckedSalesSetup) {
+        getHolddata();
+      }
+      // getUnpaiddatas();
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -1136,9 +1140,6 @@ const BST6Payment = () => {
     setEmpData(datas?.[0]);
   };
   const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
     await dispatch(
       getAddCustomerDetails({
         CompId: CompId,
@@ -1235,7 +1236,11 @@ const BST6Payment = () => {
   const handleButtonClick = () => {
     if (qrCode && SelectedUPIPayOption === 'Default' && UpiQRPreference) {
       UpiPayment();
-    } else if (salesBillEdit && currentOrderNetAmount < previousNetAmount && !refundPaySelected) {
+    } else if (
+      salesBillEdit &&
+      currentOrderNetAmount < previousNetAmount &&
+      !refundPaySelected
+    ) {
       setMessageType('warning');
       setMessageData('Please Select Refund Payment Method');
       return;
@@ -1564,28 +1569,7 @@ const BST6Payment = () => {
     setPaybtnnameselected(PaymentOptionsModeName);
     setPaybtnselected(PaymentOptionsModeId);
   }, [PaymentOptions]);
-  // useEffect(() => {
-  //   const handleKeyPress = (event) => {
-  //     if (event.shiftKey && event.code === 'KeyM') {
-  //       if (
-  //         document.activeElement.tagName !== 'INPUT' &&
-  //         document.activeElement.tagName !== 'TEXTAREA'
-  //       ) {
-  //         event.preventDefault();
-  //         setBlink(true);
-  //       }
-  //     }
-  //   };
-  //   const handleClickOutside = (event) => {
-  //     setBlink(false);
-  //   };
-  //   window.addEventListener('keydown', handleKeyPress);
-  //   window.addEventListener('mousedown', handleClickOutside);
-  //   return () => {
-  //     window.removeEventListener('keydown', handleKeyPress);
-  //     window.addEventListener('mousedown', handleClickOutside);
-  //   };
-  // }, []);
+
   useEffect(() => {
     getBookingTypeId();
   }, [BookingType, BookingTypeBoth]);
@@ -1610,20 +1594,12 @@ const BST6Payment = () => {
   };
 
   const getBookingTypeId = async () => {
-    let tempconfigdata = await dispatch(
-      getConfigType({ TypeName: 'Booking Type' })
-    ).unwrap();
+    setConfigDataList(AllBookingType);
+    let configdata = AllBookingType;
+    let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
 
-    if (tempconfigdata?.data?.statusCode == 1) {
-      setConfigDataList(tempconfigdata?.data?.data);
-      let configdata = tempconfigdata?.data?.data;
-      let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
-
-      let filterconfigdata = configdata?.find(
-        (a) => a?.ConfigName === checkName
-      );
-      setSelectedBookingType(filterconfigdata?.ConfigId);
-    }
+    let filterconfigdata = configdata?.find((a) => a?.ConfigName === checkName);
+    setSelectedBookingType(filterconfigdata?.ConfigId);
   };
   const gettodaydate = () => {
     const currentDate = new Date();
@@ -1702,7 +1678,7 @@ const BST6Payment = () => {
   const handleRefundPaymentMode = (id, name) => {
     setRefundPaySelected(id);
     setRefundPaySelectedName(name);
-  }
+  };
 
   const addUpiOption = async (id, name, UPIId) => {
     await dispatch(changeUpiIDprint(UPIId));
@@ -1957,7 +1933,9 @@ const BST6Payment = () => {
     setUpinotSelected(false);
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
-    getHolddata();
+    if (holdCheckedSalesSetup) {
+      getHolddata();
+    }
     if (defaultBookingType === 'Both') {
       await dispatch(changeBookingType('TakeAway'));
     }
@@ -2132,15 +2110,15 @@ const BST6Payment = () => {
       OrderStatus: 'O',
       OrderType:
         BookingType === 'Dine In' ||
-          BookingTypeBoth ||
-          Estimation?.SettingValue == 'N'
+        BookingTypeBoth ||
+        Estimation?.SettingValue == 'N'
           ? 'S'
           : GlobEstBooking === 'OvrAllEst'
             ? 'E'
             : GlobEstBooking === 'ParEst'
               ? GlobProdwisedata?.includes(
-                a.InwardDtlId + ' ' + a?.BookingTypeName
-              )
+                  a.InwardDtlId + ' ' + a?.BookingTypeName
+                )
                 ? 'E'
                 : 'S'
               : 'S',
@@ -2230,7 +2208,7 @@ const BST6Payment = () => {
           : Paybtnnameselected?.toLowerCase() === 'credit'
             ? 'S'
             : Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
+                SelectedUPIPayOption?.toLowerCase() === 'default'
               ? 'S'
               : 'P',
       OrderDtlDetails:
@@ -2247,85 +2225,113 @@ const BST6Payment = () => {
           ? globalTipAmount === 0
             ? SelectedTableDetails
             : SelectedTableDetails?.map((item) => ({
-              ...item,
-              TipsAmount: globalTipAmount,
-            }))
+                ...item,
+                TipsAmount: globalTipAmount,
+              }))
           : null,
       SalesPaymentType: 'normal',
       PaymentDetail: [
         {
-          PaymentType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? refundPaySelected :
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : SelectedUPIPayOption?.toLowerCase() === 'business'
-                    ? BusinessPayOption?.find(
-                      (busupi) => busupi?.ModeId === UpiId
-                    )?.ModeId
-                    : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          Amount: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? previousNetAmount - currentOrderNetAmount : Math.round(TotalAmount),
-          MerchantId: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'business'
-              ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                ?.MerchantId
-              : null,
-          PaymentOptionType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) && (refundPaySelectedName?.toLowerCase() === 'cash' || refundPaySelectedName?.toLowerCase() === 'credit') ? 'PC' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption?.toLowerCase() === 'business'
-                        ? 'BU'
-                        : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                ?.UPIDetailId
-              : SelectedUPIPayOption?.toLowerCase() === 'business'
+          PaymentType:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? refundPaySelected
+              : Paybtnnameselected?.toLowerCase() === 'upi'
+                ? SelectedUPIPayOption?.toLowerCase() === 'pd'
+                  ? PaymentDeviceUPI?.[0]?.ModeId
+                  : SelectedUPIPayOption?.toLowerCase() === 'pg'
+                    ? PaymentgatewayUPI?.[0]?.ModeId
+                    : SelectedUPIPayOption?.toLowerCase() === 'business'
+                      ? BusinessPayOption?.find(
+                          (busupi) => busupi?.ModeId === UpiId
+                        )?.ModeId
+                      : paybtnselected
+                : paybtnselected
+                  ? paybtnselected
+                  : null,
+          Amount:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? previousNetAmount - currentOrderNetAmount
+              : Math.round(TotalAmount),
+          MerchantId:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'business'
                 ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                  ?.MerchantUPIId
+                    ?.MerchantId
                 : null,
-          AccountDtl: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? [] :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.UPIId === UpiId
-              )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                (Paybtnnameselected?.toLowerCase() === 'card' &&
-                  SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'pg') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? 'S' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
+          PaymentOptionType:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            (refundPaySelectedName?.toLowerCase() === 'cash' ||
+              refundPaySelectedName?.toLowerCase() === 'credit')
+              ? 'PC'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'PC'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
+                  ? 'PC'
+                  : Paybtnnameselected?.toLowerCase() === 'card'
+                    ? SelectedCardOption
+                    : Paybtnnameselected?.toLowerCase() === 'upi'
+                      ? SelectedUPIPayOption?.toLowerCase() === 'default'
+                        ? 'PC'
+                        : SelectedUPIPayOption?.toLowerCase() === 'business'
+                          ? 'BU'
+                          : SelectedUPIPayOption
+                      : null,
+          ModeOfPayment:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
+                    ?.UPIDetailId
+                : SelectedUPIPayOption?.toLowerCase() === 'business'
+                  ? BusinessPayOption?.find(
+                      (busupi) => busupi?.ModeId === UpiId
+                    )?.MerchantUPIId
+                  : null,
+          AccountDtl:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? []
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
                   SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
+                    (upipay) => upipay?.UPIId === UpiId
+                  )
+                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'pd') ||
+                    (Paybtnnameselected?.toLowerCase() === 'card' &&
+                      SelectedCardOption?.toLowerCase() === 'pd')
+                  ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                  : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                        SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      (Paybtnnameselected?.toLowerCase() === 'card' &&
+                        SelectedCardOption?.toLowerCase() === 'pg')
+                    ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
+                    : [],
+          PaymentStatus:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? 'S'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'S'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
                   ? 'S'
-                  : 'P',
-          Debit: (salesBillEdit && currentOrderNetAmount < previousNetAmount && refundPaySelectedName?.toLowerCase() === 'credit') ? Math.round(previousNetAmount - currentOrderNetAmount) : 0,
-          Credit: salesBillEdit ? (currentOrderNetAmount > previousNetAmount && Paybtnnameselected?.toLowerCase() === 'credit') ? Math.round(TotalAmount) : 0 :
-            Paybtnnameselected?.toLowerCase() === 'credit'
+                  : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'default'
+                    ? 'S'
+                    : 'P',
+          Debit:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            refundPaySelectedName?.toLowerCase() === 'credit'
+              ? Math.round(previousNetAmount - currentOrderNetAmount)
+              : 0,
+          Credit: salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount &&
+              Paybtnnameselected?.toLowerCase() === 'credit'
+              ? Math.round(TotalAmount)
+              : 0
+            : Paybtnnameselected?.toLowerCase() === 'credit'
               ? Math.round(TotalAmount)
               : 0,
         },
@@ -2394,14 +2400,14 @@ const BST6Payment = () => {
         setMessageType('success');
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         response?.data?.OrderDetails?.length > 0 &&
           setPrintOrderDetails([response?.data]);
@@ -2562,14 +2568,14 @@ const BST6Payment = () => {
           setMessageType('success');
           setMessageData(
             response?.data?.response +
-            ' ' +
-            (response?.data?.OrderDetails?.length > 0
-              ? response?.data?.OrderId &&
-              extractLastNumberOrderId(
-                response?.data?.OrderId,
-                response?.data?.OrderDetails?.[0]?.FYStatus
-              )
-              : '')
+              ' ' +
+              (response?.data?.OrderDetails?.length > 0
+                ? response?.data?.OrderId &&
+                  extractLastNumberOrderId(
+                    response?.data?.OrderId,
+                    response?.data?.OrderDetails?.[0]?.FYStatus
+                  )
+                : '')
           );
           response?.data?.OrderDetails?.length > 0 &&
             setPrintOrderDetails([response?.data]);
@@ -2676,14 +2682,14 @@ const BST6Payment = () => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -2859,14 +2865,14 @@ const BST6Payment = () => {
             setMessageType('success');
             setMessageData(
               bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
-                )
-                : '')
+                ' ' +
+                (bookingpaymentupdate?.data?.OrderDetails?.length > 0
+                  ? bookingpaymentupdate?.data?.OrderId &&
+                    extractLastNumberOrderId(
+                      bookingpaymentupdate?.data?.OrderId,
+                      bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
+                    )
+                  : '')
             );
             bookingpaymentupdate?.data?.OrderDetails?.length > 0 &&
               setPrintOrderDetails([bookingpaymentupdate?.data]);
@@ -2885,7 +2891,7 @@ const BST6Payment = () => {
         if (
           Date.now() - startTime >
           useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
+            60000
         ) {
           // 60,000 ms = 1 minute
 
@@ -3323,8 +3329,10 @@ const BST6Payment = () => {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if (salesBillEdit) {
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger, salesBillEdit]);
 
   const Otherserviceprint = async () => {
     if (OtherServicesPrintDetails?.length > 0) {
@@ -3478,1326 +3486,1360 @@ const BST6Payment = () => {
     );
   };
   return (
-    <>
-      {(addcustomer || hold) && (
-        <FeaturesFunctionalities
-          handleHoldCancel={handleHoldCancel}
-          modalOpen={hold}
-          handleAddCustomerCancel={handleAddCustomerCancel}
-          addcustomer={addcustomer}
-        />
-      )}
-      {creditCustomerOpen && (
-        <BSCreditCustomer
-          creditCustomerOpen={creditCustomerOpen}
-          CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-        />
-      )}
-      {TotalAmount == 0 && Success && (
-        <div>
-          <QrComponent com={`WelcomeScreen**${brachName}`} />
-        </div>
-      )}
-      {TotalAmount > 0 &&
-        qrCode &&
-        PaymentUpiOptions?.length > 0 &&
-        SelectedUpiOption && (
+    <Suspense fallback={<div>Suspense Loading...</div>}>
+      <>
+        {(addcustomer || hold) && (
+          <FeaturesFunctionalities
+            handleHoldCancel={handleHoldCancel}
+            modalOpen={hold}
+            handleAddCustomerCancel={handleAddCustomerCancel}
+            addcustomer={addcustomer}
+          />
+        )}
+        {creditCustomerOpen && (
+          <BSCreditCustomer
+            creditCustomerOpen={creditCustomerOpen}
+            CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
+          />
+        )}
+        {TotalAmount == 0 && Success && (
+          <div>
+            <QrComponent com={`WelcomeScreen**${brachName}`} />
+          </div>
+        )}
+        {TotalAmount > 0 &&
+          qrCode &&
+          PaymentUpiOptions?.length > 0 &&
+          SelectedUpiOption && (
+            <div>
+              <QrComponent
+                com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+              />
+            </div>
+          )}
+
+        {PaymentUpiOptions?.length > 0 && OrderId && (
           <div>
             <QrComponent
-              com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+              com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
             />
           </div>
         )}
 
-      {PaymentUpiOptions?.length > 0 && OrderId && (
-        <div>
-          <QrComponent
-            com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
-          />
-        </div>
-      )}
-
-      <div className="BST6Payment-Structure">
-        {screenwidth <= 768 && (
-          <div
-            className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
-            style={{
-              width: '100%',
-              transition: 'max-height 0.3s ease-in-out',
-              overflow: 'scroll',
-              maxHeight: responsiveBill ? '200px' : '0px',
-            }}
-          >
-            {Array.isArray(OrderCardDetail) &&
-              OrderCardDetail?.length >= 1 &&
-              (isMobile || screenwidth <= 768) && (
-                <BSBillingTable6 optionNames={tableOptions} />
-              )}
-          </div>
-        )}
-        <div className="BST6Payment-div2">
-          <div className="CustomerAddSrch">
-            <div style={{ height: '2.1rem' }}>
-              {tableOptions
-                ?.filter((item) => item.OptionName === 'AddCustomer')
-                .map((filteredItem) => (
-                  <React.Fragment key={filteredItem.TemplateOptionsId}>
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        columnGap: '0.5rem',
-                      }}
-                    >
-                      <BSCustomerSelect />
-                      <TooltipWrapper
-                        title={'Add Customer'}
-                        isMobile={isMobile}
-                      >
-                        {' '}
-                        <PozoAddCustomerIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={handleAddCustomer}
-                          style={{
-                            fontSize: '25px',
-                            color:
-                              selOption || GetCustId ? '#52c41a' : '#1292EE',
-                            cursor: Custdisable ? 'not-allowed' : 'pointer',
-                          }}
-                        />
-                      </TooltipWrapper>
-                    </div>
-                  </React.Fragment>
-                ))}
-            </div>
-          </div>
-          {!OtherServicesglobal && (
+        <div className="BST6Payment-Structure">
+          {screenwidth <= 768 && (
             <div
+              className={`BSBillingTable1-summeryTable ${responsiveBill ? 'open' : 'closed'}`}
               style={{
-                width: '2rem',
-                display: 'flex',
-                alignItems: 'center',
-                gap: '1rem',
-                justifyContent: 'center',
+                width: '100%',
+                transition: 'max-height 0.3s ease-in-out',
+                overflow: 'scroll',
+                maxHeight: responsiveBill ? '200px' : '0px',
               }}
             >
-              {tableOptions?.map((item) => (
-                <>
-                  {unpaidFlow == false
-                    ? item?.OptionName == 'Hold' &&
-                    BookingType !== 'Dine In' &&
-                    !BookingTypeBoth &&
-                    OrderCardDetail?.length != 0 &&
-                    CheckOrderType?.length === 0 &&
-                    OrderType != 'Failed' &&
-                    CheckBookingStatus != 'Close' &&
-                    paybtns?.length > 0 &&
-                    !addnewAccess && (
-                      <TooltipWrapper title={'Hold'} isMobile={isMobile}>
-                        {' '}
-                        <PozoHoldIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={() => AddBookingDetails('Hold')}
-                          style={{
-                            fontSize: '30px',
-                            cursor: 'pointer',
-                            color: '' ? '#52c41a' : '#1292EE',
-                          }}
-                        />
-                      </TooltipWrapper>
-                    )
-                    : ''}
-                  {unpaidFlow == false
-                    ? item?.OptionName == 'Hold' &&
-                    BookingType !== 'Dine In' &&
-                    !BookingTypeBoth &&
-                    Holddata?.length > 0 &&
-                    OrderCardDetail?.length == 0 &&
-                    CheckBookingStatus != 'Close' &&
-                    !addnewAccess &&
-                    paybtns?.length > 0 &&
-                    !OtherServicesglobal && (
-                      <TooltipWrapper title={'Recall'} isMobile={isMobile}>
-                        {' '}
-                        <Badge
-                          count={Holddata?.length}
-                          size={'small'}
-                          offset={[0, 7]}
+              {Array.isArray(OrderCardDetail) &&
+                OrderCardDetail?.length >= 1 &&
+                (isMobile || screenwidth <= 768) && (
+                  <BSBillingTable6 optionNames={tableOptions} />
+                )}
+            </div>
+          )}
+          <div className="BST6Payment-div2">
+            <div className="CustomerAddSrch">
+              <div style={{ height: '2.1rem' }}>
+                {tableOptions
+                  ?.filter((item) => item.OptionName === 'AddCustomer')
+                  .map((filteredItem) => (
+                    <React.Fragment key={filteredItem.TemplateOptionsId}>
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          columnGap: '0.5rem',
+                        }}
+                      >
+                        <BSCustomerSelect />
+                        <TooltipWrapper
+                          title={'Add Customer'}
+                          isMobile={isMobile}
                         >
-                          <PozoHoldIcon
+                          {' '}
+                          <PozoAddCustomerIcon
                             className="BSBillingNav-icon-table-icon"
-                            onClick={() => HandleholdModelOpen()}
+                            onClick={handleAddCustomer}
                             style={{
-                              fontSize: '28px',
-                              cursor: 'pointer',
-                              color: Holddata ? '#52c41a' : 'default',
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
+                              fontSize: '25px',
+                              color:
+                                selOption || GetCustId ? '#52c41a' : '#1292EE',
+                              cursor: Custdisable ? 'not-allowed' : 'pointer',
                             }}
                           />
-                        </Badge>
+                        </TooltipWrapper>
+                      </div>
+                    </React.Fragment>
+                  ))}
+              </div>
+            </div>
+            {!OtherServicesglobal && (
+              <div
+                style={{
+                  width: '2rem',
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '1rem',
+                  justifyContent: 'center',
+                }}
+              >
+                {tableOptions?.map((item) => (
+                  <>
+                    {unpaidFlow == false
+                      ? item?.OptionName == 'Hold' &&
+                        BookingType !== 'Dine In' &&
+                        !BookingTypeBoth &&
+                        OrderCardDetail?.length != 0 &&
+                        CheckOrderType?.length === 0 &&
+                        OrderType != 'Failed' &&
+                        CheckBookingStatus != 'Close' &&
+                        paybtns?.length > 0 &&
+                        !addnewAccess && (
+                          <TooltipWrapper title={'Hold'} isMobile={isMobile}>
+                            {' '}
+                            <PozoHoldIcon
+                              className="BSBillingNav-icon-table-icon"
+                              onClick={() => AddBookingDetails('Hold')}
+                              style={{
+                                fontSize: '30px',
+                                cursor: 'pointer',
+                                color: '' ? '#52c41a' : '#1292EE',
+                              }}
+                            />
+                          </TooltipWrapper>
+                        )
+                      : ''}
+                    {unpaidFlow == false
+                      ? item?.OptionName == 'Hold' &&
+                        BookingType !== 'Dine In' &&
+                        !BookingTypeBoth &&
+                        Holddata?.length > 0 &&
+                        OrderCardDetail?.length == 0 &&
+                        CheckBookingStatus != 'Close' &&
+                        !addnewAccess &&
+                        paybtns?.length > 0 &&
+                        !OtherServicesglobal && (
+                          <TooltipWrapper title={'Recall'} isMobile={isMobile}>
+                            {' '}
+                            <Badge
+                              count={Holddata?.length}
+                              size={'small'}
+                              offset={[0, 7]}
+                            >
+                              <PozoHoldIcon
+                                className="BSBillingNav-icon-table-icon"
+                                onClick={() => HandleholdModelOpen()}
+                                style={{
+                                  fontSize: '28px',
+                                  cursor: 'pointer',
+                                  color: Holddata ? '#52c41a' : 'default',
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
+                                }}
+                              />
+                            </Badge>
+                          </TooltipWrapper>
+                        )
+                      : ''}
+                  </>
+                ))}
+                {paybtns?.length > 1 && (
+                  <div
+                    style={{
+                      pointerEvents:
+                        (BookingType === 'Dine In' ||
+                          BookingTypeBoth ||
+                          CheckOrderType?.length > 0) &&
+                        !unpaidFlow &&
+                        OrderStatus
+                          ? 'none'
+                          : 'auto',
+                      opacity:
+                        (BookingType === 'Dine In' ||
+                          BookingTypeBoth ||
+                          CheckOrderType?.length > 0) &&
+                        !unpaidFlow &&
+                        OrderStatus
+                          ? 0.5
+                          : 1,
+                      width: '2rem',
+                    }}
+                  >
+                    {!OtherServicesglobal && (
+                      <TooltipWrapper title="Split Payment" isMobile={isMobile}>
+                        {' '}
+                        <div
+                          className="BSBillingNav-icon-table-icon"
+                          onClick={
+                            CheckBookingStatus != 'Close' && !addnewAccess
+                              ? SplitPaymentOpen
+                              : ''
+                          }
+                          style={{
+                            width: '1.5rem',
+                            cursor:
+                              OrderCardDetail?.length === 0 ||
+                              CheckBookingStatus == 'Close' ||
+                              addnewAccess
+                                ? 'not-allowed'
+                                : 'pointer',
+                            color:
+                              OrderCardDetail?.length === 0 ||
+                              CheckBookingStatus == 'Close' ||
+                              addnewAccess
+                                ? 'gray'
+                                : 'rgb(18, 146, 238)',
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '2.46rem',
+                          }}
+                        >
+                          <PozoSplitPaymentIcon />
+                        </div>
                       </TooltipWrapper>
-                    )
-                    : ''}
-                </>
-              ))}
-              {paybtns?.length > 1 && (
+                    )}
+                  </div>
+                )}
+              </div>
+            )}
+            {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
+              <div
+                onClick={handleResponsiveBill}
+                className="Btn-responsiveBill"
+                style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
+              >
+                {responsiveBill ? (
+                  <div
+                    style={{
+                      width: '28px',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '26px',
+                    }}
+                  >
+                    {' '}
+                    <PozoCartIcon />{' '}
+                  </div>
+                ) : (
+                  <div
+                    style={{
+                      width: '28px',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '26px',
+                    }}
+                  >
+                    {' '}
+                    <PozoCartIcon />{' '}
+                  </div>
+                )}
+              </div>
+            )}
+          </div>
+          <div className="BST6Payment-div1">
+            <Messages messageType={messageType} messageData={messageData} />
+
+            <div className="Paybtn6">
+              <TooltipWrapper
+                // title={'Payment Mode (SHIFT + M)'}
+                isMobile={isMobile}
+                placement={'left'}
+              >
                 <div
+                  className="Table6-payment-mode"
                   style={{
                     pointerEvents:
                       (BookingType === 'Dine In' ||
                         BookingTypeBoth ||
                         CheckOrderType?.length > 0) &&
-                        !unpaidFlow &&
-                        OrderStatus
+                      !unpaidFlow &&
+                      OrderStatus
                         ? 'none'
                         : 'auto',
                     opacity:
                       (BookingType === 'Dine In' ||
                         BookingTypeBoth ||
                         CheckOrderType?.length > 0) &&
-                        !unpaidFlow &&
-                        OrderStatus
+                      !unpaidFlow &&
+                      OrderStatus
                         ? 0.5
                         : 1,
-                    width: '2rem',
                   }}
                 >
-                  {!OtherServicesglobal && (
-                    <TooltipWrapper title="Split Payment" isMobile={isMobile}>
-                      {' '}
-                      <div
-                        className="BSBillingNav-icon-table-icon"
-                        onClick={
-                          CheckBookingStatus != 'Close' && !addnewAccess
-                            ? SplitPaymentOpen
-                            : ''
-                        }
-                        style={{
-                          width: '1.5rem',
-                          cursor:
-                            OrderCardDetail?.length === 0 ||
-                              CheckBookingStatus == 'Close' ||
-                              addnewAccess
-                              ? 'not-allowed'
-                              : 'pointer',
-                          color:
-                            OrderCardDetail?.length === 0 ||
-                              CheckBookingStatus == 'Close' ||
-                              addnewAccess
-                              ? 'gray'
-                              : 'rgb(18, 146, 238)',
-                          display: 'flex',
-                          alignItems: 'center',
-                          height: '2.46rem',
-                        }}
-                      >
-                        <PozoSplitPaymentIcon />
+                  {paybtns?.length > 0 &&
+                  currentOrderNetAmount >= previousNetAmount ? (
+                    paybtns?.map((payment) => (
+                      <div className="Table6-cash">
+                        <button
+                          className={
+                            paybtnselected === payment.ModeId &&
+                            (UpinotSelected || CardoptionnotSelected)
+                              ? 'Btn-payment-mode-notupisel'
+                              : paybtnselected === payment.ModeId &&
+                                  (!UpinotSelected || !CardoptionnotSelected)
+                                ? 'Btn-payment-mode'
+                                : 'Btn-payment-mode-sel'
+                          }
+                          style={{
+                            fontFamily: FontFamily['para'],
+                            position: 'relative',
+                            animation: blink
+                              ? 'blink-animation 0.5s infinite alternate'
+                              : 'none',
+                          }}
+                          onClick={() =>
+                            payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
+                              ? handleUPIButtonClick(
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
+                              : handlePaymentMode(
+                                  payment.ModeId,
+                                  payment.ModeName
+                                )
+                          }
+                        >
+                          {/* {UpiOption === "" && payment?.Name?.toLowerCase() === "upi" && <p> UPI</p>} */}
+
+                          <div
+                            style={{
+                              display: 'flex',
+                              flexDirection: 'row',
+                              columnGap: '0.5rem',
+                            }}
+                          >
+                            {payment.ModeName}
+                            {payment?.ModeName?.toLowerCase() === 'card' && (
+                              <CardPopover
+                                CardPayOption={CardPayOption}
+                                SelectedCardOption={SelectedCardOption}
+                                AddCardOption={AddCardOption}
+                                CardOptionOpen={CardOptionOpen}
+                                EnableCardOptions={EnableCardOptions}
+                                paygate={paygate}
+                                paydevice={paydevice}
+                              />
+                            )}
+                            {payment?.ModeName?.toLowerCase() === 'upi' && (
+                              <UpiPopover
+                                defaultPaymentMode={defaultPaymentMode}
+                                defaultEnabled={defaultEnabled}
+                                setDefaultEnabled={setDefaultEnabled}
+                                BusinessPayOption={BusinessPayOption}
+                                UpiOptionOpen={UpiOptionOpen}
+                                UpiPayOption={UpiPayOption}
+                                SelectedUPIPayOption={SelectedUPIPayOption}
+                                AddUPIPaymentOption={AddUPIPaymentOption}
+                                PaymentUpiOptions={PaymentUpiOptions}
+                                UpiOption={UpiOption}
+                                UpiId={UpiId}
+                                paygate={paygate}
+                                paydevice={paydevice}
+                                EnableUpiOptions={EnableUpiOptions}
+                                PaymentgatewayUPI={PaymentgatewayUPI}
+                                PaymentDeviceUPI={PaymentDeviceUPI}
+                                SelectedUpiOption={SelectedUpiOption}
+                                addUpiOption={addUpiOption}
+                                hideDefault={hideDefault}
+                              />
+                            )}
+                          </div>
+                        </button>
                       </div>
-                    </TooltipWrapper>
+                    ))
+                  ) : currentOrderNetAmount < previousNetAmount &&
+                    salesBillEdit &&
+                    refundPayBtns.length > 0 ? (
+                    refundPayBtns.map((payment) => (
+                      <div className="Table6-cash">
+                        <button
+                          className={
+                            refundPaySelected === payment.ConfigId &&
+                            (UpinotSelected || CardoptionnotSelected)
+                              ? 'Btn-payment-mode-notupisel'
+                              : refundPaySelected === payment.ConfigId &&
+                                  (!UpinotSelected || !CardoptionnotSelected)
+                                ? 'Btn-payment-mode'
+                                : 'Btn-payment-mode-sel'
+                          }
+                          style={{
+                            fontFamily: FontFamily['para'],
+                            position: 'relative',
+                            animation: blink
+                              ? 'blink-animation 0.5s infinite alternate'
+                              : 'none',
+                          }}
+                          onClick={() =>
+                            handleRefundPaymentMode(
+                              payment?.ConfigId,
+                              payment?.ConfigName
+                            )
+                          }
+                        >
+                          <div
+                            style={{
+                              display: 'flex',
+                              flexDirection: 'row',
+                              columnGap: '0.5rem',
+                            }}
+                          >
+                            {payment.ConfigName}
+                          </div>
+                        </button>
+                      </div>
+                    ))
+                  ) : (
+                    <div
+                      onClick={handlepaymentoptions}
+                      style={{ cursor: 'pointer' }}
+                      className="payment-error-msg"
+                    >
+                      Please Set Payment Options
+                    </div>
                   )}
                 </div>
-              )}
+              </TooltipWrapper>
             </div>
-          )}
-          {Array.isArray(OrderCardDetail) && OrderCardDetail?.length >= 1 && (
-            <div
-              onClick={handleResponsiveBill}
-              className="Btn-responsiveBill"
-              style={{ color: responsiveBill ? '#52c41a' : '#1292ee' }}
-            >
-              {responsiveBill ? (
-                <div
-                  style={{
-                    width: '28px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '26px',
-                  }}
-                >
-                  {' '}
-                  <PozoCartIcon />{' '}
-                </div>
-              ) : (
-                <div
-                  style={{
-                    width: '28px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '26px',
-                  }}
-                >
-                  {' '}
-                  <PozoCartIcon />{' '}
-                </div>
-              )}
-            </div>
-          )}
-        </div>
-        <div className="BST6Payment-div1">
-          <Messages messageType={messageType} messageData={messageData} />
 
-          <div className="Paybtn6">
-            <TooltipWrapper
-              // title={'Payment Mode (SHIFT + M)'}
-              isMobile={isMobile}
-              placement={'left'}
-            >
-              <div
-                className="Table6-payment-mode"
-                style={{
-                  pointerEvents:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 'none'
-                      : 'auto',
-                  opacity:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 0.5
-                      : 1,
-                }}
-              >
-                {paybtns?.length > 0 && (currentOrderNetAmount >= previousNetAmount) ? (
-                  paybtns?.map((payment) => (
-                    <div className="Table6-cash">
-                      <button
-                        className={
-                          paybtnselected === payment.ModeId &&
-                            (UpinotSelected || CardoptionnotSelected)
-                            ? 'Btn-payment-mode-notupisel'
-                            : paybtnselected === payment.ModeId &&
-                              (!UpinotSelected || !CardoptionnotSelected)
-                              ? 'Btn-payment-mode'
-                              : 'Btn-payment-mode-sel'
-                        }
-                        style={{
-                          fontFamily: FontFamily['para'],
-                          position: 'relative',
-                          animation: blink
-                            ? 'blink-animation 0.5s infinite alternate'
-                            : 'none',
-                        }}
-                        onClick={() =>
-                          payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
-                            ? handleUPIButtonClick(
-                              payment.ModeId,
-                              payment.ModeName
-                            )
-                            : handlePaymentMode(
-                              payment.ModeId,
-                              payment.ModeName
-                            )
-                        }
-                      >
-                        {/* {UpiOption === "" && payment?.Name?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                        <div
-                          style={{
-                            display: 'flex',
-                            flexDirection: 'row',
-                            columnGap: '0.5rem',
-                          }}
-                        >
-                          {payment.ModeName}
-                          {payment?.ModeName?.toLowerCase() === 'card' && (
-                            <CardPopover
-                              CardPayOption={CardPayOption}
-                              SelectedCardOption={SelectedCardOption}
-                              AddCardOption={AddCardOption}
-                              CardOptionOpen={CardOptionOpen}
-                              EnableCardOptions={EnableCardOptions}
-                              paygate={paygate}
-                              paydevice={paydevice}
-                            />
-                          )}
-                          {payment?.ModeName?.toLowerCase() === 'upi' && (
-                            <UpiPopover
-                              defaultPaymentMode={defaultPaymentMode}
-                              defaultEnabled={defaultEnabled}
-                              setDefaultEnabled={setDefaultEnabled}
-                              BusinessPayOption={BusinessPayOption}
-                              UpiOptionOpen={UpiOptionOpen}
-                              UpiPayOption={UpiPayOption}
-                              SelectedUPIPayOption={SelectedUPIPayOption}
-                              AddUPIPaymentOption={AddUPIPaymentOption}
-                              PaymentUpiOptions={PaymentUpiOptions}
-                              UpiOption={UpiOption}
-                              UpiId={UpiId}
-                              paygate={paygate}
-                              paydevice={paydevice}
-                              EnableUpiOptions={EnableUpiOptions}
-                              PaymentgatewayUPI={PaymentgatewayUPI}
-                              PaymentDeviceUPI={PaymentDeviceUPI}
-                              SelectedUpiOption={SelectedUpiOption}
-                              addUpiOption={addUpiOption}
-                              hideDefault={hideDefault}
-                            />
-                          )}
-                        </div>
-                      </button>
-                    </div>
-                  ))
-                ) : (currentOrderNetAmount < previousNetAmount && salesBillEdit && refundPayBtns.length > 0) ? (
-                  refundPayBtns.map((payment) => (
-                    <div className="Table6-cash">
-                      <button
-                        className={
-                          refundPaySelected === payment.ConfigId &&
-                            (UpinotSelected || CardoptionnotSelected)
-                            ? 'Btn-payment-mode-notupisel'
-                            : refundPaySelected === payment.ConfigId &&
-                              (!UpinotSelected || !CardoptionnotSelected)
-                              ? 'Btn-payment-mode'
-                              : 'Btn-payment-mode-sel'
-                        }
-                        style={{
-                          fontFamily: FontFamily['para'],
-                          position: 'relative',
-                          animation: blink
-                            ? 'blink-animation 0.5s infinite alternate'
-                            : 'none',
-                        }}
-                        onClick={() => handleRefundPaymentMode(payment?.ConfigId, payment?.ConfigName)}
-                      >
-                        <div
-                          style={{
-                            display: 'flex',
-                            flexDirection: 'row',
-                            columnGap: '0.5rem',
-                          }}
-                        >
-                          {payment.ConfigName}
-                        </div>
-                      </button>
-                    </div>
-                  ))
-                ) : (
-                  <div
-                    onClick={handlepaymentoptions}
-                    style={{ cursor: 'pointer' }}
-                    className="payment-error-msg"
-                  >
-                    Please Set Payment Options
-                  </div>
-                )}
-              </div>
-            </TooltipWrapper>
-          </div>
-
-          <div className="BST6Payment-flex">
-            <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
-              <button
-                className={
-                  // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
-                  addnewAccess
-                    ? 'BST6Payment-Button-pay-disabled'
-                    : FirstPaymentclick === false &&
-                      OrderCardDetail?.length > 0 &&
-                      paybtnselected &&
-                      CheckBookingStatus != 'Close'
-                      ? !OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ?
-                        'BST6Payment-Button-pay'
-                        : 'BST6Payment-Button-pay'
-                        : 'BST6Payment-Button-pay Order'
-                      : 'BST6Payment-Button-pay-disabled'
-                }
-              >
-                <div
-                  className="BST6Payment-Paydiv"
-                  // onClick={() => {
-                  //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
-                  // }}
-                  onClick={
-                    // BranchFinancialStatus==='N'? financialYearError:
-                    handleButtonClick
+            <div className="BST6Payment-flex">
+              <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
+                <button
+                  className={
+                    // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
+                    addnewAccess
+                      ? 'BST6Payment-Button-pay-disabled'
+                      : FirstPaymentclick === false &&
+                          OrderCardDetail?.length > 0 &&
+                          paybtnselected &&
+                          CheckBookingStatus != 'Close'
+                        ? !OrderStatus
+                          ? salesBillEdit &&
+                            currentOrderNetAmount < previousNetAmount
+                            ? 'BST6Payment-Button-pay'
+                            : 'BST6Payment-Button-pay'
+                          : 'BST6Payment-Button-pay Order'
+                        : 'BST6Payment-Button-pay-disabled'
                   }
                 >
-                  {!OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <div>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</div> : (
-                    <>
-                      <p style={{ fontFamily: FontFamily['head'] }}>
-                        {isMobile ? (
-                          `₹ ${safeRound(
-                            OrderType === 'Failed'
-                              ? FailedTotalAmt
-                              : credit && overAllBal >= 0
-                                ? Math.max(0, TotalAmount - overAllBal)
-                                : TotalAmount
-                          )}`
-                        ) : (
-                          <div>
-                            ₹{' '}
-                            <CountUp
-                              duration={0.4}
-                              className="counter"
-                              end={safeRound(
+                  <div
+                    className="BST6Payment-Paydiv"
+                    // onClick={() => {
+                    //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
+                    // }}
+                    onClick={
+                      // BranchFinancialStatus==='N'? financialYearError:
+                      handleButtonClick
+                    }
+                  >
+                    {!OrderStatus ? (
+                      salesBillEdit &&
+                      currentOrderNetAmount < previousNetAmount ? (
+                        <div>
+                          Refund: ₹
+                          {(previousNetAmount || 0) -
+                            (currentOrderNetAmount || 0)}
+                        </div>
+                      ) : (
+                        <>
+                          <p style={{ fontFamily: FontFamily['head'] }}>
+                            {isMobile ? (
+                              `₹ ${safeRound(
                                 OrderType === 'Failed'
                                   ? FailedTotalAmt
                                   : credit && overAllBal >= 0
                                     ? Math.max(0, TotalAmount - overAllBal)
                                     : TotalAmount
-                              )}
+                              )}`
+                            ) : (
+                              <div>
+                                ₹{' '}
+                                <CountUp
+                                  duration={0.4}
+                                  className="counter"
+                                  end={safeRound(
+                                    OrderType === 'Failed'
+                                      ? FailedTotalAmt
+                                      : credit && overAllBal >= 0
+                                        ? Math.max(0, TotalAmount - overAllBal)
+                                        : TotalAmount
+                                  )}
+                                />
+                              </div>
+                            )}
+                            {/* ₹ {Math.round(TotalAmount)} */}
+                          </p>
+
+                          <AiOutlineArrowRight />
+                        </>
+                      )
+                    ) : (
+                      <div>ORDER</div>
+                    )}
+                    {PrintOrderDetails?.length > 0 &&
+                      PrintOrderDetails?.[0]?.OrderDetails?.map(
+                        (orderDetail, index) => (
+                          <div style={{ display: 'none' }}>
+                            <PaymentPdfBooking
+                              index={index}
+                              table2Data={orderDetail}
+                              singleData2={orderDetail?.productDetails}
+                              orderId={
+                                orderDetail?.OrderId &&
+                                extractLastNumberOrderId(
+                                  orderDetail?.OrderId,
+                                  orderDetail?.FYStatus
+                                )
+                              }
+                              CreatedDate={orderDetail?.CreatedDate}
+                              PaymentStatus={
+                                PrintOrderDetails?.[0]?.PaymentOrderDtl
+                              }
+                              Preference={SettingDataSelector}
+                              printDatas={printDatas}
                             />
                           </div>
-                        )}
-                        {/* ₹ {Math.round(TotalAmount)} */}
-                      </p>
-
-                      <AiOutlineArrowRight />
+                        )
+                      )}
+                    {PrintOrderDetails?.length > 0 &&
+                      (TokenOnly?.SettingValue === 'Y' ||
+                        IndividualToken?.SettingValue === 'Y') &&
+                      PrintOrderDetails?.[0]?.OrderDetails?.map(
+                        (orderDetail, index) => (
+                          <div style={{ display: 'none' }}>
+                            <TokensinglePrint
+                              index={index}
+                              table2Data={orderDetail}
+                              singleData2={orderDetail?.productDetails}
+                              orderId={
+                                orderDetail?.OrderId &&
+                                extractLastNumberOrderId(
+                                  orderDetail?.OrderId,
+                                  orderDetail?.FYStatus
+                                )
+                              }
+                              CreatedDate={orderDetail?.CreatedDate}
+                              PaymentStatus={
+                                PrintOrderDetails?.[0]?.PaymentOrderDtl
+                              }
+                            />
+                          </div>
+                        )
+                      )}
+                  </div>
+                </button>
+              </TooltipWrapper>
+              <div className="BigScreenSummary" style={{ paddingTop: '15px' }}>
+                <Popover
+                  content={
+                    <>
+                      <BSSummery1 />
                     </>
-                  ) : (
-                    <div>ORDER</div>
-                  )}
-                  {PrintOrderDetails?.length > 0 &&
-                    PrintOrderDetails?.[0]?.OrderDetails?.map(
-                      (orderDetail, index) => (
-                        <div style={{ display: 'none' }}>
-                          <PaymentPdfBooking
-                            index={index}
-                            table2Data={orderDetail}
-                            singleData2={orderDetail?.productDetails}
-                            orderId={
-                              orderDetail?.OrderId &&
-                              extractLastNumberOrderId(
-                                orderDetail?.OrderId,
-                                orderDetail?.FYStatus
-                              )
-                            }
-                            CreatedDate={orderDetail?.CreatedDate}
-                            PaymentStatus={
-                              PrintOrderDetails?.[0]?.PaymentOrderDtl
-                            }
-                            Preference={SettingDataSelector}
-                            printDatas={printDatas}
-                          />
-                        </div>
-                      )
-                    )}
-                  {PrintOrderDetails?.length > 0 &&
-                    (TokenOnly?.SettingValue === 'Y' ||
-                      IndividualToken?.SettingValue === 'Y') &&
-                    PrintOrderDetails?.[0]?.OrderDetails?.map(
-                      (orderDetail, index) => (
-                        <div style={{ display: 'none' }}>
-                          <TokensinglePrint
-                            index={index}
-                            table2Data={orderDetail}
-                            singleData2={orderDetail?.productDetails}
-                            orderId={
-                              orderDetail?.OrderId &&
-                              extractLastNumberOrderId(
-                                orderDetail?.OrderId,
-                                orderDetail?.FYStatus
-                              )
-                            }
-                            CreatedDate={orderDetail?.CreatedDate}
-                            PaymentStatus={
-                              PrintOrderDetails?.[0]?.PaymentOrderDtl
-                            }
-                          />
-                        </div>
-                      )
-                    )}
-                </div>
-              </button>
-            </TooltipWrapper>
-            <div className="BigScreenSummary" style={{ paddingTop: '15px' }}>
+                  }
+                  title=" "
+                  trigger="click"
+                  open={open2}
+                  onOpenChange={handleOpenChange2}
+                  overlayStyle={{
+                    // width: "100%",
+                    height: '300',
+                  }}
+                >
+                  <UpCircleOutlined
+                    style={{ fontSize: '25px', color: 'rgb(18, 146, 238)' }}
+                    className="pop-sum-btn-flscrn"
+                  />
+                </Popover>
+              </div>
               <Popover
                 content={
                   <>
+                    <a onClick={hide}>
+                      <AiOutlineClose color="black" />
+                    </a>
                     <BSSummery1 />
                   </>
                 }
                 title=" "
                 trigger="click"
-                open={open2}
-                onOpenChange={handleOpenChange2}
+                open={open}
+                onOpenChange={handleOpenChange}
                 overlayStyle={{
-                  // width: "100%",
+                  width: '100%',
                   height: '300',
                 }}
               >
                 <UpCircleOutlined
-                  style={{ fontSize: '25px', color: 'rgb(18, 146, 238)' }}
-                  className="pop-sum-btn-flscrn"
+                  style={{ fontSize: '25px' }}
+                  className="pop-sum-btn"
                 />
               </Popover>
             </div>
-            <Popover
-              content={
-                <>
-                  <a onClick={hide}>
-                    <AiOutlineClose color="black" />
-                  </a>
-                  <BSSummery1 />
-                </>
-              }
-              title=" "
-              trigger="click"
-              open={open}
-              onOpenChange={handleOpenChange}
-              overlayStyle={{
-                width: '100%',
-                height: '300',
-              }}
-            >
-              <UpCircleOutlined
-                style={{ fontSize: '25px' }}
-                className="pop-sum-btn"
-              />
-            </Popover>
-          </div>
-        </div>
-
-        <div
-          style={{
-            display: 'flex',
-            justifyContent: 'space-evenly',
-            width: '100%',
-          }}
-        >
-          <div className="BST6Payment-buttons">
-            {paybtnselected ==
-              paybtns?.filter(
-                (item) => item?.ModeName?.toLowerCase() === 'cash'
-              )?.[0]?.ModeId ? (
-              <PaymentInput
-                totalAmount={TotalAmount}
-                BillingTableName="BillingTable6"
-              />
-            ) : (
-              ''
-            )}
           </div>
 
-          <div className="BST6Payment-others">
-            {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
-              .length === 1 || navCust === true ? (
-              <div style={{ width: '2rem' }}>
-                {Object.keys(useOptions)?.length > 0 &&
-                  useOptions?.some((flow) =>
-                    flow.OptionDetails.some(
-                      (option) =>
-                        option.OptionName === 'Pay at the counter' &&
-                        option.ModeDetails.some(
-                          (mode) => mode.ModeName === 'Credit'
-                        )
-                    )
-                  ) && (
-                    <React.Fragment key="CreditCustomerFragment">
-                      {!OtherServicesglobal && (
-                        <TooltipWrapper
-                          title="Advance Amount"
-                          isMobile={isMobile}
-                        >
-                          {' '}
-                          <PozoAdvanceIcon
-                            className="BSBillingNav-icon-table-icon"
-                            onClick={CreditCustomerFun}
-                            style={{
-                              cursor:
-                                OrderCardDetail?.length > 0 && 'not-allowed',
-                              color:
-                                OrderCardDetail?.length > 0 ||
-                                  (selOption?.value === undefined &&
-                                    GlobalAddCustomerDetails1?.length === 0 &&
-                                    GetCustId?.CustMobile === undefined)
-                                  ? 'gray'
-                                  : 'rgb(18, 146, 238)',
-                              fontSize: '28px',
-                            }}
-                          />
-                        </TooltipWrapper>
-                      )}
-                    </React.Fragment>
-                  )}
-              </div>
-            ) : (
-              ''
-            )}
-            {/* Customer Orders */}
-            {GetCustId && (
-              <Tooltip title="Customer Orders" isMobile={isMobile}>
-                {' '}
-                <div
-                  className="BSBillingNav-icon-table-icon"
-                  onClick={() => {
-                    if (
-                      CheckBookingStatus !== 'Close' &&
-                      !addnewAccess &&
-                      !(OrderCardDetail?.length > 0)
-                    ) {
-                      setCustomerPreviesOrders(true);
-                    }
-                  }}
-                  style={{
-                    cursor: OrderCardDetail?.length > 0 && 'not-allowed',
-                    color:
-                      OrderCardDetail?.length > 0 ||
-                        (OrderCardDetail?.length > 0 &&
-                          GetCustId?.CustMobile === undefined)
-                        ? 'gray'
-                        : 'rgb(18, 146, 238)',
-                    fontSize: '25px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                    width: '1.5rem',
-                  }}
-                >
-                  <FaCartPlus />
-                </div>
-              </Tooltip>
-            )}
-            {tabledata?.length > 0 && dinePreference && (
-              <div style={{ width: '2rem' }}>
-                {tableOptions
-                  ?.filter((item) => item.OptionName === 'UnpaidBill')
-                  .map((filteredItem) => (
-                    <React.Fragment key={filteredItem.TemplateOptionsId}>
-                      {!OtherServicesglobal && (
-                        <TooltipWrapper
-                          title="Unpaid Bills"
-                          isMobile={isMobile}
-                        >
-                          {' '}
-                          <PozoUnpaidIcon
-                            className="BSBillingNav-icon-table-icon"
-                            style={{
-                              fontSize: '27px',
-                              cursor: 'pointer',
-                              color: unpaidFlow ? '#52c41a' : '#1292EE',
-                            }}
-                            onClick={() => {
-                              (setUnpaidOpen(true), getUnpaiddatas());
-                            }}
-                          />
-                        </TooltipWrapper>
-                      )}
-                    </React.Fragment>
-                  ))}
-              </div>
-            )}
-            {OtherServicesglobal && OrderCardDetail.length >= 1 && (
-              <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
-                {' '}
-                <div
-                  className="BSBillingNav-icon-table-icon"
-                  onClick={
-                    // CheckBookingStatus != 'Close' && !addnewAccess?
-                    Otherservicesvehicleno
-                    // : ''
-                  }
-                  style={{
-                    width: '1.5rem',
-                    cursor:
-                      OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                        ? 'not-allowed'
-                        : 'pointer',
-                    color:
-                      OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                        ? 'gray'
-                        : 'rgb(18, 146, 238)',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                  }}
-                >
-                  <TfiClipboard />
-                </div>
-              </TooltipWrapper>
-            )}
-            {dinePreference && (
-              <div style={{ width: '2rem' }}>
-                {(BookingType === 'Dine In' ||
-                  BookingTypeBoth ||
-                  CheckOrderType?.length > 0) &&
-                  !unpaidFlow &&
-                  SelectedTableDetails?.length !== 0 && (
-                    <>
-                      <TooltipWrapper title="ORDER" isMobile={isMobile}>
-                        {' '}
-                        <PozoDineInIcon
-                          className={
-                            FirstPaymentclick === false && !addnewAccess
-                              ? OrderStatus
-                                ? 'Dinein-order-btn pulse-element ChairClrRed'
-                                : 'Dinein-order-btn pulse-element ChairClrGreen'
-                              : 'Dinein-order-btn-disabled pulse-element'
-                          }
-                          onClick={() =>
-                            FirstPaymentclick === false && !addnewAccess
-                              ? changeOrderStatus()
-                              : ''
-                          }
-                        />
-                      </TooltipWrapper>
-                      {FirstPaymentclick === false &&
-                        !addnewAccess &&
-                        !OrderStatus && <BSTipAmount />}
-                    </>
-                  )}
-              </div>
-            )}
-            {!OtherServicesglobal &&
-              OrderCardDetail?.length > 0 &&
-              ParkingDisplay &&
-              !OtherServicesglobal && (
-                <div
-                  style={{
-                    width: '1.5rem',
-                    color: 'rgb(18, 146, 238)',
-                    display: 'flex',
-                    alignItems: 'center',
-                    height: '2.46rem',
-                  }}
-                >
-                  <BSOtherServiceClaim />
-                </div>
-              )}
-            {!OtherServicesglobal && unpaidFlow == true ? (
-              <TooltipWrapper title="Print Bill" isMobile={isMobile}>
-                {' '}
-                <PozoBillIcon
-                  className="Hover"
-                  style={{
-                    fontSize: '25px',
-                    cursor: 'pointer',
-                    color: unpaidFlow ? '#52c41a' : '#1292EE',
-                  }}
-                  onClick={() => {
-                    Recipt();
-                  }}
-                />
-              </TooltipWrapper>
-            ) : (
-              ''
-            )}
-          </div>
-          {!OtherServicesglobal && CreditCustomer && (
-            <div style={{ display: 'none' }}>
-              <BsBillingCreditCustomer
-                ModalCreditCustomer={CreditCustomer}
-                handlemodalclose={() => {
-                  handleCreditCustomer('Cancel');
-                }}
-                handleOk={() => {
-                  handleCreditCustomer('Submit');
-                }}
-              />
-            </div>
-          )}
-        </div>
-        <DefaultModal
-          open={UpiOpen}
-          title="UPI PAYMENT"
-          width={500}
-          handleCancel={() => {
-            Upimodel('Cancel');
-          }}
-          footer={false}
-          children={
-            <div style={{ overflow: 'scroll' }}>
-              {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
-
-              <div
-                style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  justifyContent: 'space-evenly',
-                  alignItems: 'center',
-                }}
-              >
-                <div>
-                  <QrinScreen
-                    Amount={
-                      OrderType === 'Failed'
-                        ? FailedTotalAmt
-                        : Math.round(TotalAmount)
-                    }
-                    UpiId={UpiId}
-                  />
-                </div>
-
-                <div>
-                  <h1>
-                    {' '}
-                    RS :
-                    {OrderType === 'Failed'
-                      ? FailedTotalAmt
-                      : Math.round(TotalAmount)}{' '}
-                  </h1>
-                </div>
-              </div>
-
-              <div className="sentok">
-                {(selOption || SelCustId) && (
-                  <div className="sentLink" onClick={onFinalSubmit}>
-                    Sent Payment Link
-                    <img
-                      src={WpIcon}
-                      alt="Your Alt Text"
-                      style={{ width: '30px', height: '30px' }}
-                    />
-                    {/* <ArrowRightOutlined /> */}
-                  </div>
-                )}
-
-                <div
-                  style={{
-                    display: 'flex',
-                    flexDirection: 'row-reverse',
-                    width: '100px',
-                  }}
-                >
-                  <Buttons
-                    buttonText="OK"
-                    color="901D77"
-                    icon={<ArrowRightOutlined />}
-                    handleSubmit={() => {
-                      Upimodel('Submit');
-                    }}
-                  />
-                </div>
-              </div>
-            </div>
-          }
-        />
-        {
-          OtherServicesPrintDetails?.length > 0 && (
-            // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <OtherServicePrintStyle1
-                // index={index}
-                table2Data={OtherServicesPrintDetails}
-                singleData2={OtherServicesPrintDetails?.productDetails}
-                orderId={
-                  OtherServicesPrintDetails?.OrderId &&
-                  extractLastNumberOrderId(
-                    OtherServicesPrintDetails?.OrderId,
-                    OtherServicesPrintDetails?.FYStatus
-                  )
-                }
-                CreatedDate={OtherServicesPrintDetails?.CreatedDate}
-                PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
-                Preference={SettingDataSelector}
-                printDatas={printDatas}
-              />
-            </div>
-          )
-          // ))
-        }
-        <DefaultModal
-          open={unpaidopen}
-          title="UNPAID BILL'S"
-          width={1000}
-          handleCancel={() => {
-            setUnpaidOpen(false);
-          }}
-          footer={false}
-          children={
-            <div style={{ height: '400px', overflow: 'scroll' }}>
-              <Tables
-                columns={columns}
-                data={TableData}
-                dataSource={TableData}
-              />
-            </div>
-          }
-        />
-        {UnpaidConfirmation && (
-          <Modal
-            open={UnpaidConfirmation}
-            width={500}
-            children={
-              <>
-                <div>
-                  You have already selected a table. If you click 'OK,' the
-                  table selection will be removed, and the unpaid flow will
-                  continue. If you click 'Cancel,' the dine-in flow will proceed
-                  as selected.
-                </div>
-              </>
-            }
-            onOk={UnpaidOk}
-            onCancel={Unpaidclose}
-          />
-        )}
-        {!OtherServicesglobal && Splitpayment && (
-          <SplitPayment
-            SplitPaymentModal={Splitpayment}
-            handlesplitpaymentclose={handlesplitpaymentclose}
-            TotalNetAmount={
-              OrderType === 'Failed' ? FailedTotalAmt : Math.round(OrderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
-                ((OverAllSales > 0 ? OverAllSales : 0) +
-                  (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                  (Discount > 0 ? Discount : 0)))
-            }
-            failedOrderData={failedOrderData}
-          />
-        )}
-
-        {PrintOrderDetails?.length > 0 && (
           <div
             style={{
               display: 'flex',
-              gap: '1rem',
-              justifyContent: 'center',
-              margin: '1rem 0',
+              justifyContent: 'space-evenly',
+              width: '100%',
             }}
           >
-            {filteredSettingNames?.includes('whatsapp') &&
-              MobileNoWhatsApp?.value && (
-                <FaWhatsapp
-                  size={32}
-                  color="#25D366"
-                  style={{ cursor: 'pointer' }}
-                  onClick={handleWhatsAppClick}
-                  title="Share on WhatsApp"
+            <div className="BST6Payment-buttons">
+              {paybtnselected ==
+              paybtns?.filter(
+                (item) => item?.ModeName?.toLowerCase() === 'cash'
+              )?.[0]?.ModeId ? (
+                <PaymentInput
+                  totalAmount={TotalAmount}
+                  BillingTableName="BillingTable6"
                 />
+              ) : (
+                ''
               )}
+            </div>
 
-            <FaPrint
-              size={32}
-              color="#1292EE"
-              style={{ cursor: 'pointer' }}
-              onClick={handlePrintOrToken}
-              title="Print"
-            />
-
-            {filteredSettingNames?.includes('SMS') && isMobile && (
-              <MdSms
-                size={32}
-                color="#FF8800"
-                style={{ cursor: 'pointer' }}
-                onClick={handleSMSClick}
-                title="Send SMS"
-              />
-            )}
-            {/* WhatsAppShare modal/component */}
-            {showWhatsAppShare && (
-              <WhatsAppShare
-                message={encodedMessage}
-                mobileNumber={MobileNoWhatsApp?.value}
-                onClose={() => closePrintOption(false)}
-              />
-            )}
-            {showSMSShare && isMobile && (
-              <SMSShare
-                message={encodedMessage}
-                mobileNumber={MobileNoWhatsApp?.value}
-                onClose={() => closePrintOption(false)}
-              />
+            <div className="BST6Payment-others">
+              {tableOptions?.filter((item) => item.OptionName === 'AddCustomer')
+                .length === 1 || navCust === true ? (
+                <div style={{ width: '2rem' }}>
+                  {Object.keys(useOptions)?.length > 0 &&
+                    useOptions?.some((flow) =>
+                      flow.OptionDetails.some(
+                        (option) =>
+                          option.OptionName === 'Pay at the counter' &&
+                          option.ModeDetails.some(
+                            (mode) => mode.ModeName === 'Credit'
+                          )
+                      )
+                    ) && (
+                      <React.Fragment key="CreditCustomerFragment">
+                        {!OtherServicesglobal && (
+                          <TooltipWrapper
+                            title="Advance Amount"
+                            isMobile={isMobile}
+                          >
+                            {' '}
+                            <PozoAdvanceIcon
+                              className="BSBillingNav-icon-table-icon"
+                              onClick={CreditCustomerFun}
+                              style={{
+                                cursor:
+                                  OrderCardDetail?.length > 0 && 'not-allowed',
+                                color:
+                                  OrderCardDetail?.length > 0 ||
+                                  (selOption?.value === undefined &&
+                                    GlobalAddCustomerDetails1?.length === 0 &&
+                                    GetCustId?.CustMobile === undefined)
+                                    ? 'gray'
+                                    : 'rgb(18, 146, 238)',
+                                fontSize: '28px',
+                              }}
+                            />
+                          </TooltipWrapper>
+                        )}
+                      </React.Fragment>
+                    )}
+                </div>
+              ) : (
+                ''
+              )}
+              {/* Customer Orders */}
+              {GetCustId && (
+                <Tooltip title="Customer Orders" isMobile={isMobile}>
+                  {' '}
+                  <div
+                    className="BSBillingNav-icon-table-icon"
+                    onClick={() => {
+                      if (
+                        CheckBookingStatus !== 'Close' &&
+                        !addnewAccess &&
+                        !(OrderCardDetail?.length > 0)
+                      ) {
+                        setCustomerPreviesOrders(true);
+                      }
+                    }}
+                    style={{
+                      cursor: OrderCardDetail?.length > 0 && 'not-allowed',
+                      color:
+                        OrderCardDetail?.length > 0 ||
+                        (OrderCardDetail?.length > 0 &&
+                          GetCustId?.CustMobile === undefined)
+                          ? 'gray'
+                          : 'rgb(18, 146, 238)',
+                      fontSize: '25px',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                      width: '1.5rem',
+                    }}
+                  >
+                    <FaCartPlus />
+                  </div>
+                </Tooltip>
+              )}
+              {tabledata?.length > 0 && dinePreference && (
+                <div style={{ width: '2rem' }}>
+                  {tableOptions
+                    ?.filter((item) => item.OptionName === 'UnpaidBill')
+                    .map((filteredItem) => (
+                      <React.Fragment key={filteredItem.TemplateOptionsId}>
+                        {!OtherServicesglobal && (
+                          <TooltipWrapper
+                            title="Unpaid Bills"
+                            isMobile={isMobile}
+                          >
+                            {' '}
+                            <PozoUnpaidIcon
+                              className="BSBillingNav-icon-table-icon"
+                              style={{
+                                fontSize: '27px',
+                                cursor: 'pointer',
+                                color: unpaidFlow ? '#52c41a' : '#1292EE',
+                              }}
+                              onClick={() => {
+                                (setUnpaidOpen(true), getUnpaiddatas());
+                              }}
+                            />
+                          </TooltipWrapper>
+                        )}
+                      </React.Fragment>
+                    ))}
+                </div>
+              )}
+              {OtherServicesglobal && OrderCardDetail.length >= 1 && (
+                <TooltipWrapper title="Vehicle Number" isMobile={isMobile}>
+                  {' '}
+                  <div
+                    className="BSBillingNav-icon-table-icon"
+                    onClick={
+                      // CheckBookingStatus != 'Close' && !addnewAccess?
+                      Otherservicesvehicleno
+                      // : ''
+                    }
+                    style={{
+                      width: '1.5rem',
+                      cursor:
+                        OrderCardDetail?.length === 0 ||
+                        CheckBookingStatus == 'Close' ||
+                        addnewAccess
+                          ? 'not-allowed'
+                          : 'pointer',
+                      color:
+                        OrderCardDetail?.length === 0 ||
+                        CheckBookingStatus == 'Close' ||
+                        addnewAccess
+                          ? 'gray'
+                          : 'rgb(18, 146, 238)',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                    }}
+                  >
+                    <TfiClipboard />
+                  </div>
+                </TooltipWrapper>
+              )}
+              {dinePreference && (
+                <div style={{ width: '2rem' }}>
+                  {(BookingType === 'Dine In' ||
+                    BookingTypeBoth ||
+                    CheckOrderType?.length > 0) &&
+                    !unpaidFlow &&
+                    SelectedTableDetails?.length !== 0 && (
+                      <>
+                        <TooltipWrapper title="ORDER" isMobile={isMobile}>
+                          {' '}
+                          <PozoDineInIcon
+                            className={
+                              FirstPaymentclick === false && !addnewAccess
+                                ? OrderStatus
+                                  ? 'Dinein-order-btn pulse-element ChairClrRed'
+                                  : 'Dinein-order-btn pulse-element ChairClrGreen'
+                                : 'Dinein-order-btn-disabled pulse-element'
+                            }
+                            onClick={() =>
+                              FirstPaymentclick === false && !addnewAccess
+                                ? changeOrderStatus()
+                                : ''
+                            }
+                          />
+                        </TooltipWrapper>
+                        {FirstPaymentclick === false &&
+                          !addnewAccess &&
+                          !OrderStatus && <BSTipAmount />}
+                      </>
+                    )}
+                </div>
+              )}
+              {!OtherServicesglobal &&
+                OrderCardDetail?.length > 0 &&
+                ParkingDisplay &&
+                !OtherServicesglobal && (
+                  <div
+                    style={{
+                      width: '1.5rem',
+                      color: 'rgb(18, 146, 238)',
+                      display: 'flex',
+                      alignItems: 'center',
+                      height: '2.46rem',
+                    }}
+                  >
+                    <BSOtherServiceClaim />
+                  </div>
+                )}
+              {!OtherServicesglobal && unpaidFlow == true ? (
+                <TooltipWrapper title="Print Bill" isMobile={isMobile}>
+                  {' '}
+                  <PozoBillIcon
+                    className="Hover"
+                    style={{
+                      fontSize: '25px',
+                      cursor: 'pointer',
+                      color: unpaidFlow ? '#52c41a' : '#1292EE',
+                    }}
+                    onClick={() => {
+                      Recipt();
+                    }}
+                  />
+                </TooltipWrapper>
+              ) : (
+                ''
+              )}
+            </div>
+            {!OtherServicesglobal && CreditCustomer && (
+              <div style={{ display: 'none' }}>
+                <BsBillingCreditCustomer
+                  ModalCreditCustomer={CreditCustomer}
+                  handlemodalclose={() => {
+                    handleCreditCustomer('Cancel');
+                  }}
+                  handleOk={() => {
+                    handleCreditCustomer('Submit');
+                  }}
+                />
+              </div>
             )}
           </div>
-        )}
-        <DefaultModal
-          className={'paymentoptionsModal'}
-          open={GlobalSalesPaymentoptions}
-          width={500}
-          height={1000}
-          handleCancel={() => {
-            dispatch(changeSalesPaymentoption(false));
-          }}
-          footer={false}
-          children={
-            <div
-              className="paymentoptionsModalContent"
-              style={{ overflow: 'scroll' }}
-            >
-              <Paymentoption onSuccess={getPaymentOptionFeature} />
-            </div>
-          }
-        />
-        <DefaultModal
-          className={'paymentoptionsModal'}
-          open={OtherServicesModal}
-          title="Vehicle No"
-          handleCancel={() => {
-            setOtherServicesModal(false);
-          }}
-          // handleSubmit={Handlevehiclenumbers}
-          footer={false}
-          children={
-            <div
-              className="paymentoptionsModalContent"
-              style={{ overflow: 'scroll' }}
-            >
-              {OrderCardDetail.map((item, i) => {
-                const isGroup = item.ServiceType === 'G';
-                const groupKey = item.id; // 🔁 using `id` for groups now
-                const uniqueKey = `${item.ServiceId}__${item.__index}`;
+          <DefaultModal
+            open={UpiOpen}
+            title="UPI PAYMENT"
+            width={500}
+            handleCancel={() => {
+              Upimodel('Cancel');
+            }}
+            footer={false}
+            children={
+              <div style={{ overflow: 'scroll' }}>
+                {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
 
-                // For G-type: render input only once for the group
-                if (
-                  isGroup &&
-                  i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
-                ) {
-                  return null;
-                }
-
-                const qty = isGroup
-                  ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
-                    (sum, o) => sum + (o.OrderQty || 1),
-                    0
-                  )
-                  : item.OrderQty || 1;
-
-                return (
-                  <div
-                    key={isGroup ? groupKey : uniqueKey}
-                    style={{ marginBottom: 20 }}
-                  >
-                    <h4>{item.ServiceName}</h4>
-
-                    {Array.from({ length: qty }).map((_, index) => {
-                      const inputKey = isGroup
-                        ? item.id
-                        : `${item.ServiceId}__${item.__index}`;
-                      const value = vehicleInputs[inputKey]?.[index] || '';
-                      const error = errors[inputKey]?.[index] || '';
-
-                      return (
-                        <div
-                          key={`${inputKey}-${index}`}
-                          style={{ marginBottom: 10 }}
-                        >
-                          <input
-                            placeholder={`Vehicle No ${index + 1}`}
-                            value={value}
-                            onChange={(e) =>
-                              handleInputChange(
-                                isGroup ? item.id : item.ServiceId,
-                                index,
-                                e.target.value,
-                                item.ServiceType,
-                                item
-                              )
-                            }
-                            onKeyPress={(e) => {
-                              if (!/[A-Za-z0-9]/.test(e.key)) {
-                                e.preventDefault();
-                              }
-                            }}
-                            style={{
-                              width: '100%',
-                              padding: 8,
-                              borderRadius: 4,
-                              border: error
-                                ? '1px solid red'
-                                : '1px solid #ccc',
-                            }}
-                          />
-                          {error && (
-                            <span style={{ color: 'red', fontSize: 12 }}>
-                              {error}
-                            </span>
-                          )}
-                        </div>
-                      );
-                    })}
-                  </div>
-                );
-              })}
-              <div style={{ textAlign: 'right', marginTop: 16 }}>
-                <button
-                  type="button"
-                  onClick={Handlevehiclenumbers}
-                  disabled={hasVehicleInputErrors()}
+                <div
                   style={{
-                    padding: '8px 24px',
-                    fontFamily: 'Gilroy',
-                    background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
-                    color: '#fff',
-                    border: 'none',
-                    borderRadius: 4,
-                    cursor: hasVehicleInputErrors() ? 'not-allowed' : 'pointer',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    justifyContent: 'space-evenly',
+                    alignItems: 'center',
                   }}
                 >
-                  Submit
-                </button>
+                  <div>
+                    <QrinScreen
+                      Amount={
+                        OrderType === 'Failed'
+                          ? FailedTotalAmt
+                          : Math.round(TotalAmount)
+                      }
+                      UpiId={UpiId}
+                    />
+                  </div>
+
+                  <div>
+                    <h1>
+                      {' '}
+                      RS :
+                      {OrderType === 'Failed'
+                        ? FailedTotalAmt
+                        : Math.round(TotalAmount)}{' '}
+                    </h1>
+                  </div>
+                </div>
+
+                <div className="sentok">
+                  {(selOption || SelCustId) && (
+                    <div className="sentLink" onClick={onFinalSubmit}>
+                      Sent Payment Link
+                      <img
+                        src={WpIcon}
+                        alt="Your Alt Text"
+                        style={{ width: '30px', height: '30px' }}
+                      />
+                      {/* <ArrowRightOutlined /> */}
+                    </div>
+                  )}
+
+                  <div
+                    style={{
+                      display: 'flex',
+                      flexDirection: 'row-reverse',
+                      width: '100px',
+                    }}
+                  >
+                    <Buttons
+                      buttonText="OK"
+                      color="901D77"
+                      icon={<ArrowRightOutlined />}
+                      handleSubmit={() => {
+                        Upimodel('Submit');
+                      }}
+                    />
+                  </div>
+                </div>
               </div>
-            </div>
+            }
+          />
+          {
+            OtherServicesPrintDetails?.length > 0 && (
+              // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <OtherServicePrintStyle1
+                  // index={index}
+                  table2Data={OtherServicesPrintDetails}
+                  singleData2={OtherServicesPrintDetails?.productDetails}
+                  orderId={
+                    OtherServicesPrintDetails?.OrderId &&
+                    extractLastNumberOrderId(
+                      OtherServicesPrintDetails?.OrderId,
+                      OtherServicesPrintDetails?.FYStatus
+                    )
+                  }
+                  CreatedDate={OtherServicesPrintDetails?.CreatedDate}
+                  PaymentStatus={
+                    OtherServicesPrintDetails?.[0]?.PaymentOrderDtl
+                  }
+                  Preference={SettingDataSelector}
+                  printDatas={printDatas}
+                />
+              </div>
+            )
+            // ))
           }
-        />
-        <DefaultModal
-          open={businessUPI}
-          handleCancel={() => setShowCancelConfirm(true)}
-          footer={false}
-          width={500}
-          children={
-            <>
-              <PaymentGatewayEmbedded
-                orderId={businessUPIOrderId}
-                setBusinessUPIOrderId={setBusinessUPIOrderId}
-                businessUPILink={businessUPILink}
-                setBusinessUPI={setBusinessUPI}
-                setPaymentSuccess={setPaymentSuccess}
-                paymentSucess={paymentSucess}
-                ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
-                CustomerDisplay={CustomerDisplay}
-              />
-            </>
-          }
-        />
-        {showCancelConfirm && (
-          <Modal
-            open={showCancelConfirm}
-            title="Cancel Payment"
-            onOk={() => {
-              setBusinessUPI(false);
-              setShowCancelConfirm(false);
-              ClearAllGlobalStateDatas();
-              CustomerDisplay();
-            }}
-            onCancel={() => setShowCancelConfirm(false)}
-            okText="Yes"
-            cancelText="No"
-          >
-            Do you want to cancel the payment?
-          </Modal>
-        )}
-        {
-          OtherServicesPrintDetails?.length > 0 && (
-            // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <OtherServicePrintStyle1
-                // index={index}
-                table2Data={OtherServicesPrintDetails}
-                singleData2={OtherServicesPrintDetails?.productDetails}
-                orderId={
-                  OtherServicesPrintDetails?.OrderId &&
-                  extractLastNumberOrderId(
-                    OtherServicesPrintDetails?.OrderId,
-                    OtherServicesPrintDetails?.FYStatus
-                  )
-                }
-                CreatedDate={OtherServicesPrintDetails?.CreatedDate}
-                PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
-                Preference={SettingDataSelector}
-                printDatas={printDatas}
-              />
-            </div>
-          )
-          // ))
-        }
-        {customerPreviesOrders && (
           <DefaultModal
-            open={customerPreviesOrders}
-            handleCancel={() => setCustomerPreviesOrders(false)}
+            open={unpaidopen}
+            title="UNPAID BILL'S"
+            width={1000}
+            handleCancel={() => {
+              setUnpaidOpen(false);
+            }}
             footer={false}
-            width={700}
-            className={'ModalPaymentGatewayEmbedded'}
+            children={
+              <div style={{ height: '400px', overflow: 'scroll' }}>
+                <Tables
+                  columns={columns}
+                  data={TableData}
+                  dataSource={TableData}
+                />
+              </div>
+            }
+          />
+          {UnpaidConfirmation && (
+            <Modal
+              open={UnpaidConfirmation}
+              width={500}
+              children={
+                <>
+                  <div>
+                    You have already selected a table. If you click 'OK,' the
+                    table selection will be removed, and the unpaid flow will
+                    continue. If you click 'Cancel,' the dine-in flow will
+                    proceed as selected.
+                  </div>
+                </>
+              }
+              onOk={UnpaidOk}
+              onCancel={Unpaidclose}
+            />
+          )}
+          {!OtherServicesglobal && Splitpayment && (
+            <SplitPayment
+              SplitPaymentModal={Splitpayment}
+              handlesplitpaymentclose={handlesplitpaymentclose}
+              TotalNetAmount={
+                OrderType === 'Failed'
+                  ? FailedTotalAmt
+                  : Math.round(
+                      OrderCardDetail?.reduce(
+                        (acc, data) => data?.TotalAmt + acc,
+                        0
+                      ) -
+                        ((OverAllSales > 0 ? OverAllSales : 0) +
+                          (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                          (Discount > 0 ? Discount : 0))
+                    )
+              }
+              failedOrderData={failedOrderData}
+            />
+          )}
+
+          {PrintOrderDetails?.length > 0 && (
+            <div
+              style={{
+                display: 'flex',
+                gap: '1rem',
+                justifyContent: 'center',
+                margin: '1rem 0',
+              }}
+            >
+              {filteredSettingNames?.includes('whatsapp') &&
+                MobileNoWhatsApp?.value && (
+                  <FaWhatsapp
+                    size={32}
+                    color="#25D366"
+                    style={{ cursor: 'pointer' }}
+                    onClick={handleWhatsAppClick}
+                    title="Share on WhatsApp"
+                  />
+                )}
+
+              <FaPrint
+                size={32}
+                color="#1292EE"
+                style={{ cursor: 'pointer' }}
+                onClick={handlePrintOrToken}
+                title="Print"
+              />
+
+              {filteredSettingNames?.includes('SMS') && isMobile && (
+                <MdSms
+                  size={32}
+                  color="#FF8800"
+                  style={{ cursor: 'pointer' }}
+                  onClick={handleSMSClick}
+                  title="Send SMS"
+                />
+              )}
+              {/* WhatsAppShare modal/component */}
+              {showWhatsAppShare && (
+                <WhatsAppShare
+                  message={encodedMessage}
+                  mobileNumber={MobileNoWhatsApp?.value}
+                  onClose={() => closePrintOption(false)}
+                />
+              )}
+              {showSMSShare && isMobile && (
+                <SMSShare
+                  message={encodedMessage}
+                  mobileNumber={MobileNoWhatsApp?.value}
+                  onClose={() => closePrintOption(false)}
+                />
+              )}
+            </div>
+          )}
+          <DefaultModal
+            className={'paymentoptionsModal'}
+            open={GlobalSalesPaymentoptions}
+            width={500}
+            height={1000}
+            handleCancel={() => {
+              dispatch(changeSalesPaymentoption(false));
+            }}
+            footer={false}
+            children={
+              <div
+                className="paymentoptionsModalContent"
+                style={{ overflow: 'scroll' }}
+              >
+                <Paymentoption onSuccess={getPaymentOptionFeature} />
+              </div>
+            }
+          />
+          <DefaultModal
+            className={'paymentoptionsModal'}
+            open={OtherServicesModal}
+            title="Vehicle No"
+            handleCancel={() => {
+              setOtherServicesModal(false);
+            }}
+            // handleSubmit={Handlevehiclenumbers}
+            footer={false}
+            children={
+              <div
+                className="paymentoptionsModalContent"
+                style={{ overflow: 'scroll' }}
+              >
+                {OrderCardDetail.map((item, i) => {
+                  const isGroup = item.ServiceType === 'G';
+                  const groupKey = item.id; // 🔁 using `id` for groups now
+                  const uniqueKey = `${item.ServiceId}__${item.__index}`;
+
+                  // For G-type: render input only once for the group
+                  if (
+                    isGroup &&
+                    i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
+                  ) {
+                    return null;
+                  }
+
+                  const qty = isGroup
+                    ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
+                        (sum, o) => sum + (o.OrderQty || 1),
+                        0
+                      )
+                    : item.OrderQty || 1;
+
+                  return (
+                    <div
+                      key={isGroup ? groupKey : uniqueKey}
+                      style={{ marginBottom: 20 }}
+                    >
+                      <h4>{item.ServiceName}</h4>
+
+                      {Array.from({ length: qty }).map((_, index) => {
+                        const inputKey = isGroup
+                          ? item.id
+                          : `${item.ServiceId}__${item.__index}`;
+                        const value = vehicleInputs[inputKey]?.[index] || '';
+                        const error = errors[inputKey]?.[index] || '';
+
+                        return (
+                          <div
+                            key={`${inputKey}-${index}`}
+                            style={{ marginBottom: 10 }}
+                          >
+                            <input
+                              placeholder={`Vehicle No ${index + 1}`}
+                              value={value}
+                              onChange={(e) =>
+                                handleInputChange(
+                                  isGroup ? item.id : item.ServiceId,
+                                  index,
+                                  e.target.value,
+                                  item.ServiceType,
+                                  item
+                                )
+                              }
+                              onKeyPress={(e) => {
+                                if (!/[A-Za-z0-9]/.test(e.key)) {
+                                  e.preventDefault();
+                                }
+                              }}
+                              style={{
+                                width: '100%',
+                                padding: 8,
+                                borderRadius: 4,
+                                border: error
+                                  ? '1px solid red'
+                                  : '1px solid #ccc',
+                              }}
+                            />
+                            {error && (
+                              <span style={{ color: 'red', fontSize: 12 }}>
+                                {error}
+                              </span>
+                            )}
+                          </div>
+                        );
+                      })}
+                    </div>
+                  );
+                })}
+                <div style={{ textAlign: 'right', marginTop: 16 }}>
+                  <button
+                    type="button"
+                    onClick={Handlevehiclenumbers}
+                    disabled={hasVehicleInputErrors()}
+                    style={{
+                      padding: '8px 24px',
+                      fontFamily: 'Gilroy',
+                      background: hasVehicleInputErrors() ? '#ccc' : '#8f1e78',
+                      color: '#fff',
+                      border: 'none',
+                      borderRadius: 4,
+                      cursor: hasVehicleInputErrors()
+                        ? 'not-allowed'
+                        : 'pointer',
+                    }}
+                  >
+                    Submit
+                  </button>
+                </div>
+              </div>
+            }
+          />
+          <DefaultModal
+            open={businessUPI}
+            handleCancel={() => setShowCancelConfirm(true)}
+            footer={false}
+            width={500}
             children={
               <>
-                <CustomerOrders
-                  CustomerDetails={selOption}
-                  close={() => setCustomerPreviesOrders(false)}
+                <PaymentGatewayEmbedded
+                  orderId={businessUPIOrderId}
+                  setBusinessUPIOrderId={setBusinessUPIOrderId}
+                  businessUPILink={businessUPILink}
+                  setBusinessUPI={setBusinessUPI}
+                  setPaymentSuccess={setPaymentSuccess}
+                  paymentSucess={paymentSucess}
+                  ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
+                  CustomerDisplay={CustomerDisplay}
                 />
               </>
             }
           />
-        )}
-        <DefaultModal
-          className={'paymentoptionsModal'}
-          open={OtherServicesModal}
-          title="Vehicle No"
-          handleCancel={() => {
-            setOtherServicesModal(false);
-          }}
-          handleSubmit={Handlevehiclenumbers}
-          footer={true}
-          children={
-            <div
-              className="paymentoptionsModalContent"
-              style={{ overflow: 'scroll' }}
+          {showCancelConfirm && (
+            <Modal
+              open={showCancelConfirm}
+              title="Cancel Payment"
+              onOk={() => {
+                setBusinessUPI(false);
+                setShowCancelConfirm(false);
+                ClearAllGlobalStateDatas();
+                CustomerDisplay();
+              }}
+              onCancel={() => setShowCancelConfirm(false)}
+              okText="Yes"
+              cancelText="No"
             >
-              {OrderCardDetail.map((item, i) => {
-                const isGroup = item.ServiceType === 'G';
-                const groupKey = item.id; // 🔁 using `id` for groups now
-                const uniqueKey = `${item.ServiceId}__${item.__index}`;
-
-                // For G-type: render input only once for the group
-                if (
-                  isGroup &&
-                  i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
-                ) {
-                  return null;
-                }
-
-                const qty = isGroup
-                  ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
-                    (sum, o) => sum + (o.OrderQty || 1),
-                    0
-                  )
-                  : item.OrderQty || 1;
-
-                return (
-                  <div
-                    key={isGroup ? groupKey : uniqueKey}
-                    style={{ marginBottom: 20 }}
-                  >
-                    <h4>{item.ServiceName}</h4>
-
-                    {Array.from({ length: qty }).map((_, index) => {
-                      const inputKey = isGroup
-                        ? item.id
-                        : `${item.ServiceId}__${item.__index}`;
-                      const value = vehicleInputs[inputKey]?.[index] || '';
-                      const error = errors[inputKey]?.[index] || '';
-
-                      return (
-                        <div
-                          key={`${inputKey}-${index}`}
-                          style={{ marginBottom: 10 }}
-                        >
-                          <input
-                            placeholder={`Vehicle No ${index + 1}`}
-                            value={value}
-                            onChange={(e) =>
-                              handleInputChange(
-                                isGroup ? item.id : item.ServiceId,
-                                index,
-                                e.target.value,
-                                item.ServiceType,
-                                item
-                              )
-                            }
-                            style={{
-                              width: '100%',
-                              padding: 8,
-                              borderRadius: 4,
-                              border: error
-                                ? '1px solid red'
-                                : '1px solid #ccc',
-                            }}
-                          />
-                          {error && (
-                            <span style={{ color: 'red', fontSize: 12 }}>
-                              {error}
-                            </span>
-                          )}
-                        </div>
-                      );
-                    })}
-                  </div>
-                );
-              })}
-            </div>
+              Do you want to cancel the payment?
+            </Modal>
+          )}
+          {
+            OtherServicesPrintDetails?.length > 0 && (
+              // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <OtherServicePrintStyle1
+                  // index={index}
+                  table2Data={OtherServicesPrintDetails}
+                  singleData2={OtherServicesPrintDetails?.productDetails}
+                  orderId={
+                    OtherServicesPrintDetails?.OrderId &&
+                    extractLastNumberOrderId(
+                      OtherServicesPrintDetails?.OrderId,
+                      OtherServicesPrintDetails?.FYStatus
+                    )
+                  }
+                  CreatedDate={OtherServicesPrintDetails?.CreatedDate}
+                  PaymentStatus={
+                    OtherServicesPrintDetails?.[0]?.PaymentOrderDtl
+                  }
+                  Preference={SettingDataSelector}
+                  printDatas={printDatas}
+                />
+              </div>
+            )
+            // ))
           }
-        />
-      </div>
-    </>
+          {customerPreviesOrders && (
+            <DefaultModal
+              open={customerPreviesOrders}
+              handleCancel={() => setCustomerPreviesOrders(false)}
+              footer={false}
+              width={700}
+              className={'ModalPaymentGatewayEmbedded'}
+              children={
+                <>
+                  <CustomerOrders
+                    CustomerDetails={selOption}
+                    close={() => setCustomerPreviesOrders(false)}
+                  />
+                </>
+              }
+            />
+          )}
+          <DefaultModal
+            className={'paymentoptionsModal'}
+            open={OtherServicesModal}
+            title="Vehicle No"
+            handleCancel={() => {
+              setOtherServicesModal(false);
+            }}
+            handleSubmit={Handlevehiclenumbers}
+            footer={true}
+            children={
+              <div
+                className="paymentoptionsModalContent"
+                style={{ overflow: 'scroll' }}
+              >
+                {OrderCardDetail.map((item, i) => {
+                  const isGroup = item.ServiceType === 'G';
+                  const groupKey = item.id; // 🔁 using `id` for groups now
+                  const uniqueKey = `${item.ServiceId}__${item.__index}`;
+
+                  // For G-type: render input only once for the group
+                  if (
+                    isGroup &&
+                    i !== OrderCardDetail.findIndex((o) => o.id === groupKey)
+                  ) {
+                    return null;
+                  }
+
+                  const qty = isGroup
+                    ? OrderCardDetail.filter((o) => o.id === groupKey).reduce(
+                        (sum, o) => sum + (o.OrderQty || 1),
+                        0
+                      )
+                    : item.OrderQty || 1;
+
+                  return (
+                    <div
+                      key={isGroup ? groupKey : uniqueKey}
+                      style={{ marginBottom: 20 }}
+                    >
+                      <h4>{item.ServiceName}</h4>
+
+                      {Array.from({ length: qty }).map((_, index) => {
+                        const inputKey = isGroup
+                          ? item.id
+                          : `${item.ServiceId}__${item.__index}`;
+                        const value = vehicleInputs[inputKey]?.[index] || '';
+                        const error = errors[inputKey]?.[index] || '';
+
+                        return (
+                          <div
+                            key={`${inputKey}-${index}`}
+                            style={{ marginBottom: 10 }}
+                          >
+                            <input
+                              placeholder={`Vehicle No ${index + 1}`}
+                              value={value}
+                              onChange={(e) =>
+                                handleInputChange(
+                                  isGroup ? item.id : item.ServiceId,
+                                  index,
+                                  e.target.value,
+                                  item.ServiceType,
+                                  item
+                                )
+                              }
+                              style={{
+                                width: '100%',
+                                padding: 8,
+                                borderRadius: 4,
+                                border: error
+                                  ? '1px solid red'
+                                  : '1px solid #ccc',
+                              }}
+                            />
+                            {error && (
+                              <span style={{ color: 'red', fontSize: 12 }}>
+                                {error}
+                              </span>
+                            )}
+                          </div>
+                        );
+                      })}
+                    </div>
+                  );
+                })}
+              </div>
+            }
+          />
+        </div>
+      </>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBilling7Payment.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBilling7Payment.jsx
index f8400af..e44bf95 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBilling7Payment.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBilling7Payment.jsx
@@ -7,7 +7,7 @@ import { BiRightArrowAlt } from 'react-icons/bi';
 import { AiOutlineClose } from 'react-icons/ai';
 import BSSummery from '../BSBillingTableSummery/BSSummery.jsx';
 import BSBillingTable7 from './BSBillingTable7';
-import { UpCircleOutlined, UpOutlined } from '@ant-design/icons';
+import { UpCircleOutlined } from '@ant-design/icons';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable4/BSBillingTable4.scss';
 import {
   GlobalSelectedFont,
@@ -17,7 +17,7 @@ import {
   GlobalprintDatas,
   GlobalPrinterMappingDtls,
   getPrinterMappingDetails,
-  getPrintSelectionComponentData,
+  // getPrintSelectionComponentData,
 } from '../../../../../Features/ThemeChange/ThemeChange.js';
 import { PrintStyleFunction } from '../../../../paymentpdfPage/PrintStyleFunction.js';
 import FeaturesFunctionalities from '../../BookingFunctionality/FeaturesFunctionalities.jsx';
@@ -94,7 +94,7 @@ import {
   GlobalOverAllDiscSales,
   ChangeOverAllDiscSales,
   ChangeOverAllDiscEstimate,
-  getAllCustomer,
+
   GlobalBranchFinancialStatus,
   changeSummeryComboOfferAmount,
   ChangeComboCarddata,
@@ -119,6 +119,7 @@ import {
   changeBillEditingMode,
   changePreviousOrderPayment,
   changePreviousOrderOfferDetail,
+  GlobalAllBookingType,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData.js';
 import {
   globalExtraTotalAmount,
@@ -174,11 +175,8 @@ import { getEmpAccess } from '../../../../../Features/AppPage/CenterPage.js';
 import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
 import PozoCartIcon from '../../../../../Pages/BookingScreen/Components/UtillComponents/PozoCartIcon.jsx';
 import {
-  Global_CoupenCodeAmount,
-  Global_loyaltyPointsDiscountAmount,
   Global_OrderOfferDetail,
-  Global_OverallOfferAmount,
-  Global_SalesWiseOfferAmount,
+  Global_OverallOfferAmount
 } from '../../../../../Features/Offer/Offer.js';
 import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
@@ -242,6 +240,7 @@ const BSBilling7Payment = () => {
   const screenwidth = useSelector(GlobalScreenSize);
   const defaultBookingType = useSelector(GlobalDefaultBookingType);
   const printerTemplateStyle = useSelector(SelectedPrintTemplate);
+  const AllBookingType=useSelector(GlobalAllBookingType)
   const FontFamily = useSelector(GlobalSelectedFont);
   const OrderCardDetail = useSelector(GlobalOrderCardDetails);
   const GetCustId = useSelector(GlobalCustId);
@@ -269,6 +268,9 @@ const BSBilling7Payment = () => {
   const templateData = useSelector(getTemplateData);
   const appPreferences = useSelector(ApplicationPreferences);
   const Combodata = useSelector(GlobalCombocarddata, shallowEqual);
+  const holdCheckedSalesSetup = tableOptions?.some(
+    (item) => item?.OptionName === 'Hold'
+  );
   const bookingTypePreference = appPreferences?.find(
     (preference) => preference?.PreferredCatName === 'Booking Type'
   )?.PreferenceCatDetails;
@@ -306,11 +308,9 @@ const BSBilling7Payment = () => {
   const offerAppliedProducts = useSelector(GlobalOfferAppliedProducts);
   const GlobEstBooking = useSelector(GlobalEstimateBooking);
   const GlobProdwisedata = useSelector(GlobalSelProdWiseEst);
-  const BranchFinancialStatus = useSelector(GlobalBranchFinancialStatus);
   const preOrder = useSelector(GlobalpreOrderOpen);
   const OrderType = useSelector(GlobalOrderType);
   const FailedTotalAmt = useSelector(GlobalFailedTotalAmt);
-  const OrderOfferDetail = useSelector(Global_OrderOfferDetail, shallowEqual);
   const defaultPaymentTrigger = useSelector(GlobalPaymentTrigger);
   const [defaultPaymentMode, setDefaultPaymentMode] = useState([]);
   const [defaultEnabled, setDefaultEnabled] = useState(false);
@@ -324,8 +324,6 @@ const BSBilling7Payment = () => {
   const BranchId = SessionData?.BranchId;
   const UserId = SessionData?.UserId;
   const UserType = SessionData?.UserType;
-  const AuthToken = SessionData?.AuthToken;
-  const SessionMobileNo = SessionData?.SessionMobileNo;
   const [FirstPaymentclick, setFirstPaymentclick] = useState(false);
   const [open, setOpen] = useState(false);
   const [unpaidopen, setUnpaidOpen] = useState(false);
@@ -692,13 +690,16 @@ const BSBilling7Payment = () => {
       UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // const Data1 = { AppId, CompId, BranchId };
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
   useEffect(() => {
     if (CompId && BranchId && AppId) {
+      if(holdCheckedSalesSetup)
+      {
       getHolddata();
-      getUnpaiddatas();
+      }
+      // getUnpaiddatas();
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -814,9 +815,7 @@ const BSBilling7Payment = () => {
       : parseInt(value || 0);
   };
   const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
+
     await dispatch(
       getAddCustomerDetails({
         CompId: CompId,
@@ -1627,20 +1626,14 @@ const BSBilling7Payment = () => {
   };
 
   const getBookingTypeId = async () => {
-    let tempconfigdata = await dispatch(
-      getConfigType({ TypeName: 'Booking Type' })
-    ).unwrap();
-
-    if (tempconfigdata?.data?.statusCode == 1) {
-      setConfigDataList(tempconfigdata?.data?.data);
-      let configdata = tempconfigdata?.data?.data;
+      setConfigDataList(AllBookingType);
+      let configdata = AllBookingType;
       let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
 
       let filterconfigdata = configdata?.find(
         (a) => a?.ConfigName === checkName
       );
       setSelectedBookingType(filterconfigdata?.ConfigId);
-    }
   };
   const gettodaydate = () => {
     const currentDate = new Date();
@@ -1932,7 +1925,10 @@ const BSBilling7Payment = () => {
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
     setUpinotSelected(false);
+    if(holdCheckedSalesSetup)
+    {
     getHolddata();
+    }
     if (defaultBookingType === 'Both') {
       await dispatch(changeBookingType('TakeAway'));
     }
@@ -3331,8 +3327,10 @@ const BSBilling7Payment = () => {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if(salesBillEdit){
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger,salesBillEdit]);
 
   const Otherserviceprint = async () => {
     if (OtherServicesPrintDetails?.length > 0) {
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBillingTable7.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBillingTable7.jsx
index 34ded16..82755a3 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBillingTable7.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBillingTable7.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { lazy, Suspense, useEffect, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable7/BSBillingTable7.scss';
 import {
@@ -14,7 +14,6 @@ import {
   GlobalPreviousOrderLength,
   GlobalUnpaidData,
   changeOrderCardDetails,
-  ChangeSelectedCustDisable,
   changeReorderHoldDetails,
   changeBookingType,
   changeSelectedOption,
@@ -50,7 +49,9 @@ import {
   GlobalOfferAppliedProducts,
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 
-import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
+const BSBillingEditQuantity = lazy(
+  () => import('../BSBillingEditQuantity/BSBillingEditQuantity')
+);
 import {
   ChangeTotalAmount,
   globalExtraTotalAmount,
@@ -61,11 +62,14 @@ import dineInIcon from '../../../../../Images/Dine In.svg';
 import TakeAwayIcon from '../../../../../Images/Take away.svg';
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
 import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
-import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
-import { getSession } from '../../../../../Services/Others.js';
+const BSEditTotalAmt = lazy(
+  () => import('../BSEditTotalAmount/BSEditTotalAmt.jsx')
+);
+const BSImeiDetails = lazy(() => import('../BSImeiDetails/BSImeiDetails.jsx'));
+const CustomerPriceHistory = lazy(
+  () => import('../../UtillComponents/CustomerPriceHistory.jsx')
+);
 import { useUtilsComponent } from '../../../../../Services/utils.js';
-import CustomerPriceHistory from '../../UtillComponents/CustomerPriceHistory.jsx';
 
 const BSBillingTable7 = () => {
   const { removeExtraCharge } = useUtilsComponent();
@@ -99,7 +103,8 @@ const BSBillingTable7 = () => {
   const GetCustId = useSelector(GlobalCustId);
   const selectedCustomer = useSelector(GlobalSelOption);
 
-  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] = useState(false);
+  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] =
+    useState(false);
   const [customerProduct, setCustomerProduct] = useState(null);
   const [EditQuantity, setEditQuantity] = useState(false);
   const [Modaldata, setModaldata] = useState([]);
@@ -133,16 +138,16 @@ const BSBillingTable7 = () => {
     OrderType === 'Hold'
       ? tableData?.filter((a, b) => a.BookingTypeName === 'TakeAway')
       : tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
-      );
+          (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
+        );
   const OldtableDataDinein = tableData?.filter(
     (a, b) => a.BookingTypeName === 'Dine In' && a?.SalesId
   );
   const OldtableDataTakeAway =
     OrderType != 'Hold'
       ? tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
-      )
+          (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
+        )
       : [];
   const productBasedExtraCharges = GlobalExtraCharge.filter(
     (obj) => 'ProdName' in obj
@@ -276,7 +281,6 @@ const BSBillingTable7 = () => {
         event.preventDefault();
         handleShortcut('weightAmount');
       }
-
     };
     window.addEventListener('keydown', handleKeyDown);
 
@@ -936,9 +940,9 @@ const BSBillingTable7 = () => {
             )?.map((item, idx) =>
               idx === 0
                 ? {
-                  ...item,
-                  FreeQty,
-                }
+                    ...item,
+                    FreeQty,
+                  }
                 : item
             ),
           };
@@ -1309,9 +1313,6 @@ const BSBillingTable7 = () => {
               });
             }
           }
-          //Change Remove OrderCartDetail
-          //Remove FreeprodList
-          //ChangeOfferApplied Products
         }
       } else {
         ///remove item wise offer
@@ -1605,8 +1606,6 @@ const BSBillingTable7 = () => {
               });
             }
           } else {
-            //have to find if thereis two Booking Type is there
-            //Convert That Free Product To Paid Product
             let ischeckBothBookingType = tableData?.find(
               (e) =>
                 e?.InwardDtlId == inward &&
@@ -1621,12 +1620,6 @@ const BSBillingTable7 = () => {
                 e?.BookingTypeName == item?.BookingTypeName
             );
             if (ischeckBothBookingType) {
-              //Convert That Free Product To Paid Product
-
-              //merge that paid product with same booking type
-              //decrease free prod list qty
-              //change offer applied product qty
-              // await ChangeOrderCardDetailsFn(item?.BookingTypeName, null, ischeckBothBookingType?.OrderQty + FreeProductSameBookingType?.OrderQty, false, ischeckBothBookingType?.InwardDtlId, item?.InwardDtlId, item?.Offer, true)
               if (FreeProductSameBookingType?.OrderQty >= item?.OrderQty) {
                 await ChangeFreeprodlistFn({
                   OverAllFreeQty: FreeProd?.OverAllFreeQty - item?.OrderQty,
@@ -1676,24 +1669,10 @@ const BSBillingTable7 = () => {
                 let diff =
                   item?.OrderQty - FreeProductSameBookingType?.OrderQty;
 
-                //SameBookingFreeQty
-                //FreeProductSameBookingType?.OrderQty
-
-                //Another BookingType Paid Qty
-                //anotherBookingType
-
-                //anotherBookingType?.Free OrderQty
-                //ischeckBothBookingType
-
-                //anotherBookingType?.OrderQty-ischeckBothBookingType?.OrderQty
-                //convert another Booking Type Qty also Free to Paid
-
                 if (
                   (anotherBookingType?.OrderQty || 0) <
                   anotherBookingTypeOffer?.OrderQty
                 ) {
-                  //paidproduct                         ischeckBothBookingType?.OrderQty-anotherBookingType?.OrderQty
-                  //PaidProdcut Current BookingType    FreeProductSameBookingType?.OrderQty
                   let paidproductAnotherType =
                     ischeckBothBookingType?.OrderQty -
                     anotherBookingType?.OrderQty;
@@ -1845,146 +1824,7 @@ const BSBillingTable7 = () => {
         }
       }
     }
-
   };
-  // const removeFromCart = async (item) => {
-  //   setPreviousdataLength(tableData?.length);
-  //   if (item?.BookingTypeName !== 'Dine In' && OrderType !== 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderHoldDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName !== 'Dine In' && OrderType === 'Hold') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     );
-  //     // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderHoldDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   } else if (item?.BookingTypeName === 'Dine In') {
-  //     const UpdatedData = tableData?.filter(
-  //       (cartItem) =>
-  //         !(
-  //           cartItem?.ProdId === item?.ProdId &&
-  //           cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //           cartItem?.OrderRate === item?.OrderRate &&
-  //           cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //           !cartItem?.SalesId
-  //         )
-  //     );
-
-  //     if (OfferCheckedInSetup && preferenceOffer) {
-  //       await applyOffer(UpdatedData);
-  //     } else {
-  //       dispatch(changeOrderCardDetails(UpdatedData));
-  //     }
-  //     await dispatch(
-  //       ChangeTotalAmount(
-  //         GlobalExtraCharge?.filter((extra) => {
-  //           if (BookingType === 'Dine In') {
-  //             // Remove extra charges linked to the removed product
-  //             return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //           } else if (BookingType === 'TakeAway') {
-  //             // Remove extra charges only if SalesId is not present
-  //             return extra.ProdId !== item?.ProdId;
-  //           }
-  //           return true; // Keep everything else
-  //         })
-  //       )
-  //     ); // if the quantity of the item is 1, remove the item from the cart
-  //     if (tableData?.length <= 1) {
-  //       await dispatch(changeReorderHoldDetails({}));
-  //       await dispatch(changeReorderHoldDetails([]));
-  //       await dispatch(changeUnpaidData(false));
-  //       await dispatch(ChangeSelectedCustDisable(false));
-  //       await dispatch(changeSelectedOption(false));
-  //       await dispatch(changeBookingType('TakeAway'));
-  //       await dispatch(changeTokenOnly(false));
-  //       await dispatch(changeAllProductTokenAvailable(false));
-  //       await dispatch(ChangeOverAllDiscSales(null));
-  //       await dispatch(ChangeOverAllDiscEstimate(null));
-  //       await dispatch(changeSelProdWiseEst([]));
-  //       await dispatch(ChangeTotalAmount([]));
-  //     }
-  //   }
-  // };
 
   function safeRound(amountStr) {
     if (amountStr == null) return allowDecimal ? '0.00' : '0';
@@ -1997,11 +1837,10 @@ const BSBillingTable7 = () => {
     return allowDecimal ? num.toFixed(2) : Math.round(num).toString();
   }
 
-
   const handleCustomerProductPriceHistory = (item) => {
     setCustomerPriceHistoryOpen(true);
     setCustomerProduct(item?.ProdId);
-  }
+  };
 
   const handlechange33 = () => {
     if (editdelete === 'Edit') {
@@ -2055,592 +1894,603 @@ const BSBillingTable7 = () => {
   };
 
   return (
-    <>
-      <div
-        style={{
-          display: 'flex',
-          justifyContent: 'flex-end',
-          alignItems: 'center',
-          gap: '0.5rem',
-          // padding: "0.5rem 0.5rem",
-          position: 'sticky',
-          top: '0',
-          zIndex: '1',
-        }}
-      ></div>
-      <div
-        class="radio-button-group mts"
-        style={{ position: 'sticky', padding: '3px' }}
-      >
-        {editField && (
-          <div class="item">
-            <input
-              type="radio"
-              name="button-group"
-              class="radio-button"
-              value="1"
-              id="button1"
-              checked={editdelete === 'Edit' && 'checked'}
-            />
-            <label for="button1" onClick={handlechange33}>
-              {' '}
-              Edit{' '}
-            </label>
-          </div>
-        )}
-        {deleteField && (
-          <div class="item">
-            <input
-              type="radio"
-              name="button-group"
-              class="radio-button"
-              value="2"
-              id="button2"
-              checked={editdelete === 'Delete' && 'checked'}
-            />
-            <label for="button2" onClick={handlechange22}>
-              {' '}
-              Delete{' '}
-            </label>
-          </div>
-        )}
-      </div>
+    <Suspense fallback={<div>Loading...</div>}>
+      <>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'flex-end',
+            alignItems: 'center',
+            gap: '0.5rem',
+            // padding: "0.5rem 0.5rem",
+            position: 'sticky',
+            top: '0',
+            zIndex: '1',
+          }}
+        ></div>
+        <div
+          class="radio-button-group mts"
+          style={{ position: 'sticky', padding: '3px' }}
+        >
+          {editField && (
+            <div class="item">
+              <input
+                type="radio"
+                name="button-group"
+                class="radio-button"
+                value="1"
+                id="button1"
+                checked={editdelete === 'Edit' && 'checked'}
+              />
+              <label for="button1" onClick={handlechange33}>
+                {' '}
+                Edit{' '}
+              </label>
+            </div>
+          )}
+          {deleteField && (
+            <div class="item">
+              <input
+                type="radio"
+                name="button-group"
+                class="radio-button"
+                value="2"
+                id="button2"
+                checked={editdelete === 'Delete' && 'checked'}
+              />
+              <label for="button2" onClick={handlechange22}>
+                {' '}
+                Delete{' '}
+              </label>
+            </div>
+          )}
+        </div>
 
-      <div
-        style={{ height: isMobile ? '40vh' : '' }}
-        className={
-          isMobile ? 'BSBilling-tablediv-mobile' : 'BSBilling7-tablediv'
-        }
-      >
-        <table className="BSBill-Table7">
-          <thead>
-            <tr
-              className="BSBill-Table7-throw"
-              style={{
-                backgroundColor: SelectedBillColor?.['BackgroundColor'],
-                color: SelectedBillColor?.['FontColor'],
-                fontFamily: SelectedFont,
-              }}
-            >
-              {tableOptions?.map((item) => (
-                <>
-                  {item.OptionName == 'Sl.No' && BookingTypeBoth && (
-                    <th
-                      style={{
-                        fontFamily: SelectedFont,
-                        fontWeight: '600',
-                        fontSize: '13px',
-                        width: '15px',
-                        padding: '1px',
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="Serial Number">{''}</Tooltip>
-                      ) : (
-                        <div>{''}</div>
-                      )}
-                    </th>
-                  )}
-                  {item.OptionName == 'Sl.No' && (
-                    <th
-                      className="BillTable7-th"
-                      style={{
-                        fontFamily: SelectedFont,
-                        fontWeight: '600',
-                        padding: '8px',
-                        fontSize: '16px',
-                        width: '10px',
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="Serial Number">Sl.No</Tooltip>
-                      ) : (
-                        <div>Sl.No</div>
-                      )}
-                    </th>
-                  )}
+        <div
+          style={{ height: isMobile ? '40vh' : '' }}
+          className={
+            isMobile ? 'BSBilling-tablediv-mobile' : 'BSBilling7-tablediv'
+          }
+        >
+          <table className="BSBill-Table7">
+            <thead>
+              <tr
+                className="BSBill-Table7-throw"
+                style={{
+                  backgroundColor: SelectedBillColor?.['BackgroundColor'],
+                  color: SelectedBillColor?.['FontColor'],
+                  fontFamily: SelectedFont,
+                }}
+              >
+                {tableOptions?.map((item) => (
+                  <>
+                    {item.OptionName == 'Sl.No' && BookingTypeBoth && (
+                      <th
+                        style={{
+                          fontFamily: SelectedFont,
+                          fontWeight: '600',
+                          fontSize: '13px',
+                          width: '15px',
+                          padding: '1px',
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="Serial Number">{''}</Tooltip>
+                        ) : (
+                          <div>{''}</div>
+                        )}
+                      </th>
+                    )}
+                    {item.OptionName == 'Sl.No' && (
+                      <th
+                        className="BillTable7-th"
+                        style={{
+                          fontFamily: SelectedFont,
+                          fontWeight: '600',
+                          padding: '8px',
+                          fontSize: '16px',
+                          width: '10px',
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="Serial Number">Sl.No</Tooltip>
+                        ) : (
+                          <div>Sl.No</div>
+                        )}
+                      </th>
+                    )}
 
-                  {item.OptionName == 'Item' && (
-                    <th
-                      className="BillTable7-th"
-                      style={{
-                        fontFamily: SelectedFont,
-                        fontWeight: '600',
-                        padding: '8px',
-                        fontSize: '16px',
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="Item Name">Item</Tooltip>
-                      ) : (
-                        <div> Item </div>
-                      )}
-                    </th>
-                  )}
-                  {item.OptionName == 'MRP' && (
-                    <th
-                      className="BillTable7-th"
-                      style={{
-                        fontFamily: SelectedFont,
-                        padding: '8px',
-                        fontSize: '16px',
-                        width: '5%',
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="MRP">MRP</Tooltip>
-                      ) : (
-                        <div>MRP</div>
-                      )}
-                    </th>
-                  )}
-                  {item.OptionName == 'Discount' && (
-                    <th
-                      className="BillTable7-th"
-                      style={{
-                        fontFamily: SelectedFont,
-                        fontWeight: '600',
-                        padding: '8px',
-                        fontSize: '16px',
-                        width: '5%',
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="Discount">₹/%</Tooltip>
-                      ) : (
-                        <div>₹/% </div>
-                      )}
-                    </th>
-                  )}
-                  {item.OptionName == 'Quantity' && (
-                    <th
-                      className="BillTable7-th"
-                      style={{
-                        fontFamily: SelectedFont,
-                        fontWeight: '600',
-                        fontSize: '16px',
-                        padding: '8px',
-                        width: '5%',
-                      }}
-                      // onClick={tableData?.length>0? OpenEditTotalAmount :""}
-                      onClick={() => {
-                        if (tableData?.length > 0) {
-                          OpenEditTotalAmount();
-                        }
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="Quantity">Qty</Tooltip>
-                      ) : (
-                        <div>Qty</div>
-                      )}
-                    </th>
-                  )}
-                  {item.OptionName == 'Rate' && (
-                    <th
-                      className="BillTable7-th"
-                      style={{
-                        fontFamily: SelectedFont,
-                        fontWeight: '600',
-                        fontSize: '16px',
-                        width: '5%',
-                        padding: '8px',
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="Rate">Rt</Tooltip>
-                      ) : (
-                        <div> Rt </div>
-                      )}
-                    </th>
-                  )}
-                  {item.OptionName == 'Amount' && (
-                    <th
-                      className="BillTable7-th"
-                      style={{
-                        fontFamily: SelectedFont,
-                        fontWeight: '600',
-                        fontSize: '16px',
-                        width: '5%',
-                        padding: '8px',
-                      }}
-                    >
-                      {!isMobile ? (
-                        <Tooltip title="Amount">Amt</Tooltip>
-                      ) : (
-                        <div>Amt</div>
-                      )}
-                    </th>
-                  )}
-                </>
-              ))}
-            </tr>
-          </thead>
-          {/* For Reorder TakeWay */}
-          {OldtableDataTakeAway?.length > 0 && (
-            <tbody className="Table7-tbody">
-              {OldtableDataTakeAway?.map((item, index) => (
-                <tr
-                  style={{
-                    fontFamily: SelectedFont ? SelectedFont : '',
+                    {item.OptionName == 'Item' && (
+                      <th
+                        className="BillTable7-th"
+                        style={{
+                          fontFamily: SelectedFont,
+                          fontWeight: '600',
+                          padding: '8px',
+                          fontSize: '16px',
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="Item Name">Item</Tooltip>
+                        ) : (
+                          <div> Item </div>
+                        )}
+                      </th>
+                    )}
+                    {item.OptionName == 'MRP' && (
+                      <th
+                        className="BillTable7-th"
+                        style={{
+                          fontFamily: SelectedFont,
+                          padding: '8px',
+                          fontSize: '16px',
+                          width: '5%',
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="MRP">MRP</Tooltip>
+                        ) : (
+                          <div>MRP</div>
+                        )}
+                      </th>
+                    )}
+                    {item.OptionName == 'Discount' && (
+                      <th
+                        className="BillTable7-th"
+                        style={{
+                          fontFamily: SelectedFont,
+                          fontWeight: '600',
+                          padding: '8px',
+                          fontSize: '16px',
+                          width: '5%',
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="Discount">₹/%</Tooltip>
+                        ) : (
+                          <div>₹/% </div>
+                        )}
+                      </th>
+                    )}
+                    {item.OptionName == 'Quantity' && (
+                      <th
+                        className="BillTable7-th"
+                        style={{
+                          fontFamily: SelectedFont,
+                          fontWeight: '600',
+                          fontSize: '16px',
+                          padding: '8px',
+                          width: '5%',
+                        }}
+                        // onClick={tableData?.length>0? OpenEditTotalAmount :""}
+                        onClick={() => {
+                          if (tableData?.length > 0) {
+                            OpenEditTotalAmount();
+                          }
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="Quantity">Qty</Tooltip>
+                        ) : (
+                          <div>Qty</div>
+                        )}
+                      </th>
+                    )}
+                    {item.OptionName == 'Rate' && (
+                      <th
+                        className="BillTable7-th"
+                        style={{
+                          fontFamily: SelectedFont,
+                          fontWeight: '600',
+                          fontSize: '16px',
+                          width: '5%',
+                          padding: '8px',
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="Rate">Rt</Tooltip>
+                        ) : (
+                          <div> Rt </div>
+                        )}
+                      </th>
+                    )}
+                    {item.OptionName == 'Amount' && (
+                      <th
+                        className="BillTable7-th"
+                        style={{
+                          fontFamily: SelectedFont,
+                          fontWeight: '600',
+                          fontSize: '16px',
+                          width: '5%',
+                          padding: '8px',
+                        }}
+                      >
+                        {!isMobile ? (
+                          <Tooltip title="Amount">Amt</Tooltip>
+                        ) : (
+                          <div>Amt</div>
+                        )}
+                      </th>
+                    )}
+                  </>
+                ))}
+              </tr>
+            </thead>
+            {/* For Reorder TakeWay */}
+            {OldtableDataTakeAway?.length > 0 && (
+              <tbody className="Table7-tbody">
+                {OldtableDataTakeAway?.map((item, index) => (
+                  <tr
+                    style={{
+                      fontFamily: SelectedFont ? SelectedFont : '',
 
-                    backgroundColor:
-                      BillOrderPre === 'Y'
-                        ? item?.SalesId && OrderType !== 'Hold'
+                      backgroundColor:
+                        BillOrderPre === 'Y'
+                          ? item?.SalesId && OrderType !== 'Hold'
+                            ? 'rgb(243, 248, 213)'
+                            : triggerAnimation &&
+                                index === 0 &&
+                                !item?.SalesId &&
+                                tableDataTakeAway?.length >= PreviousdataLength
+                              ? 'wheat'
+                              : triggerAnimation &&
+                                  index === 0 &&
+                                  tableDataTakeAway?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
+                                ? 'wheat'
+                                : 'inherit'
+                          : 'none',
+                      background:
+                        item?.SalesId && OrderType !== 'Hold'
                           ? 'rgb(243, 248, 213)'
-                          : triggerAnimation &&
+                          : GlobEstBooking === 'ParEst' &&
+                              GlobProdwisedata?.includes(
+                                item?.InwardDtlId + ' ' + item?.BookingTypeName
+                              )
+                            ? '#b2d1f7'
+                            : index % 2 === 0
+                              ? 'white'
+                              : SelectedBillColor?.['OverallBackgroundColor']
+                                ? SelectedBillColor?.['OverallBackgroundColor']
+                                : '#d6d6d6',
+                      animation:
+                        BillOrderPre === 'Y' && !BookingTypeBoth
+                          ? triggerAnimation &&
                             index === 0 &&
                             !item?.SalesId &&
-                            tableDataTakeAway?.length >= PreviousdataLength
-                            ? 'wheat'
-                            : triggerAnimation &&
-                              index === 0 &&
-                              tableDataTakeAway?.length >=
-                              PreviousdataLength &&
-                              !HoldOrderDtl &&
-                              !UnpaidData
-                              ? 'wheat'
-                              : 'inherit'
-                        : 'none',
-                    background:
+                            tableDataTakeAway?.length >= PreviousdataLength &&
+                            !HoldOrderDtl &&
+                            !UnpaidData
+                            ? 'splashAnimation 0.5s ease-in-out'
+                            : 'none'
+                          : 'none',
+                    }}
+                    key={index}
+                    onClick={
+                      editdelete === 'Edit'
+                        ? () => handleEditQuantity(item)
+                        : editdelete === 'Delete'
+                          ? () => removeFromCart(item)
+                          : () => {}
+                    }
+                    // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
+
+                    className={`${
                       item?.SalesId && OrderType !== 'Hold'
+                        ? 'BSBill-Table7-content-disabled'
+                        : 'BSBill-Table7-content'
+                    } 
+              
+                 `}
+                  >
+                    {tableOptions?.map((tableitem) => (
+                      <>
+                        {BookingTypeBoth &&
+                          index == 0 &&
+                          tableitem.OptionName == 'Sl.No' && (
+                            <td
+                              rowspan={tableData.length}
+                              style={{ backgroundColor: '#CFB59D' }}
+                            >
+                              <img width="30px" alt="" src={TakeAwayIcon} />
+                            </td>
+                          )}
+
+                        {tableitem.OptionName == 'Sl.No' && (
+                          <td
+                            className="Table-3_qty"
+                            style={{
+                              width: '0px',
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {index + 1}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Item' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                              textAlign: 'left',
+                              padding: '8px',
+                            }}
+                            onClick={() =>
+                              (item.FullProductIdentifierDtls?.length > 0 ||
+                                item.ProductIdentifierDtls?.length > 0) &&
+                              handleImeiDetails(item)
+                            }
+                          >
+                            {item?.ProdName}
+                            {item?.Type != 'C' && (
+                              <>
+                                <p
+                                  className="Tbl3-Variant"
+                                  style={{ fontFamily: 'Poppins' }}
+                                >
+                                  (
+                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                    'variant'
+                                  ) && <span>{item?.ProdVariantName} </span>}
+                                  {item?.Size}
+                                  {item?.SinglePc == 'Y'
+                                    ? 'PCS'
+                                    : item?.UomName}
+                                  )
+                                </p>
+                                {item?.OfferMessage &&
+                                  !Array.isArray(item.OfferMessage) && (
+                                    <p
+                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                    >
+                                      {item.OfferMessage?.split('>')?.[0] +
+                                        `> ${item?.OrderQty} Eligible Free`}
+                                    </p>
+                                  )}
+                              </>
+                            )}
+                            {item?.Type === 'C' && (
+                              <div
+                                className="Tbl3-Variant"
+                                style={{ fontFamily: 'Poppins' }}
+                              >
+                                {item.ProdDetail?.map((prod, index) => (
+                                  <p key={index}>
+                                    {prod.ProdName} - {prod.Size} {prod.UomName}
+                                  </p>
+                                ))}
+                              </div>
+                            )}
+                            {productBasedExtraCharges?.find(
+                              (find) => find.ProdId === item.ProdId
+                            ) !== undefined && (
+                              <div
+                                style={{
+                                  fontSize: '10px',
+                                  fontWeight: '500',
+                                  whiteSpace: 'nowrap',
+                                }}
+                              >
+                                Extra Charges :{' '}
+                                {
+                                  productBasedExtraCharges?.find(
+                                    (find) => find.ProdId === item.ProdId
+                                  )?.TotalAmt
+                                }
+                              </div>
+                            )}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'MRP' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.MRP}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Discount' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.Type != 'C'
+                              ? item.Offer
+                                ? item.Offer
+                                : '-'
+                              : item?.OfferPrice && item?.OfferPrice > 0
+                                ? item?.OfferType === 'F'
+                                  ? `₹${safeRound(item.OfferPrice)}`
+                                  : `${item.OfferPrice}%`
+                                : '-'}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Quantity' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.OrderQty}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Rate' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.OrderRate}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Amount' && (
+                          <td
+                            onClick={(e) => {
+                              e.stopPropagation();
+                              if (GetCustId) {
+                                handleCustomerProductPriceHistory(item);
+                              }
+                            }}
+                            style={{ fontFamily: 'Poppins' }}
+                          >
+                            {safeRound(item?.TotalAmt)}
+                          </td>
+                        )}
+                      </>
+                    ))}
+                  </tr>
+                ))}
+              </tbody>
+            )}
+            {/* Reorder DineIn */}
+            {OldtableDataDinein?.length > 0 && (
+              <tbody className="Table7-tbody">
+                {OldtableDataDinein?.map((item, index) => (
+                  <tr
+                    style={{
+                      fontFamily: SelectedFont ? SelectedFont : '',
+
+                      backgroundColor:
+                        BillOrderPre === 'Y'
+                          ? item?.SalesId
+                            ? 'rgb(243, 248, 213)'
+                            : BookingType === 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataTakeAway?.length + index === 0 &&
+                                !item?.SalesId &&
+                                tableDataDinein?.length >= PreviousdataLength
+                              ? 'wheat'
+                              : BookingType !== 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataTakeAway?.length + index === 0 &&
+                                  tableDataDinein?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
+                                ? 'wheat'
+                                : 'inherit'
+                          : 'none',
+                      background: item?.SalesId
                         ? 'rgb(243, 248, 213)'
                         : GlobEstBooking === 'ParEst' &&
-                          GlobProdwisedata?.includes(
-                            item?.InwardDtlId + ' ' + item?.BookingTypeName
-                          )
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
                           ? '#b2d1f7'
-                          : index % 2 === 0
+                          : (OldtableDataTakeAway?.length + index) % 2 === 0
                             ? 'white'
                             : SelectedBillColor?.['OverallBackgroundColor']
                               ? SelectedBillColor?.['OverallBackgroundColor']
                               : '#d6d6d6',
-                    animation:
-                      BillOrderPre === 'Y' && !BookingTypeBoth
-                        ? triggerAnimation &&
-                          index === 0 &&
-                          !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength &&
-                          !HoldOrderDtl &&
-                          !UnpaidData
-                          ? 'splashAnimation 0.5s ease-in-out'
-                          : 'none'
-                        : 'none',
-                  }}
-                  key={index}
-                  onClick={
-                    editdelete === 'Edit'
-                      ? () => handleEditQuantity(item)
-                      : editdelete === 'Delete'
-                        ? () => removeFromCart(item)
-                        : () => { }
-                  }
-                  // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
-
-                  className={`${item?.SalesId && OrderType !== 'Hold'
-                    ? 'BSBill-Table7-content-disabled'
-                    : 'BSBill-Table7-content'
-                    } 
-              
-                 `}
-                >
-                  {tableOptions?.map((tableitem) => (
-                    <>
-                      {BookingTypeBoth &&
-                        index == 0 &&
-                        tableitem.OptionName == 'Sl.No' && (
-                          <td
-                            rowspan={tableData.length}
-                            style={{ backgroundColor: '#CFB59D' }}
-                          >
-                            <img width="30px" alt="" src={TakeAwayIcon} />
-                          </td>
-                        )}
-
-                      {tableitem.OptionName == 'Sl.No' && (
-                        <td
-                          className="Table-3_qty"
-                          style={{
-                            width: '0px',
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {index + 1}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Item' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                            textAlign: 'left',
-                            padding: '8px',
-                          }}
-                          onClick={() =>
-                            (item.FullProductIdentifierDtls?.length > 0 ||
-                              item.ProductIdentifierDtls?.length > 0) &&
-                            handleImeiDetails(item)
-                          }
-                        >
-                          {item?.ProdName}
-                          {item?.Type != 'C' && (
-                            <>
-                              <p
-                                className="Tbl3-Variant"
-                                style={{ fontFamily: 'Poppins' }}
-                              >
-                                (
-                                {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                  'variant'
-                                ) && <span>{item?.ProdVariantName} </span>}
-                                {item?.Size}
-                                {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
-                              </p>
-                              {item?.OfferMessage &&
-                                !Array.isArray(item.OfferMessage) && (
-                                  <p
-                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                  >
-                                    {item.OfferMessage?.split('>')?.[0] +
-                                      `> ${item?.OrderQty} Eligible Free`}
-                                  </p>
-                                )}
-                            </>
-                          )}
-                          {item?.Type === 'C' && (
-                            <div
-                              className="Tbl3-Variant"
-                              style={{ fontFamily: 'Poppins' }}
-                            >
-                              {item.ProdDetail?.map((prod, index) => (
-                                <p key={index}>
-                                  {prod.ProdName} - {prod.Size} {prod.UomName}
-                                </p>
-                              ))}
-                            </div>
-                          )}
-                          {productBasedExtraCharges?.find(
-                            (find) => find.ProdId === item.ProdId
-                          ) !== undefined && (
-                              <div
-                                style={{
-                                  fontSize: '10px',
-                                  fontWeight: '500',
-                                  whiteSpace: 'nowrap',
-                                }}
-                              >
-                                Extra Charges :{' '}
-                                {
-                                  productBasedExtraCharges?.find(
-                                    (find) => find.ProdId === item.ProdId
-                                  )?.TotalAmt
-                                }
-                              </div>
-                            )}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'MRP' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.MRP}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Discount' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.Type != 'C'
-                            ? item.Offer
-                              ? item.Offer
-                              : '-'
-                            : item?.OfferPrice && item?.OfferPrice > 0
-                              ? item?.OfferType === 'F'
-                                ? `₹${safeRound(item.OfferPrice)}`
-                                : `${item.OfferPrice}%`
-                              : '-'}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Quantity' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.OrderQty}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Rate' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.OrderRate}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Amount' && (
-                        <td
-                          onClick={(e) => {
-                            e.stopPropagation();
-                            if (GetCustId) {
-                              handleCustomerProductPriceHistory(item);
-                            }
-                          }}
-                          style={{ fontFamily: 'Poppins' }}>
-                          {safeRound(item?.TotalAmt)}
-                        </td>
-                      )}
-                    </>
-                  ))}
-                </tr>
-              ))}
-            </tbody>
-          )}
-          {/* Reorder DineIn */}
-          {OldtableDataDinein?.length > 0 && (
-            <tbody className="Table7-tbody">
-              {OldtableDataDinein?.map((item, index) => (
-                <tr
-                  style={{
-                    fontFamily: SelectedFont ? SelectedFont : '',
-
-                    backgroundColor:
-                      BillOrderPre === 'Y'
-                        ? item?.SalesId
-                          ? 'rgb(243, 248, 213)'
-                          : BookingType === 'Dine In' &&
-                            triggerAnimation &&
+                      animation:
+                        BillOrderPre === 'Y' && !BookingTypeBoth
+                          ? triggerAnimation &&
                             OldtableDataTakeAway?.length + index === 0 &&
                             !item?.SalesId &&
-                            tableDataDinein?.length >= PreviousdataLength
-                            ? 'wheat'
-                            : BookingType !== 'Dine In' &&
-                              triggerAnimation &&
-                              OldtableDataTakeAway?.length + index === 0 &&
-                              tableDataDinein?.length >= PreviousdataLength &&
-                              !HoldOrderDtl &&
-                              !UnpaidData
-                              ? 'wheat'
-                              : 'inherit'
-                        : 'none',
-                    background: item?.SalesId
-                      ? 'rgb(243, 248, 213)'
-                      : GlobEstBooking === 'ParEst' &&
-                        GlobProdwisedata?.includes(
-                          item?.InwardDtlId + ' ' + item?.BookingTypeName
-                        )
-                        ? '#b2d1f7'
-                        : (OldtableDataTakeAway?.length + index) % 2 === 0
-                          ? 'white'
-                          : SelectedBillColor?.['OverallBackgroundColor']
-                            ? SelectedBillColor?.['OverallBackgroundColor']
-                            : '#d6d6d6',
-                    animation:
-                      BillOrderPre === 'Y' && !BookingTypeBoth
-                        ? triggerAnimation &&
-                          OldtableDataTakeAway?.length + index === 0 &&
-                          !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength &&
-                          !HoldOrderDtl &&
-                          !UnpaidData
-                          ? 'splashAnimation 0.5s ease-in-out'
-                          : 'none'
-                        : 'none',
-                  }}
-                  key={OldtableDataTakeAway?.length + index}
-                  onClick={
-                    editdelete === 'Edit'
-                      ? () => handleEditQuantity(item)
-                      : editdelete === 'Delete'
-                        ? () => removeFromCart(item)
-                        : () => { }
-                  }
-                  // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
+                            tableDataDinein?.length >= PreviousdataLength &&
+                            !HoldOrderDtl &&
+                            !UnpaidData
+                            ? 'splashAnimation 0.5s ease-in-out'
+                            : 'none'
+                          : 'none',
+                    }}
+                    key={OldtableDataTakeAway?.length + index}
+                    onClick={
+                      editdelete === 'Edit'
+                        ? () => handleEditQuantity(item)
+                        : editdelete === 'Delete'
+                          ? () => removeFromCart(item)
+                          : () => {}
+                    }
+                    // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
 
-                  className={`${item?.SalesId
-                    ? 'BSBill-Table7-content-disabled'
-                    : 'BSBill-Table7-content'
+                    className={`${
+                      item?.SalesId
+                        ? 'BSBill-Table7-content-disabled'
+                        : 'BSBill-Table7-content'
                     } 
               
                  `}
-                >
-                  {tableOptions?.map((tableitem) => (
-                    <>
-                      {BookingTypeBoth &&
-                        index == 0 &&
-                        tableitem.OptionName == 'Sl.No' && (
+                  >
+                    {tableOptions?.map((tableitem) => (
+                      <>
+                        {BookingTypeBoth &&
+                          index == 0 &&
+                          tableitem.OptionName == 'Sl.No' && (
+                            <td
+                              rowspan={tableData.length}
+                              style={{ backgroundColor: '#A2C3CD' }}
+                            >
+                              <img width="30px" alt="" src={dineInIcon} />
+                            </td>
+                          )}
+
+                        {tableitem.OptionName == 'Sl.No' && (
                           <td
-                            rowspan={tableData.length}
-                            style={{ backgroundColor: '#A2C3CD' }}
+                            className="Table-3_qty"
+                            style={{
+                              width: '0px',
+                              fontFamily: 'Poppins',
+                            }}
                           >
-                            <img width="30px" alt="" src={dineInIcon} />
+                            {OldtableDataTakeAway?.length + index + 1}
                           </td>
                         )}
+                        {tableitem.OptionName == 'Item' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                              textAlign: 'left',
+                              padding: '8px',
+                            }}
+                          >
+                            {item?.ProdName}
 
-                      {tableitem.OptionName == 'Sl.No' && (
-                        <td
-                          className="Table-3_qty"
-                          style={{
-                            width: '0px',
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {OldtableDataTakeAway?.length + index + 1}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Item' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                            textAlign: 'left',
-                            padding: '8px',
-                          }}
-                        >
-                          {item?.ProdName}
-
-                          {item?.Type != 'C' && (
-                            <>
-                              <p
+                            {item?.Type != 'C' && (
+                              <>
+                                <p
+                                  className="Tbl3-Variant"
+                                  style={{ fontFamily: 'Poppins' }}
+                                >
+                                  (
+                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                    'variant'
+                                  ) && <span>{item?.ProdVariantName} </span>}
+                                  {item?.Size}
+                                  {item?.SinglePc == 'Y'
+                                    ? 'PCS'
+                                    : item?.UomName}
+                                  )
+                                </p>
+                                {item?.OfferMessage &&
+                                  !Array.isArray(item.OfferMessage) && (
+                                    <p
+                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                    >
+                                      {item.OfferMessage?.split('>')?.[0] +
+                                        `> ${item?.OrderQty} Eligible Free`}
+                                    </p>
+                                  )}
+                              </>
+                            )}
+                            {item?.Type === 'C' && (
+                              <div
                                 className="Tbl3-Variant"
                                 style={{ fontFamily: 'Poppins' }}
                               >
-                                (
-                                {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                  'variant'
-                                ) && <span>{item?.ProdVariantName} </span>}
-                                {item?.Size}
-                                {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
-                              </p>
-                              {item?.OfferMessage &&
-                                !Array.isArray(item.OfferMessage) && (
-                                  <p
-                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                  >
-                                    {item.OfferMessage?.split('>')?.[0] +
-                                      `> ${item?.OrderQty} Eligible Free`}
+                                {item.ProdDetail?.map((prod, index) => (
+                                  <p key={index}>
+                                    {prod.ProdName} - {prod.Size} {prod.UomName}
                                   </p>
-                                )}
-                            </>
-                          )}
-                          {item?.Type === 'C' && (
-                            <div
-                              className="Tbl3-Variant"
-                              style={{ fontFamily: 'Poppins' }}
-                            >
-                              {item.ProdDetail?.map((prod, index) => (
-                                <p key={index}>
-                                  {prod.ProdName} - {prod.Size} {prod.UomName}
-                                </p>
-                              ))}
-                            </div>
-                          )}
-                          {productBasedExtraCharges?.find(
-                            (find) => find.ProdId === item.ProdId
-                          ) !== undefined && (
+                                ))}
+                              </div>
+                            )}
+                            {productBasedExtraCharges?.find(
+                              (find) => find.ProdId === item.ProdId
+                            ) !== undefined && (
                               <div
                                 style={{
                                   fontSize: '10px',
@@ -2656,272 +2506,275 @@ const BSBillingTable7 = () => {
                                 }
                               </div>
                             )}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'MRP' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.MRP}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Discount' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.Type != 'C'
-                            ? item.Offer
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'MRP' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.MRP}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Discount' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.Type != 'C'
                               ? item.Offer
-                              : '-'
-                            : item?.OfferPrice && item?.OfferPrice > 0
-                              ? item?.OfferType === 'F'
-                                ? `₹${safeRound(item.OfferPrice)}`
-                                : `${item.OfferPrice}%`
-                              : '-'}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Quantity' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.OrderQty}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Rate' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.OrderRate}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Amount' && (
-                        <td onClick={(e) => {
-                          e.stopPropagation();
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }} style={{ fontFamily: 'Poppins' }}>
-                          {safeRound(item?.TotalAmt)}
-                        </td>
-                      )}
-                    </>
-                  ))}
-                </tr>
-              ))}
-            </tbody>
-          )}
-          {/* TakeWay */}
-          {tableDataTakeAway?.length > 0 && (
-            <tbody className="Table7-tbody">
-              {tableDataTakeAway?.map((item, index) => (
-                <tr
-                  style={{
-                    fontFamily: SelectedFont,
+                                ? item.Offer
+                                : '-'
+                              : item?.OfferPrice && item?.OfferPrice > 0
+                                ? item?.OfferType === 'F'
+                                  ? `₹${safeRound(item.OfferPrice)}`
+                                  : `${item.OfferPrice}%`
+                                : '-'}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Quantity' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.OrderQty}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Rate' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.OrderRate}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Amount' && (
+                          <td
+                            onClick={(e) => {
+                              e.stopPropagation();
+                              if (GetCustId) {
+                                handleCustomerProductPriceHistory(item);
+                              }
+                            }}
+                            style={{ fontFamily: 'Poppins' }}
+                          >
+                            {safeRound(item?.TotalAmt)}
+                          </td>
+                        )}
+                      </>
+                    ))}
+                  </tr>
+                ))}
+              </tbody>
+            )}
+            {/* TakeWay */}
+            {tableDataTakeAway?.length > 0 && (
+              <tbody className="Table7-tbody">
+                {tableDataTakeAway?.map((item, index) => (
+                  <tr
+                    style={{
+                      fontFamily: SelectedFont,
 
-                    backgroundColor:
-                      BillOrderPre === 'Y'
-                        ? BookingType === 'Dine In' && item?.SalesId
-                          ? 'rgb(243, 248, 213)'
-                          : BookingType === 'Dine In' &&
-                            triggerAnimation &&
-                            OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            !item?.SalesId &&
-                            tableDataTakeAway?.length >= PreviousdataLength
-                            ? 'wheat'
-                            : BookingType !== 'Dine In' &&
-                              triggerAnimation &&
-                              OldtableDataDinein?.length +
-                              OldtableDataTakeAway?.length +
-                              index ===
-                              0 &&
-                              tableDataTakeAway?.length >=
-                              PreviousdataLength &&
-                              !HoldOrderDtl &&
-                              !UnpaidData
+                      backgroundColor:
+                        BillOrderPre === 'Y'
+                          ? BookingType === 'Dine In' && item?.SalesId
+                            ? 'rgb(243, 248, 213)'
+                            : BookingType === 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataDinein?.length +
+                                  OldtableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                !item?.SalesId &&
+                                tableDataTakeAway?.length >= PreviousdataLength
                               ? 'wheat'
-                              : (OldtableDataDinein?.length +
+                              : BookingType !== 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataDinein?.length +
+                                    OldtableDataTakeAway?.length +
+                                    index ===
+                                    0 &&
+                                  tableDataTakeAway?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
+                                ? 'wheat'
+                                : (OldtableDataDinein?.length +
+                                      OldtableDataTakeAway?.length +
+                                      index) %
+                                      2 ===
+                                    0
+                                  ? 'white'
+                                  : SelectedBillColor?.[
+                                        'OverallBackgroundColor'
+                                      ]
+                                    ? SelectedBillColor?.[
+                                        'OverallBackgroundColor'
+                                      ]
+                                    : '#d6d6d6'
+                          : (OldtableDataDinein?.length +
                                 OldtableDataTakeAway?.length +
                                 index) %
                                 2 ===
-                                0
-                                ? 'white'
-                                : SelectedBillColor?.['OverallBackgroundColor']
-                                  ? SelectedBillColor?.[
-                                  'OverallBackgroundColor'
-                                  ]
-                                  : '#d6d6d6'
-                        : (OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index) %
-                          2 ===
-                          0
-                          ? 'white'
-                          : SelectedBillColor?.['OverallBackgroundColor']
-                            ? SelectedBillColor?.['OverallBackgroundColor']
-                            : '#d6d6d6',
-                    background:
-                      BookingType === 'Dine In' && item?.SalesId
-                        ? 'rgb(243, 248, 213)'
-                        : GlobEstBooking === 'ParEst' &&
-                          GlobProdwisedata?.includes(
-                            item?.InwardDtlId + ' ' + item?.BookingTypeName
-                          )
-                          ? '#b2d1f7'
-                          : (OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index) %
-                            2 ===
-                            0
+                              0
                             ? 'white'
                             : SelectedBillColor?.['OverallBackgroundColor']
                               ? SelectedBillColor?.['OverallBackgroundColor']
                               : '#d6d6d6',
-                    animation:
-                      BillOrderPre === 'Y' && !BookingTypeBoth
-                        ? triggerAnimation &&
-                          OldtableDataDinein?.length +
-                          OldtableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataTakeAway?.length >= PreviousdataLength &&
-                          !HoldOrderDtl &&
-                          !UnpaidData
-                          ? 'splashAnimation 0.5s ease-in-out'
-                          : 'none'
-                        : 'none',
-                  }}
-                  key={
-                    OldtableDataDinein?.length +
-                    OldtableDataTakeAway?.length +
-                    index
-                  }
-                  onClick={
-                    editdelete === 'Edit'
-                      ? () =>
-                        item.Type == 'P' || item.Type == 'C'
-                          ? handleEditQuantity(item)
-                          : item.ServiceType == 'G'
-                            ? handleEditQuantity(item)
-                            : ''
-                      : editdelete === 'Delete'
-                        ? () => removeFromCart(item)
-                        : () => { }
-                  }
-                  // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
+                      background:
+                        BookingType === 'Dine In' && item?.SalesId
+                          ? 'rgb(243, 248, 213)'
+                          : GlobEstBooking === 'ParEst' &&
+                              GlobProdwisedata?.includes(
+                                item?.InwardDtlId + ' ' + item?.BookingTypeName
+                              )
+                            ? '#b2d1f7'
+                            : (OldtableDataDinein?.length +
+                                  OldtableDataTakeAway?.length +
+                                  index) %
+                                  2 ===
+                                0
+                              ? 'white'
+                              : SelectedBillColor?.['OverallBackgroundColor']
+                                ? SelectedBillColor?.['OverallBackgroundColor']
+                                : '#d6d6d6',
+                      animation:
+                        BillOrderPre === 'Y' && !BookingTypeBoth
+                          ? triggerAnimation &&
+                            OldtableDataDinein?.length +
+                              OldtableDataTakeAway?.length +
+                              index ===
+                              0 &&
+                            !item?.SalesId &&
+                            tableDataTakeAway?.length >= PreviousdataLength &&
+                            !HoldOrderDtl &&
+                            !UnpaidData
+                            ? 'splashAnimation 0.5s ease-in-out'
+                            : 'none'
+                          : 'none',
+                    }}
+                    key={
+                      OldtableDataDinein?.length +
+                      OldtableDataTakeAway?.length +
+                      index
+                    }
+                    onClick={
+                      editdelete === 'Edit'
+                        ? () =>
+                            item.Type == 'P' || item.Type == 'C'
+                              ? handleEditQuantity(item)
+                              : item.ServiceType == 'G'
+                                ? handleEditQuantity(item)
+                                : ''
+                        : editdelete === 'Delete'
+                          ? () => removeFromCart(item)
+                          : () => {}
+                    }
+                    // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
 
-                  className={`${BookingType === 'Dine In' && item?.SalesId
-                    ? 'BSBill-Table7-content-disabled'
-                    : 'BSBill-Table7-content'
+                    className={`${
+                      BookingType === 'Dine In' && item?.SalesId
+                        ? 'BSBill-Table7-content-disabled'
+                        : 'BSBill-Table7-content'
                     } 
               
                  `}
-                >
-                  {tableOptions?.map((tableitem) => (
-                    <>
-                      {BookingTypeBoth &&
-                        index == 0 &&
-                        tableitem.OptionName == 'Sl.No' && (
+                  >
+                    {tableOptions?.map((tableitem) => (
+                      <>
+                        {BookingTypeBoth &&
+                          index == 0 &&
+                          tableitem.OptionName == 'Sl.No' && (
+                            <td
+                              rowspan={tableData.length}
+                              style={{ backgroundColor: '#CFB59D' }}
+                            >
+                              <img width="30px" alt="" src={TakeAwayIcon} />
+                            </td>
+                          )}
+
+                        {tableitem.OptionName == 'Sl.No' && (
                           <td
-                            rowspan={tableData.length}
-                            style={{ backgroundColor: '#CFB59D' }}
+                            className="Table-3_qty"
+                            style={{
+                              width: '0px',
+                              fontFamily: 'Poppins',
+                            }}
                           >
-                            <img width="30px" alt="" src={TakeAwayIcon} />
+                            {OldtableDataDinein?.length +
+                              OldtableDataTakeAway?.length +
+                              index +
+                              1}
                           </td>
                         )}
+                        {tableitem.OptionName == 'Item' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                              textAlign: 'left',
+                              padding: '8px',
+                            }}
+                            onClick={() =>
+                              (item.FullProductIdentifierDtls?.length > 0 ||
+                                item.ProductIdentifierDtls?.length > 0) &&
+                              handleImeiDetails(item)
+                            }
+                          >
+                            {item?.Type !== 'OS'
+                              ? item.ProdName
+                              : item.ServiceName}
 
-                      {tableitem.OptionName == 'Sl.No' && (
-                        <td
-                          className="Table-3_qty"
-                          style={{
-                            width: '0px',
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index +
-                            1}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Item' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                            textAlign: 'left',
-                            padding: '8px',
-                          }}
-                          onClick={() =>
-                            (item.FullProductIdentifierDtls?.length > 0 ||
-                              item.ProductIdentifierDtls?.length > 0) &&
-                            handleImeiDetails(item)
-                          }
-                        >
-                          {item?.Type !== 'OS'
-                            ? item.ProdName
-                            : item.ServiceName}
-
-                          {item?.Type != 'C' && (
-                            <>
-                              <p
+                            {item?.Type != 'C' && (
+                              <>
+                                <p
+                                  className="Tbl3-Variant"
+                                  style={{ fontFamily: 'Poppins' }}
+                                >
+                                  {' '}
+                                  {item?.Type !== 'OS' && (
+                                    <>
+                                      {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                        'variant'
+                                      ) && (
+                                        <span>{item?.ProdVariantName} </span>
+                                      )}
+                                      {item?.Size}
+                                      {item?.SinglePc == 'Y'
+                                        ? 'PCS'
+                                        : item?.UomName}
+                                    </>
+                                  )}
+                                </p>
+                                {item?.OfferMessage &&
+                                  !Array.isArray(item.OfferMessage) && (
+                                    <p
+                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                    >
+                                      {item.OfferMessage?.split('>')?.[0] +
+                                        `> ${item?.OrderQty} Eligible Free`}
+                                    </p>
+                                  )}
+                              </>
+                            )}
+                            {item?.Type === 'C' && (
+                              <div
                                 className="Tbl3-Variant"
                                 style={{ fontFamily: 'Poppins' }}
                               >
-                                {/* (
-                              {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                'variant'
-                              ) && <span>{item?.ProdVariantName} </span>}
-                              {item?.Size}
-                              {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName}) */}
-                                {item?.Type !== 'OS' && (
-                                  <>
-                                    {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                      'variant'
-                                    ) && <span>{item?.ProdVariantName} </span>}
-                                    {item?.Size}
-                                    {item?.SinglePc == 'Y'
-                                      ? 'PCS'
-                                      : item?.UomName}
-                                  </>
-                                )}
-                              </p>
-                              {item?.OfferMessage &&
-                                !Array.isArray(item.OfferMessage) && (
-                                  <p
-                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                  >
-                                    {item.OfferMessage?.split('>')?.[0] +
-                                      `> ${item?.OrderQty} Eligible Free`}
+                                {item.ProdDetail?.map((prod, index) => (
+                                  <p key={index}>
+                                    {prod.ProdName} - {prod.Size} {prod.UomName}
                                   </p>
-                                )}
-                            </>
-                          )}
-                          {item?.Type === 'C' && (
-                            <div
-                              className="Tbl3-Variant"
-                              style={{ fontFamily: 'Poppins' }}
-                            >
-                              {item.ProdDetail?.map((prod, index) => (
-                                <p key={index}>
-                                  {prod.ProdName} - {prod.Size} {prod.UomName}
-                                </p>
-                              ))}
-                            </div>
-                          )}
-                          {productBasedExtraCharges?.find(
-                            (find) => find.ProdId === item.ProdId
-                          ) !== undefined && (
+                                ))}
+                              </div>
+                            )}
+                            {productBasedExtraCharges?.find(
+                              (find) => find.ProdId === item.ProdId
+                            ) !== undefined && (
                               <div
                                 style={{
                                   fontSize: '10px',
@@ -2937,240 +2790,248 @@ const BSBillingTable7 = () => {
                                 }
                               </div>
                             )}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'MRP' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.MRP}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Discount' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.Type != 'C'
-                            ? item.Offer
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'MRP' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.MRP}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Discount' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.Type != 'C'
                               ? item.Offer
-                              : '-'
-                            : item?.OfferPrice && item?.OfferPrice > 0
-                              ? item?.OfferType === 'F'
-                                ? `₹${safeRound(item.OfferPrice)}`
-                                : `${item.OfferPrice}%`
-                              : '-'}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Quantity' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.OrderQty}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Rate' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {safeRound(item?.OrderRate)}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Amount' && (
-                        <td onClick={(e) => {
-                          e.stopPropagation();
-                          if (GetCustId) {
-                            handleCustomerProductPriceHistory(item);
-                          }
-                        }} style={{ fontFamily: 'Poppins' }}>
-                          {item?.TotalAmt}
-                        </td>
-                      )}
-                    </>
-                  ))}
-                </tr>
-              ))}
-            </tbody>
-          )}
-          {/* DineIn */}
-          {tableDataDinein?.length > 0 && (
-            <tbody className="Table7-tbody">
-              {tableDataDinein?.map((item, index) => (
-                <tr
-                  style={{
-                    fontFamily: SelectedFont,
+                                ? item.Offer
+                                : '-'
+                              : item?.OfferPrice && item?.OfferPrice > 0
+                                ? item?.OfferType === 'F'
+                                  ? `₹${safeRound(item.OfferPrice)}`
+                                  : `${item.OfferPrice}%`
+                                : '-'}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Quantity' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.OrderQty}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Rate' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {safeRound(item?.OrderRate)}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Amount' && (
+                          <td
+                            onClick={(e) => {
+                              e.stopPropagation();
+                              if (GetCustId) {
+                                handleCustomerProductPriceHistory(item);
+                              }
+                            }}
+                            style={{ fontFamily: 'Poppins' }}
+                          >
+                            {item?.TotalAmt}
+                          </td>
+                        )}
+                      </>
+                    ))}
+                  </tr>
+                ))}
+              </tbody>
+            )}
+            {/* DineIn */}
+            {tableDataDinein?.length > 0 && (
+              <tbody className="Table7-tbody">
+                {tableDataDinein?.map((item, index) => (
+                  <tr
+                    style={{
+                      fontFamily: SelectedFont,
 
-                    backgroundColor:
-                      BillOrderPre === 'Y' && !BookingTypeBoth
-                        ? BookingType === 'Dine In' &&
-                          item?.SalesId &&
-                          !BookingTypeBoth
+                      backgroundColor:
+                        BillOrderPre === 'Y' && !BookingTypeBoth
+                          ? BookingType === 'Dine In' &&
+                            item?.SalesId &&
+                            !BookingTypeBoth
+                            ? 'rgb(243, 248, 213)'
+                            : BookingType === 'Dine In' &&
+                                triggerAnimation &&
+                                OldtableDataTakeAway?.length +
+                                  OldtableDataDinein?.length +
+                                  tableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                !item?.SalesId &&
+                                tableDataDinein?.length >= PreviousdataLength
+                              ? 'wheat'
+                              : BookingType !== 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataTakeAway?.length +
+                                    OldtableDataDinein?.length +
+                                    tableDataTakeAway?.length +
+                                    index ===
+                                    0 &&
+                                  tableDataDinein?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
+                                ? 'wheat'
+                                : 'inherit'
+                          : 'none',
+                      background:
+                        BookingType === 'Dine In' &&
+                        item?.SalesId &&
+                        !BookingTypeBoth
                           ? 'rgb(243, 248, 213)'
-                          : BookingType === 'Dine In' &&
-                            triggerAnimation &&
+                          : GlobEstBooking === 'ParEst' &&
+                              GlobProdwisedata?.includes(
+                                item?.InwardDtlId + ' ' + item?.BookingTypeName
+                              )
+                            ? '#b2d1f7'
+                            : (OldtableDataTakeAway?.length +
+                                  OldtableDataDinein?.length +
+                                  tableDataTakeAway?.length +
+                                  index) %
+                                  2 ===
+                                0
+                              ? 'white'
+                              : SelectedBillColor?.['OverallBackgroundColor']
+                                ? SelectedBillColor?.['OverallBackgroundColor']
+                                : '#d6d6d6',
+                      animation:
+                        BillOrderPre === 'Y' && !BookingTypeBoth
+                          ? triggerAnimation &&
                             OldtableDataTakeAway?.length +
-                            OldtableDataDinein?.length +
-                            tableDataTakeAway?.length +
-                            index ===
-                            0 &&
-                            !item?.SalesId &&
-                            tableDataDinein?.length >= PreviousdataLength
-                            ? 'wheat'
-                            : BookingType !== 'Dine In' &&
-                              triggerAnimation &&
-                              OldtableDataTakeAway?.length +
                               OldtableDataDinein?.length +
                               tableDataTakeAway?.length +
                               index ===
                               0 &&
-                              tableDataDinein?.length >= PreviousdataLength &&
-                              !HoldOrderDtl &&
-                              !UnpaidData
-                              ? 'wheat'
-                              : 'inherit'
-                        : 'none',
-                    background:
-                      BookingType === 'Dine In' &&
-                        item?.SalesId &&
-                        !BookingTypeBoth
-                        ? 'rgb(243, 248, 213)'
-                        : GlobEstBooking === 'ParEst' &&
-                          GlobProdwisedata?.includes(
-                            item?.InwardDtlId + ' ' + item?.BookingTypeName
-                          )
-                          ? '#b2d1f7'
-                          : (OldtableDataTakeAway?.length +
-                            OldtableDataDinein?.length +
-                            tableDataTakeAway?.length +
-                            index) %
-                            2 ===
-                            0
-                            ? 'white'
-                            : SelectedBillColor?.['OverallBackgroundColor']
-                              ? SelectedBillColor?.['OverallBackgroundColor']
-                              : '#d6d6d6',
-                    animation:
-                      BillOrderPre === 'Y' && !BookingTypeBoth
-                        ? triggerAnimation &&
-                          OldtableDataTakeAway?.length +
-                          OldtableDataDinein?.length +
-                          tableDataTakeAway?.length +
-                          index ===
-                          0 &&
-                          !item?.SalesId &&
-                          tableDataDinein?.length >= PreviousdataLength &&
-                          !HoldOrderDtl &&
-                          !UnpaidData
-                          ? 'splashAnimation 0.5s ease-in-out'
-                          : 'none'
-                        : 'none',
-                  }}
-                  key={
-                    OldtableDataTakeAway?.length +
-                    OldtableDataDinein?.length +
-                    tableDataTakeAway?.length +
-                    index
-                  }
-                  onClick={
-                    editdelete === 'Edit'
-                      ? () => handleEditQuantity(item)
-                      : editdelete === 'Delete'
-                        ? () => removeFromCart(item)
-                        : () => { }
-                  }
-                  // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
+                            !item?.SalesId &&
+                            tableDataDinein?.length >= PreviousdataLength &&
+                            !HoldOrderDtl &&
+                            !UnpaidData
+                            ? 'splashAnimation 0.5s ease-in-out'
+                            : 'none'
+                          : 'none',
+                    }}
+                    key={
+                      OldtableDataTakeAway?.length +
+                      OldtableDataDinein?.length +
+                      tableDataTakeAway?.length +
+                      index
+                    }
+                    onClick={
+                      editdelete === 'Edit'
+                        ? () => handleEditQuantity(item)
+                        : editdelete === 'Delete'
+                          ? () => removeFromCart(item)
+                          : () => {}
+                    }
+                    // onClick={editdelete === "Edit" ? () => handleEditQuantity(item) : editdelete === "Delete" ? () => removeFromCart(item) : ""}
 
-                  className={`${BookingType === 'Dine In' && item?.SalesId
-                    ? 'BSBill-Table7-content-disabled'
-                    : 'BSBill-Table7-content'
+                    className={`${
+                      BookingType === 'Dine In' && item?.SalesId
+                        ? 'BSBill-Table7-content-disabled'
+                        : 'BSBill-Table7-content'
                     } 
               
                  `}
-                >
-                  {tableOptions?.map((tableitem) => (
-                    <>
-                      {BookingTypeBoth &&
-                        index == 0 &&
-                        tableitem.OptionName == 'Sl.No' && (
+                  >
+                    {tableOptions?.map((tableitem) => (
+                      <>
+                        {BookingTypeBoth &&
+                          index == 0 &&
+                          tableitem.OptionName == 'Sl.No' && (
+                            <td
+                              rowspan={tableData.length}
+                              style={{ backgroundColor: '#A2C3CD' }}
+                            >
+                              <img width="30px" alt="" src={dineInIcon} />
+                            </td>
+                          )}
+
+                        {tableitem.OptionName == 'Sl.No' && (
                           <td
-                            rowspan={tableData.length}
-                            style={{ backgroundColor: '#A2C3CD' }}
+                            className="Table-3_qty"
+                            style={{
+                              width: '0px',
+                              fontFamily: 'Poppins',
+                            }}
                           >
-                            <img width="30px" alt="" src={dineInIcon} />
+                            {OldtableDataTakeAway?.length +
+                              OldtableDataDinein?.length +
+                              tableDataTakeAway?.length +
+                              index +
+                              1}
                           </td>
                         )}
+                        {tableitem.OptionName == 'Item' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                              textAlign: 'left',
+                              padding: '8px',
+                            }}
+                          >
+                            {item?.ProdName}
 
-                      {tableitem.OptionName == 'Sl.No' && (
-                        <td
-                          className="Table-3_qty"
-                          style={{
-                            width: '0px',
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {OldtableDataTakeAway?.length +
-                            OldtableDataDinein?.length +
-                            tableDataTakeAway?.length +
-                            index +
-                            1}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Item' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                            textAlign: 'left',
-                            padding: '8px',
-                          }}
-                        >
-                          {item?.ProdName}
-
-                          {item?.Type != 'C' && (
-                            <>
-                              <p
+                            {item?.Type != 'C' && (
+                              <>
+                                <p
+                                  className="Tbl3-Variant"
+                                  style={{ fontFamily: 'Poppins' }}
+                                >
+                                  (
+                                  {!item?.ProdVariantName?.toLowerCase()?.includes(
+                                    'variant'
+                                  ) && <span>{item?.ProdVariantName} </span>}
+                                  {item?.Size}
+                                  {item?.SinglePc == 'Y'
+                                    ? 'PCS'
+                                    : item?.UomName}
+                                  )
+                                </p>
+                                {item?.OfferMessage &&
+                                  !Array.isArray(item.OfferMessage) && (
+                                    <p
+                                      className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
+                                    >
+                                      {item.OfferMessage?.split('>')?.[0] +
+                                        `> ${item?.OrderQty} Eligible Free`}
+                                    </p>
+                                  )}
+                              </>
+                            )}
+                            {item?.Type === 'C' && (
+                              <div
                                 className="Tbl3-Variant"
                                 style={{ fontFamily: 'Poppins' }}
                               >
-                                (
-                                {!item?.ProdVariantName?.toLowerCase()?.includes(
-                                  'variant'
-                                ) && <span>{item?.ProdVariantName} </span>}
-                                {item?.Size}
-                                {item?.SinglePc == 'Y' ? 'PCS' : item?.UomName})
-                              </p>
-                              {item?.OfferMessage &&
-                                !Array.isArray(item.OfferMessage) && (
-                                  <p
-                                    className={`offermessageTag ${!isMobile ? 'desktop' : ''}`}
-                                  >
-                                    {item.OfferMessage?.split('>')?.[0] +
-                                      `> ${item?.OrderQty} Eligible Free`}
+                                {item.ProdDetail?.map((prod, index) => (
+                                  <p key={index}>
+                                    {prod.ProdName} - {prod.Size} {prod.UomName}
                                   </p>
-                                )}
-                            </>
-                          )}
-                          {item?.Type === 'C' && (
-                            <div
-                              className="Tbl3-Variant"
-                              style={{ fontFamily: 'Poppins' }}
-                            >
-                              {item.ProdDetail?.map((prod, index) => (
-                                <p key={index}>
-                                  {prod.ProdName} - {prod.Size} {prod.UomName}
-                                </p>
-                              ))}
-                            </div>
-                          )}
-                          {productBasedExtraCharges?.find(
-                            (find) => find.ProdId === item.ProdId
-                          ) !== undefined && (
+                                ))}
+                              </div>
+                            )}
+                            {productBasedExtraCharges?.find(
+                              (find) => find.ProdId === item.ProdId
+                            ) !== undefined && (
                               <div
                                 style={{
                                   fontSize: '10px',
@@ -3186,105 +3047,107 @@ const BSBillingTable7 = () => {
                                 }
                               </div>
                             )}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'MRP' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.MRP}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Discount' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.Type != 'C'
-                            ? item.Offer
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'MRP' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.MRP}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Discount' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.Type != 'C'
                               ? item.Offer
-                              : '-'
-                            : item?.OfferPrice && item?.OfferPrice > 0
-                              ? item?.OfferType === 'F'
-                                ? `₹${safeRound(item.OfferPrice)}`
-                                : `${item.OfferPrice}%`
-                              : '-'}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Quantity' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.OrderQty}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Rate' && (
-                        <td
-                          style={{
-                            fontFamily: 'Poppins',
-                          }}
-                        >
-                          {item?.OrderRate}
-                        </td>
-                      )}
-                      {tableitem.OptionName == 'Amount' && (
-                        <td
-                          onClick={(e) => {
-                            e.stopPropagation();
-                            if (GetCustId) {
-                              handleCustomerProductPriceHistory(item);
-                            }
-                          }}
-                          style={{ fontFamily: 'Poppins' }}>
-                          {safeRound(item?.TotalAmt)}
-                        </td>
-                      )}
-                    </>
-                  ))}
-                </tr>
-              ))}
-            </tbody>
+                                ? item.Offer
+                                : '-'
+                              : item?.OfferPrice && item?.OfferPrice > 0
+                                ? item?.OfferType === 'F'
+                                  ? `₹${safeRound(item.OfferPrice)}`
+                                  : `${item.OfferPrice}%`
+                                : '-'}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Quantity' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.OrderQty}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Rate' && (
+                          <td
+                            style={{
+                              fontFamily: 'Poppins',
+                            }}
+                          >
+                            {item?.OrderRate}
+                          </td>
+                        )}
+                        {tableitem.OptionName == 'Amount' && (
+                          <td
+                            onClick={(e) => {
+                              e.stopPropagation();
+                              if (GetCustId) {
+                                handleCustomerProductPriceHistory(item);
+                              }
+                            }}
+                            style={{ fontFamily: 'Poppins' }}
+                          >
+                            {safeRound(item?.TotalAmt)}
+                          </td>
+                        )}
+                      </>
+                    ))}
+                  </tr>
+                ))}
+              </tbody>
+            )}
+          </table>
+          {OpenEditTotalAmt && (
+            <BSEditTotalAmt
+              EditTotalOpen={OpenEditTotalAmt}
+              EditTotalClose={handleEditTotalAmountCancel}
+            />
           )}
-        </table>
-        {OpenEditTotalAmt && (
-          <BSEditTotalAmt
-            EditTotalOpen={OpenEditTotalAmt}
-            EditTotalClose={handleEditTotalAmountCancel}
+        </div>
+        {EditQuantity && (
+          <BSBillingEditQuantity
+            handleEditQuantityCancel={handleEditQuantityCancel}
+            BSBillingEditQuantity={EditQuantity}
+            Productdata={Modaldata}
+            Index={Index}
+            shortKeyMethod={shortKeyMethod}
           />
         )}
-      </div>
-      {EditQuantity && (
-        <BSBillingEditQuantity
-          handleEditQuantityCancel={handleEditQuantityCancel}
-          BSBillingEditQuantity={EditQuantity}
-          Productdata={Modaldata}
-          Index={Index}
-          shortKeyMethod={shortKeyMethod}
-        />
-      )}
-      {OpenImeiDetail && (
-        <BSImeiDetails
-          DeviceDetails={OpenImeiDetail}
-          handleDeviceDetailClose={handleImeiDetailClose}
-          ProductDetail={Modaldata}
-        />
-      )}
-      {(customerPriceHistoryOpen && GetCustId) &&
-        <CustomerPriceHistory
-          open={customerPriceHistoryOpen}
-          custId={GetCustId}
-          setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
-          customerProduct={customerProduct}
-          setCustomerProduct={setCustomerProduct}
-          selectedCustomer={selectedCustomer}
-        />
-      }
-    </>
+        {OpenImeiDetail && (
+          <BSImeiDetails
+            DeviceDetails={OpenImeiDetail}
+            handleDeviceDetailClose={handleImeiDetailClose}
+            ProductDetail={Modaldata}
+          />
+        )}
+        {customerPriceHistoryOpen && GetCustId && (
+          <CustomerPriceHistory
+            open={customerPriceHistoryOpen}
+            custId={GetCustId}
+            setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
+            customerProduct={customerProduct}
+            setCustomerProduct={setCustomerProduct}
+            selectedCustomer={selectedCustomer}
+          />
+        )}
+      </>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQty.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQty.jsx
index 64af609..7da9ce1 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQty.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQty.jsx
@@ -1,7 +1,5 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
-import { DefaultModal } from '../../../../../Components/Modal/DefaultModal';
-import FormHeader from '../../../../PageComponents/FormHeader.jsx';
 import { Form } from 'antd';
 import {
   GlobalOrderCardDetails,
@@ -11,38 +9,29 @@ import {
   GlobalOrderType,
   GlobalReorderProductDetails,
   PreferenceData,
-  getConfigType,
+  GlobalAllBookingType,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
-import { ArrowRightOutlined } from '@ant-design/icons';
 import { Messages } from '../../../../../Components/Notifications/Messages';
 import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingEditQuantity/BSBillingEditQuantity.scss';
-import { settingDataSelector } from '../../../../../Features/PreferenceMaster/PreferenceMaster.js';
-import { RadioGrpButton } from '../../../../../Components/Forms/RadioGroup.jsx';
-import Buttons from '../../../../../Components/Forms/Buttons.jsx';
-import { InputField } from '../../../../../Components/Forms/InputField.jsx';
-import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import {
   getTemplateData,
   StoredSessionData,
 } from '../../../../../Features/ThemeChange/ThemeChange.js';
-import { validateSafeInput } from '../../../../../Services/Others.js';
 import { GlobalEmpAccessDetail } from '../../../../../Features/AppPage/CenterPage.js';
 import {
   ChangeFullFreeProductList,
   changeFullOfferAppliedProducts,
   ChangeOfferAppliedProducts,
-  changeOfferAppliedProductsForLoyalty,
   GlobalFreeProdList,
   GlobalOfferAppliedProducts,
   RemoveOfferAppliedProduct,
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import { validateOffers } from '../../BSItemCards/ValidateOffer.jsx';
 import { v4 as uuidv4 } from 'uuid';
-import "./ComboBillTableEdit.scss"
+import './ComboBillTableEdit.scss';
 
 const ComboEditQty = (props) => {
   const dispatch = useDispatch();
-  const formRef = useRef(null);
   const quantityInputRef = useRef(null);
   const priceChangeInputRef = useRef(null);
   const reductionInputRef = useRef(null);
@@ -54,7 +43,7 @@ const ComboEditQty = (props) => {
   // const CompId = SessionData?.CompId;
   // const BranchId = SessionData?.BranchId;
   const UserType = SessionData?.UserType;
-  const applyOffer = useApplyOfferto_CardDetail();
+  const AllBookingType = useSelector(GlobalAllBookingType);
   const preferenceDatas = useSelector(PreferenceData);
   const EmpAccessDetail = useSelector(GlobalEmpAccessDetail);
   const OverAllproductBasedOfferDatas = useSelector(
@@ -75,7 +64,7 @@ const ComboEditQty = (props) => {
   console.log(preferenceshortcutkey, 'preferenceshortcutkey');
   const [PriceChangeaccess, setPriceChangeaccess] = useState(true);
 
-  const [ConfigDataList, setConfigDataList] = useState([]);
+  const [ConfigDataList, setConfigDataList] = useState(AllBookingType);
   const [messageType, setMessageType] = useState(null);
   const [messageData, setMessageData] = useState(null);
   const [EditOpen, setEditOpen] = useState(props?.BSBillingEditQuantity);
@@ -104,7 +93,7 @@ const ComboEditQty = (props) => {
           ? 'Price'
           : 'Parcel'
   );
-  const [PercentageSelection, setPercentageSelection] = useState('Fixed');
+
   const [RadioDetails, setRadioDetails] = useState(false);
   const [editedPrice, setEditedPrice] = useState(0);
   const allowDecimal = preferenceDatas?.[0]?.SettingDtlDetails?.find(
@@ -265,11 +254,7 @@ const ComboEditQty = (props) => {
     setEditedPrice(0);
   };
 
-  // const AddQuantityonly = () => {
-  //   setMessageType('success');
-  //   setMessageData('Quantity Added');
-  // };
-
+ 
   const createUpdatedCartItem = (cartItem, quantity, newPrice) => {
     const qty = parseInt(quantity);
     const rate = parseFloat(newPrice);
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQtyAndRate.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQtyAndRate.jsx
index 83107da..4d274fc 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQtyAndRate.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/ComboBillTableEdit/ComboEditQtyAndRate.jsx
@@ -29,16 +29,18 @@ import {
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import { validateOffers } from '../../BSItemCards/ValidateOffer.jsx';
 import { v4 as uuidv4 } from 'uuid';
-import "./ComboBillTableEdit.scss"
+import './ComboBillTableEdit.scss';
 
 const ComboEditQtyAndRate = (props) => {
   const dispatch = useDispatch();
   const formRef = useRef(null);
   const quantityInputRef = useRef(null);
   const priceChangeInputRef = useRef(null);
-  const modalRef = useRef(null);
-  const { setIndex = () => {}, setEditQtyCombo = () => {}, setEditRateCombo = () => {} } = props;
-
+  const {
+    setIndex = () => {},
+    setEditQtyCombo = () => {},
+    setEditRateCombo = () => {},
+  } = props;
 
   const [disableSubmitButton, setDisableSubmitButton] = useState(false);
   const SessionData = useSelector(StoredSessionData);
@@ -70,7 +72,9 @@ const ComboEditQtyAndRate = (props) => {
   const [ConfigDataList, setConfigDataList] = useState([]);
   const [messageType, setMessageType] = useState(null);
   const [messageData, setMessageData] = useState(null);
-  const [EditOpen, setEditOpen] = useState(props?.BSBillingEditQuantity || props?.BSBillingEditRate);
+  const [EditOpen, setEditOpen] = useState(
+    props?.BSBillingEditQuantity || props?.BSBillingEditRate
+  );
   const [ItemData, setItemData] = useState(props?.Productdata);
   const [Quantity, setQuantity] = useState('');
   const ReorderProductData = useSelector(GlobalReorderProductDetails);
@@ -123,7 +127,7 @@ const ComboEditQtyAndRate = (props) => {
       setEditOpen(props.BSBillingEditQuantity || props.BSBillingEditRate);
       setItemData(props.Productdata);
       setQuantity('');
-       setEditedPrice('');
+      setEditedPrice('');
     },
     [props.BSBillingEditQuantity],
     [props.Productdata],
@@ -141,21 +145,26 @@ const ComboEditQtyAndRate = (props) => {
   }, [RadioBtnSelection, props.BSBillingEditQuantity, props.BSBillingEditRate]);
 
   useEffect(() => {
-const handleKeyDown = (event) => {
-  const navigationKeys = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'];
-  if (event.key === 'Escape' || navigationKeys.includes(event.key)) {
-    event.preventDefault();
-    if (props.BSBillingEditQuantity) {
-      props.handleEditQuantityCancel?.();
-      setEditQtyCombo(false);
-    }
-    if (props.BSBillingEditRate) {
-      props.handleEditRateComboCancel?.();
-      setEditRateCombo(false);
-    }
-    return;
-  }
-};
+    const handleKeyDown = (event) => {
+      const navigationKeys = [
+        'ArrowLeft',
+        'ArrowRight',
+        'ArrowUp',
+        'ArrowDown',
+      ];
+      if (event.key === 'Escape' || navigationKeys.includes(event.key)) {
+        event.preventDefault();
+        if (props.BSBillingEditQuantity) {
+          props.handleEditQuantityCancel?.();
+          setEditQtyCombo(false);
+        }
+        if (props.BSBillingEditRate) {
+          props.handleEditRateComboCancel?.();
+          setEditRateCombo(false);
+        }
+        return;
+      }
+    };
 
     if (EditOpen) {
       document.addEventListener('keydown', handleKeyDown);
@@ -173,8 +182,6 @@ const handleKeyDown = (event) => {
     props.BSBillingEditRate,
   ]);
 
-  
-
   useEffect(() => {
     const BillOrder = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
       (item) => item.SettingIdName === 'BillItemsOrder'
@@ -198,7 +205,11 @@ const handleKeyDown = (event) => {
     } else if (props?.BSBillingEditQuantity) {
       setRadioBtnSelection('Quantity');
     }
-  }, [props?.BSBillingEditRate, props?.BSBillingEditQuantity, props.Productdata?.OrderRate]);
+  }, [
+    props?.BSBillingEditRate,
+    props?.BSBillingEditQuantity,
+    props.Productdata?.OrderRate,
+  ]);
   const getBookingTypeId = async () => {
     let tempconfigdata = await dispatch(
       getConfigType({ TypeName: 'Booking Type' })
@@ -209,7 +220,6 @@ const handleKeyDown = (event) => {
     }
   };
 
-
   const calculateOverAllQty = (item, filterItems) => {
     if (!item) return 0;
 
@@ -256,25 +266,25 @@ const handleKeyDown = (event) => {
         setMessageData('Product not found in cart');
         return;
       }
-      
+
       const editedProduct = CartOrderDetails[editedProductIndex];
       const existingQty = editedProduct.OrderQty;
-      
+
       // Validate rate value
       if (!newPrice || newPrice <= 0) {
         setMessageType('error');
         setMessageData('Please enter a valid rate');
         return;
       }
-      
+
       // Update ONLY the rate, use existing quantity
       await handleNormalEditQuantity(
         editedProduct,
         editedProductIndex,
-        existingQty, 
+        existingQty,
         newPrice
       );
-      
+
       // Reset and close
       setClearQuantity(false);
       setIndex(null);
@@ -3216,14 +3226,13 @@ const handleKeyDown = (event) => {
               ref={quantityInputRef}
               type="number"
               value={Quantity}
-               min="0"
+              min="0"
               onChange={(e) => setQuantity(e.target.value)}
               onBlur={() => {
                 if (Quantity && Quantity.trim() !== '') {
                   AddProductQuantity();
                 }
               }}
-              min={0}
               className="EditQTYcomboInput"
               placeholder="Enter Qty"
             />
@@ -3239,7 +3248,11 @@ const handleKeyDown = (event) => {
                 autoComplete="off"
                 onChange={SellingPriceChange}
                 onBlur={() => {
-                  if (editedPrice && editedPrice !== '' && disableSubmitButton) {
+                  if (
+                    editedPrice &&
+                    editedPrice !== '' &&
+                    disableSubmitButton
+                  ) {
                     AddProductQuantity();
                   }
                 }}
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/ComboSalesBillTable/ComboSalesBillTable.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/ComboSalesBillTable/ComboSalesBillTable.jsx
index 0a453ef..0630d60 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/ComboSalesBillTable/ComboSalesBillTable.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/ComboSalesBillTable/ComboSalesBillTable.jsx
@@ -1,5 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react';
-import './ComboSalesBillTable.scss';
+import React, { lazy, useEffect, useRef, useState } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { Popconfirm, Tooltip } from 'antd';
 import WebFont from 'webfontloader';
@@ -9,16 +8,12 @@ import {
   ChangeTotalAmount,
   globalExtraTotalAmount,
 } from '../../../../../Features/ExteraCharges/ExtraCharges.js';
-import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
 import {
   changeholddata,
   gettinghold,
   puttinghold,
 } from '../../../../../Features/BookingScreen/HoldOption/HoldOption.js';
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
-import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
-import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
 import {
   getTemplateData,
   SelectedGlobalBillingColorDetail,
@@ -66,8 +61,6 @@ import {
   GlobalSalesBillEdit,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
 import {
-  ChangeOfferAppliedProducts,
-  ChangeFreeProductList,
   ChangeFullFreeProductList,
   GlobalFreeProdList,
   GlobalOfferAppliedProducts,
@@ -75,11 +68,24 @@ import {
   changeLoyaltyConsumedQuantities,
   ClearOfferAppliedProducts,
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
-import { useRemoveProducts } from '../BSBillingTable3/RemoveCartWithOffer.jsx';
 import { useUtilsComponent } from '../../../../../Services/utils.js';
-import ComboEditRate from '../ComboBillTableEdit/ComboEditRate.jsx';
-import CustomerPriceHistory from '../../UtillComponents/CustomerPriceHistory.jsx';
-import ComboEditQtyAndRate from '../ComboBillTableEdit/ComboEditQtyAndRate.jsx';
+import { useRemoveProducts } from '../BSBillingTable3/RemoveCartWithOffer.jsx';
+import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
+// jsx files
+const CustomerPriceHistory = lazy(
+  () => import('../../UtillComponents/CustomerPriceHistory.jsx')
+);
+const ComboEditQtyAndRate = lazy(
+  () => import('../ComboBillTableEdit/ComboEditQtyAndRate.jsx')
+);
+const BSEditTotalAmt = lazy(
+  () => import('../BSEditTotalAmount/BSEditTotalAmt.jsx')
+);
+const BSImeiDetails = lazy(() => import('../BSImeiDetails/BSImeiDetails.jsx'));
+const BSBillingEditQuantity = lazy(
+  () => import('../BSBillingEditQuantity/BSBillingEditQuantity.jsx')
+); // Scss Files
+import './ComboSalesBillTable.scss';
 
 const ComboSalesBillTable = () => {
   const { removeExtraCharge } = useUtilsComponent();
@@ -152,13 +158,13 @@ const ComboSalesBillTable = () => {
     OrderType === 'Hold'
       ? tableData?.filter((a, b) => a.BookingTypeName === 'TakeAway')
       : tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
-      );
+          (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
+        );
   const OldtableDataTakeAway =
     OrderType != 'Hold'
       ? tableData?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
-      )
+          (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
+        )
       : [];
 
   const [EditQuantity, setEditQuantity] = useState(false);
@@ -267,7 +273,9 @@ const ComboSalesBillTable = () => {
             ...sameItems[0],
             OrderQty: totalQty,
             TotalAmt: totalQty * item.OrderRate,
-            TaxAmt: ((totalQty * item.OrderRate * item.TaxPercentage) / (100 + item.TaxPercentage)),
+            TaxAmt:
+              (totalQty * item.OrderRate * item.TaxPercentage) /
+              (100 + item.TaxPercentage),
           };
           mergedData.push(mergedItem);
         } else {
@@ -313,13 +321,7 @@ const ComboSalesBillTable = () => {
     };
   }, [GetCustId, tableData]);
 
-  // useEffect(() => {
-  //   const BillOrder = preferenceDatas?.[0]?.SettingDtlDetails?.find(
-  //     (item) => item.SettingIdName === 'BillItemsOrder'
-  //   );
-  //   setBillOrderPre(BillOrder?.SettingValue);
-  // }, [preferenceDatas]);
-  useEffect(() => {
+   useEffect(() => {
     const getSelectedItem = () => {
       const getItem = (data = []) => {
         if (!data.length) return null;
@@ -463,6 +465,7 @@ const ComboSalesBillTable = () => {
       BranchId: BranchId,
       AppId: AppId,
     };
+
     await dispatch(getSelectedFavItems(data)).unwrap();
 
     let data1 = {
@@ -1229,9 +1232,9 @@ const ComboSalesBillTable = () => {
             )?.map((item, idx) =>
               idx === 0
                 ? {
-                  ...item,
-                  FreeQty,
-                }
+                    ...item,
+                    FreeQty,
+                  }
                 : item
             ),
           };
@@ -2136,7 +2139,6 @@ const ComboSalesBillTable = () => {
         }
       }
     }
-
   };
 
   useEffect(() => {
@@ -2468,24 +2470,25 @@ const ComboSalesBillTable = () => {
                         tableDataDinein?.length >= PreviousdataLength
                         ? 'wheat'
                         : BookingType !== 'Dine In' &&
-                          triggerAnimation &&
-                          OldtableDataTakeAway?.length + index === 0 &&
-                          tableDataDinein?.length >= PreviousdataLength &&
-                          !HoldOrderDtl &&
-                          !UnpaidData
+                            triggerAnimation &&
+                            OldtableDataTakeAway?.length + index === 0 &&
+                            tableDataDinein?.length >= PreviousdataLength &&
+                            !HoldOrderDtl &&
+                            !UnpaidData
                           ? 'wheat'
                           : 'inherit'
                       : 'none',
-                  background: row?.SalesId && OrderType !== 'Hold'
-                    ? 'rgb(243, 248, 213)'
-                    : GlobEstBooking === 'ParEst' &&
-                      GlobProdwisedata?.includes(
-                        row?.InwardDtlId + ' ' + row?.BookingTypeName
-                      )
-                      ? '#b2d1f7'
-                      : (OldtableDataTakeAway?.length + index) % 2 === 0
-                        ? 'white'
-                        : SelectedBillColor?.['OverallBackgroundColor'],
+                  background:
+                    row?.SalesId && OrderType !== 'Hold'
+                      ? 'rgb(243, 248, 213)'
+                      : GlobEstBooking === 'ParEst' &&
+                          GlobProdwisedata?.includes(
+                            row?.InwardDtlId + ' ' + row?.BookingTypeName
+                          )
+                        ? '#b2d1f7'
+                        : (OldtableDataTakeAway?.length + index) % 2 === 0
+                          ? 'white'
+                          : SelectedBillColor?.['OverallBackgroundColor'],
 
                   animation:
                     BillOrderPre === 'Y' && !BookingTypeBoth
@@ -2524,44 +2527,44 @@ const ComboSalesBillTable = () => {
                       {/* Product Name / Item */}
                       {(item.OptionName === 'Item' ||
                         item.OptionName === 'Product Name') && (
-                          <td
-                            key={`prod-${index}`}
-                            className={`productNameTd ${isActiveCell ? 'active-cell' : ''}`}
-                            onClick={() =>
-                              row.FullProductIdentifierDtls?.length > 0 ||
-                                row.ProductIdentifierDtls?.length > 0
-                                ? handleImeiDetails(row)
-                                : editField && handleEditQuantity(row)
-                            }
-                          >
-                            {row?.Type !== 'OS' ? row.ProdName : row.ServiceName}
-                            {row?.BrandName ? ` ${row.BrandName}` : ''}
-                            {row?.Type !== 'C' && (
-                              <p
-                                //  className="Tbl3-Variant"
-                                className={
-                                  isActiveCell
-                                    ? 'Tbl3VariantActve'
-                                    : 'Tbl3-Variant'
-                                }
-                              >
-                                {/* {row?.ProdVariantName} {row?.Size} {row?.UomName} */}
-                                (
-                                {!row?.ProdVariantName?.toLowerCase()?.includes(
-                                  'variant'
-                                ) && <span>{row?.ProdVariantName} </span>}
-                                {row?.Size}
-                                {row?.SinglePc == 'Y' ? 'PCS' : row?.UomName})
+                        <td
+                          key={`prod-${index}`}
+                          className={`productNameTd ${isActiveCell ? 'active-cell' : ''}`}
+                          onClick={() =>
+                            row.FullProductIdentifierDtls?.length > 0 ||
+                            row.ProductIdentifierDtls?.length > 0
+                              ? handleImeiDetails(row)
+                              : editField && handleEditQuantity(row)
+                          }
+                        >
+                          {row?.Type !== 'OS' ? row.ProdName : row.ServiceName}
+                          {row?.BrandName ? ` ${row.BrandName}` : ''}
+                          {row?.Type !== 'C' && (
+                            <p
+                              //  className="Tbl3-Variant"
+                              className={
+                                isActiveCell
+                                  ? 'Tbl3VariantActve'
+                                  : 'Tbl3-Variant'
+                              }
+                            >
+                              {/* {row?.ProdVariantName} {row?.Size} {row?.UomName} */}
+                              (
+                              {!row?.ProdVariantName?.toLowerCase()?.includes(
+                                'variant'
+                              ) && <span>{row?.ProdVariantName} </span>}
+                              {row?.Size}
+                              {row?.SinglePc == 'Y' ? 'PCS' : row?.UomName})
+                            </p>
+                          )}
+                          {row?.Type === 'C' &&
+                            row.ProdDetail?.map((prod, idx) => (
+                              <p key={idx}>
+                                {prod.ProdName} - {prod.Size} {prod.UomName}
                               </p>
-                            )}
-                            {row?.Type === 'C' &&
-                              row.ProdDetail?.map((prod, idx) => (
-                                <p key={idx}>
-                                  {prod.ProdName} - {prod.Size} {prod.UomName}
-                                </p>
-                              ))}
-                          </td>
-                        )}
+                            ))}
+                        </td>
+                      )}
 
                       {/* Barcode */}
                       {item.OptionName === 'Barcode' && (
@@ -2588,10 +2591,11 @@ const ComboSalesBillTable = () => {
                           }}
                           key={`qty-${index}`}
                           tabIndex={0}
-                          className={`${EditQtyCombo && row?.localId === Index
-                            ? 'EditQTYcomboTD'
-                            : 'qtyTd'
-                            } ${isActiveCell ? 'active-cell' : ''}`}
+                          className={`${
+                            EditQtyCombo && row?.localId === Index
+                              ? 'EditQTYcomboTD'
+                              : 'qtyTd'
+                          } ${isActiveCell ? 'active-cell' : ''}`}
                           onClick={() =>
                             editField && handleEditQuantityCombo(row)
                           }
@@ -2654,9 +2658,9 @@ const ComboSalesBillTable = () => {
                         >
                           {row?.Offer > 0
                             ? `${(
-                              (row.Offer / (row?.OrderQty * row?.OrderRate)) *
-                              100
-                            ).toFixed(2)}%`
+                                (row.Offer / (row?.OrderQty * row?.OrderRate)) *
+                                100
+                              ).toFixed(2)}%`
                             : '-'}
                         </td>
                       )}
@@ -2688,8 +2692,8 @@ const ComboSalesBillTable = () => {
                         >
                           {allowDecimal
                             ? Number(row.TotalAmt - (row?.Offer || 0)).toFixed(
-                              2
-                            )
+                                2
+                              )
                             : Number(row.TotalAmt - (row?.Offer || 0))}
                         </td>
                       )}
@@ -2732,7 +2736,7 @@ const ComboSalesBillTable = () => {
                         <td
                           key={`delete-${index}`}
                           className={`deleteTd ${isActiveCell ? 'active-cell' : ''}`}
-                        // className=""
+                          // className=""
                         >
                           <AiOutlineClose
                             onClick={() => removeFromCart(row)}
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTable.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTable.jsx
index c3ec00f..37fdb39 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTable.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTable.jsx
@@ -1,25 +1,27 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState, lazy, Suspense } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { Popconfirm, Tooltip } from 'antd';
 import WebFont from 'webfontloader';
-import { isMobile } from 'react-device-detect';
 import { AiOutlineClose, AiFillDelete } from 'react-icons/ai';
 import TakeAwayIcon from '../../../../../Images/Take away.svg';
 import dineInIcon from '../../../../../Images/Dine In.svg';
-import {
-  ChangeTotalAmount,
-  globalExtraTotalAmount,
-} from '../../../../../Features/ExteraCharges/ExtraCharges.js';
-import BSBillingEditQuantity from '../BSBillingEditQuantity/BSBillingEditQuantity';
-import {
-  changeholddata,
-  gettinghold,
-  puttinghold,
-} from '../../../../../Features/BookingScreen/HoldOption/HoldOption.js';
+
 import { getCustomerDisplayWindow } from '../../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
-import BSEditTotalAmt from '../BSEditTotalAmount/BSEditTotalAmt.jsx';
-import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import BSImeiDetails from '../BSImeiDetails/BSImeiDetails.jsx';
+const BSEditTotalAmt = lazy(
+  () => import('../BSEditTotalAmount/BSEditTotalAmt.jsx')
+);
+
+const StandardTablePayment = lazy(() => import('./StandardTablePayment.jsx'));
+
+const CustomerPriceHistory = lazy(
+  () => import('../../UtillComponents/CustomerPriceHistory.jsx')
+);
+
+const BSImeiDetails = lazy(() => import('../BSImeiDetails/BSImeiDetails.jsx'));
+
+const BSBillingEditQuantity = lazy(
+  () => import('../BSBillingEditQuantity/BSBillingEditQuantity')
+);
 import {
   getTemplateData,
   SelectedGlobalBillingColorDetail,
@@ -70,9 +72,17 @@ import {
   GlobalSelOption,
   GlobalSalesBillEdit,
 } from '../../../../../Features/BookingScreen/BookingData/BookingData';
+import {
+  ChangeTotalAmount,
+  globalExtraTotalAmount,
+} from '../../../../../Features/ExteraCharges/ExtraCharges.js';
+import {
+  changeholddata,
+  gettinghold,
+  puttinghold,
+} from '../../../../../Features/BookingScreen/HoldOption/HoldOption.js';
 import './StandardTable.scss';
-import { IoClose } from 'react-icons/io5';
-import StandardTablePayment from './StandardTablePayment.jsx';
+
 import { FaAngleDown, FaAngleUp } from 'react-icons/fa';
 import {
   ChangeFullFreeProductList,
@@ -82,10 +92,7 @@ import {
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin.js';
 import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
-import { CiShop } from 'react-icons/ci';
-import BranchName from '../../../Template/BranchName.jsx';
 import { useUtilsComponent } from '../../../../../Services/utils.js';
-import CustomerPriceHistory from '../../UtillComponents/CustomerPriceHistory.jsx';
 
 const StandardTable = () => {
   const { removeExtraCharge } = useUtilsComponent();
@@ -139,18 +146,12 @@ const StandardTable = () => {
   const OrderType = useSelector(GlobalOrderType);
   const GlobalExtraCharge = useSelector(globalExtraTotalAmount);
   const OtherServicesglobal = useSelector(GlobalOtherSevices);
-  const totalItems = useSelector(GlobalSummeryTotalItems);
   const GetCustId = useSelector(GlobalCustId);
   const selectedCustomer = useSelector(GlobalSelOption);
-  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] = useState(false);
+  const [customerPriceHistoryOpen, setCustomerPriceHistoryOpen] =
+    useState(false);
   const [customerProduct, setCustomerProduct] = useState(null);
-  const [tableCollapse, setTableCollapse] = useState(false);
   const [shortKeyMethod, setshortKeyMethod] = useState(null);
-
-  // Add state for toggle functionality
-  const [isExpanded, setIsExpanded] = useState(false);
-
-  // Add state for mobile table show/hide
   const [mobileTableVisible, setMobileTableVisible] = useState(true);
 
   const tableDataDinein = OrderCardDetail?.filter(
@@ -160,8 +161,8 @@ const StandardTable = () => {
     OrderType === 'Hold'
       ? OrderCardDetail?.filter((a, b) => a.BookingTypeName === 'TakeAway')
       : OrderCardDetail?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
-      );
+          (a, b) => a.BookingTypeName === 'TakeAway' && !a?.SalesId
+        );
   console.log('HoldOrderDtl', OrderCardDetail);
   const OldtableDataDinein = OrderCardDetail?.filter(
     (a, b) => a.BookingTypeName === 'Dine In' && a?.SalesId
@@ -169,8 +170,8 @@ const StandardTable = () => {
   const OldtableDataTakeAway =
     OrderType != 'Hold'
       ? OrderCardDetail?.filter(
-        (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
-      )
+          (a, b) => a.BookingTypeName === 'TakeAway' && a?.SalesId
+        )
       : [];
 
   const [EditQuantity, setEditQuantity] = useState(false);
@@ -274,16 +275,7 @@ const StandardTable = () => {
         }
         return;
       }
-      // 👉 CTRL shortcuts
       if (!event.ctrlKey) return;
-      // if (key === 'q') {
-      //   event.preventDefault();
-      //   handleShortcut('qty');
-      // }
-      // if (key === 'e') {
-      //   event.preventDefault();
-      //   handleShortcut('price');
-      // }
       if (key === 'q') {
         event.preventDefault();
         handleShortcut('qty');
@@ -305,36 +297,6 @@ const StandardTable = () => {
     };
   }, [preferenceshortcutkey, tableDataTakeAway, tableDataDinein, BillOrderPre]);
 
-  //     useEffect(() => {
-  //   const handleKeyDown = (event) => {
-  //     // Ctrl + Q
-  //     if (event.ctrlKey && event.key.toLowerCase() === "q") {
-  //       event.preventDefault();
-
-  //       const getItem = (data = []) => {
-  //         if (!data.length) return null;
-  //         return BillOrderPre === "Y"
-  //           ? data[0]
-  //           : data[data.length - 1];
-  //       };
-
-  //       let item = null;
-  //       if (tableDataTakeAway?.length > 0) {
-  //         item = getItem(tableDataTakeAway);
-  //       } else if (tableDataDinein?.length > 0) {
-  //         item = getItem(tableDataDinein);
-  //       }
-  //       if (item) {
-  //         handleEditQuantity(item);
-  //       }
-  //     }
-  //   };
-  //   window.addEventListener("keydown", handleKeyDown);
-
-  //   return () => {
-  //     window.removeEventListener("keydown", handleKeyDown);
-  //   };
-  // }, [tableDataTakeAway, tableDataDinein, BillOrderPre]);
   const getstockbadge = async () => {
     let data = {
       CompId: CompId,
@@ -342,9 +304,9 @@ const StandardTable = () => {
       AppId: AppId,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
     await dispatch(getSelectedFavItems(data)).unwrap();
@@ -356,9 +318,9 @@ const StandardTable = () => {
       ProdSubCat: ProdSubCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -369,9 +331,9 @@ const StandardTable = () => {
       prodCat: prodCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -576,7 +538,6 @@ const StandardTable = () => {
     CompleteRemoveAndPaidToFreeOtherTypeWithoutMerge = false,
     RemoveAndUpdateOtherBookingType = false,
     BookingTypeName,
-    TotalAmt,
     localid,
   }) => {
     let ModifiedOrderCardDetail = JSON.parse(JSON.stringify(OrderCardDetail));
@@ -687,14 +648,7 @@ const StandardTable = () => {
     }
     if (CompleteRemove) {
       const data = ModifiedOrderCardDetail?.filter(
-        (e) =>
-          !(
-            (e.localId === localid)
-            // e?.InwardDtlId === InwardDtlId &&
-            // e?.Offer === Offer &&
-            // e?.BookingTypeName === BookingTypeName &&
-            // e?.TotalAmt === TotalAmt
-          )
+        (e) => !(e.localId === localid)
       );
       return dispatch(changeOrderCardDetails(data));
     }
@@ -1188,9 +1142,9 @@ const StandardTable = () => {
             )?.map((item, idx) =>
               idx === 0
                 ? {
-                  ...item,
-                  FreeQty,
-                }
+                    ...item,
+                    FreeQty,
+                  }
                 : item
             ),
           };
@@ -1915,7 +1869,6 @@ const StandardTable = () => {
                   insideinwardDtlId: false,
                 });
               } else {
-                let data = isCheckFreeProductOutside?.FreeQty - item?.OrderQty;
                 //First i Calculate Another Booking Type Qty
                 let anotherBookingType = OrderCardDetail?.find(
                   (e) =>
@@ -1930,27 +1883,10 @@ const StandardTable = () => {
                     e?.BookingTypeName != item?.BookingTypeName
                 );
 
-                let diff =
-                  item?.OrderQty - FreeProductSameBookingType?.OrderQty;
-
-                //SameBookingFreeQty
-                //FreeProductSameBookingType?.OrderQty
-
-                //Another BookingType Paid Qty
-                //anotherBookingType
-
-                //anotherBookingType?.Free OrderQty
-                //ischeckBothBookingType
-
-                //anotherBookingType?.OrderQty-ischeckBothBookingType?.OrderQty
-                //convert another Booking Type Qty also Free to Paid
-
                 if (
                   (anotherBookingType?.OrderQty || 0) <
                   anotherBookingTypeOffer?.OrderQty
                 ) {
-                  //paidproduct                         ischeckBothBookingType?.OrderQty-anotherBookingType?.OrderQty
-                  //PaidProdcut Current BookingType    FreeProductSameBookingType?.OrderQty
                   let paidproductAnotherType =
                     ischeckBothBookingType?.OrderQty -
                     anotherBookingType?.OrderQty;
@@ -2102,146 +2038,7 @@ const StandardTable = () => {
         }
       }
     }
-
   };
-  // const removeFromCart = async (item) => {
-  //     setPreviousdataLength(OrderCardDetail?.length);
-  //     if (item?.BookingTypeName !== 'Dine In' && OrderType !== 'Hold') {
-  //         const UpdatedData = OrderCardDetail?.filter(
-  //             (cartItem) =>
-  //                 !(
-  //                     cartItem?.ProdId === item?.ProdId &&
-  //                     cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //                     cartItem?.OrderRate === item?.OrderRate &&
-  //                     cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //                     !cartItem?.SalesId
-  //                 )
-  //         );
-
-  //         if (OfferCheckedInSetup && preferenceOffer) {
-  //             await applyOffer(UpdatedData);
-  //         } else {
-  //             dispatch(changeOrderCardDetails(UpdatedData));
-  //         }
-
-  //         await dispatch(
-  //             ChangeTotalAmount(
-  //                 GlobalExtraCharge?.filter((extra) => {
-  //                     if (BookingType === 'Dine In') {
-  //                         // Remove extra charges linked to the removed product
-  //                         return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //                     } else if (BookingType === 'TakeAway') {
-  //                         // Remove extra charges only if SalesId is not present
-  //                         return extra.ProdId !== item?.ProdId;
-  //                     }
-  //                     return true; // Keep everything else
-  //                 })
-  //             )
-  //         );
-  //         // if the quantity of the item is 1, remove the item from the cart
-  //         if (OrderCardDetail?.length <= 1) {
-  //             await dispatch(changeReorderHoldDetails({}));
-  //             await dispatch(changeReorderProductDetails([]));
-  //             await dispatch(changeUnpaidData(false));
-  //             await dispatch(changeBookingType('TakeAway'));
-  //             await dispatch(changeTokenOnly(false));
-  //             await dispatch(ChangeTotalAmount([]));
-  //             await dispatch(changeAllProductTokenAvailable(false));
-  //             await dispatch(ChangeOverAllDiscSales(null));
-  //             await dispatch(ChangeOverAllDiscEstimate(null));
-  //             await dispatch(changeSelProdWiseEst([]));
-  //         }
-  //     } else if (item?.BookingTypeName !== 'Dine In' && OrderType === 'Hold') {
-  //         const UpdatedData = OrderCardDetail?.filter(
-  //             (cartItem) =>
-  //                 !(
-  //                     cartItem?.ProdId === item?.ProdId &&
-  //                     cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //                     cartItem?.OrderRate === item?.OrderRate &&
-  //                     cartItem?.BookingTypeName === item?.BookingTypeName
-  //                 )
-  //         );
-
-  //         if (OfferCheckedInSetup && preferenceOffer) {
-  //             await applyOffer(UpdatedData);
-  //         } else {
-  //             dispatch(changeOrderCardDetails(UpdatedData));
-  //         }
-
-  //         await dispatch(
-  //             ChangeTotalAmount(
-  //                 GlobalExtraCharge?.filter((extra) => {
-  //                     if (BookingType === 'Dine In') {
-  //                         // Remove extra charges linked to the removed product
-  //                         return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //                     } else if (BookingType === 'TakeAway') {
-  //                         // Remove extra charges only if SalesId is not present
-  //                         return extra.ProdId !== item?.ProdId;
-  //                     }
-  //                     return true; // Keep everything else
-  //                 })
-  //             )
-  //         );
-  //         // if the quantity of the item is 1, remove the item from the cart
-  //         if (OrderCardDetail?.length <= 1) {
-  //             await dispatch(changeReorderHoldDetails({}));
-  //             await dispatch(changeReorderProductDetails([]));
-  //             await dispatch(changeUnpaidData(false));
-  //             await dispatch(changeBookingType('TakeAway'));
-  //             await dispatch(changeTokenOnly(false));
-  //             await dispatch(changeAllProductTokenAvailable(false));
-  //             await dispatch(ChangeOverAllDiscSales(null));
-  //             await dispatch(ChangeOverAllDiscEstimate(null));
-  //             await dispatch(changeSelProdWiseEst([]));
-  //             await dispatch(ChangeTotalAmount([]));
-  //         }
-  //     } else if (item?.BookingTypeName === 'Dine In') {
-  //         const UpdatedData = OrderCardDetail?.filter(
-  //             (cartItem) =>
-  //                 !(
-  //                     cartItem?.ProdId === item?.ProdId &&
-  //                     cartItem?.InwardDtlId === item?.InwardDtlId &&
-  //                     cartItem?.OrderRate === item?.OrderRate &&
-  //                     cartItem?.BookingTypeName === item?.BookingTypeName &&
-  //                     !cartItem?.SalesId
-  //                 )
-  //         );
-
-  //         if (OfferCheckedInSetup && preferenceOffer) {
-  //             await applyOffer(UpdatedData);
-  //         } else {
-  //             dispatch(changeOrderCardDetails(UpdatedData));
-  //         }
-  //         await dispatch(
-  //             ChangeTotalAmount(
-  //                 GlobalExtraCharge?.filter((extra) => {
-  //                     if (BookingType === 'Dine In') {
-  //                         // Remove extra charges linked to the removed product
-  //                         return !(extra.ProdId === item?.ProdId && !extra.SalesId);
-  //                     } else if (BookingType === 'TakeAway') {
-  //                         // Remove extra charges only if SalesId is not present
-  //                         return extra.ProdId !== item?.ProdId;
-  //                     }
-  //                     return true; // Keep everything else
-  //                 })
-  //             )
-  //         ); // if the quantity of the item is 1, remove the item from the cart
-  //         if (OrderCardDetail?.length <= 1) {
-  //             await dispatch(changeReorderHoldDetails({}));
-  //             await dispatch(changeReorderProductDetails([]));
-  //             await dispatch(changeUnpaidData(false));
-  //             await dispatch(ChangeSelectedCustDisable(false));
-  //             await dispatch(changeSelectedOption(false));
-  //             await dispatch(changeBookingType('TakeAway'));
-  //             await dispatch(changeTokenOnly(false));
-  //             await dispatch(changeAllProductTokenAvailable(false));
-  //             await dispatch(ChangeOverAllDiscSales(null));
-  //             await dispatch(ChangeOverAllDiscEstimate(null));
-  //             await dispatch(changeSelProdWiseEst([]));
-  //             await dispatch(ChangeTotalAmount([]));
-  //         }
-  //     }
-  // };
 
   useEffect(() => {
     // setTriggerAnimation(true);
@@ -2296,16 +2093,12 @@ const StandardTable = () => {
   const handleCustomerProductPriceHistory = (item) => {
     setCustomerPriceHistoryOpen(true);
     setCustomerProduct(item?.ProdId);
-  }
+  };
 
   const handleEditQuantityCancel = () => {
     setEditQuantity(false);
   };
 
-  const handleToggle = () => {
-    setIsExpanded(!isExpanded);
-  };
-
   const handleTableCart = () => {
     if (window.innerWidth <= 768) {
       setMobileTableVisible((prev) => !prev);
@@ -2594,10 +2387,11 @@ const StandardTable = () => {
                 {OldtableDataTakeAway?.map((item, index) => (
                   <tr
                     key={index}
-                    className={`${item?.SalesId && OrderType !== 'Hold'
-                      ? 'booking-billing-table-row-disabled'
-                      : 'booking-billing-table-row'
-                      }`}
+                    className={`${
+                      item?.SalesId && OrderType !== 'Hold'
+                        ? 'booking-billing-table-row-disabled'
+                        : 'booking-billing-table-row'
+                    }`}
                     style={{
                       fontFamily:
                         "'Inter', ui-sans-serif, system-ui, sans-serif",
@@ -2607,16 +2401,16 @@ const StandardTable = () => {
                           ? item?.SalesId && OrderType !== 'Hold'
                             ? 'rgb(243, 248, 213)'
                             : triggerAnimation &&
-                              index === 0 &&
-                              !item?.SalesId &&
-                              tableDataTakeAway?.length >= PreviousdataLength
+                                index === 0 &&
+                                !item?.SalesId &&
+                                tableDataTakeAway?.length >= PreviousdataLength
                               ? 'wheat'
                               : triggerAnimation &&
-                                index === 0 &&
-                                tableDataTakeAway?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
+                                  index === 0 &&
+                                  tableDataTakeAway?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
                                 ? 'wheat'
                                 : 'inherit'
                           : 'none',
@@ -2624,9 +2418,9 @@ const StandardTable = () => {
                         item?.SalesId && OrderType !== 'Hold'
                           ? 'rgb(243, 248, 213)'
                           : GlobEstBooking === 'ParEst' &&
-                            GlobProdwisedata?.includes(
-                              item?.InwardDtlId + ' ' + item?.BookingTypeName
-                            )
+                              GlobProdwisedata?.includes(
+                                item?.InwardDtlId + ' ' + item?.BookingTypeName
+                              )
                             ? '#b2d1f7'
                             : index % 2 === 0
                               ? 'white'
@@ -2652,7 +2446,7 @@ const StandardTable = () => {
                           index == 0 &&
                           tableitem.OptionName == 'Sl.No' && (
                             <td
-                              rowspan={OrderCardDetail.length}
+                              rowSpan={OrderCardDetail.length}
                               style={{ backgroundColor: '#CFB59D' }}
                             >
                               <img width="30px" alt="" src={TakeAwayIcon} />
@@ -2689,7 +2483,7 @@ const StandardTable = () => {
                               }}
                               onClick={() =>
                                 item.FullProductIdentifierDtls?.length > 0 ||
-                                  item.ProductIdentifierDtls?.length > 0
+                                item.ProductIdentifierDtls?.length > 0
                                   ? handleImeiDetails(item)
                                   : editField && handleEditQuantity(item)
                               }
@@ -2758,21 +2552,21 @@ const StandardTable = () => {
                               {productBasedExtraCharges?.find(
                                 (find) => find.ProdId === item.ProdId
                               ) !== undefined && (
-                                  <div
-                                    style={{
-                                      fontSize: '10px',
-                                      fontWeight: '500',
-                                      whiteSpace: 'nowrap',
-                                    }}
-                                  >
-                                    Extra Charges :{' '}
-                                    {
-                                      productBasedExtraCharges?.find(
-                                        (find) => find.ProdId === item.ProdId
-                                      )?.TotalAmt
-                                    }
-                                  </div>
-                                )}
+                                <div
+                                  style={{
+                                    fontSize: '10px',
+                                    fontWeight: '500',
+                                    whiteSpace: 'nowrap',
+                                  }}
+                                >
+                                  Extra Charges :{' '}
+                                  {
+                                    productBasedExtraCharges?.find(
+                                      (find) => find.ProdId === item.ProdId
+                                    )?.TotalAmt
+                                  }
+                                </div>
+                              )}
                             </td>
                           </>
                         )}
@@ -2870,7 +2664,9 @@ const StandardTable = () => {
                               }
                             }}
                           >
-                            {safeRound(item?.TotalAmt - (item?.Offer || 0) || 0)}
+                            {safeRound(
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            )}
                           </td>
                         )}
                         {tableitem.OptionName == 'Delete' && (
@@ -2914,10 +2710,11 @@ const StandardTable = () => {
                 {OldtableDataDinein?.map((item, index) => (
                   <tr
                     key={OldtableDataTakeAway?.length + index}
-                    className={`${item?.SalesId
-                      ? 'booking-billing-table-row-disabled'
-                      : 'booking-billing-table-row'
-                      } 
+                    className={`${
+                      item?.SalesId
+                        ? 'booking-billing-table-row-disabled'
+                        : 'booking-billing-table-row'
+                    } 
             
                `}
                     style={{
@@ -2929,27 +2726,27 @@ const StandardTable = () => {
                           ? item?.SalesId
                             ? 'rgb(243, 248, 213)'
                             : BookingType === 'Dine In' &&
-                              triggerAnimation &&
-                              OldtableDataTakeAway?.length + index === 0 &&
-                              !item?.SalesId &&
-                              tableDataDinein?.length >= PreviousdataLength
-                              ? 'wheat'
-                              : BookingType !== 'Dine In' &&
                                 triggerAnimation &&
                                 OldtableDataTakeAway?.length + index === 0 &&
-                                tableDataDinein?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
+                                !item?.SalesId &&
+                                tableDataDinein?.length >= PreviousdataLength
+                              ? 'wheat'
+                              : BookingType !== 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataTakeAway?.length + index === 0 &&
+                                  tableDataDinein?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
                                 ? 'wheat'
                                 : 'inherit'
                           : 'none',
                       background: item?.SalesId
                         ? 'rgb(243, 248, 213)'
                         : GlobEstBooking === 'ParEst' &&
-                          GlobProdwisedata?.includes(
-                            item?.InwardDtlId + ' ' + item?.BookingTypeName
-                          )
+                            GlobProdwisedata?.includes(
+                              item?.InwardDtlId + ' ' + item?.BookingTypeName
+                            )
                           ? '#b2d1f7'
                           : (OldtableDataTakeAway?.length + index) % 2 === 0
                             ? 'white'
@@ -2975,7 +2772,7 @@ const StandardTable = () => {
                           index == 0 &&
                           tableitem.OptionName == 'Sl.No' && (
                             <td
-                              rowspan={OrderCardDetail.length}
+                              rowSpan={OrderCardDetail.length}
                               style={{ backgroundColor: '#A2C3CD' }}
                             >
                               <img width="30px" alt="" src={dineInIcon} />
@@ -3076,21 +2873,21 @@ const StandardTable = () => {
                               {productBasedExtraCharges?.find(
                                 (find) => find.ProdId === item.ProdId
                               ) !== undefined && (
-                                  <div
-                                    style={{
-                                      fontSize: '10px',
-                                      fontWeight: '500',
-                                      whiteSpace: 'nowrap',
-                                    }}
-                                  >
-                                    Extra Charges :{' '}
-                                    {
-                                      productBasedExtraCharges?.find(
-                                        (find) => find.ProdId === item.ProdId
-                                      )?.TotalAmt
-                                    }
-                                  </div>
-                                )}
+                                <div
+                                  style={{
+                                    fontSize: '10px',
+                                    fontWeight: '500',
+                                    whiteSpace: 'nowrap',
+                                  }}
+                                >
+                                  Extra Charges :{' '}
+                                  {
+                                    productBasedExtraCharges?.find(
+                                      (find) => find.ProdId === item.ProdId
+                                    )?.TotalAmt
+                                  }
+                                </div>
+                              )}
                             </td>
                           </>
                         )}
@@ -3187,7 +2984,9 @@ const StandardTable = () => {
                               }
                             }}
                           >
-                            {safeRound(item?.TotalAmt - (item?.Offer || 0) || 0)}
+                            {safeRound(
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            )}
                           </td>
                         )}
 
@@ -3236,10 +3035,11 @@ const StandardTable = () => {
                       OldtableDataTakeAway?.length +
                       index
                     }
-                    className={`${BookingType === 'Dine In' && item?.SalesId
-                      ? 'booking-billing-table-row-disabled'
-                      : 'booking-billing-table-row'
-                      } 
+                    className={`${
+                      BookingType === 'Dine In' && item?.SalesId
+                        ? 'booking-billing-table-row-disabled'
+                        : 'booking-billing-table-row'
+                    } 
             
                `}
                     style={{
@@ -3248,43 +3048,43 @@ const StandardTable = () => {
                           ? BookingType === 'Dine In' && item?.SalesId
                             ? 'rgb(243, 248, 213)'
                             : BookingType === 'Dine In' &&
-                              triggerAnimation &&
-                              OldtableDataDinein?.length +
-                              OldtableDataTakeAway?.length +
-                              index ===
-                              0 &&
-                              !item?.SalesId &&
-                              tableDataTakeAway?.length >= PreviousdataLength
-                              ? 'wheat'
-                              : BookingType !== 'Dine In' &&
                                 triggerAnimation &&
                                 OldtableDataDinein?.length +
-                                OldtableDataTakeAway?.length +
-                                index ===
-                                0 &&
-                                tableDataTakeAway?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
+                                  OldtableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                !item?.SalesId &&
+                                tableDataTakeAway?.length >= PreviousdataLength
+                              ? 'wheat'
+                              : BookingType !== 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataDinein?.length +
+                                    OldtableDataTakeAway?.length +
+                                    index ===
+                                    0 &&
+                                  tableDataTakeAway?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
                                 ? 'wheat'
                                 : (OldtableDataDinein?.length +
-                                  OldtableDataTakeAway?.length +
-                                  index) %
-                                  2 ===
-                                  0
+                                      OldtableDataTakeAway?.length +
+                                      index) %
+                                      2 ===
+                                    0
                                   ? 'white'
                                   : SelectedBillColor?.[
-                                    'OverallBackgroundColor'
-                                  ]
+                                        'OverallBackgroundColor'
+                                      ]
                                     ? SelectedBillColor?.[
-                                    'OverallBackgroundColor'
-                                    ]
+                                        'OverallBackgroundColor'
+                                      ]
                                     : '#d6d6d6'
                           : (OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index) %
-                            2 ===
-                            0
+                                OldtableDataTakeAway?.length +
+                                index) %
+                                2 ===
+                              0
                             ? 'white'
                             : SelectedBillColor?.['OverallBackgroundColor']
                               ? SelectedBillColor?.['OverallBackgroundColor']
@@ -3293,15 +3093,15 @@ const StandardTable = () => {
                         BookingType === 'Dine In' && item?.SalesId
                           ? 'rgb(243, 248, 213)'
                           : GlobEstBooking === 'ParEst' &&
-                            GlobProdwisedata?.includes(
-                              item?.InwardDtlId + ' ' + item?.BookingTypeName
-                            )
+                              GlobProdwisedata?.includes(
+                                item?.InwardDtlId + ' ' + item?.BookingTypeName
+                              )
                             ? '#b2d1f7'
                             : (OldtableDataDinein?.length +
-                              OldtableDataTakeAway?.length +
-                              index) %
-                              2 ===
-                              0
+                                  OldtableDataTakeAway?.length +
+                                  index) %
+                                  2 ===
+                                0
                               ? 'white'
                               : SelectedBillColor?.['OverallBackgroundColor']
                                 ? SelectedBillColor?.['OverallBackgroundColor']
@@ -3310,9 +3110,9 @@ const StandardTable = () => {
                         BillOrderPre === 'Y' && !BookingTypeBoth
                           ? triggerAnimation &&
                             OldtableDataDinein?.length +
-                            OldtableDataTakeAway?.length +
-                            index ===
-                            0 &&
+                              OldtableDataTakeAway?.length +
+                              index ===
+                              0 &&
                             !item?.SalesId &&
                             tableDataTakeAway?.length >= PreviousdataLength &&
                             !HoldOrderDtl &&
@@ -3328,7 +3128,7 @@ const StandardTable = () => {
                           index == 0 &&
                           tableitem.OptionName == 'Sl.No' && (
                             <td
-                              rowspan={OrderCardDetail.length}
+                              rowSpan={OrderCardDetail.length}
                               style={{ backgroundColor: '#CFB59D' }}
                             >
                               <img width="30px" alt="" src={TakeAwayIcon} />
@@ -3365,7 +3165,7 @@ const StandardTable = () => {
                               }}
                               onClick={() =>
                                 item.FullProductIdentifierDtls?.length > 0 ||
-                                  item.ProductIdentifierDtls?.length > 0
+                                item.ProductIdentifierDtls?.length > 0
                                   ? handleImeiDetails(item)
                                   : editField && handleEditQuantity(item)
                               }
@@ -3389,8 +3189,8 @@ const StandardTable = () => {
                                         {!item?.ProdVariantName?.toLowerCase()?.includes(
                                           'variant'
                                         ) && (
-                                            <span>{item?.ProdVariantName} </span>
-                                          )}
+                                          <span>{item?.ProdVariantName} </span>
+                                        )}
                                         {AvailableDate ? (
                                           <>
                                             {' '}
@@ -3440,21 +3240,21 @@ const StandardTable = () => {
                               {productBasedExtraCharges?.find(
                                 (find) => find.ProdId === item.ProdId
                               ) !== undefined && (
-                                  <div
-                                    style={{
-                                      fontSize: '10px',
-                                      fontWeight: '500',
-                                      whiteSpace: 'nowrap',
-                                    }}
-                                  >
-                                    Extra Charges :{' '}
-                                    {
-                                      productBasedExtraCharges?.find(
-                                        (find) => find.ProdId === item.ProdId
-                                      )?.TotalAmt
-                                    }
-                                  </div>
-                                )}
+                                <div
+                                  style={{
+                                    fontSize: '10px',
+                                    fontWeight: '500',
+                                    whiteSpace: 'nowrap',
+                                  }}
+                                >
+                                  Extra Charges :{' '}
+                                  {
+                                    productBasedExtraCharges?.find(
+                                      (find) => find.ProdId === item.ProdId
+                                    )?.TotalAmt
+                                  }
+                                </div>
+                              )}
                             </td>
                           </>
                         )}
@@ -3552,7 +3352,9 @@ const StandardTable = () => {
                               }
                             }}
                           >
-                            {safeRound(item?.TotalAmt - (item?.Offer || 0) || 0)}
+                            {safeRound(
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            )}
                           </td>
                         )}
 
@@ -3601,10 +3403,11 @@ const StandardTable = () => {
                       tableDataTakeAway?.length +
                       index
                     }
-                    className={`${BookingType === 'Dine In' && item?.SalesId
-                      ? 'booking-billing-table-row-disabled'
-                      : 'booking-billing-table-row'
-                      } 
+                    className={`${
+                      BookingType === 'Dine In' && item?.SalesId
+                        ? 'booking-billing-table-row-disabled'
+                        : 'booking-billing-table-row'
+                    } 
             
                `}
                     style={{
@@ -3615,45 +3418,45 @@ const StandardTable = () => {
                             !BookingTypeBoth
                             ? 'rgb(243, 248, 213)'
                             : BookingType === 'Dine In' &&
-                              triggerAnimation &&
-                              OldtableDataTakeAway?.length +
-                              OldtableDataDinein?.length +
-                              tableDataTakeAway?.length +
-                              index ===
-                              0 &&
-                              !item?.SalesId &&
-                              tableDataDinein?.length >= PreviousdataLength
-                              ? 'wheat'
-                              : BookingType !== 'Dine In' &&
                                 triggerAnimation &&
                                 OldtableDataTakeAway?.length +
-                                OldtableDataDinein?.length +
-                                tableDataTakeAway?.length +
-                                index ===
-                                0 &&
-                                tableDataDinein?.length >=
-                                PreviousdataLength &&
-                                !HoldOrderDtl &&
-                                !UnpaidData
+                                  OldtableDataDinein?.length +
+                                  tableDataTakeAway?.length +
+                                  index ===
+                                  0 &&
+                                !item?.SalesId &&
+                                tableDataDinein?.length >= PreviousdataLength
+                              ? 'wheat'
+                              : BookingType !== 'Dine In' &&
+                                  triggerAnimation &&
+                                  OldtableDataTakeAway?.length +
+                                    OldtableDataDinein?.length +
+                                    tableDataTakeAway?.length +
+                                    index ===
+                                    0 &&
+                                  tableDataDinein?.length >=
+                                    PreviousdataLength &&
+                                  !HoldOrderDtl &&
+                                  !UnpaidData
                                 ? 'wheat'
                                 : 'inherit'
                           : 'none',
                       background:
                         BookingType === 'Dine In' &&
-                          item?.SalesId &&
-                          !BookingTypeBoth
+                        item?.SalesId &&
+                        !BookingTypeBoth
                           ? 'rgb(243, 248, 213)'
                           : GlobEstBooking === 'ParEst' &&
-                            GlobProdwisedata?.includes(
-                              item?.InwardDtlId + ' ' + item?.BookingTypeName
-                            )
+                              GlobProdwisedata?.includes(
+                                item?.InwardDtlId + ' ' + item?.BookingTypeName
+                              )
                             ? '#b2d1f7'
                             : (OldtableDataTakeAway?.length +
-                              OldtableDataDinein?.length +
-                              tableDataTakeAway?.length +
-                              index) %
-                              2 ===
-                              0
+                                  OldtableDataDinein?.length +
+                                  tableDataTakeAway?.length +
+                                  index) %
+                                  2 ===
+                                0
                               ? 'white'
                               : SelectedBillColor?.['OverallBackgroundColor']
                                 ? SelectedBillColor?.['OverallBackgroundColor']
@@ -3662,10 +3465,10 @@ const StandardTable = () => {
                         BillOrderPre === 'Y' && !BookingTypeBoth
                           ? triggerAnimation &&
                             OldtableDataTakeAway?.length +
-                            OldtableDataDinein?.length +
-                            tableDataTakeAway?.length +
-                            index ===
-                            0 &&
+                              OldtableDataDinein?.length +
+                              tableDataTakeAway?.length +
+                              index ===
+                              0 &&
                             !item?.SalesId &&
                             tableDataDinein?.length >= PreviousdataLength &&
                             !HoldOrderDtl &&
@@ -3681,7 +3484,7 @@ const StandardTable = () => {
                           index == 0 &&
                           tableitem.OptionName == 'Sl.No' && (
                             <td
-                              rowspan={OrderCardDetail.length}
+                              rowSpan={OrderCardDetail.length}
                               style={{ backgroundColor: '#A2C3CD' }}
                             >
                               <img width="30px" alt="" src={dineInIcon} />
@@ -3787,21 +3590,21 @@ const StandardTable = () => {
                               {productBasedExtraCharges?.find(
                                 (find) => find.ProdId === item.ProdId
                               ) !== undefined && (
-                                  <div
-                                    style={{
-                                      fontSize: '10px',
-                                      fontWeight: '500',
-                                      whiteSpace: 'nowrap',
-                                    }}
-                                  >
-                                    Extra Charges :{' '}
-                                    {
-                                      productBasedExtraCharges?.find(
-                                        (find) => find.ProdId === item.ProdId
-                                      )?.TotalAmt
-                                    }
-                                  </div>
-                                )}
+                                <div
+                                  style={{
+                                    fontSize: '10px',
+                                    fontWeight: '500',
+                                    whiteSpace: 'nowrap',
+                                  }}
+                                >
+                                  Extra Charges :{' '}
+                                  {
+                                    productBasedExtraCharges?.find(
+                                      (find) => find.ProdId === item.ProdId
+                                    )?.TotalAmt
+                                  }
+                                </div>
+                              )}
                             </td>
                           </>
                         )}
@@ -3898,7 +3701,9 @@ const StandardTable = () => {
                               }
                             }}
                           >
-                            {safeRound(item?.TotalAmt - (item?.Offer || 0) || 0)}
+                            {safeRound(
+                              item?.TotalAmt - (item?.Offer || 0) || 0
+                            )}
                           </td>
                         )}
 
@@ -3929,33 +3734,37 @@ const StandardTable = () => {
               </tbody>
             )}
           </table>
-          {OpenEditTotalAmt && (
-            <BSEditTotalAmt
-              EditTotalOpen={OpenEditTotalAmt}
-              EditTotalClose={handleEditTotalAmountCancel}
-            />
-          )}
-          {OpenImeiDetail && (
-            <BSImeiDetails
-              DeviceDetails={OpenImeiDetail}
-              handleDeviceDetailClose={handleImeiDetailClose}
-              ProductDetail={Modaldata}
-            />
-          )}
-          {(customerPriceHistoryOpen && GetCustId) &&
-            <CustomerPriceHistory
-              open={customerPriceHistoryOpen}
-              custId={GetCustId}
-              setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
-              customerProduct={customerProduct}
-              setCustomerProduct={setCustomerProduct}
-              selectedCustomer={selectedCustomer}
-              OrderCardDetail={OrderCardDetail}
-            />
-          }
+          <Suspense fallback={<div>Loading...</div>}>
+            {OpenEditTotalAmt && (
+              <BSEditTotalAmt
+                EditTotalOpen={OpenEditTotalAmt}
+                EditTotalClose={handleEditTotalAmountCancel}
+              />
+            )}
+            {OpenImeiDetail && (
+              <BSImeiDetails
+                DeviceDetails={OpenImeiDetail}
+                handleDeviceDetailClose={handleImeiDetailClose}
+                ProductDetail={Modaldata}
+              />
+            )}
+            {customerPriceHistoryOpen && GetCustId && (
+              <CustomerPriceHistory
+                open={customerPriceHistoryOpen}
+                custId={GetCustId}
+                setCustomerPriceHistoryOpen={setCustomerPriceHistoryOpen}
+                customerProduct={customerProduct}
+                setCustomerProduct={setCustomerProduct}
+                selectedCustomer={selectedCustomer}
+                OrderCardDetail={OrderCardDetail}
+              />
+            )}
+          </Suspense>
         </div>
         <div className="booking-table-footer">
-          <StandardTablePayment />
+          <Suspense fallback={<div>Loading...</div>}>
+            <StandardTablePayment />
+          </Suspense>
         </div>
       </div>
     </div>
diff --git a/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTablePayment.jsx b/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTablePayment.jsx
index ce83b53..503a1a1 100644
--- a/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTablePayment.jsx
+++ b/src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTablePayment.jsx
@@ -1,5 +1,12 @@
+import React, {
+  useCallback,
+  useEffect,
+  useRef,
+  useState,
+  lazy,
+  Suspense,
+} from 'react';
 import {
-  FaAngleDown,
   FaCartPlus,
   FaMoneyBillWave,
   FaPrint,
@@ -8,8 +15,13 @@ import {
 import { IoClose } from 'react-icons/io5';
 import { FaMobileScreenButton } from 'react-icons/fa6';
 import moment from 'moment';
-import Credit from '../../UtillComponents/Pozo retail icons/credit.svg';
-import { FaCreditCard } from 'react-icons/fa6';
+import { Tables } from '../../../../../Components/Tables/Table.jsx';
+import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip.jsx';
+import UpiPopover from './Utils/UpiPopOver';
+import { isMobile } from 'react-device-detect';
+import { useDispatch } from 'react-redux';
+
+// Js Files
 import {
   changeAddBookingDetailsTrigger,
   changeBillEditingMode,
@@ -58,6 +70,7 @@ import {
   getSelectedFavItems,
   getUnpaidData,
   GlobalAddBookingDetailsTrigger,
+  GlobalAllBookingType,
   GlobalBookingType,
   GlobalBookingTypeBoth,
   GlobalCombocarddata,
@@ -89,7 +102,6 @@ import {
   GlobalSelectedTableDetails,
   GlobalSelOption,
   GlobalSelProdWiseEst,
-  GlobalSummeryTotalItems,
   GlobalSummeryTotalTaxAmount,
   GlobaltipAmount,
   Globalunpaidflow,
@@ -104,16 +116,10 @@ import {
   putSalesBillEdit,
   putSplitpaymentStatus,
   SendPaymentLink,
-} from '../../../../../Features/BookingScreen/BookingData/BookingData';
+} from '../../../../../Features/BookingScreen/BookingData/BookingData.js';
 import { shallowEqual, useSelector } from 'react-redux';
+import { Global_OverallOfferAmount } from '../../../../../Features/Offer/Offer';
 import {
-  Global_OrderOfferDetail,
-  Global_OverallOfferAmount,
-} from '../../../../../Features/Offer/Offer';
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import {
-  getPrinterMappingDetails,
-  getPrintSelectionComponentData,
   getTemplateData,
   GlobalprintDatas,
   GlobalPrinterMappingDtls,
@@ -130,13 +136,11 @@ import {
   encryptObject,
   extractLastNumberOrderId,
 } from '../../../../../Services/Others';
-import { useDispatch } from 'react-redux';
 import { getPaymentOptionsData } from '../../../../../Features/BookingScreen/BookingData/KioskBookingData';
 import { PostOtherServices } from '../../../../../Features/OtherServices/OtherServices';
 import paygate from '../../../../../Images/paygate.png';
 import defaultupi from '../../../../../Images/defaultupi.png';
 import paydevice from '../../../../../Images/paydevice.png';
-import QrinScreen from '../../BookingFunctionality/DynamicScreenQr.jsx';
 import {
   changeholddata,
   gettinghold,
@@ -147,33 +151,22 @@ import {
   changeSalesPaymentoption,
   GlobalSalesPaymentoption,
 } from '../../../../../Features/Payment/Paymentoptions/Paymentoptions';
-import UpiPopover from './Utils/UpiPopOver';
-import { isMobile } from 'react-device-detect';
-import { MobilePdfPrint } from '../../BookingFunctionality/MobilePdfPrint';
 import IndividualTokenMobilePrint from '../../BookingFunctionality/IndividualTokenMobilePrint';
 import SingleTokenMobilePrint from '../../BookingFunctionality/SingleTokenMobilePrint';
 import MobilePrint from '../../BookingFunctionality/MobilePrint';
 import { PrintStyleFunction } from '../../../../paymentpdfPage/PrintStyleFunction';
 import { printDiv } from '../../../../../Services/WSOthers';
-import { MdSms } from 'react-icons/md';
-import WhatsAppShare from '../../../../WhatsAppShare/whatsAppShare';
-import SMSShare from '../../../../WhatsAppShare/SmsShare';
 import { GlobalBookingStatus } from '../../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail';
 import { useAuth } from '../../../../../AuthContext';
 import CountUp from 'react-countup';
-import { BiRightArrowAlt } from 'react-icons/bi';
 import { GlobalpreOrderOpen } from '../../../../../Features/BookingScreen/PreOrder/PreOrder';
 import BsBillingCreditCustomer from '../../BookingFunctionality/BSBillingCreditCustomer';
-import TokensinglePrint from '../../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint';
 import PaymentPdfBooking from '../../../../paymentpdfPage/PaymentPdfBooking';
 import { DefaultModal } from '../../../../../Components/Modal/DefaultModal';
 import Buttons from '../../../../../Components/Forms/Buttons';
-import { ArrowRightOutlined } from '@ant-design/icons';
-import Paymentoption from '../../../../Payment/PaymentOptions/PaymentOptions';
-import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon';
+
 import SplitPayment from '../../BookingFunctionality/SplitPayment';
 import BSCreditCustomer from '../../UtillComponents/BSCreditCustomer';
-import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon';
 import {
   getDefaultPaymentOptions,
   GlobalAddCustomerDetails,
@@ -182,12 +175,8 @@ import {
 } from '../../../../../Features/BookingScreen/Customer/addCustomer';
 import { useNavigate } from 'react-router-dom';
 import { ApplicationPreferences } from '../../../../../Features/BrachLogin/BranchLogin';
-import PozoDineInIcon from '../../UtillComponents/Pozo retail icons/PozoDineIn';
 import { Messages } from '../../../../../Components/Notifications/Messages';
-import WpIcon from '../../../../../Images/message.png';
 import { FaAngleUp } from 'react-icons/fa';
-import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import CardPopover from './Utils/CardPopover.jsx';
 import {
   ChangeFullFreeProductList,
   changeFullOfferAppliedProducts,
@@ -197,24 +186,57 @@ import {
 } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
 import { PublicQrCodepost } from '../../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
-import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip.jsx';
-import PozoUnpaidIcon from '../../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
-import { Tables } from '../../../../../Components/Tables/Table.jsx';
-import pozologoimg from '../../../../../Images/pozologoimg.png';
-import PaymentGatewayEmbedded from '../../UtillComponents/PaymentGatewayEmbedded.jsx';
-import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
-import OtherServicePrintStyle1 from '../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx';
-import OtherServiceMobilePrint from '../../BookingFunctionality/OtherServiceMobilePrint.jsx';
 import {
   getExpireProductsList,
   getLowStockAlertProductsList,
 } from '../../../../../Features/ProductPage/ProductPage.js';
-import { PostBlockSlots } from '../../../../../Features/Kiosk/kiosk.js';
-import CustomerOrders from '../../BookingFunctionality/CustomerOrders.jsx';
-import { getEmpAccess } from '../../../../../Features/AppPage/CenterPage.js';
+
+// Jsx Files
+const CustomerOrders = lazy(
+  () => import('../../BookingFunctionality/CustomerOrders.jsx')
+);
+const PaymentGatewayEmbedded = lazy(
+  () => import('../../UtillComponents/PaymentGatewayEmbedded.jsx')
+);
+const MobileMultiPdfPrintTrigger = lazy(
+  () => import('../../UtillComponents/MobileMultiPdfPrintTrigger.jsx')
+);
+const OtherServicePrintStyle1 = lazy(
+  () =>
+    import('../../../PrintTemplates/ThermalPrinter/OtherServicePrintStyle1.jsx')
+);
+const OtherServiceMobilePrint = lazy(
+  () => import('../../BookingFunctionality/OtherServiceMobilePrint.jsx')
+);
+const QrinScreen = lazy(
+  () => import('../../BookingFunctionality/DynamicScreenQr.jsx')
+);
+const CardPopover = lazy(() => import('./Utils/CardPopover.jsx'));
+const SMSShare = lazy(() => import('../../../../WhatsAppShare/SmsShare'));
+const WhatsAppShare = lazy(
+  () => import('../../../../WhatsAppShare/whatsAppShare')
+);
+const TokensinglePrint = lazy(
+  () => import('../../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint')
+);
+import { useApplyOfferto_CardDetail } from '../../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
+
+// Icons File
+import WpIcon from '../../../../../Images/message.png';
+import pozologoimg from '../../../../../Images/pozologoimg.png';
+import PozoUnpaidIcon from '../../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
+import PozoDineInIcon from '../../UtillComponents/Pozo retail icons/PozoDineIn';
+import Credit from '../../UtillComponents/Pozo retail icons/credit.svg';
+import Paymentoption from '../../../../Payment/PaymentOptions/PaymentOptions';
+import PozoSplitPaymentIcon from '../../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon';
+import { ArrowRightOutlined } from '@ant-design/icons';
+import { BiRightArrowAlt } from 'react-icons/bi';
+import PozoAdvanceIcon from '../../UtillComponents/Pozo retail icons/PozoAdvanceIcon';
+import { MdSms } from 'react-icons/md';
+
+//
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
-const RetailApiurl = import.meta.env.ENV_API_URL;
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
 
 const StandardTablePayment = () => {
@@ -231,11 +253,10 @@ const StandardTablePayment = () => {
   const CompId = SessionData?.CompId;
   const UserId = SessionData?.UserId;
   const UserType = SessionData?.UserType;
-  const AuthToken = SessionData?.AuthToken;
-  const SessionMobileNo = SessionData?.SessionMobileNo;
   const applyOffer = useApplyOfferto_CardDetail();
   const defaultPaymentTrigger = useSelector(GlobalPaymentTrigger);
   const defaultBookingType = useSelector(GlobalDefaultBookingType);
+  const AllBookingType = useSelector(GlobalAllBookingType);
   const Holddata = useSelector(globalholddata);
   const FontFamily = useSelector(GlobalSelectedFont);
   const prodCat = useSelector(GlobalProductCategorie);
@@ -273,13 +294,14 @@ const StandardTablePayment = () => {
   const [SelectedBookingType, setSelectedBookingType] = useState(null);
   const GlobaluseOptions = useSelector(GlobalCommonPaymentOptions);
   const SelCustId = useSelector(GlobalSelCustId);
-  const OrderOfferDetail = useSelector(Global_OrderOfferDetail, shallowEqual);
   const GlobProdwisedata = useSelector(GlobalSelProdWiseEst);
   const GlobEstBooking = useSelector(GlobalEstimateBooking);
   const OtherServicesglobal = useSelector(GlobalOtherSevices);
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const OrderType = useSelector(GlobalOrderType);
   const unpaidFlow = useSelector(Globalunpaidflow);
@@ -323,7 +345,6 @@ const StandardTablePayment = () => {
       preference?.PreferredSubCatName === 'SportsApp' &&
       preference?.PreferredStatus == 'Y'
   );
-  console.log(selectedDate, 'selectedDateselectedDate');
   const PrinterDetails = useSelector(GlobalPrinterMappingDtls);
   const UpiQRPreference = preferenceDetails?.find(
     (setting) =>
@@ -336,7 +357,6 @@ const StandardTablePayment = () => {
   const [blink, setBlink] = useState(false);
   const [showWhatsAppShare, setShowWhatsAppShare] = useState(false);
   const [showSMSShare, setSMSShare] = useState(false);
-  const [formattedDate, setFormattedDate] = useState('');
   const [OrderStatus, setOrderStatus] = useState(true);
   const [OtherServicesPrintDetails, setOtherServicesPrintDetails] = useState(
     []
@@ -598,10 +618,10 @@ const StandardTablePayment = () => {
       },
     },
   ];
-  useEffect(() => {
-    let data = { compId: CompId, branchId: BranchId };
-    dispatch(getCurrentOrderid(data)).unwrap();
-  }, []);
+  // useEffect(() => {
+  //   let data = { compId: CompId, branchId: BranchId };
+  //   dispatch(getCurrentOrderid(data)).unwrap();
+  // }, []);
   const TableData = [];
   tabledata?.map((item) =>
     TableData.push({
@@ -639,19 +659,6 @@ const StandardTablePayment = () => {
     }
   }, [AddBookingDetailsTrigger]);
 
-  // useEffect(() => {
-  //   let data = {
-  //     CompId: CompId,
-  //     BranchId: BranchId,
-  //     AppId: AppId,
-  //     UserId: UserId,
-  //   };
-
-  //   dispatch(getPrinterMappingDetails(data)).unwrap();
-  //   const Data1 = { AppId, CompId, BranchId };
-  //   dispatch(getPrintSelectionComponentData(Data1)).unwrap();
-  // }, []);
-
   useEffect(() => {
     if (isMobile) {
       OtherServiceMobilePrint(
@@ -735,29 +742,6 @@ const StandardTablePayment = () => {
     unpaidFlow,
   ]);
 
-  // useEffect(() => {
-  //   const handleKeyPress = (event) => {
-  //     if (event.shiftKey && event.code === 'KeyM') {
-  //       if (
-  //         document.activeElement.tagName !== 'INPUT' &&
-  //         document.activeElement.tagName !== 'TEXTAREA'
-  //       ) {
-  //         event.preventDefault();
-  //         setBlink(true);
-  //       }
-  //     }
-  //   };
-  //   const handleClickOutside = (event) => {
-  //     setBlink(false);
-  //   };
-  //   window.addEventListener('keydown', handleKeyPress);
-  //   window.addEventListener('mousedown', handleClickOutside);
-  //   return () => {
-  //     window.removeEventListener('keydown', handleKeyPress);
-  //     window.addEventListener('mousedown', handleClickOutside);
-  //   };
-  // }, []);
-
   useEffect(() => {
     // setPaybtnnameselected(PaymentOptions?.[0]?.ModeName);
     // setPaybtnselected(PaymentOptions?.[0]?.ModeId);
@@ -900,14 +884,21 @@ const StandardTablePayment = () => {
 
       const filteredPayments =
         previousOrderPayment?.filter(
-          p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+          (p) =>
+            p?.LastOrderTran === 'Y' &&
+            p?.AfterAdjustment != null &&
+            p?.AfterAdjustment !== '' &&
+            p?.AfterAdjustment
         ) || [];
 
       const paymentsToUse =
-        filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
+        filteredPayments.length > 0
+          ? filteredPayments
+          : previousOrderPayment || [];
 
       const totalPreviouspayment = paymentsToUse?.reduce(
-        (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+        (acc, payment) =>
+          acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
         0
       );
 
@@ -916,9 +907,7 @@ const StandardTablePayment = () => {
         0
       );
 
-      const previousNetAmount =
-        (totalPreviouspayment) || 0;
-
+      const previousNetAmount = totalPreviouspayment || 0;
 
       let withdiscTotal =
         Total -
@@ -930,22 +919,35 @@ const StandardTablePayment = () => {
         withdiscTotal >= 0
           ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
           : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      )
-      console.log(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount, "totalPreviouspayment")
+      );
+      console.log(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount,
+        'totalPreviouspayment'
+      );
 
-      setTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount);
+      setTotalAmount(
+        salesBillEdit
+          ? currentOrderNetAmount > previousNetAmount
+            ? currentOrderNetAmount - previousNetAmount
+            : 0
+          : currentOrderNetAmount
+      );
       setCurrentOrderNetAmount(currentOrderNetAmount);
       setPreviousNetAmount(previousNetAmount);
-      dispatch(changeSummeryTotalAmount(salesBillEdit ? (currentOrderNetAmount > previousNetAmount) ? (currentOrderNetAmount - previousNetAmount) : 0 : currentOrderNetAmount));
-      // dispatch(
-      //     changeSummeryTotalAmount(withdiscTotal > 0 ? withdiscTotal : Number(Total))
-      // );
+      dispatch(
+        changeSummeryTotalAmount(
+          salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount
+              ? currentOrderNetAmount - previousNetAmount
+              : 0
+            : currentOrderNetAmount
+        )
+      );
       dispatch(changeSummeryComboOfferAmount(withComboSum));
-
-      // if (withdiscTotal <= 0) {
-      //     dispatch(ChangeOverAllDiscSales(0));
-      //     dispatch(ChangeOverAllDiscEstimate(0));
-      // }
     } else {
       setTotalAmount(0);
       dispatch(changeSummeryTotalAmount(0));
@@ -971,22 +973,6 @@ const StandardTablePayment = () => {
     }
   }, [orderCardDetail]);
 
-  // useEffect(() => {
-  //   if (
-  //     PrintOrderDetails?.length > 0 &&
-  //     (!filteredSettingNames ||
-  //       filteredSettingNames?.includes('Print') ||
-  //       filteredSettingNames?.length === 0) &&
-  //     ((!filteredSettingNames?.includes('whatsapp') &&
-  //       (!isMobile || !filteredSettingNames?.includes('SMS'))) ||
-  //       ((filteredSettingNames?.includes('whatsapp') ||
-  //         (isMobile && filteredSettingNames?.includes('SMS'))) &&
-  //         (!MobileNoWhatsApp || Object.keys(MobileNoWhatsApp).length === 0)))
-  //   ) {
-  //     handlePrintOrToken();
-  //   }
-  // }, [PrintOrderDetails]);
-
   useEffect(() => {
     if (!PrintOrderDetails?.length) return;
 
@@ -1065,7 +1051,6 @@ const StandardTablePayment = () => {
   }, [PaymentUpiOptions, PaymentOptions, SelCustId]);
 
   useEffect(() => {
-
     if (salesBillEdit) {
       if (SelCustId) {
         setRefundPayBtns(AllPaymentOptions);
@@ -1080,8 +1065,7 @@ const StandardTablePayment = () => {
         setRefundPayBtns(withoutCustomer);
       }
     }
-
-  }, [AllPaymentOptions, SelCustId, salesBillEdit])
+  }, [AllPaymentOptions, SelCustId, salesBillEdit]);
 
   useEffect(() => {
     if (
@@ -1179,7 +1163,11 @@ const StandardTablePayment = () => {
   const handleButtonClick = () => {
     if (qrCode && SelectedUPIPayOption === 'Default' && UpiQRPreference) {
       UpiPayment();
-    } else if (salesBillEdit && currentOrderNetAmount < previousNetAmount && !refundPaySelected) {
+    } else if (
+      salesBillEdit &&
+      currentOrderNetAmount < previousNetAmount &&
+      !refundPaySelected
+    ) {
       setMessageType('warning');
       setMessageData('Please Select Refund Payment Method');
       return;
@@ -1433,15 +1421,15 @@ const StandardTablePayment = () => {
       OrderStatus: 'O',
       OrderType:
         BookingType === 'Dine In' ||
-          BookingTypeBoth ||
-          Estimation?.SettingValue == 'N'
+        BookingTypeBoth ||
+        Estimation?.SettingValue == 'N'
           ? 'S'
           : GlobEstBooking === 'OvrAllEst'
             ? 'E'
             : GlobEstBooking === 'ParEst'
               ? GlobProdwisedata?.includes(
-                a.InwardDtlId + ' ' + a?.BookingTypeName
-              )
+                  a.InwardDtlId + ' ' + a?.BookingTypeName
+                )
                 ? 'E'
                 : 'S'
               : 'S',
@@ -1537,7 +1525,7 @@ const StandardTablePayment = () => {
           : Paybtnnameselected?.toLowerCase() === 'credit'
             ? 'S'
             : Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
+                SelectedUPIPayOption?.toLowerCase() === 'default'
               ? 'S'
               : 'P',
       OrderDtlDetails:
@@ -1554,86 +1542,114 @@ const StandardTablePayment = () => {
           ? globalTipAmount === 0
             ? SelectedTableDetails
             : SelectedTableDetails?.map((item) => ({
-              ...item,
-              TipsAmount: globalTipAmount,
-            }))
+                ...item,
+                TipsAmount: globalTipAmount,
+              }))
           : null,
 
       SalesPaymentType: 'normal',
       PaymentDetail: [
         {
-          PaymentType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? refundPaySelected :
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : SelectedUPIPayOption?.toLowerCase() === 'business'
-                    ? BusinessPayOption?.find(
-                      (busupi) => busupi?.ModeId === UpiId
-                    )?.ModeId
-                    : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          Amount: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? previousNetAmount - currentOrderNetAmount : Math.round(TotalAmount),
-          MerchantId: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'business'
-              ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                ?.MerchantId
-              : null,
-          PaymentOptionType: (salesBillEdit && currentOrderNetAmount < previousNetAmount) && (refundPaySelectedName?.toLowerCase() === 'cash' || refundPaySelectedName?.toLowerCase() === 'credit') ? 'PC' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption?.toLowerCase() === 'business'
-                        ? 'BU'
-                        : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? null :
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                ?.UPIDetailId
-              : SelectedUPIPayOption?.toLowerCase() === 'business'
+          PaymentType:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? refundPaySelected
+              : Paybtnnameselected?.toLowerCase() === 'upi'
+                ? SelectedUPIPayOption?.toLowerCase() === 'pd'
+                  ? PaymentDeviceUPI?.[0]?.ModeId
+                  : SelectedUPIPayOption?.toLowerCase() === 'pg'
+                    ? PaymentgatewayUPI?.[0]?.ModeId
+                    : SelectedUPIPayOption?.toLowerCase() === 'business'
+                      ? BusinessPayOption?.find(
+                          (busupi) => busupi?.ModeId === UpiId
+                        )?.ModeId
+                      : paybtnselected
+                : paybtnselected
+                  ? paybtnselected
+                  : null,
+          Amount:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? previousNetAmount - currentOrderNetAmount
+              : Math.round(TotalAmount),
+          MerchantId:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                  SelectedUPIPayOption?.toLowerCase() === 'business'
                 ? BusinessPayOption?.find((busupi) => busupi?.ModeId === UpiId)
-                  ?.MerchantUPIId
+                    ?.MerchantId
                 : null,
-          AccountDtl: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? [] :
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.UPIId === UpiId
-              )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                (Paybtnnameselected?.toLowerCase() === 'card' &&
-                  SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'pg') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus: (salesBillEdit && currentOrderNetAmount < previousNetAmount) ? 'S' :
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
+          PaymentOptionType:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            (refundPaySelectedName?.toLowerCase() === 'cash' ||
+              refundPaySelectedName?.toLowerCase() === 'credit')
+              ? 'PC'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'PC'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
+                  ? 'PC'
+                  : Paybtnnameselected?.toLowerCase() === 'card'
+                    ? SelectedCardOption
+                    : Paybtnnameselected?.toLowerCase() === 'upi'
+                      ? SelectedUPIPayOption?.toLowerCase() === 'default'
+                        ? 'PC'
+                        : SelectedUPIPayOption?.toLowerCase() === 'business'
+                          ? 'BU'
+                          : SelectedUPIPayOption
+                      : null,
+          ModeOfPayment:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? null
+              : SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
+                    ?.UPIDetailId
+                : SelectedUPIPayOption?.toLowerCase() === 'business'
+                  ? BusinessPayOption?.find(
+                      (busupi) => busupi?.ModeId === UpiId
+                    )?.MerchantUPIId
+                  : null,
+          AccountDtl:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? []
+              : Paybtnnameselected?.toLowerCase() === 'upi' &&
                   SelectedUPIPayOption?.toLowerCase() === 'default'
+                ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
+                    (upipay) => upipay?.UPIId === UpiId
+                  )
+                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'pd') ||
+                    (Paybtnnameselected?.toLowerCase() === 'card' &&
+                      SelectedCardOption?.toLowerCase() === 'pd')
+                  ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                  : (Paybtnnameselected?.toLowerCase() === 'upi' &&
+                        SelectedUPIPayOption?.toLowerCase() === 'pg') ||
+                      (Paybtnnameselected?.toLowerCase() === 'card' &&
+                        SelectedCardOption?.toLowerCase() === 'pg')
+                    ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
+                    : [],
+          PaymentStatus:
+            salesBillEdit && currentOrderNetAmount < previousNetAmount
+              ? 'S'
+              : Paybtnnameselected?.toLowerCase() === 'cash'
+                ? 'S'
+                : Paybtnnameselected?.toLowerCase() === 'credit'
                   ? 'S'
-                  : 'P',
-          Debit: (salesBillEdit && currentOrderNetAmount < previousNetAmount && refundPaySelectedName?.toLowerCase() === 'credit') ? Math.round(previousNetAmount - currentOrderNetAmount) : 0,
-          Credit: salesBillEdit ? (currentOrderNetAmount > previousNetAmount && Paybtnnameselected?.toLowerCase() === 'credit') ? Math.round(TotalAmount) : 0 :
-            Paybtnnameselected?.toLowerCase() === 'credit'
+                  : Paybtnnameselected?.toLowerCase() === 'upi' &&
+                      SelectedUPIPayOption?.toLowerCase() === 'default'
+                    ? 'S'
+                    : 'P',
+          Debit:
+            salesBillEdit &&
+            currentOrderNetAmount < previousNetAmount &&
+            refundPaySelectedName?.toLowerCase() === 'credit'
+              ? Math.round(previousNetAmount - currentOrderNetAmount)
+              : 0,
+          Credit: salesBillEdit
+            ? currentOrderNetAmount > previousNetAmount &&
+              Paybtnnameselected?.toLowerCase() === 'credit'
+              ? Math.round(TotalAmount)
+              : 0
+            : Paybtnnameselected?.toLowerCase() === 'credit'
               ? Math.round(TotalAmount)
               : 0,
         },
@@ -1727,14 +1743,14 @@ const StandardTablePayment = () => {
         setMessageType('success');
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         response?.data?.OrderDetails?.length > 0 &&
           setPrintOrderDetails([response?.data]);
@@ -1893,14 +1909,14 @@ const StandardTablePayment = () => {
           setMessageType('success');
           setMessageData(
             response?.data?.response +
-            ' ' +
-            (response?.data?.OrderDetails?.length > 0
-              ? response?.data?.OrderId &&
-              extractLastNumberOrderId(
-                response?.data?.OrderId,
-                response?.data?.OrderDetails?.[0]?.FYStatus
-              )
-              : '')
+              ' ' +
+              (response?.data?.OrderDetails?.length > 0
+                ? response?.data?.OrderId &&
+                  extractLastNumberOrderId(
+                    response?.data?.OrderId,
+                    response?.data?.OrderDetails?.[0]?.FYStatus
+                  )
+                : '')
           );
           response?.data?.OrderDetails?.length > 0 &&
             setPrintOrderDetails([response?.data]);
@@ -2005,14 +2021,14 @@ const StandardTablePayment = () => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -2039,8 +2055,8 @@ const StandardTablePayment = () => {
   };
 
   const handleSalesBillEdit = async (putdatas, value, pay) => {
-    console.log(putdatas, value, pay, "handleSalesBillEdit")
-  }
+    console.log(putdatas, value, pay, 'handleSalesBillEdit');
+  };
 
   const OtherServicePostBooking = async (PostData, value) => {
     console.log(PostData, value, 'PostData, value');
@@ -2086,11 +2102,12 @@ const StandardTablePayment = () => {
       AppId: AppId,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
+
     await dispatch(getSelectedFavItems(data)).unwrap();
 
     let data1 = {
@@ -2100,9 +2117,9 @@ const StandardTablePayment = () => {
       ProdSubCat: ProdSubCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -2113,9 +2130,9 @@ const StandardTablePayment = () => {
       prodCat: prodCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -2295,14 +2312,14 @@ const StandardTablePayment = () => {
             setMessageType('success');
             setMessageData(
               bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
-                )
-                : '')
+                ' ' +
+                (bookingpaymentupdate?.data?.OrderDetails?.length > 0
+                  ? bookingpaymentupdate?.data?.OrderId &&
+                    extractLastNumberOrderId(
+                      bookingpaymentupdate?.data?.OrderId,
+                      bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
+                    )
+                  : '')
             );
             bookingpaymentupdate?.data?.OrderDetails?.length > 0 &&
               setPrintOrderDetails([bookingpaymentupdate?.data]);
@@ -2320,7 +2337,7 @@ const StandardTablePayment = () => {
         if (
           Date.now() - startTime >
           useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
+            60000
         ) {
           // 60,000 ms = 1 minute
 
@@ -2435,27 +2452,11 @@ const StandardTablePayment = () => {
                 setMessageData('Payment Failed');
                 await dispatch(changePaymentloader(false));
                 setFirstPaymentclick(false);
-                // setPaybtnselected(PaymentOptions?.[0]?.ModeId);
-                // setPaybtnnameselected(PaymentOptions?.[0]?.ModeName);
                 setPaybtnnameselected(PaymentOptionsModeName);
                 setPaybtnselected(PaymentOptionsModeId);
                 clearInterval(intervalId); // Stop the loop when payment fails
                 CustomerDisplayRemovedData();
                 ClearAllGlobalStateDatas(value);
-                // const customerDisplayWindow = getCustomerDisplayWindow();
-                // if (customerDisplayWindow && !customerDisplayWindow.closed) {
-                //     const updatedData = {
-                //         userData: orderCardDetail,
-                //         ExtraCharges: GlobalExtraCharge,
-                //         upi: GlobalUpiID,
-                //         customer: selOption != null ? selOption : GetCustId,
-                //         paymentMethod: Paybtnnameselected,
-                //         Paymentgateway: false,
-                //         OrderTotalAmount: PaymentGatewayfilter?.[0]?.Amount
-
-                //     };
-                //     customerDisplayWindow.postMessage(updatedData, '*');
-                // }
               }
             }
           } catch (error) {
@@ -2666,13 +2667,6 @@ const StandardTablePayment = () => {
       orderCardDetail?.length > 0 &&
       (BookingType === 'Dine In' || BookingTypeBoth)
     ) {
-      // await dispatch(changeOrderCardDetails([]))
-      // await dispatch(changeOrderCardDetails(tabledata?.[event]?.productDetails))
-      // await dispatch(ChangeTotalAmount(tabledata?.[event]?.ExtraChargeDetails))
-      // await dispatch(changeUnpaidData(true))
-      // await dispatch(changeReorderHoldDetails([tabledata?.[event]]?.[0]));
-      // await dispatch(changeReorderProductDetails(tabledata?.[event]?.productDetails))
-      // setUnpaidOpen(false)
       setUnpaidConfirmation(true);
       setunpaidselectedindex(event);
     } else {
@@ -2789,7 +2783,7 @@ const StandardTablePayment = () => {
   const handleRefundPaymentMode = (id, name) => {
     setRefundPaySelected(id);
     setRefundPaySelectedName(name);
-  }
+  };
 
   const addUpiOption = async (id, name, UPIId) => {
     await dispatch(changeUpiIDprint(UPIId));
@@ -2842,7 +2836,9 @@ const StandardTablePayment = () => {
     setPaybtnselected(PaymentOptionsModeId);
     setQrCode(false);
     setUpinotSelected(false);
-    getHolddata();
+    if (holdCheckedSalesSetup) {
+      getHolddata();
+    }
     setCurrentOrderNetAmount(0);
     setPreviousNetAmount(0);
     if (defaultBookingType === 'Both') {
@@ -2977,7 +2973,7 @@ const StandardTablePayment = () => {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
 
     if (selectedStyle) {
@@ -2986,8 +2982,9 @@ const StandardTablePayment = () => {
           async (orderDetail, index) => {
             await printDiv(`${selectedStyle}-${index}`, style); // Use unique IDs for each print
             if (orderDetail?.BookingTypeName !== 'Dine In') {
-              const groupedTokens = orderDetail?.productDetails?.filter(data => data?.EditTokenAvailable !== 'N')?.reduce(
-                (acc, item, idx) => {
+              const groupedTokens = orderDetail?.productDetails
+                ?.filter((data) => data?.EditTokenAvailable !== 'N')
+                ?.reduce((acc, item, idx) => {
                   if (item.TokenAvailable === 'Y') {
                     if (!item.CounterName) {
                       // If CounterName is null or empty
@@ -3000,9 +2997,7 @@ const StandardTablePayment = () => {
                     }
                   }
                   return acc;
-                },
-                {}
-              );
+                }, {});
 
               // Iterate over grouped tokens and print them
               const tokensToPrint = Object.entries(groupedTokens).map(
@@ -3031,8 +3026,9 @@ const StandardTablePayment = () => {
       await Promise.all(
         PrintOrderDetails?.[0]?.OrderDetails?.map(
           async (orderDetail, index) => {
-            const groupedTokens = orderDetail?.productDetails?.filter(data => data?.EditTokenAvailable !== 'N')?.reduce(
-              (acc, item, idx) => {
+            const groupedTokens = orderDetail?.productDetails
+              ?.filter((data) => data?.EditTokenAvailable !== 'N')
+              ?.reduce((acc, item, idx) => {
                 if (item.TokenAvailable === 'Y') {
                   if (!item.CounterName) {
                     // If CounterName is null or empty
@@ -3045,9 +3041,7 @@ const StandardTablePayment = () => {
                   }
                 }
                 return acc;
-              },
-              {}
-            );
+              }, {});
 
             // Iterate over grouped tokens and print them
             const tokensToPrint = Object.entries(groupedTokens).map(
@@ -3067,11 +3061,11 @@ const StandardTablePayment = () => {
       );
     } else {
       await Promise.all(
-        PrintOrderDetails?.[0]?.OrderDetails?.filter(data => data?.EditTokenAvailable !== 'N')?.map(
-          async (orderDetail, index) => {
-            await TokenPrint(`${index}-${orderDetail?.OrderId}`);
-          }
-        )
+        PrintOrderDetails?.[0]?.OrderDetails?.filter(
+          (data) => data?.EditTokenAvailable !== 'N'
+        )?.map(async (orderDetail, index) => {
+          await TokenPrint(`${index}-${orderDetail?.OrderId}`);
+        })
       );
       setPrintOrderDetails([]);
       closePrintOption();
@@ -3395,218 +3389,223 @@ const StandardTablePayment = () => {
   }
 
   return (
-    <div className="booking-table-footer" style={{ padding: '0' }}>
-      <Messages
-        messageType={messageType}
-        messageData={messageData}
-        onComplete={onComplete}
-      />
-      {summary && (
-        <div className="paymentDetailsSection" ref={summaryRef}>
-          <div className="detailsSummarty-Title">
-            <div>Items :</div>
-            <p>{orderCardDetail?.length || 0}</p>
-          </div>
-          <div className="detailsSummarty-Title">
-            <div>Total Qty :</div>
-            <p>
-              {orderCardDetail?.reduce((acc, item) => {
-                const isWeightScale = item?.ScaleType === 'weight';
-
-                if (isWeightScale) {
-                  return (
-                    acc +
-                    (Weightasquantity
-                      ? Math.round(Number(item?.OrderQty || 0))
-                      : 1)
-                  );
-                }
-
-                return acc + Math.round(Number(item?.OrderQty || 0));
-              }, 0)}
-            </p>
-          </div>
-          <div className="detailsSummarty-Title">
-            <div>MRP Total :</div>
-            <p>
-              ₹
-              {orderCardDetail?.reduce(
-                (acc, data) => parseFloat(data?.TotalAmt || 0) + acc,
-                0
-              )}
-            </p>
-          </div>
-          {TotalTaxAmount > 0 && (
+    <Suspense fallback={<div>Suspense Loading...</div>}>
+      <div className="booking-table-footer" style={{ padding: '0' }}>
+        <Messages
+          messageType={messageType}
+          messageData={messageData}
+          onComplete={onComplete}
+        />
+        {summary && (
+          <div className="paymentDetailsSection" ref={summaryRef}>
             <div className="detailsSummarty-Title">
-              <div>Tax Amount :</div>
-              <p>{safeRound(TotalTaxAmount)}</p>
+              <div>Items :</div>
+              <p>{orderCardDetail?.length || 0}</p>
             </div>
-          )}
-          {parseInt(extra) > 0 && (
             <div className="detailsSummarty-Title">
-              <div>Extra Charges :</div>
-              <p>{safeRound(extra)}</p>
+              <div>Total Qty :</div>
+              <p>
+                {orderCardDetail?.reduce((acc, item) => {
+                  const isWeightScale = item?.ScaleType === 'weight';
+
+                  if (isWeightScale) {
+                    return (
+                      acc +
+                      (Weightasquantity
+                        ? Math.round(Number(item?.OrderQty || 0))
+                        : 1)
+                    );
+                  }
+
+                  return acc + Math.round(Number(item?.OrderQty || 0));
+                }, 0)}
+              </p>
+            </div>
+            <div className="detailsSummarty-Title">
+              <div>MRP Total :</div>
+              <p>
+                ₹
+                {orderCardDetail?.reduce(
+                  (acc, data) => parseFloat(data?.TotalAmt || 0) + acc,
+                  0
+                )}
+              </p>
+            </div>
+            {TotalTaxAmount > 0 && (
+              <div className="detailsSummarty-Title">
+                <div>Tax Amount :</div>
+                <p>{safeRound(TotalTaxAmount)}</p>
+              </div>
+            )}
+            {parseInt(extra) > 0 && (
+              <div className="detailsSummarty-Title">
+                <div>Extra Charges :</div>
+                <p>{safeRound(extra)}</p>
+              </div>
+            )}
+            <div className="detailsSummarty-Title1">
+              <div>Discount :</div>
+              <p>
+                -₹
+                {(OverAllSales > 0 ? OverAllSales : 0) +
+                  (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                  (Discount > 0 ? Discount : 0)}
+              </p>
+            </div>
+            <div className="detailsTitle">
+              <div>Total :</div>
+              <p>
+                ₹
+                {safeRound(
+                  credit && overAllBal >= 0
+                    ? Math.max(0, TotalAmount - overAllBal)
+                    : TotalAmount
+                )}
+              </p>
             </div>
-          )}
-          <div className="detailsSummarty-Title1">
-            <div>Discount :</div>
-            <p>
-              -₹
-              {(OverAllSales > 0 ? OverAllSales : 0) +
-                (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                (Discount > 0 ? Discount : 0)}
-            </p>
           </div>
-          <div className="detailsTitle">
-            <div>Total :</div>
-            <p>
-              ₹
-              {safeRound(credit && overAllBal >= 0
-                ? Math.max(0, TotalAmount - overAllBal)
-                : TotalAmount)}
-            </p>
-          </div>
-        </div>
-      )}
-      <div className="payment-buttons-container">
-        <div style={{ display: 'flex', alignItems: 'center', gap: '1rem' }}>
-          <Tooltip title="Advance Amount" isMobile={isMobile}>
-            <div>
-              {' '}
-              <PozoAdvanceIcon
-                className="BSBillingNav-icon-table-icon"
-                onClick={CreditCustomer1}
-                style={{
-                  cursor: orderCardDetail?.length > 0 && 'not-allowed',
-                  color:
-                    orderCardDetail?.length > 0 ||
+        )}
+        <div className="payment-buttons-container">
+          <div style={{ display: 'flex', alignItems: 'center', gap: '1rem' }}>
+            <Tooltip title="Advance Amount" isMobile={isMobile}>
+              <div>
+                {' '}
+                <PozoAdvanceIcon
+                  className="BSBillingNav-icon-table-icon"
+                  onClick={CreditCustomer1}
+                  style={{
+                    cursor: orderCardDetail?.length > 0 && 'not-allowed',
+                    color:
+                      orderCardDetail?.length > 0 ||
                       (selOption?.value === undefined &&
                         GlobalAddCustomerDetails1?.length === 0 &&
                         GetCustId?.CustMobile === undefined)
-                      ? 'gray'
-                      : 'rgb(18, 146, 238)',
-                  fontSize: '28px',
-                }}
-              />{' '}
-            </div>
-          </Tooltip>
-
-          {!OtherServicesglobal && (
-            <Tooltip title="Split Payment" isMobile={isMobile}>
-              {' '}
-              <div
-                className="BSBillingNav-icon-table-icon"
-                onClick={
-                  CheckBookingStatus != 'Close' && !addnewAccess
-                    ? SplitPaymentOpen
-                    : ''
-                }
-                style={{
-                  width: '1.5rem',
-                  cursor:
-                    orderCardDetail?.length === 0 ||
-                      CheckBookingStatus == 'Close' ||
-                      addnewAccess
-                      ? 'not-allowed'
-                      : 'pointer',
-                  color:
-                    orderCardDetail?.length === 0 ||
-                      CheckBookingStatus == 'Close' ||
-                      addnewAccess
-                      ? 'gray'
-                      : 'rgb(18, 146, 238)',
-                  display: 'flex',
-                  alignItems: 'center',
-                  height: '2.46rem',
-                }}
-              >
-                <PozoSplitPaymentIcon />
+                        ? 'gray'
+                        : 'rgb(18, 146, 238)',
+                    fontSize: '28px',
+                  }}
+                />{' '}
               </div>
             </Tooltip>
-          )}
 
-          {/* Customer Orders */}
-          {GetCustId && (
-
-            <Tooltip title="Customer Orders" isMobile={isMobile}>
-              {' '}
-              <div
-                className="BSBillingNav-icon-table-icon"
-                onClick={() => {
-                  if (
-                    CheckBookingStatus !== 'Close' &&
-                    !addnewAccess &&
-                    !(orderCardDetail?.length > 0)
-                  ) {
-                    setCustomerPreviesOrders(true);
+            {!OtherServicesglobal && (
+              <Tooltip title="Split Payment" isMobile={isMobile}>
+                {' '}
+                <div
+                  className="BSBillingNav-icon-table-icon"
+                  onClick={
+                    CheckBookingStatus != 'Close' && !addnewAccess
+                      ? SplitPaymentOpen
+                      : ''
                   }
-                }}
-                style={{
-                  cursor: orderCardDetail?.length > 0 && 'not-allowed',
-                  color:
-                    orderCardDetail?.length > 0 ||
+                  style={{
+                    width: '1.5rem',
+                    cursor:
+                      orderCardDetail?.length === 0 ||
+                      CheckBookingStatus == 'Close' ||
+                      addnewAccess
+                        ? 'not-allowed'
+                        : 'pointer',
+                    color:
+                      orderCardDetail?.length === 0 ||
+                      CheckBookingStatus == 'Close' ||
+                      addnewAccess
+                        ? 'gray'
+                        : 'rgb(18, 146, 238)',
+                    display: 'flex',
+                    alignItems: 'center',
+                    height: '2.46rem',
+                  }}
+                >
+                  <PozoSplitPaymentIcon />
+                </div>
+              </Tooltip>
+            )}
+
+            {/* Customer Orders */}
+            {GetCustId && (
+              <Tooltip title="Customer Orders" isMobile={isMobile}>
+                {' '}
+                <div
+                  className="BSBillingNav-icon-table-icon"
+                  onClick={() => {
+                    if (
+                      CheckBookingStatus !== 'Close' &&
+                      !addnewAccess &&
+                      !(orderCardDetail?.length > 0)
+                    ) {
+                      setCustomerPreviesOrders(true);
+                    }
+                  }}
+                  style={{
+                    cursor: orderCardDetail?.length > 0 && 'not-allowed',
+                    color:
+                      orderCardDetail?.length > 0 ||
                       (orderCardDetail?.length > 0 &&
                         GetCustId?.CustMobile === undefined)
-                      ? 'gray'
-                      : 'rgb(18, 146, 238)',
-                  fontSize: '25px',
+                        ? 'gray'
+                        : 'rgb(18, 146, 238)',
+                    fontSize: '25px',
+                    display: 'flex',
+                    alignItems: 'center',
+                    height: '2.46rem',
+                    width: '1.5rem',
+                  }}
+                >
+                  <FaCartPlus />
+                </div>
+              </Tooltip>
+            )}
+
+            {tabledata?.length > 0 && dinePreference && (
+              <div style={{ width: '2rem' }}>
+                {tableOptions
+                  ?.filter((item) => item.OptionName === 'UnpaidBill')
+                  .map((filteredItem) => (
+                    <React.Fragment key={filteredItem.TemplateOptionsId}>
+                      {!OtherServicesglobal && (
+                        <TooltipWrapper
+                          title="Unpaid Bills"
+                          isMobile={isMobile}
+                        >
+                          {' '}
+                          <PozoUnpaidIcon
+                            className="BSBillingNav-icon-table-icon"
+                            style={{
+                              fontSize: '27px',
+                              cursor: 'pointer',
+                              color: unpaidFlow ? '#52c41a' : '#1292EE',
+                            }}
+                            onClick={() => {
+                              (setUnpaidOpen(true), getUnpaiddatas());
+                            }}
+                          />
+                        </TooltipWrapper>
+                      )}
+                    </React.Fragment>
+                  ))}
+              </div>
+            )}
+            {/* share  */}
+            {PrintOrderDetails?.length > 0 && (
+              <div
+                style={{
                   display: 'flex',
-                  alignItems: 'center',
-                  height: '2.46rem',
-                  width: '1.5rem',
+                  gap: '1rem',
+                  justifyContent: 'center',
                 }}
               >
-                <FaCartPlus />
-              </div>
-            </Tooltip>
-          )}
-
-          {tabledata?.length > 0 && dinePreference && (
-            <div style={{ width: '2rem' }}>
-              {tableOptions
-                ?.filter((item) => item.OptionName === 'UnpaidBill')
-                .map((filteredItem) => (
-                  <React.Fragment key={filteredItem.TemplateOptionsId}>
-                    {!OtherServicesglobal && (
-                      <TooltipWrapper title="Unpaid Bills" isMobile={isMobile}>
-                        {' '}
-                        <PozoUnpaidIcon
-                          className="BSBillingNav-icon-table-icon"
-                          style={{
-                            fontSize: '27px',
-                            cursor: 'pointer',
-                            color: unpaidFlow ? '#52c41a' : '#1292EE',
-                          }}
-                          onClick={() => {
-                            (setUnpaidOpen(true), getUnpaiddatas());
-                          }}
-                        />
-                      </TooltipWrapper>
-                    )}
-                  </React.Fragment>
-                ))}
-            </div>
-          )}
-          {/* share  */}
-          {PrintOrderDetails?.length > 0 && (
-            <div
-              style={{
-                display: 'flex',
-                gap: '1rem',
-                justifyContent: 'center',
-              }}
-            >
-              {filteredSettingNames?.includes('whatsapp') &&
-                MobileNoWhatsApp?.value && (
-                  <FaWhatsapp
-                    size={32}
-                    color="#25D366"
-                    style={{ cursor: 'pointer' }}
-                    onClick={handleWhatsAppClick}
-                    title="Share on WhatsApp"
-                  />
-                )}
-              {/* <FaPrint
+                {filteredSettingNames?.includes('whatsapp') &&
+                  MobileNoWhatsApp?.value && (
+                    <FaWhatsapp
+                      size={32}
+                      color="#25D366"
+                      style={{ cursor: 'pointer' }}
+                      onClick={handleWhatsAppClick}
+                      title="Share on WhatsApp"
+                    />
+                  )}
+                {/* <FaPrint
                 size={32}
                 color="#1292EE"
                 style={{ cursor: 'pointer' }}
@@ -3614,9 +3613,9 @@ const StandardTablePayment = () => {
                 title="Print"
               /> */}
 
-              {(filteredSettingNames?.includes('Print') ||
-                !MobileNoWhatsApp ||
-                !MobileNoWhatsApp.value) && (
+                {(filteredSettingNames?.includes('Print') ||
+                  !MobileNoWhatsApp ||
+                  !MobileNoWhatsApp.value) && (
                   <FaPrint
                     size={32}
                     color="#1292EE"
@@ -3626,580 +3625,603 @@ const StandardTablePayment = () => {
                   />
                 )}
 
-              {filteredSettingNames?.includes('SMS') && isMobile && (
-                <MdSms
-                  size={32}
-                  color="#FF8800"
-                  style={{ cursor: 'pointer' }}
-                  onClick={handleSMSClick}
-                  title="Send SMS"
-                />
-              )}
-              {/* WhatsAppShare modal/component */}
-              {showWhatsAppShare && (
-                <WhatsAppShare
-                  message={encodedMessage}
-                  mobileNumber={MobileNoWhatsApp?.value}
-                  onClose={() => closePrintOption(false)}
-                />
-              )}
-              {showSMSShare && isMobile && (
-                <SMSShare
-                  message={encodedMessage}
-                  mobileNumber={MobileNoWhatsApp?.value}
-                  onClose={() => closePrintOption(false)}
-                />
-              )}
-            </div>
-          )}
-
-          {dinePreference &&
-            (BookingType === 'Dine In' ||
-              BookingTypeBoth ||
-              CheckOrderType?.length > 0) &&
-            !unpaidFlow &&
-            SelectedTableDetails?.length !== 0 && (
-              <div
-                style={{ width: '4rem', display: 'flex', alignItems: 'center' }}
-              >
-                <Tooltip title="ORDER" isMobile={isMobile}>
-                  {' '}
-                  <PozoDineInIcon
-                    className={
-                      FirstPaymentclick === false && !addnewAccess
-                        ? OrderStatus
-                          ? 'Dinein-order-btn pulse-element ChairClrRed'
-                          : 'Dinein-order-btn pulse-element ChairClrGreen'
-                        : 'Dinein-order-btn-disabled pulse-element'
-                    }
-                    onClick={() =>
-                      FirstPaymentclick === false && !addnewAccess
-                        ? changeOrderStatus()
-                        : ''
-                    }
+                {filteredSettingNames?.includes('SMS') && isMobile && (
+                  <MdSms
+                    size={32}
+                    color="#FF8800"
+                    style={{ cursor: 'pointer' }}
+                    onClick={handleSMSClick}
+                    title="Send SMS"
                   />
-                </Tooltip>
+                )}
+                {/* WhatsAppShare modal/component */}
+                {showWhatsAppShare && (
+                  <WhatsAppShare
+                    message={encodedMessage}
+                    mobileNumber={MobileNoWhatsApp?.value}
+                    onClose={() => closePrintOption(false)}
+                  />
+                )}
+                {showSMSShare && isMobile && (
+                  <SMSShare
+                    message={encodedMessage}
+                    mobileNumber={MobileNoWhatsApp?.value}
+                    onClose={() => closePrintOption(false)}
+                  />
+                )}
               </div>
             )}
-        </div>
-        <button className="summaryopenClose" onClick={handleSummary}>
-          {summary ? (
-            <>
-              Summary Close <IoClose color="#e33333" />
-            </>
-          ) : (
-            <>
-              Summary <FaAngleUp />
-            </>
-          )}
-        </button>
-      </div>
-      <Tooltip title={'Payment Mode (SHIFT + M)'} placement={'top'}>
-        <div
-          className="paymentsButtons"
-          style={{
-            pointerEvents: isDisabled ? 'none' : 'auto',
-            opacity: isDisabled ? 0.5 : 1,
-          }}
-        >
-          {payBtns?.length > 0 && (currentOrderNetAmount >= previousNetAmount) ? (
-            payBtns.map((payment) => {
-              const mode = payment?.ModeName?.toLowerCase();
-              const isSelected = paybtnselected === payment?.ModeId;
-              const buttonClass = isSelected
-                ? 'paybutton-selected'
-                : 'paybutton';
 
-              const handleClick =
-                mode === 'upi'
-                  ? () =>
-                    handleUPIButtonClick(payment?.ModeId, payment?.ModeName)
-                  : () => handlePaymentMode(payment?.ModeId, payment?.ModeName);
-
-              return (
-                <div className="standard-pay-btns" key={payment?.ModeId}>
-                  <button
-                    className={buttonClass}
-                    style={{
-                      // fontFamily: FontFamily['para'],
-                      backgroundColor:
-                        mode === 'upi'
-                          ? '#2563eb'
-                          : mode === 'card'
-                            ? '#9333ea'
-                            : mode === 'credit'
-                              ? '#9333ea'
-                              : '#16a34a',
-                      animation: blink
-                        ? 'blink-animation 0.5s infinite alternate'
-                        : 'none',
-                    }}
-                    onClick={handleClick}
-                  >
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        gap: '0.5rem',
-                      }}
-                    >
-                      {mode === 'cash' && <FaMoneyBillWave />}
-                      {mode === 'upi' && <FaMobileScreenButton />}
-
-                      {mode === 'credit' && (
-                        <>
-                          <img src={Credit} alt="" width={20} />
-                        </>
-                      )}
-                      {payment?.ModeName}
-
-                      {mode === 'upi' && (
-                        <UpiPopover
-                          defaultPaymentMode={defaultPaymentMode}
-                          defaultEnabled={defaultEnabled}
-                          setDefaultEnabled={setDefaultEnabled}
-                          UpiOptionOpen={UpiOptionOpen}
-                          UpiPayOption={UpiPayOption}
-                          SelectedUPIPayOption={SelectedUPIPayOption}
-                          AddUPIPaymentOption={AddUPIPaymentOption}
-                          PaymentUpiOptions={PaymentUpiOptions}
-                          UpiOption={UpiOption}
-                          UpiId={UpiId}
-                          BusinessPayOption={BusinessPayOption}
-                          paygate={paygate}
-                          paydevice={paydevice}
-                          EnableUpiOptions={EnableUpiOptions}
-                          PaymentgatewayUPI={PaymentgatewayUPI}
-                          PaymentDeviceUPI={PaymentDeviceUPI}
-                          SelectedUpiOption={SelectedUpiOption}
-                          addUpiOption={addUpiOption}
-                          hideDefault={hideDefault}
-                        />
-                      )}
-                      {mode === 'card' && (
-                        <CardPopover
-                          CardPayOption={CardPayOption}
-                          SelectedCardOption={SelectedCardOption}
-                          AddCardOption={AddCardOption}
-                          CardOptionOpen={CardOptionOpen}
-                          EnableCardOptions={EnableCardOptions}
-                          paygate={paygate}
-                          paydevice={paydevice}
-                        />
-                      )}
-                    </div>
-                  </button>
+            {dinePreference &&
+              (BookingType === 'Dine In' ||
+                BookingTypeBoth ||
+                CheckOrderType?.length > 0) &&
+              !unpaidFlow &&
+              SelectedTableDetails?.length !== 0 && (
+                <div
+                  style={{
+                    width: '4rem',
+                    display: 'flex',
+                    alignItems: 'center',
+                  }}
+                >
+                  <Tooltip title="ORDER" isMobile={isMobile}>
+                    {' '}
+                    <PozoDineInIcon
+                      className={
+                        FirstPaymentclick === false && !addnewAccess
+                          ? OrderStatus
+                            ? 'Dinein-order-btn pulse-element ChairClrRed'
+                            : 'Dinein-order-btn pulse-element ChairClrGreen'
+                          : 'Dinein-order-btn-disabled pulse-element'
+                      }
+                      onClick={() =>
+                        FirstPaymentclick === false && !addnewAccess
+                          ? changeOrderStatus()
+                          : ''
+                      }
+                    />
+                  </Tooltip>
                 </div>
-              );
-            })
-          ) : (currentOrderNetAmount < previousNetAmount && salesBillEdit && refundPayBtns.length > 0) ? (
-            refundPayBtns.map((payment) => {
-              const mode = payment?.ConfigName?.toLowerCase();
-              const isSelected = refundPaySelected === payment?.ConfigId;
-              const buttonClass = isSelected
-                ? 'paybutton-selected'
-                : 'paybutton';
-
-              return (
-                <div className="standard-pay-btns" key={payment?.ConfigId}>
-                  <button
-                    className={buttonClass}
-                    style={{
-                      // fontFamily: FontFamily['para'],
-                      backgroundColor:
-                        mode === 'upi'
-                          ? '#2563eb'
-                          : mode === 'card'
-                            ? '#9333ea'
-                            : mode === 'credit'
-                              ? '#9333ea'
-                              : '#16a34a',
-                      animation: blink
-                        ? 'blink-animation 0.5s infinite alternate'
-                        : 'none',
-                    }}
-                    onClick={() => handleRefundPaymentMode(payment?.ConfigId, payment?.ConfigName)}
-                  >
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        gap: '0.5rem',
-                      }}
-                    >
-                      {mode === 'cash' && <FaMoneyBillWave />}
-                      {mode === 'upi' && <FaMobileScreenButton />}
-
-                      {mode === 'credit' && (
-                        <>
-                          <img src={Credit} alt="" width={20} />
-                        </>
-                      )}
-                      {payment?.ConfigName}
-                    </div>
-                  </button>
-                </div>
-              );
-            })
-          ) : (
-            <div
-              onClick={handlePaymentOptions}
-              style={{ cursor: 'pointer' }}
-              className="payment-error-msg"
-            >
-              Please Set Payment Options
-            </div>
-          )}
+              )}
+          </div>
+          <button className="summaryopenClose" onClick={handleSummary}>
+            {summary ? (
+              <>
+                Summary Close <IoClose color="#e33333" />
+              </>
+            ) : (
+              <>
+                Summary <FaAngleUp />
+              </>
+            )}
+          </button>
         </div>
-      </Tooltip>
+        <Tooltip title={'Payment Mode (SHIFT + M)'} placement={'top'}>
+          <div
+            className="paymentsButtons"
+            style={{
+              pointerEvents: isDisabled ? 'none' : 'auto',
+              opacity: isDisabled ? 0.5 : 1,
+            }}
+          >
+            {payBtns?.length > 0 &&
+            currentOrderNetAmount >= previousNetAmount ? (
+              payBtns.map((payment) => {
+                const mode = payment?.ModeName?.toLowerCase();
+                const isSelected = paybtnselected === payment?.ModeId;
+                const buttonClass = isSelected
+                  ? 'paybutton-selected'
+                  : 'paybutton';
 
-      <Tooltip title="Create Bill (F4)" isMobile={isMobile}>
-        <div
-          className={
-            addnewAccess
-              ? 'standard-pay-btn-disabled'
-              : FirstPaymentclick === false &&
-                orderCardDetail?.length > 0 &&
-                paybtnselected &&
-                CheckBookingStatus !== 'Close'
-                ? !OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ?
-                  'standard-pay-btn-refund'
-                  : 'standard-pay-btn'
-                  : 'standard-pay-btn order-complete'
-                : 'standard-pay-btn-disabled'
-          }
-          onClick={handleButtonClick}
-        >
-          {!OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <p>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</p> : (
-            <>
-              <p
-                className="standard-pay-amount"
-                style={{ fontFamily: FontFamily['head'] }}
+                const handleClick =
+                  mode === 'upi'
+                    ? () =>
+                        handleUPIButtonClick(payment?.ModeId, payment?.ModeName)
+                    : () =>
+                        handlePaymentMode(payment?.ModeId, payment?.ModeName);
+
+                return (
+                  <div className="standard-pay-btns" key={payment?.ModeId}>
+                    <button
+                      className={buttonClass}
+                      style={{
+                        // fontFamily: FontFamily['para'],
+                        backgroundColor:
+                          mode === 'upi'
+                            ? '#2563eb'
+                            : mode === 'card'
+                              ? '#9333ea'
+                              : mode === 'credit'
+                                ? '#9333ea'
+                                : '#16a34a',
+                        animation: blink
+                          ? 'blink-animation 0.5s infinite alternate'
+                          : 'none',
+                      }}
+                      onClick={handleClick}
+                    >
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          gap: '0.5rem',
+                        }}
+                      >
+                        {mode === 'cash' && <FaMoneyBillWave />}
+                        {mode === 'upi' && <FaMobileScreenButton />}
+
+                        {mode === 'credit' && (
+                          <>
+                            <img src={Credit} alt="" width={20} />
+                          </>
+                        )}
+                        {payment?.ModeName}
+
+                        {mode === 'upi' && (
+                          <UpiPopover
+                            defaultPaymentMode={defaultPaymentMode}
+                            defaultEnabled={defaultEnabled}
+                            setDefaultEnabled={setDefaultEnabled}
+                            UpiOptionOpen={UpiOptionOpen}
+                            UpiPayOption={UpiPayOption}
+                            SelectedUPIPayOption={SelectedUPIPayOption}
+                            AddUPIPaymentOption={AddUPIPaymentOption}
+                            PaymentUpiOptions={PaymentUpiOptions}
+                            UpiOption={UpiOption}
+                            UpiId={UpiId}
+                            BusinessPayOption={BusinessPayOption}
+                            paygate={paygate}
+                            paydevice={paydevice}
+                            EnableUpiOptions={EnableUpiOptions}
+                            PaymentgatewayUPI={PaymentgatewayUPI}
+                            PaymentDeviceUPI={PaymentDeviceUPI}
+                            SelectedUpiOption={SelectedUpiOption}
+                            addUpiOption={addUpiOption}
+                            hideDefault={hideDefault}
+                          />
+                        )}
+                        {mode === 'card' && (
+                          <CardPopover
+                            CardPayOption={CardPayOption}
+                            SelectedCardOption={SelectedCardOption}
+                            AddCardOption={AddCardOption}
+                            CardOptionOpen={CardOptionOpen}
+                            EnableCardOptions={EnableCardOptions}
+                            paygate={paygate}
+                            paydevice={paydevice}
+                          />
+                        )}
+                      </div>
+                    </button>
+                  </div>
+                );
+              })
+            ) : currentOrderNetAmount < previousNetAmount &&
+              salesBillEdit &&
+              refundPayBtns.length > 0 ? (
+              refundPayBtns.map((payment) => {
+                const mode = payment?.ConfigName?.toLowerCase();
+                const isSelected = refundPaySelected === payment?.ConfigId;
+                const buttonClass = isSelected
+                  ? 'paybutton-selected'
+                  : 'paybutton';
+
+                return (
+                  <div className="standard-pay-btns" key={payment?.ConfigId}>
+                    <button
+                      className={buttonClass}
+                      style={{
+                        // fontFamily: FontFamily['para'],
+                        backgroundColor:
+                          mode === 'upi'
+                            ? '#2563eb'
+                            : mode === 'card'
+                              ? '#9333ea'
+                              : mode === 'credit'
+                                ? '#9333ea'
+                                : '#16a34a',
+                        animation: blink
+                          ? 'blink-animation 0.5s infinite alternate'
+                          : 'none',
+                      }}
+                      onClick={() =>
+                        handleRefundPaymentMode(
+                          payment?.ConfigId,
+                          payment?.ConfigName
+                        )
+                      }
+                    >
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          gap: '0.5rem',
+                        }}
+                      >
+                        {mode === 'cash' && <FaMoneyBillWave />}
+                        {mode === 'upi' && <FaMobileScreenButton />}
+
+                        {mode === 'credit' && (
+                          <>
+                            <img src={Credit} alt="" width={20} />
+                          </>
+                        )}
+                        {payment?.ConfigName}
+                      </div>
+                    </button>
+                  </div>
+                );
+              })
+            ) : (
+              <div
+                onClick={handlePaymentOptions}
+                style={{ cursor: 'pointer' }}
+                className="payment-error-msg"
               >
-                {isMobile ? (
-                  `₹ ${safeRound(
-                    OrderType === 'Failed'
-                      ? FailedTotalAmt
-                      : credit && overAllBal >= 0
-                        ? Math.max(0, TotalAmount - overAllBal)
-                        : TotalAmount
-                  )}`
-                ) : (
-                  <div>
-                    ₹{' '}
-                    <CountUp
-                      duration={0.4}
-                      className="counter"
-                      end={safeRound(
+                Please Set Payment Options
+              </div>
+            )}
+          </div>
+        </Tooltip>
+
+        <Tooltip title="Create Bill (F4)" isMobile={isMobile}>
+          <div
+            className={
+              addnewAccess
+                ? 'standard-pay-btn-disabled'
+                : FirstPaymentclick === false &&
+                    orderCardDetail?.length > 0 &&
+                    paybtnselected &&
+                    CheckBookingStatus !== 'Close'
+                  ? !OrderStatus
+                    ? salesBillEdit && currentOrderNetAmount < previousNetAmount
+                      ? 'standard-pay-btn-refund'
+                      : 'standard-pay-btn'
+                    : 'standard-pay-btn order-complete'
+                  : 'standard-pay-btn-disabled'
+            }
+            onClick={handleButtonClick}
+          >
+            {!OrderStatus ? (
+              salesBillEdit && currentOrderNetAmount < previousNetAmount ? (
+                <p>
+                  Refund: ₹
+                  {(previousNetAmount || 0) - (currentOrderNetAmount || 0)}
+                </p>
+              ) : (
+                <>
+                  <p
+                    className="standard-pay-amount"
+                    style={{ fontFamily: FontFamily['head'] }}
+                  >
+                    {isMobile ? (
+                      `₹ ${safeRound(
                         OrderType === 'Failed'
                           ? FailedTotalAmt
                           : credit && overAllBal >= 0
                             ? Math.max(0, TotalAmount - overAllBal)
                             : TotalAmount
-                      )}
-                    />
+                      )}`
+                    ) : (
+                      <div>
+                        ₹{' '}
+                        <CountUp
+                          duration={0.4}
+                          className="counter"
+                          end={safeRound(
+                            OrderType === 'Failed'
+                              ? FailedTotalAmt
+                              : credit && overAllBal >= 0
+                                ? Math.max(0, TotalAmount - overAllBal)
+                                : TotalAmount
+                          )}
+                        />
+                      </div>
+                    )}
+                  </p>
+
+                  <div className="standard-pay-arrow">
+                    <BiRightArrowAlt size={25} />
                   </div>
-                )}
-              </p>
-
-              <div className="standard-pay-arrow">
-                <BiRightArrowAlt size={25} />
-              </div>
-            </>
-          ) : (
-            <div className="standard-pay-order-label">ORDER</div>
-          )}
-        </div>
-      </Tooltip>
-
-      <DefaultModal
-        open={unpaidopen}
-        title="UNPAID BILL'S"
-        width={1000}
-        handleCancel={() => {
-          setUnpaidOpen(false);
-        }}
-        footer={false}
-        children={
-          <div style={{ height: '400px', overflow: 'scroll' }}>
-            <Tables
-              columns={columns}
-              data={TableData}
-              dataSource={TableData}
-            // pagination={handlePageChange}
-            // onChange={handleChange}
-            />
+                </>
+              )
+            ) : (
+              <div className="standard-pay-order-label">ORDER</div>
+            )}
           </div>
-        }
-      />
-      {UnpaidConfirmation && (
-        <Modal
-          open={UnpaidConfirmation}
-          width={500}
-          children={
-            <>
-              <div>
-                You have already selected a table. If you click 'OK,' the table
-                selection will be removed, and the unpaid flow will continue. If
-                you click 'Cancel,' the dine-in flow will proceed as selected.
-              </div>
-            </>
-          }
-          onOk={UnpaidOk}
-          onCancel={Unpaidclose}
-        />
-      )}
+        </Tooltip>
 
-      {UpiOpen && (
         <DefaultModal
-          open={UpiOpen}
-          title="UPI PAYMENT"
-          width={500}
+          open={unpaidopen}
+          title="UNPAID BILL'S"
+          width={1000}
           handleCancel={() => {
-            Upimodel('Cancel');
+            setUnpaidOpen(false);
           }}
           footer={false}
           children={
-            <div style={{ overflow: 'scroll' }}>
-              <div
-                style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  justifyContent: 'space-evenly',
-                  alignItems: 'center',
-                }}
-              >
-                <div>
-                  <QrinScreen
-                    Amount={
-                      OrderType === 'Failed'
-                        ? FailedTotalAmt
-                        : Math.round(TotalAmount)
-                    }
-                    UpiId={UpiId}
-                  />
-                </div>
-
-                <div>
-                  <h1>
-                    {' '}
-                    RS :
-                    {OrderType === 'Failed'
-                      ? FailedTotalAmt
-                      : Math.round(TotalAmount)}{' '}
-                  </h1>
-                </div>
-              </div>
-
-              <div className="sentok">
-                {(selOption || SelCustId) && (
-                  <div className="sentLink" onClick={onFinalSubmit}>
-                    Sent Payment Link
-                    <img
-                      src={WpIcon}
-                      alt="Your Alt Text"
-                      style={{ width: '30px', height: '30px' }}
-                    />
-                  </div>
-                )}
-
-                <div
-                  style={{
-                    display: 'flex',
-                    flexDirection: 'row-reverse',
-                    width: '100px',
-                  }}
-                >
-                  <Buttons
-                    buttonText="OK"
-                    color="901D77"
-                    icon={<ArrowRightOutlined />}
-                    handleSubmit={() => {
-                      Upimodel('Submit');
-                    }}
-                  />
-                </div>
-              </div>
+            <div style={{ height: '400px', overflow: 'scroll' }}>
+              <Tables
+                columns={columns}
+                data={TableData}
+                dataSource={TableData}
+                // pagination={handlePageChange}
+                // onChange={handleChange}
+              />
             </div>
           }
         />
-      )}
-      {PrintOrderDetails?.length > 0 &&
-        PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-          <div style={{ display: 'none' }}>
-            <PaymentPdfBooking
-              index={index}
-              table2Data={orderDetail}
-              singleData2={orderDetail?.productDetails}
-              orderId={
-                orderDetail?.OrderId &&
-                extractLastNumberOrderId(
-                  orderDetail?.OrderId,
-                  orderDetail?.FYStatus
-                )
-              }
-              CreatedDate={orderDetail?.CreatedDate}
-              PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-              Preference={preferenceDatas}
-              printDatas={printDatas}
-            />
-          </div>
-        ))}
-      {PrintOrderDetails?.length > 0 &&
-        (TokenOnly?.SettingValue === 'Y' ||
-          IndividualToken?.SettingValue === 'Y') &&
-        PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-          <div style={{ display: 'none' }}>
-            <TokensinglePrint
-              index={index}
-              table2Data={orderDetail}
-              singleData2={orderDetail?.productDetails}
-              orderId={
-                orderDetail?.OrderId &&
-                extractLastNumberOrderId(
-                  orderDetail?.OrderId,
-                  orderDetail?.FYStatus
-                )
-              }
-              CreatedDate={orderDetail?.CreatedDate}
-              PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-            />
-          </div>
-        ))}
-      {CreditCustomer && (
-        <div style={{ display: 'none' }}>
-          <BsBillingCreditCustomer
-            ModalCreditCustomer={CreditCustomer}
-            handlemodalclose={() => {
-              handleCreditCustomer('Cancel');
-            }}
-            handleOk={() => {
-              handleCreditCustomer('Submit');
-            }}
+        {UnpaidConfirmation && (
+          <Modal
+            open={UnpaidConfirmation}
+            width={500}
+            children={
+              <>
+                <div>
+                  You have already selected a table. If you click 'OK,' the
+                  table selection will be removed, and the unpaid flow will
+                  continue. If you click 'Cancel,' the dine-in flow will proceed
+                  as selected.
+                </div>
+              </>
+            }
+            onOk={UnpaidOk}
+            onCancel={Unpaidclose}
           />
-        </div>
-      )}
+        )}
 
-      {creditCustomerOpen && (
-        <BSCreditCustomer
-          creditCustomerOpen={creditCustomerOpen}
-          CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-        />
-      )}
-      {Splitpayment && (
-        <SplitPayment
-          SplitPaymentModal={Splitpayment}
-          handlesplitpaymentclose={handlesplitpaymentclose}
-          TotalNetAmount={Math.round(
-            orderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
-            ((OverAllSales > 0 ? OverAllSales : 0) +
-              (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-              (Discount > 0 ? Discount : 0))
-          )}
-        // failedOrderData={failedOrderData}
-        />
-      )}
+        {UpiOpen && (
+          <DefaultModal
+            open={UpiOpen}
+            title="UPI PAYMENT"
+            width={500}
+            handleCancel={() => {
+              Upimodel('Cancel');
+            }}
+            footer={false}
+            children={
+              <div style={{ overflow: 'scroll' }}>
+                <div
+                  style={{
+                    display: 'flex',
+                    flexDirection: 'column',
+                    justifyContent: 'space-evenly',
+                    alignItems: 'center',
+                  }}
+                >
+                  <div>
+                    <QrinScreen
+                      Amount={
+                        OrderType === 'Failed'
+                          ? FailedTotalAmt
+                          : Math.round(TotalAmount)
+                      }
+                      UpiId={UpiId}
+                    />
+                  </div>
 
-      <DefaultModal
-        className={'paymentoptionsModal'}
-        open={GlobalSalesPaymentoptions}
-        width={500}
-        height={1000}
-        handleCancel={() => {
-          dispatch(changeSalesPaymentoption(false));
-        }}
-        footer={false}
-        children={
-          <div
-            className="paymentoptionsModalContent"
-            style={{ overflow: 'scroll' }}
-          >
-            <Paymentoption onSuccess={getPaymentOptionFeature} />
-          </div>
-        }
-      />
-      <DefaultModal
-        open={businessUPI}
-        handleCancel={() => setShowCancelConfirm(true)}
-        footer={false}
-        width={600}
-        className={'ModalPaymentGatewayEmbedded'}
-        children={
-          <>
-            <PaymentGatewayEmbedded
-              ref={paymentGatewayRef}
-              orderId={businessUPIOrderId}
-              setBusinessUPIOrderId={setBusinessUPIOrderId}
-              businessUPILink={businessUPILink}
-              setBusinessUPI={setBusinessUPI}
-              setPaymentSuccess={setPaymentSuccess}
-              paymentSucess={paymentSucess}
-              ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
-              CustomerDisplay={CustomerDisplay}
+                  <div>
+                    <h1>
+                      {' '}
+                      RS :
+                      {OrderType === 'Failed'
+                        ? FailedTotalAmt
+                        : Math.round(TotalAmount)}{' '}
+                    </h1>
+                  </div>
+                </div>
+
+                <div className="sentok">
+                  {(selOption || SelCustId) && (
+                    <div className="sentLink" onClick={onFinalSubmit}>
+                      Sent Payment Link
+                      <img
+                        src={WpIcon}
+                        alt="Your Alt Text"
+                        style={{ width: '30px', height: '30px' }}
+                      />
+                    </div>
+                  )}
+
+                  <div
+                    style={{
+                      display: 'flex',
+                      flexDirection: 'row-reverse',
+                      width: '100px',
+                    }}
+                  >
+                    <Buttons
+                      buttonText="OK"
+                      color="901D77"
+                      icon={<ArrowRightOutlined />}
+                      handleSubmit={() => {
+                        Upimodel('Submit');
+                      }}
+                    />
+                  </div>
+                </div>
+              </div>
+            }
+          />
+        )}
+        {PrintOrderDetails?.length > 0 &&
+          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+            <div style={{ display: 'none' }}>
+              <PaymentPdfBooking
+                index={index}
+                table2Data={orderDetail}
+                singleData2={orderDetail?.productDetails}
+                orderId={
+                  orderDetail?.OrderId &&
+                  extractLastNumberOrderId(
+                    orderDetail?.OrderId,
+                    orderDetail?.FYStatus
+                  )
+                }
+                CreatedDate={orderDetail?.CreatedDate}
+                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                Preference={preferenceDatas}
+                printDatas={printDatas}
+              />
+            </div>
+          ))}
+        {PrintOrderDetails?.length > 0 &&
+          (TokenOnly?.SettingValue === 'Y' ||
+            IndividualToken?.SettingValue === 'Y') &&
+          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+            <div style={{ display: 'none' }}>
+              <TokensinglePrint
+                index={index}
+                table2Data={orderDetail}
+                singleData2={orderDetail?.productDetails}
+                orderId={
+                  orderDetail?.OrderId &&
+                  extractLastNumberOrderId(
+                    orderDetail?.OrderId,
+                    orderDetail?.FYStatus
+                  )
+                }
+                CreatedDate={orderDetail?.CreatedDate}
+                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+              />
+            </div>
+          ))}
+        {CreditCustomer && (
+          <div style={{ display: 'none' }}>
+            <BsBillingCreditCustomer
+              ModalCreditCustomer={CreditCustomer}
+              handlemodalclose={() => {
+                handleCreditCustomer('Cancel');
+              }}
+              handleOk={() => {
+                handleCreditCustomer('Submit');
+              }}
             />
-          </>
-        }
-      />
-      {showCancelConfirm && (
-        <Modal
-          open={showCancelConfirm}
-          title="Cancel Payment"
-          onOk={() => {
-            paymentGatewayRef.current?.clearPolling();
-            setBusinessUPI(false);
-            setShowCancelConfirm(false);
-            ClearAllGlobalStateDatas();
-            CustomerDisplay();
-          }}
-          onCancel={() => setShowCancelConfirm(false)}
-          okText="Yes"
-          cancelText="No"
-        >
-          Do you want to cancel the payment?
-        </Modal>
-      )}
-      {customerPreviesOrders && (
+          </div>
+        )}
+
+        {creditCustomerOpen && (
+          <BSCreditCustomer
+            creditCustomerOpen={creditCustomerOpen}
+            CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
+          />
+        )}
+        {Splitpayment && (
+          <SplitPayment
+            SplitPaymentModal={Splitpayment}
+            handlesplitpaymentclose={handlesplitpaymentclose}
+            TotalNetAmount={Math.round(
+              orderCardDetail?.reduce((acc, data) => data?.TotalAmt + acc, 0) -
+                ((OverAllSales > 0 ? OverAllSales : 0) +
+                  (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                  (Discount > 0 ? Discount : 0))
+            )}
+            // failedOrderData={failedOrderData}
+          />
+        )}
+
         <DefaultModal
-          open={customerPreviesOrders}
-          handleCancel={() => setCustomerPreviesOrders(false)}
+          className={'paymentoptionsModal'}
+          open={GlobalSalesPaymentoptions}
+          width={500}
+          height={1000}
+          handleCancel={() => {
+            dispatch(changeSalesPaymentoption(false));
+          }}
           footer={false}
-          width={700}
+          children={
+            <div
+              className="paymentoptionsModalContent"
+              style={{ overflow: 'scroll' }}
+            >
+              <Paymentoption onSuccess={getPaymentOptionFeature} />
+            </div>
+          }
+        />
+        <DefaultModal
+          open={businessUPI}
+          handleCancel={() => setShowCancelConfirm(true)}
+          footer={false}
+          width={600}
           className={'ModalPaymentGatewayEmbedded'}
           children={
             <>
-              <CustomerOrders
-                CustomerDetails={selOption}
-                close={() => setCustomerPreviesOrders(false)}
+              <PaymentGatewayEmbedded
+                ref={paymentGatewayRef}
+                orderId={businessUPIOrderId}
+                setBusinessUPIOrderId={setBusinessUPIOrderId}
+                businessUPILink={businessUPILink}
+                setBusinessUPI={setBusinessUPI}
+                setPaymentSuccess={setPaymentSuccess}
+                paymentSucess={paymentSucess}
+                ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
+                CustomerDisplay={CustomerDisplay}
               />
             </>
           }
         />
-      )}
-      {
-        OtherServicesPrintDetails?.length > 0 && (
-          // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-          <div style={{ display: 'none' }}>
-            <OtherServicePrintStyle1
-              // index={index}
-              table2Data={OtherServicesPrintDetails}
-              singleData2={OtherServicesPrintDetails?.productDetails}
-              orderId={
-                OtherServicesPrintDetails?.OrderId &&
-                extractLastNumberOrderId(
-                  OtherServicesPrintDetails?.OrderId,
-                  OtherServicesPrintDetails?.FYStatus
-                )
-              }
-              CreatedDate={OtherServicesPrintDetails?.CreatedDate}
-              PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
-              Preference={preferenceDatas}
-              printDatas={printDatas}
-            />
-          </div>
-        )
-        // ))
-      }
-    </div>
+        {showCancelConfirm && (
+          <Modal
+            open={showCancelConfirm}
+            title="Cancel Payment"
+            onOk={() => {
+              paymentGatewayRef.current?.clearPolling();
+              setBusinessUPI(false);
+              setShowCancelConfirm(false);
+              ClearAllGlobalStateDatas();
+              CustomerDisplay();
+            }}
+            onCancel={() => setShowCancelConfirm(false)}
+            okText="Yes"
+            cancelText="No"
+          >
+            Do you want to cancel the payment?
+          </Modal>
+        )}
+        {customerPreviesOrders && (
+          <DefaultModal
+            open={customerPreviesOrders}
+            handleCancel={() => setCustomerPreviesOrders(false)}
+            footer={false}
+            width={700}
+            className={'ModalPaymentGatewayEmbedded'}
+            children={
+              <>
+                <CustomerOrders
+                  CustomerDetails={selOption}
+                  close={() => setCustomerPreviesOrders(false)}
+                />
+              </>
+            }
+          />
+        )}
+        {
+          OtherServicesPrintDetails?.length > 0 && (
+            // PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+            <div style={{ display: 'none' }}>
+              <OtherServicePrintStyle1
+                // index={index}
+                table2Data={OtherServicesPrintDetails}
+                singleData2={OtherServicesPrintDetails?.productDetails}
+                orderId={
+                  OtherServicesPrintDetails?.OrderId &&
+                  extractLastNumberOrderId(
+                    OtherServicesPrintDetails?.OrderId,
+                    OtherServicesPrintDetails?.FYStatus
+                  )
+                }
+                CreatedDate={OtherServicesPrintDetails?.CreatedDate}
+                PaymentStatus={OtherServicesPrintDetails?.[0]?.PaymentOrderDtl}
+                Preference={preferenceDatas}
+                printDatas={printDatas}
+              />
+            </div>
+          )
+          // ))
+        }
+      </div>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSCategories/BSCategoryHorizontal.jsx b/src/Pages/BookingScreen/Components/BSCategories/BSCategoryHorizontal.jsx
index 1a53a03..17c6ce2 100644
--- a/src/Pages/BookingScreen/Components/BSCategories/BSCategoryHorizontal.jsx
+++ b/src/Pages/BookingScreen/Components/BSCategories/BSCategoryHorizontal.jsx
@@ -524,36 +524,6 @@ function BSCategoryHorizontal(props) {
       await dispatch(changeProductSubCategorieProdCatfun());
     }
   };
-  // const handleClick = async (e, ProdCat, index) => {
-  //   let data1 = {
-  //     compId: CompId,
-  //     branchId: BranchId,
-  //     appId: AppId,
-  //     prodCat: ProdCat,
-  //   };
-  //   let data = false;
-  //   setaccessToCard(false);
-  //   await dispatch(changeCombosearch(false));
-  //   dispatch(ChangeisFavClicked(false));
-  //   setAccessOther(false);
-  //   setIsModalOpen(false);
-  //   setIndexVal(index);
-
-  //   await dispatch(changeProductCategorie(ProdCat));
-  //   // await dispatch(changeProductSubCategorie(ProdCat));
-  //   await dispatch(changeAccessForOthers(data));
-  //   await dispatch(ChangeFocusCatCard(!FocusStatus));
-  //   let tempSubCat = templateData?.BookingLayout?.[1]?.filter(
-  //     (a, b) => a?.OptionName === 'SubCategory'
-  //   );
-  //   if (tempSubCat.length === 0) {
-  //     await dispatch(changeProductSubCategorieProdCatfun());
-  //   }
-  //   if (templateData?.BookingLayout?.[0] === 'Layout2') {
-  //     setSubCat(true);
-  //   }
-
-  // };
 
   useEffect(() => {
     if (productCardTrigger && FavSelected) {
@@ -584,27 +554,15 @@ function BSCategoryHorizontal(props) {
           }
         : {}),
     };
-    await dispatch(getSelectedFavItems(data1));
+
+    // await dispatch(getSelectedFavItems(data1));
     await dispatch(ChangeFocusCatCard(!FocusStatus));
   };
   const handleClickOtherItems = async () => {
     dispatch(ChangedraggingComponent(null));
     dispatch(Changedragging(false));
-    let data = false;
     setIndexVal(Infinity);
-    // setaccessToCard(true);
-    // dispatch(ChangeisFavClicked(true));
-    // setAccessOther(false);
     setIsModalOpen(true);
-    // // await dispatch(ChangeSubcategoryData(null));
-    // await dispatch(changeAccessForOthers(data));
-    // let data1 = {
-    //   CompId: CompId,
-    //   BranchId: BranchId,
-    //   AppId: AppId,
-    // };
-    // await dispatch(getSelectedFavItems(data1));
-    // await dispatch(ChangeFocusCatCard(!FocusStatus));
   };
 
   const handleClick2 = async () => {
@@ -690,8 +648,10 @@ function BSCategoryHorizontal(props) {
   };
 
   useEffect(() => {
-    holdnamedrop();
-  }, [AppId, CompId, BranchId]);
+    if (isModalOpen) {
+      holdnamedrop();
+    }
+  }, [isModalOpen]);
 
   const holdnamedrop = async () => {
     let data = {
@@ -896,16 +856,16 @@ function BSCategoryHorizontal(props) {
 
     formRef?.current?.resetFields();
     resetForm();
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      ProdType: 'O',
-    };
-    const respons = await dispatch(othernamedrop(data)).unwrap();
-    if (respons?.data?.statusCode == 1) {
-      setTabledropname(respons?.data?.data);
-    }
+    // let data = {
+    //   CompId: CompId,
+    //   BranchId: BranchId,
+    //   AppId: AppId,
+    //   ProdType: 'O',
+    // };
+    // const respons = await dispatch(othernamedrop(data)).unwrap();
+    // if (respons?.data?.statusCode == 1) {
+    //   setTabledropname(respons?.data?.data);
+    // }
   };
 
   const handleValuesChange = (values) => {
@@ -1702,7 +1662,7 @@ function BSCategoryHorizontal(props) {
                           }))}
                           className="field-DropDown"
                           // placeholder="ConfigType"
-                          label={<label class="required">Tax</label>}
+                          label={<label className="required">Tax</label>}
                           // optionsNames={{ value: "TaxPercentage", label: "TaxIdName" }}
                           onChangeFunction={(selectedValue) =>
                             onChangeFunction(selectedValue)
@@ -1773,7 +1733,7 @@ function BSCategoryHorizontal(props) {
                             // }}
                             className="size-input"
                             label={
-                              <label class="required">No.of.Units :</label>
+                              <label className="required">No.of.Units :</label>
                             }
                             autocomplete="off"
                             onChange={(e) =>
@@ -1885,7 +1845,7 @@ function BSCategoryHorizontal(props) {
                           ]}
                         >
                           <InputField
-                            label={<label class="required">Quantity</label>}
+                            label={<label className="required">Quantity</label>}
                             valueData={defaultQuantity}
                             autocomplete="off"
                             onChange={(e) =>
@@ -1953,7 +1913,9 @@ function BSCategoryHorizontal(props) {
                       >
                         <InputField
                           label={
-                            <label class="required">Amount / Per Item</label>
+                            <label className="required">
+                              Amount / Per Item
+                            </label>
                           }
                           autocomplete="off"
                           onChange={(e) =>
diff --git a/src/Pages/BookingScreen/Components/BSCategories/BSCategoryVertical.jsx b/src/Pages/BookingScreen/Components/BSCategories/BSCategoryVertical.jsx
index 70555cd..eb6a953 100644
--- a/src/Pages/BookingScreen/Components/BSCategories/BSCategoryVertical.jsx
+++ b/src/Pages/BookingScreen/Components/BSCategories/BSCategoryVertical.jsx
@@ -510,8 +510,10 @@ function BSCategoryVertical(props) {
   };
 
   useEffect(() => {
-    holdnamedrop();
-  }, [AppId, CompId, BranchId]);
+    if (isModalOpen) {
+      holdnamedrop();
+    }
+  }, [isModalOpen]);
 
   const holdnamedrop = async () => {
     let data = {
@@ -708,16 +710,16 @@ function BSCategoryVertical(props) {
 
     formRef?.current?.resetFields();
     resetForm();
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      ProdType: 'O',
-    };
-    const respons = await dispatch(othernamedrop(data)).unwrap();
-    if (respons?.data?.statusCode == 1) {
-      setTabledropname(respons?.data?.data);
-    }
+    // let data = {
+    //   CompId: CompId,
+    //   BranchId: BranchId,
+    //   AppId: AppId,
+    //   ProdType: 'O',
+    // };
+    // const respons = await dispatch(othernamedrop(data)).unwrap();
+    // if (respons?.data?.statusCode == 1) {
+    //   setTabledropname(respons?.data?.data);
+    // }
   };
 
   const handleValuesChange = (values) => {
@@ -1422,7 +1424,7 @@ function BSCategoryVertical(props) {
                   <p
                     style={{
                       textTransform: Uppercase,
-                      fontWeight: '600',
+                      fontWeight: '500',
                       // paddingTop: !item.SmallIcon && "4px",
                       fontFamily: SelectedFontFamily ? SelectedFontFamily : '',
                       color: SelectedCatgColor
diff --git a/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesHorizontalcat.jsx b/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesHorizontalcat.jsx
index 018f7a1..448fad0 100644
--- a/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesHorizontalcat.jsx
+++ b/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesHorizontalcat.jsx
@@ -62,7 +62,10 @@ import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
 import { BsSortAlphaDown } from 'react-icons/bs';
 import { BsSortAlphaDownAlt } from 'react-icons/bs';
 import { ApplicationPreferences } from '../../../../Features/BrachLogin/BranchLogin.js';
-import {changeothersdatas, OtherServicesCardlistdata} from '../../../../Features/OtherServices/OtherServices.js';
+import {
+  changeothersdatas,
+  OtherServicesCardlistdata,
+} from '../../../../Features/OtherServices/OtherServices.js';
 
 function BSOtherServicesHorizontalcat(props) {
   const formRef = useRef(null);
@@ -93,7 +96,6 @@ function BSOtherServicesHorizontalcat(props) {
   const draggingComponent = useSelector(GlobaldraggingComponent);
   const alphabeticFormat = useSelector(GlobalisAlphabeticFormat);
 
-
   const [isDragging, setIsDragging] = useState(false);
   const [startX, setStartX] = useState(null);
   const [accessToCard, setaccessToCard] = useState(false);
@@ -375,14 +377,19 @@ function BSOtherServicesHorizontalcat(props) {
   };
 
   const handleClick = async (e, ProdCat, index) => {
+    let Filterdata1 = ComboCardata?.filter(
+      (item) => item?.ServiceCategory === ProdCat
+    );
+    let Filterdata2 = ComboCardata?.filter(
+      (item) => item?.ServiceCategory === ProdCat
+    );
 
-let Filterdata1 = ComboCardata?.filter((item) => item?.ServiceCategory === ProdCat)
-let Filterdata2 = ComboCardata?.filter((item) => item?.ServiceCategory === ProdCat)
-
-
-let Filterdata = ComboCardata?.filter((item) => item?.ServiceCategory === ProdCat)?.[0]?.ServiceDetails;
-let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdCat)?.[0]?.ServiceDetails;
-
+    let Filterdata = ComboCardata?.filter(
+      (item) => item?.ServiceCategory === ProdCat
+    )?.[0]?.ServiceDetails;
+    let Filterdatas = ComboCardata?.filter(
+      (item) => item?.ServiceCategory === ProdCat
+    )?.[0]?.ServiceDetails;
 
     let data1 = {
       compId: CompId,
@@ -430,7 +437,6 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
   };
 
   const handleClick2 = async () => {
-
     getTaxname();
     getUom();
     setIndexVal(-1);
@@ -511,8 +517,10 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
   };
 
   useEffect(() => {
-    holdnamedrop();
-  }, [AppId, CompId, BranchId]);
+    if (isModalOpen) {
+      holdnamedrop();
+    }
+  }, [isModalOpen]);
 
   const holdnamedrop = async () => {
     let data = {
@@ -526,13 +534,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
 
     const response = await dispatch(getUomData()).unwrap();
 
-    // setTableuomname(response?.data?.data);
-    // let UomId = response?.data?.data?.filter(
-    //   (item) => item.ConfigName?.toLowerCase() === 'pcs'
-    // )?.[0]?.['ConfigId'];
-    // formRef.current?.setFieldsValue({ UOM: UomId });
-    // setselectedUom(UomId);
-
+ 
     const UomTypePreference = ApplicationPreferenceData?.find(
       (preference) => preference?.PreferredCatName === 'Product Uom'
     )?.PreferenceCatDetails;
@@ -718,17 +720,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
     handleCancel();
 
     formRef?.current?.resetFields();
-    resetForm();
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      ProdType: 'O',
-    };
-    const respons = await dispatch(othernamedrop(data)).unwrap();
-    if (respons?.data?.statusCode == 1) {
-      setTabledropname(respons?.data?.data);
-    }
+    resetForm(); 
   };
 
   const handleValuesChange = (values) => {
@@ -860,20 +852,19 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
   };
 
   useEffect(() => {
-     if (typeof searchData === 'string' && categoryData?.length > 0) {
-    const searchTerm = searchData?.trim()?.toLowerCase();
-    const foundIndex = categoryData.findIndex(
-      (cat) =>
-        typeof cat.ProdCatName === 'string' &&
-        cat.ProdCatName?.trim()?.toLowerCase() === searchTerm
-    );
-    if (foundIndex !== -1) {
-      setIndexVal(foundIndex);
+    if (typeof searchData === 'string' && categoryData?.length > 0) {
+      const searchTerm = searchData?.trim()?.toLowerCase();
+      const foundIndex = categoryData.findIndex(
+        (cat) =>
+          typeof cat.ProdCatName === 'string' &&
+          cat.ProdCatName?.trim()?.toLowerCase() === searchTerm
+      );
+      if (foundIndex !== -1) {
+        setIndexVal(foundIndex);
+      }
+    } else if (categoryData?.length > 0) {
+      setIndexVal(0);
     }
-  } else if (categoryData?.length > 0) {
-    setIndexVal(0);
-  }
-
   }, [searchData, categoryData]);
 
   useEffect(() => {
@@ -893,14 +884,13 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
       let Data = response?.data?.data;
 
       setCombocardata(Data?.ServiceCategories);
-
     }
   };
 
   return (
     <>
-
-      <div   className="CategoryHorizontal bs1"
+      <div
+        className="CategoryHorizontal bs1"
         ref={containerRef}
         style={{ maxWidth: '100%' }}
       >
@@ -1026,7 +1016,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
                                 option,
                                 selectedTaxPercentage === option.TaxId
                               ),
-                              // label: option.TaxIdName + ' - ' + option.TaxPercentage + ' % ',
+                              // label: option.NameTaxIdName + ' - ' + option.TaxPercentage + ' % ',
                             }))}
                             className="field-DropDown"
                             // placeholder="ConfigType"
@@ -1099,13 +1089,11 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
                               }
                               // inputMode="numeric"
                               // onInput={(e) => {
-                              //   e.target.value = e.target.value.replace(/\D/g, "");
+                              //   e.target.Namevalue = e.target.value.replace(/\D/g, "");
                               // }}
                               className="size-input"
                               label={
-                                <label class="required">
-                                 No.of.Units :
-                                </label>
+                                <label class="required">No.of.Units :</label>
                               }
                               autocomplete="off"
                               onChange={(e) =>
@@ -1147,32 +1135,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
                             />
                           </Form.Item>
                         </div>
-                      </div>
-                      {/* <Form.Item
-                        name="UOM"
-                        rules={[
-                          {
-                            required: true,
-                            message: "Please Select UOM",
-                          },
-                        ]}
-                      >
-                        <DropDowns
-                          options={Tableuomname?.map((option) => ({
-                            value: option.ConfigId,
-                            label: option.ConfigName,
-                          }))}
-                          placeholder="ConfigType"
-                          label={<label class="required">UOM</label>}
-                          optionsNames={{ value: "TypeId", label: "TypeName" }}
-                          className="field-DropDown"
-                          onChangeFunction={(selectedValues) =>
-                            onChangeuomFunction(selectedValues)
-                          }
-                          valueData={selectedUom}
-                          disabled={add || !EditState ? false : true}
-                        />
-                      </Form.Item> */}
+                      </div> 
                       <div
                         className="quantity-amt"
                         style={{
@@ -1420,7 +1383,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
               index={indexval}
               onClick={() => handleClick1()}
             > */}
-              {/* <div
+          {/* <div
                 style={{ flexDirection: Reverse1 }}
                 className="CategoryHorizontal-sub-samplecard"
               >
@@ -1438,7 +1401,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
                   Favourites
                 </p>
               </div> */}
-            {/* </div> */}
+          {/* </div> */}
           {/* )} */}
 
           {(!Isdragging || draggingComponent !== 'category') &&
@@ -1469,7 +1432,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
 
                   borderColor:
                     index === indexval
-                        ? '#000000'
+                      ? '#000000'
                       : SelectedCatgColor?.['BackgroundColor'],
                 }}
                 // key={}
@@ -1569,7 +1532,9 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
                               minWidth: 'max-content', // set a width if needed
                             }}
                             className="sampleCard"
-                            onClick={(e) => handleClick(e, item.ServiceCategory, index)}
+                            onClick={(e) =>
+                              handleClick(e, item.ServiceCategory, index)
+                            }
                           >
                             <div
                               style={{ flexDirection: Reverse1 }}
@@ -1672,7 +1637,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
             index={indexval}
             onClick={() => handleClick2()}
           > */}
-            {/* <div
+          {/* <div
               style={{ flexDirection: Reverse1 }}
               className="CategoryHorizontal-sub-samplecard"
             >
@@ -1703,9 +1668,7 @@ let Filterdatas = ComboCardata?.filter((item) => item?.ServiceCategory === ProdC
             </div>
           )}
         </div>
-
       </div>
-
     </>
   );
 }
diff --git a/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesVerticalcat.jsx b/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesVerticalcat.jsx
index 546c240..f7e29d4 100644
--- a/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesVerticalcat.jsx
+++ b/src/Pages/BookingScreen/Components/BSCategories/BSOtherServicesVerticalcat.jsx
@@ -58,7 +58,10 @@ import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
 import { BsSortAlphaDown } from 'react-icons/bs';
 import { BsSortAlphaDownAlt } from 'react-icons/bs';
 import { ApplicationPreferences } from '../../../../Features/BrachLogin/BranchLogin.js';
-import { changeothersdatas, OtherServicesCardlistdata } from '../../../../Features/OtherServices/OtherServices.js';
+import {
+  changeothersdatas,
+  OtherServicesCardlistdata,
+} from '../../../../Features/OtherServices/OtherServices.js';
 
 function BSOtherServicesVerticalcat(props) {
   const formRef = useRef(null);
@@ -105,7 +108,7 @@ function BSOtherServicesVerticalcat(props) {
   const [add, setAdd] = useState(false);
   const [defaultQuantity, setdefaultQuantity] = useState(1);
   const [isSortClicked, setIsSortClicked] = useState(false);
-  const [otherServiceCategoryData,setOtherServiceCategoryData] = useState([])
+  const [otherServiceCategoryData, setOtherServiceCategoryData] = useState([]);
   const AppId = SessionData?.AppId;
   const CompId = SessionData?.CompId;
   const BranchId = SessionData?.BranchId;
@@ -147,7 +150,7 @@ function BSOtherServicesVerticalcat(props) {
         );
       }
     };
-    OtherServicesCategoryList()
+    OtherServicesCategoryList();
     const container = scrollContainerRef?.current;
     if (container) {
       container.addEventListener('scroll', handleScroll);
@@ -299,7 +302,9 @@ function BSOtherServicesVerticalcat(props) {
   };
 
   const handleClick = async (e, ProdCat, index) => {
-    const selectedOtherServiceCategory = otherServiceCategoryData?.filter(({ServiceCategory}) => ServiceCategory === ProdCat)
+    const selectedOtherServiceCategory = otherServiceCategoryData?.filter(
+      ({ ServiceCategory }) => ServiceCategory === ProdCat
+    );
     let data = false;
     setaccessToCard(false);
     setAccessOther(false);
@@ -416,8 +421,10 @@ function BSOtherServicesVerticalcat(props) {
   };
 
   useEffect(() => {
-    holdnamedrop();
-  }, [AppId, CompId, BranchId]);
+    if (isModalOpen) {
+      holdnamedrop();
+    }
+  }, [isModalOpen]);
 
   const holdnamedrop = async () => {
     let data = {
@@ -614,16 +621,16 @@ function BSOtherServicesVerticalcat(props) {
 
     formRef?.current?.resetFields();
     resetForm();
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      ProdType: 'O',
-    };
-    const respons = await dispatch(othernamedrop(data)).unwrap();
-    if (respons?.data?.statusCode == 1) {
-      setTabledropname(respons?.data?.data);
-    }
+    // let data = {
+    //   CompId: CompId,
+    //   BranchId: BranchId,
+    //   AppId: AppId,
+    //   ProdType: 'O',
+    // };
+    // const respons = await dispatch(othernamedrop(data)).unwrap();
+    // if (respons?.data?.statusCode == 1) {
+    //   setTabledropname(respons?.data?.data);
+    // }
   };
 
   const handleValuesChange = (values) => {
@@ -778,31 +785,32 @@ function BSOtherServicesVerticalcat(props) {
   };
 
   useEffect(() => {
-      if (typeof searchData === 'string' && categoryData?.length > 0) {
-        const searchTerm = searchData?.trim()?.toLowerCase();
-        const foundIndex = categoryData.findIndex(
-          (cat) =>
-            typeof cat.ProdCatName === 'string' &&
-            cat.ProdCatName?.trim()?.toLowerCase() === searchTerm
-        );
-        if (foundIndex !== -1) {
-          setIndexVal(foundIndex);
-        }
-      } else if (categoryData?.length > 0) {
-        setIndexVal(0);
+    if (typeof searchData === 'string' && categoryData?.length > 0) {
+      const searchTerm = searchData?.trim()?.toLowerCase();
+      const foundIndex = categoryData.findIndex(
+        (cat) =>
+          typeof cat.ProdCatName === 'string' &&
+          cat.ProdCatName?.trim()?.toLowerCase() === searchTerm
+      );
+      if (foundIndex !== -1) {
+        setIndexVal(foundIndex);
       }
-
+    } else if (categoryData?.length > 0) {
+      setIndexVal(0);
+    }
   }, [searchData, categoryData]);
 
-    const OtherServicesCategoryList = async () => {
-      let response = await dispatch(OtherServicesCardlistdata({CompId,BranchId,AppId})).unwrap();
-      if (response?.data?.statusCode === 1) {
-        setOtherServiceCategoryData(response?.data?.data?.ServiceCategories);
-      }else{
-        setMessageType("error")
-        setMessageData(response?.data?.response)
-      }
-    };
+  const OtherServicesCategoryList = async () => {
+    let response = await dispatch(
+      OtherServicesCardlistdata({ CompId, BranchId, AppId })
+    ).unwrap();
+    if (response?.data?.statusCode === 1) {
+      setOtherServiceCategoryData(response?.data?.data?.ServiceCategories);
+    } else {
+      setMessageType('error');
+      setMessageData(response?.data?.response);
+    }
+  };
 
   return (
     <div className="CategoryVertical">
@@ -919,7 +927,7 @@ function BSOtherServicesVerticalcat(props) {
                           ),
                           // label:
                           //   option.TaxIdName +
-                          //   " - " +
+                          //   " - " +Name
                           //   option.TaxPercentage +
                           //   " % ",
                         }))}
@@ -951,7 +959,7 @@ function BSOtherServicesVerticalcat(props) {
                               );
                             }
 
-                            return Promise.resolve();
+                            return Promise.Nameresolve();
                           },
                         },
                       ]}
@@ -1099,6 +1107,7 @@ function BSOtherServicesVerticalcat(props) {
 
                             return Promise.resolve();
                           },
+                          Name,
                         },
                       ]}
                     >
@@ -1210,51 +1219,7 @@ function BSOtherServicesVerticalcat(props) {
           pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
         }}
       >
-        {/* {globalAllItemdata?.length > 0 && (
-          <div
-            style={{
-              borderRadius: Radius,
-              backgroundColor:
-                !accessOther && accessToCard
-                  ? lightenColor(SelectedCatgColor?.['BackgroundColor'], 0.4)
-                  : SelectedCatgColor?.['BackgroundColor'],
-              padding: padding,
-              border: accessToCard && '1px solid',
-              borderColor:
-                accessToCard &&
-                !accessOther &&
-                SelectedCatgColor?.['BackgroundColor'] == '#ffffff'
-                  ? '#000000'
-                  : SelectedCatgColor?.['BackgroundColor'] === '#000000'
-                    ? '#ffffff'
-                    : darkenColor(SelectedCatgColor?.['BackgroundColor'], 70),
-            }}
-            // key={}
-            className="sampleCard"
-            index={indexval}
-            onClick={() => handleClick1()}
-          >
-            <div
-              style={{ flexDirection: Reverse1 }}
-              className="CategoryHorizontal-sub-samplecard"
-            >
-              {categoryFunction?.Image && <img src={catLogo} alt="" />}
-              <p
-                style={{
-                  textTransform: Uppercase,
-                  fontWeight: '600',
-                  fontFamily: SelectedFontFamily ? SelectedFontFamily : '',
-                  color: SelectedCatgColor
-                    ? SelectedCatgColor?.['FontColor']
-                    : '',
-                }}
-              >
-                Favourites
-              </p>
-            </div>
-          </div>
-        )} */}
-
+ 
         {(!Isdragging || draggingComponent !== 'category') &&
           otherServiceCategoryData?.map((item, index) => (
             <div
@@ -1281,7 +1246,7 @@ function BSOtherServicesVerticalcat(props) {
 
                 borderColor:
                   index === indexval
-                      ? '#000000'
+                    ? '#000000'
                     : SelectedCatgColor?.['BackgroundColor'],
               }}
               className="sampleCard"
@@ -1418,91 +1383,7 @@ function BSOtherServicesVerticalcat(props) {
           </DragDropContext>
         )}
 
-        {/* {globalAllItemdata?.length === 0 && (
-          <div
-            style={{
-              borderRadius: Radius,
-              backgroundColor:
-                !accessOther && accessToCard
-                  ? lightenColor(SelectedCatgColor?.['BackgroundColor'], 0.4)
-                  : SelectedCatgColor?.['BackgroundColor'],
-              padding: padding,
-              border: accessToCard && '1px solid',
-              borderColor:
-                accessToCard &&
-                !accessOther &&
-                SelectedCatgColor?.['BackgroundColor'] == '#ffffff'
-                  ? '#000000'
-                  : SelectedCatgColor?.['BackgroundColor'] === '#000000'
-                    ? '#ffffff'
-                    : SelectedCatgColor?.['BackgroundColor'],
-            }}
-            // key={}
-            className="sampleCard"
-            index={indexval}
-            onClick={() => handleClick1()}
-          >
-            <div
-              style={{ flexDirection: Reverse1 }}
-              className="CategoryHorizontal-sub-samplecard"
-            >
-              {categoryFunction?.Image && <img src={catLogo} alt="" />}
-              <p
-                style={{
-                  textTransform: Uppercase,
-                  fontWeight: '600',
-                  fontFamily: SelectedFontFamily ? SelectedFontFamily : '',
-                  color: SelectedCatgColor
-                    ? SelectedCatgColor?.['FontColor']
-                    : '',
-                }}
-              >
-                Favourites
-              </p>
-            </div>
-          </div>
-        )} */}
-
-        {/* <div
-          style={{
-            borderRadius: Radius,
-            backgroundColor: accessOther
-              ? lightenColor(SelectedCatgColor?.['BackgroundColor'], 0.4)
-              : SelectedCatgColor?.['BackgroundColor'],
-            padding: padding,
-            border: accessOther && '1px solid',
-            borderColor:
-              accessOther && SelectedCatgColor?.['BackgroundColor'] == '#ffffff'
-                ? '#000000'
-                : SelectedCatgColor?.['BackgroundColor'] === '#000000'
-                  ? '#ffffff'
-                  : SelectedCatgColor?.['BackgroundColor'],
-          }}
-          // key={}
-          className="sampleCard"
-          index={indexval}
-          onClick={() => handleClick2()}
-        >
-          <div
-            style={{ flexDirection: Reverse1 }}
-            className="CategoryHorizontal-sub-samplecard"
-          >
-            {categoryFunction?.Image && <img src={horizontal} alt="" />}
-            <p
-              style={{
-                textTransform: Uppercase,
-                fontWeight: '600',
-                fontFamily: SelectedFontFamily ? SelectedFontFamily : '',
-                color: SelectedCatgColor
-                  ? SelectedCatgColor?.['FontColor']
-                  : '',
-              }}
-            >
-              Others
-            </p>
-          </div>
-        </div> */}
-      </div>
+       </div>
     </div>
   );
 }
diff --git a/src/Pages/BookingScreen/Components/BSCombo/BSC1NavBar.jsx b/src/Pages/BookingScreen/Components/BSCombo/BSC1NavBar.jsx
index 4379a9c..35dd3c0 100644
--- a/src/Pages/BookingScreen/Components/BSCombo/BSC1NavBar.jsx
+++ b/src/Pages/BookingScreen/Components/BSCombo/BSC1NavBar.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { lazy, Suspense, useEffect, useRef, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import { TiLocation } from 'react-icons/ti';
@@ -24,30 +24,31 @@ import BSPrinterSetting from '../UtillComponents/BSPrinterSetting.jsx';
 import { isMobile } from 'react-device-detect';
 import { FaDisplay } from 'react-icons/fa6';
 import {
-  FeatureAddon,
   GlobalFeatAddOnData,
   PreferenceData,
 } from '../../../../Features/BookingScreen/BookingData/BookingData.js';
-import {
-  setCustomerDisplayWindow,
-  closeCustomerDisplayWindow,
-} from '../../../../Features/customerDisplayWindow/customerDisplayWindow';
+import { setCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow';
 import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
-import {
-  getUserProfile,
-  userDataByUserId,
-} from '../../../../Features/UserAccount/userData.js';
-import UserRelieveManager from '../../Template/RealivingUser.jsx';
-import BSNavBarUserInfo from '../BSNavbar/BSNavBarUserInfo.jsx';
-import BSScanTemplate from '../UtillComponents/BSScanTemplate.jsx';
+import { userDataByUserId } from '../../../../Features/UserAccount/userData.js';
 import { RiFullscreenExitFill, RiFullscreenFill } from 'react-icons/ri';
 import { Popconfirm, Tooltip } from 'antd';
 import { FaCaretDown } from 'react-icons/fa';
+const UserRelieveManager = lazy(
+  () => import('../../Template/RealivingUser.jsx')
+);
 
+const BSNavBarUserInfo = lazy(() => import('../BSNavbar/BSNavBarUserInfo.jsx'));
+
+const BSScanTemplate = lazy(
+  () => import('../UtillComponents/BSScanTemplate.jsx')
+);
+
+const BSPrinterSetting = lazy(
+  () => import('../UtillComponents/BSPrinterSetting.jsx')
+);
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const commonUrl = import.meta.env.ENV_COMMON_BASE_URL;
 const BSC1NavBar = (props) => {
-  const BSComboData = props?.hasOwnProperty('data') ? props['data'] : null;
   const divRef = useRef(null);
 
   const navigate = useNavigate();
@@ -109,16 +110,7 @@ const BSC1NavBar = (props) => {
       ).unwrap();
     }
   };
-  // const getFeatureAddonData = async () => {
-  //   let featureAddon = await dispatch(
-  //     FeatureAddon({ AppId: AppId, UserId: UserId })
-  //   ).unwrap();
-  //   if (featureAddon?.data?.statusCode === 1) {
-  //     setFeatureAddonData(featureAddon?.data?.data?.[0]?.FeatAddonHdr?.[0]);
-  //   } else {
-  //     setFeatureAddonData([]);
-  //   }
-  // };
+
   const UserAcc = () => {
     setAccIsOpen(!isAccOpen);
   };
@@ -197,25 +189,6 @@ const BSC1NavBar = (props) => {
       console.error('Customer display window failed to open.');
     }
   };
-  // const openNewTab = async () => {
-
-  //     const initialData = {
-  //         Paymentgateway: false,
-  //     };
-
-  //     const customerDisplayWindow = window.open(`${subDirectory}customer-display`, 'CustomerDisplayWindow', 'width=2000,height=5000,scrollbars=yes,resizable=yes');
-  //     if (customerDisplayWindow && !customerDisplayWindow.closed) {
-  //         setCustomerDisplayWindow(customerDisplayWindow);
-
-  //         customerDisplayWindow.onload = () => {
-  //             setTimeout(() => {
-  //                 customerDisplayWindow.postMessage(initialData, '*'); // Or use targetOrigin for CORS
-  //             }, 500); // Slight delay to ensure window is ready
-  //         };
-  //     } else {
-  //         console.error("Customer display window failed to open.");
-  //     }
-  // };
   const handleEditProfile = async () => {
     navigate(`${subDirectory}app-page/redirect-userprofile`);
   };
@@ -240,161 +213,167 @@ const BSC1NavBar = (props) => {
   };
 
   return (
-    <>
-      <div
-        className="BSC1NavBar-Container"
-        style={{
-          // backgroundColor:
-          //   BSComboData?.BookingLayout?.[0] === 'Combo1'
-          //     ? '#645CAA'
-          //     : '#08A7B8',
-          background: 'linear-gradient(to bottom right, #1e2536, #2a3447)',
-        }}
-      >
-        <div className="BSC1NavBar-div1">
-          <div className="BSC1NavBar-manu">
-            <Popconfirm
-              title="Are you sure you want to go to home?"
-              onConfirm={handleHome}
-              okText="Yes"
-              cancelText="No"
-            >
-              <PozoHomeIcon
-                style={{ color: '#1292EE', fontSize: '30px' }}
-                className="BSC1NavBar-manu-icon"
-              />
-            </Popconfirm>{' '}
-            <div
-              className={`BSC1NavBar-manu-content ${menu ? 'BSC1NavBar-manu-menu' : ''}`}
-            >
-              <div className="BSC1NavBar-manu-div">
-                <TooltipWrapper
-                  placement="right"
-                  title="DashBoard"
-                  isMobile={isMobile}
-                >
-                  <BiSolidDashboard className="BSC1Nav-menu-icon" />
-                </TooltipWrapper>
-
-                <TooltipWrapper
-                  placement="right"
-                  title="Booking / Sale"
-                  isMobile={isMobile}
-                >
-                  <CgMenuGridR className="BSC1Nav-menu-icon" />
-                </TooltipWrapper>
-
-                <TooltipWrapper
-                  placement="right"
-                  title="TableBooking"
-                  isMobile={isMobile}
-                >
-                  <MdTableChart className="BSC1Nav-menu-icon" />
-                </TooltipWrapper>
-
-                <TooltipWrapper
-                  placement="right"
-                  title="Report"
-                  isMobile={isMobile}
-                >
-                  <BiSolidReport className="BSC1Nav-menu-icon" />
-                </TooltipWrapper>
-              </div>
-            </div>
-          </div>
-
-          <div className="BSC1NavBar-name">
-            {/* <PiStorefrontFill className="BSC1NavBar-name-icon" /> */}
-            <TooltipWrapper placement="bottom" title={branchName}>
-              <span className="BSC1NavBar-ellipsisname">{branchName}</span>{' '}
-            </TooltipWrapper>
-            {BranchCity && (
-              <span className="BSC1NavBar-location">
-                {' '}
-                <TiLocation className="BSC1NavBar-location-icon" />
-                <span className="BSC1NavBar-name-ellipsis">
-                  {BranchCity}
-                </span>{' '}
-              </span>
-            )}
-          </div>
-
-          <div className="BSC1NavBar-name">
-            {ScanLayoutScreen?.SettingValue === 'Y' && (
-              <span className="BSC1NavBarlocation">
-                <BSScanTemplate />
-              </span>
-            )}
-          </div>
-
-          <div></div>
-        </div>
-        <div className="BSC1NavBar-div2">
-          <div className="BSC1NavBar-date">
-            {/* {formattedDate} */}
-            <TimeDisplay />
-
-            <DateDisplay />
-          </div>
-
-          <Tooltip title={isFullscreen ? 'Exit Full Screen' : 'Full Screen'}>
-            <div
-              className={
-                isFullscreen ? 'BsNavbar1FullScreenExit' : 'BsNavbar1FullScreen'
-              }
-              onClick={handleFullscreen}
-            >
-              {isFullscreen ? <RiFullscreenExitFill /> : <RiFullscreenFill />}
-            </div>
-          </Tooltip>
-
-          {FeatureAddonData?.FeatureDtls?.find(
-            (item) =>
-              item?.FeatureAddonName?.toLowerCase() === 'customer display'
-          ) && (
-            <TooltipWrapper title="Customer Display" isMobile={isMobile}>
-              <div
-                onClick={openNewTab}
-                style={{
-                  display: 'flex',
-                  alignItems: 'center',
-                  cursor: 'pointer',
-                }}
+    <Suspense fallback={<div>Loading...</div>}>
+      <>
+        <div
+          className="BSC1NavBar-Container"
+          style={{
+            // backgroundColor:
+            //   BSComboData?.BookingLayout?.[0] === 'Combo1'
+            //     ? '#645CAA'
+            //     : '#08A7B8',
+            background: 'linear-gradient(to bottom right, #1e2536, #2a3447)',
+          }}
+        >
+          <div className="BSC1NavBar-div1">
+            <div className="BSC1NavBar-manu">
+              <Popconfirm
+                title="Are you sure you want to go to home?"
+                onConfirm={handleHome}
+                okText="Yes"
+                cancelText="No"
               >
-                <FaDisplay color="#1292ee" size={18} />
-              </div>
-            </TooltipWrapper>
-          )}
+                <PozoHomeIcon
+                  style={{ color: '#1292EE', fontSize: '30px' }}
+                  className="BSC1NavBar-manu-icon"
+                />
+              </Popconfirm>{' '}
+              <div
+                className={`BSC1NavBar-manu-content ${menu ? 'BSC1NavBar-manu-menu' : ''}`}
+              >
+                <div className="BSC1NavBar-manu-div">
+                  <TooltipWrapper
+                    placement="right"
+                    title="DashBoard"
+                    isMobile={isMobile}
+                  >
+                    <BiSolidDashboard className="BSC1Nav-menu-icon" />
+                  </TooltipWrapper>
 
-          {!isMobile && (
-            <div className="comboPrinterIcon">
-              <BSPrinterSetting />
+                  <TooltipWrapper
+                    placement="right"
+                    title="Booking / Sale"
+                    isMobile={isMobile}
+                  >
+                    <CgMenuGridR className="BSC1Nav-menu-icon" />
+                  </TooltipWrapper>
+
+                  <TooltipWrapper
+                    placement="right"
+                    title="TableBooking"
+                    isMobile={isMobile}
+                  >
+                    <MdTableChart className="BSC1Nav-menu-icon" />
+                  </TooltipWrapper>
+
+                  <TooltipWrapper
+                    placement="right"
+                    title="Report"
+                    isMobile={isMobile}
+                  >
+                    <BiSolidReport className="BSC1Nav-menu-icon" />
+                  </TooltipWrapper>
+                </div>
+              </div>
             </div>
-          )}
 
-          <div className="BSC1NavBar-person" onClick={UserAcc}>
-            <TooltipWrapper title="Account " isMobile={isMobile}>
-              <div className="myProfileIconDrDown">
-                <BsFillPersonFill className="BSC1NavBar-person-icon" />
-                <FaCaretDown />
-              </div>
-            </TooltipWrapper>
+            <div className="BSC1NavBar-name">
+              {/* <PiStorefrontFill className="BSC1NavBar-name-icon" /> */}
+              <TooltipWrapper placement="bottom" title={branchName}>
+                <span className="BSC1NavBar-ellipsisname">
+                  {branchName}
+                </span>{' '}
+              </TooltipWrapper>
+              {BranchCity && (
+                <span className="BSC1NavBar-location">
+                  {' '}
+                  <TiLocation className="BSC1NavBar-location-icon" />
+                  <span className="BSC1NavBar-name-ellipsis">
+                    {BranchCity}
+                  </span>{' '}
+                </span>
+              )}
+            </div>
+
+            <div className="BSC1NavBar-name">
+              {ScanLayoutScreen?.SettingValue === 'Y' && (
+                <span className="BSC1NavBarlocation">
+                  <BSScanTemplate />
+                </span>
+              )}
+            </div>
+
+            <div></div>
+          </div>
+          <div className="BSC1NavBar-div2">
+            <div className="BSC1NavBar-date">
+              {/* {formattedDate} */}
+              <TimeDisplay />
+
+              <DateDisplay />
+            </div>
+
+            <Tooltip title={isFullscreen ? 'Exit Full Screen' : 'Full Screen'}>
+              <div
+                className={
+                  isFullscreen
+                    ? 'BsNavbar1FullScreenExit'
+                    : 'BsNavbar1FullScreen'
+                }
+                onClick={handleFullscreen}
+              >
+                {isFullscreen ? <RiFullscreenExitFill /> : <RiFullscreenFill />}
+              </div>
+            </Tooltip>
+
+            {FeatureAddonData?.FeatureDtls?.find(
+              (item) =>
+                item?.FeatureAddonName?.toLowerCase() === 'customer display'
+            ) && (
+              <TooltipWrapper title="Customer Display" isMobile={isMobile}>
+                <div
+                  onClick={openNewTab}
+                  style={{
+                    display: 'flex',
+                    alignItems: 'center',
+                    cursor: 'pointer',
+                  }}
+                >
+                  <FaDisplay color="#1292ee" size={18} />
+                </div>
+              </TooltipWrapper>
+            )}
+
+            {!isMobile && (
+              <div className="comboPrinterIcon">
+                <BSPrinterSetting />
+              </div>
+            )}
+
+            <div className="BSC1NavBar-person" onClick={UserAcc}>
+              <TooltipWrapper title="Account " isMobile={isMobile}>
+                <div className="myProfileIconDrDown">
+                  <BsFillPersonFill className="BSC1NavBar-person-icon" />
+                  <FaCaretDown />
+                </div>
+              </TooltipWrapper>
+            </div>
+            {isAccOpen && (
+              <BSNavBarUserInfo
+                isOpen={isAccOpen}
+                divRef={divRef}
+                CompBranchData={CompBranchData}
+                BacktoLogin={BacktoLogin}
+                userProfileData={userProfileData}
+                handleEditProfile={handleEditProfile}
+                UserRelieveManager={<UserRelieveManager />}
+                Logout={Logout}
+              />
+            )}
           </div>
-          {isAccOpen && (
-            <BSNavBarUserInfo
-              isOpen={isAccOpen}
-              divRef={divRef}
-              CompBranchData={CompBranchData}
-              BacktoLogin={BacktoLogin}
-              userProfileData={userProfileData}
-              handleEditProfile={handleEditProfile}
-              UserRelieveManager={<UserRelieveManager />}
-              Logout={Logout}
-            />
-          )}
         </div>
-      </div>
-    </>
+      </>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSCombo/BSC1Payment.jsx b/src/Pages/BookingScreen/Components/BSCombo/BSC1Payment.jsx
index 477d529..d4b72fe 100644
--- a/src/Pages/BookingScreen/Components/BSCombo/BSC1Payment.jsx
+++ b/src/Pages/BookingScreen/Components/BSCombo/BSC1Payment.jsx
@@ -1,33 +1,34 @@
-import React, { useEffect, useState, useRef } from 'react';
+import React, { useEffect, useState, useRef, lazy, Suspense } from 'react';
 import { FaWhatsapp, FaPrint, FaParking } from 'react-icons/fa';
 import { useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import moment from 'moment';
 import { Badge, Popover, Modal, Tooltip } from 'antd';
 import { AiOutlineClose, AiOutlineArrowRight } from 'react-icons/ai';
-import { GiBasket } from 'react-icons/gi';
-import {
-  UpCircleOutlined,
-  UpOutlined,
-  TransactionOutlined,
-} from '@ant-design/icons';
+import { UpCircleOutlined } from '@ant-design/icons';
 import {
   printDiv,
   extractLastNumberOrderId,
   encryptObject,
 } from '../../../../Services/Others';
-import PaymentPdfBooking from '../../../paymentpdfPage/PaymentPdfBooking';
+const PaymentPdfBooking = lazy(
+  () => import('../../../paymentpdfPage/PaymentPdfBooking')
+);
 import { Messages } from '../../../../Components/Notifications/Messages';
-import { MdMoneyOff } from 'react-icons/md';
 import paygate from '../../../../Images/paygate.png';
 import defaultupi from '../../../../Images/defaultupi.png';
 import paydevice from '../../../../Images/paydevice.png';
-import paymentFailure from '../../../../Images/payment-failure2.png';
-import BSSummery1 from '../BSBillingTables/BSBillingTableSummery/BSSummery';
 import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
 import { Tables } from '../../../../Components/Tables/Table';
-import QrComponent from '../BookingFunctionality/DynamicQr.jsx';
-import QrinScreen from '../BookingFunctionality/DynamicScreenQr.jsx';
+const BSSummery1 = lazy(
+  () => import('../BSBillingTables/BSBillingTableSummery/BSSummery')
+);
+
+const QrComponent = lazy(() => import('../BookingFunctionality/DynamicQr.jsx'));
+
+const QrinScreen = lazy(
+  () => import('../BookingFunctionality/DynamicScreenQr.jsx')
+);
 import { ArrowRightOutlined } from '@ant-design/icons';
 import Buttons from '../../../../Components/Forms/Buttons';
 import WpIcon from '../../../../Images/message.png';
@@ -51,7 +52,6 @@ import {
   GlobalReprintModal,
   changeSelectedTableDetails,
   GlobalNavHoldData,
-  getPreferenceData,
   changeSelectedCustId,
   GlobalSelCustId,
   changeSelectedOption,
@@ -64,8 +64,6 @@ import {
   changeCreditFocus,
   changeUpiIDprint,
   GlobalSelectedCustDisable,
-  changeSummeryTotalItems,
-  changeSummeryQty,
   changeSummeryTotalWithoutTaxAmount,
   changeSummeryTotalTaxAmount,
   GlobalEstimateBooking,
@@ -80,16 +78,13 @@ import {
   changeSelectChair,
   GlobalOrderType,
   changeReorderProductDetails,
-  FeatureAddon,
   GlobalCommonPaymentOptions,
   PostPaymentdevice,
   changeUpiIDName,
   changeUpiIDoptionId,
   GetPaymentdeviceResponse,
   PutBookingPaymentStatusChange,
-  changeCombosearch,
   GlobalCombosearch,
-  Comboget,
   GlobalPayementloader,
   changePaymentloader,
   PaymentGatewayGetdetail,
@@ -108,7 +103,6 @@ import {
   ChangeOverAllDiscEstimate,
   GlobalUnpaidListData,
   changeUnpaidData,
-  getAllCustomer,
   GlobalBranchFinancialStatus,
   changeSummeryComboOfferAmount,
   changeTipAmount,
@@ -116,7 +110,6 @@ import {
   GlobalFeatAddOnData,
   GlobalOtherServiceTicketClaim,
   changeOtherServiceTicketClaim,
-  GlobalOtherSevices,
   changeOtherServices,
   changeComboRedirectionToDefaultLayoutForParking,
   GlobalRetailWSSalesType,
@@ -149,7 +142,7 @@ import {
   GlobalprintDatas,
   GlobalPrinterMappingDtls,
   getPrinterMappingDetails,
-  getPrintSelectionComponentData,
+  // getPrintSelectionComponentData,
 } from '../../../../Features/ThemeChange/ThemeChange';
 import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities';
 import {
@@ -163,7 +156,6 @@ import {
   ReprintDetails,
   triggerCustomerRefresh,
 } from '../../../../Features/BookingScreen/Customer/addCustomer';
-import BSCustomerSelect from '../UtillComponents/BSSelectCustomer.jsx';
 import PozoHoldIcon from '../UtillComponents/Pozo retail icons/PozoHoldIcon';
 import PozoDineInIcon from '../UtillComponents/Pozo retail icons/PozoDineIn.jsx';
 import PozoUnpaidIcon from '../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
@@ -173,16 +165,32 @@ import PozoQuickAddIcon from '../UtillComponents/Pozo retail icons/PozoQuickAddI
 import PozoReprintIcon from '../UtillComponents/Pozo retail icons/PozoReprintIcon';
 import PozoExtraChargesIcon from '../UtillComponents/Pozo retail icons/PozoExtraChargesIcon.jsx';
 import PozoAddCustomerIcon from '../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
-import BsBillingCreditCustomer from '../BookingFunctionality/BSBillingCreditCustomer.jsx';
+const BSCustomerSelect = lazy(
+  () => import('../UtillComponents/BSSelectCustomer.jsx')
+);
+
+const BsBillingCreditCustomer = lazy(
+  () => import('../BookingFunctionality/BSBillingCreditCustomer.jsx')
+);
 import { TfiMoreAlt } from 'react-icons/tfi';
-import BSCreditCustomer from '../UtillComponents/BSCreditCustomer.jsx';
+const BSCreditCustomer = lazy(
+  () => import('../UtillComponents/BSCreditCustomer.jsx')
+);
 import PozoAdvanceIcon from '../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
 import { isMobile } from 'react-device-detect';
 import MobilePrint from '../BookingFunctionality/MobilePrint.jsx';
-import SplitPayment from '../BookingFunctionality/SplitPayment.jsx';
-import BSNavBarEstimate from '../UtillComponents/BSNavBarEst.jsx';
 import CountUp from 'react-countup';
-import BSNavBarPreOrder from '../UtillComponents/BSComboNavBarPreOrder.jsx';
+const SplitPayment = lazy(
+  () => import('../BookingFunctionality/SplitPayment.jsx')
+);
+
+const BSNavBarEstimate = lazy(
+  () => import('../UtillComponents/BSNavBarEst.jsx')
+);
+
+const BSNavBarPreOrder = lazy(
+  () => import('../UtillComponents/BSComboNavBarPreOrder.jsx')
+);
 import { GlobalpreOrderOpen } from '../../../../Features/BookingScreen/PreOrder/PreOrder.js';
 import TokensinglePrint from '../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx';
 import SingleTokenMobilePrint from '../BookingFunctionality/SingleTokenMobilePrint.jsx';
@@ -207,38 +215,48 @@ import {
   changePreOrderDistrict,
   changePreOrderState,
 } from '../../../../Features/BookingScreen/PreOrder/PreOrder.js';
-import PaymentFailedSales from '../../../Payment/PaymentFailedDetails/PaymentFailedSales.jsx';
+const PaymentFailedSales = lazy(
+  () => import('../../../Payment/PaymentFailedDetails/PaymentFailedSales.jsx')
+);
 import PozoSplitPaymentIcon from '../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
 import PozoFailedPaymentsIcon from '../UtillComponents/Pozo retail icons/PozoFailedPaymentsIcon.jsx';
 import {
-  Global_CoupenCodeAmount,
-  Global_loyaltyPointsDiscountAmount,
   Global_OrderOfferDetail,
   Global_OverallOfferAmount,
-  Global_SalesWiseOfferAmount,
 } from '../../../../Features/Offer/Offer.js';
 import { useApplyOfferto_CardDetail } from '../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
-import BSNavBarOffer from '../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx';
 import { getEmpAccess } from '../../../../Features/AppPage/CenterPage.js';
 import { useAuth } from '../../../../AuthContext.jsx';
 import { GlobalBookingStatus } from '../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail.js';
-import WhatsAppShare from '../../../WhatsAppShare/whatsAppShare.jsx';
-import CryptoJS from 'crypto-js';
-import SMSShare from '../../../WhatsAppShare/SmsShare.jsx';
+const BSNavBarOffer = lazy(
+  () => import('../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx')
+);
+
+const WhatsAppShare = lazy(
+  () => import('../../../WhatsAppShare/whatsAppShare.jsx')
+);
+
+const SMSShare = lazy(() => import('../../../WhatsAppShare/SmsShare.jsx'));
 import { MdSms } from 'react-icons/md';
 import {
   changeSalesPaymentoption,
   GlobalSalesPaymentoption,
 } from '../../../../Features/Payment/Paymentoptions/Paymentoptions.js';
-import Paymentoption from '../../../Payment/PaymentOptions/PaymentOptions.jsx';
-import BSTipAmount from '../UtillComponents/BSTipAmount.jsx';
 import { ApplicationPreferences } from '../../../../Features/BrachLogin/BranchLogin.js';
-import BSOtherServiceClaim from '../UtillComponents/BSOtherServiceClaim.jsx';
+const Paymentoption = lazy(
+  () => import('../../../Payment/PaymentOptions/PaymentOptions.jsx')
+);
+
+const BSTipAmount = lazy(() => import('../UtillComponents/BSTipAmount.jsx'));
+
+const BSOtherServiceClaim = lazy(
+  () => import('../UtillComponents/BSOtherServiceClaim.jsx')
+);
+
+const BSMembership = lazy(() => import('../UtillComponents/BSMembership.jsx'));
 import { OtherServicesCardlistdata } from '../../../../Features/OtherServices/OtherServices.js';
-import { MobilePdfPrint } from '../BookingFunctionality/MobilePdfPrint.js';
 import { PublicQrCodepost } from '../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
-import BSMembership from '../UtillComponents/BSMembership.jsx';
 import CardPopover from '../BSBillingTables/StandardTable/Utils/CardPopover.jsx';
 import UpiPopover from '../BSBillingTables/StandardTable/Utils/UpiPopOver.jsx';
 import { useDateStore } from '../../../../Features/BookingScreen/BookingData/DateStore.js';
@@ -248,13 +266,12 @@ import {
   GlobalOfferAppliedProducts,
   GlobalOverAllOfferAmt,
 } from '../../../../Features/Offer/Offernew/BookingOffernew.js';
-import BSNavBarTable from '../UtillComponents/BSNavBarTable.jsx';
 import pozologoimg from '../../../../Images/pozologoimg.png';
-import PaymentGatewayEmbedded from '../UtillComponents/PaymentGatewayEmbedded.jsx';
-
+const PaymentGatewayEmbedded = lazy(
+  () => import('../UtillComponents/PaymentGatewayEmbedded.jsx')
+);
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
-const RetailApiurl = import.meta.env.ENV_API_URL;
 
 const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
 
@@ -275,7 +292,7 @@ const BSC1Payment = (props) => {
   );
   const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
   const SessionData = useSelector(StoredSessionData);
-  const BranchFinancialStatus = useSelector(GlobalBranchFinancialStatus);
+
   const globalTipAmount = useSelector(GlobaltipAmount);
   const OtherServiceTicketClaim = useSelector(GlobalOtherServiceTicketClaim);
   const RetailWSSalesType = useSelector(GlobalRetailWSSalesType);
@@ -285,8 +302,7 @@ const BSC1Payment = (props) => {
   const CompId = SessionData?.CompId;
   const UserId = SessionData?.UserId;
   const UserType = SessionData?.UserType;
-  const AuthToken = SessionData?.AuthToken;
-  const SessionMobileNo = SessionData?.SessionMobileNo;
+
   const [open, setOpen] = useState(false);
   const printerTemplateStyle = useSelector(SelectedPrintTemplate);
   const SelectedTableDetails = useSelector(GlobalSelectedTableDetails);
@@ -327,9 +343,7 @@ const BSC1Payment = (props) => {
   const GlobEstBooking = useSelector(GlobalEstimateBooking);
   const GlobProdwisedata = useSelector(GlobalSelProdWiseEst);
   const preOrder = useSelector(GlobalpreOrderOpen);
-  const Comboglobal = useSelector(GlobalCombosearch);
   const FailedTotalAmt = useSelector(GlobalFailedTotalAmt);
-  const OrderOfferDetail = useSelector(Global_OrderOfferDetail);
   const [SelectedUpiOption, setSelectedUpiOption] = useState();
   const [credit, setCredit] = useState(false);
   const [overAllBal, setOverAllBal] = useState(0);
@@ -359,11 +373,7 @@ const BSC1Payment = (props) => {
       preference?.PreferredSubCatName === 'SportsApp' &&
       preference?.PreferredStatus == 'Y'
   );
-  console.log(
-    sportsAppPreference,
-    commonModulePreference,
-    'sportsAppPreference'
-  );
+
   const bookingTypePreference = appPreferences?.find(
     (preference) => preference?.PreferredCatName === 'Booking Type'
   )?.PreferenceCatDetails;
@@ -620,8 +630,10 @@ const BSC1Payment = (props) => {
         setDefaultPaymentMode([]);
       }
     };
-    setDefaultPaymentOption();
-  }, [defaultPaymentTrigger]);
+    if (salesBillEdit) {
+      setDefaultPaymentOption();
+    }
+  }, [defaultPaymentTrigger, salesBillEdit]);
 
   useEffect(() => {
     const getPrintData = async () => {
@@ -846,11 +858,6 @@ const BSC1Payment = (props) => {
       );
 
       dispatch(changeSummeryComboOfferAmount(withComboSum));
-
-      // if (withdiscTotal <= 0) {
-      //   dispatch(ChangeOverAllDiscSales(0));
-      //   dispatch(ChangeOverAllDiscEstimate(0));
-      // }
     } else {
       setTotalAmount(0);
       dispatch(changeSummeryTotalAmount(0));
@@ -873,8 +880,8 @@ const BSC1Payment = (props) => {
       UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
+    // const Data1 = { AppId, CompId, BranchId };
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
     handleOtherData();
   }, []);
   useEffect(() => {
@@ -960,28 +967,6 @@ const BSC1Payment = (props) => {
   const paymentFailedStatusFun = async () => {
     SetOpenFailData(!OpenFailData);
   };
-  // useEffect(() => {
-  //   const handleKeyPress = (event) => {
-  //     if (event.shiftKey && event.code === 'KeyM') {
-  //       if (
-  //         document.activeElement.tagName !== 'INPUT' &&
-  //         document.activeElement.tagName !== 'TEXTAREA'
-  //       ) {
-  //         event.preventDefault();
-  //         setBlink(true);
-  //       }
-  //     }
-  //   };
-  //   const handleClickOutside = (event) => {
-  //     setBlink(false);
-  //   };
-  //   window.addEventListener('keydown', handleKeyPress);
-  //   window.addEventListener('mousedown', handleClickOutside);
-  //   return () => {
-  //     window.removeEventListener('keydown', handleKeyPress);
-  //     window.addEventListener('mousedown', handleClickOutside);
-  //   };
-  // }, []);
 
   const handleOtherData = async () => {
     let data = {
@@ -1011,7 +996,7 @@ const BSC1Payment = (props) => {
   useEffect(() => {
     if (CompId && BranchId && AppId) {
       getHolddata();
-      getUnpaiddatas();
+      // getUnpaiddatas();
       getCustomerData();
     }
   }, [CompId, BranchId, AppId]);
@@ -1134,21 +1119,6 @@ const BSC1Payment = (props) => {
     setPaybtnnameselected(PaymentOptionsModeName);
     setPaybtnselected(PaymentOptionsModeId);
   }, [PaymentOptions]);
-  // useEffect(() => {
-  //   if (
-  //     PrintOrderDetails?.length > 0 &&
-  //     (!filteredSettingNames ||
-  //       filteredSettingNames?.includes('Print') ||
-  //       filteredSettingNames?.length === 0) &&
-  //     ((!filteredSettingNames?.includes('whatsapp') &&
-  //       (!isMobile || !filteredSettingNames?.includes('SMS'))) ||
-  //       ((filteredSettingNames?.includes('whatsapp') ||
-  //         (isMobile && filteredSettingNames?.includes('SMS'))) &&
-  //         (!MobileNoWhatsApp || Object.keys(MobileNoWhatsApp).length === 0)))
-  //   ) {
-  //     handlePrintOrToken();
-  //   }
-  // }, [PrintOrderDetails]);
 
   useEffect(() => {
     if (!PrintOrderDetails?.length) return;
@@ -1342,9 +1312,6 @@ const BSC1Payment = (props) => {
     setEmpData(datas?.[0]);
   };
   const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
     await dispatch(
       getAddCustomerDetails({
         CompId: CompId,
@@ -2944,8 +2911,6 @@ const BSC1Payment = (props) => {
           }
 
           console.error('Transaction not approved within 1 minute.');
-          // Send an error message or handle the timeout
-          // You can dispatch an action, show a notification, etc.
           break;
         }
 
@@ -3029,20 +2994,6 @@ const BSC1Payment = (props) => {
                 clearInterval(intervalId); // Stop the loop when payment fails
                 CustomerDisplayRemovedData();
                 ClearAllGlobalStateDatas(value);
-                // const customerDisplayWindow = getCustomerDisplayWindow();
-                //             if (customerDisplayWindow && !customerDisplayWindow.closed) {
-                //                 const updatedData = {
-                //                     userData: OrderCardDetail,
-                //                     ExtraCharges: GlobalExtraCharge,
-                //                     upi: GlobalUpiID,
-                //                     customer: selOption != null ? selOption : GetCustId,
-                //                     paymentMethod: Paybtnnameselected,
-                //                     Paymentgateway: false,
-                //                     OrderTotalAmount:PaymentGatewayfilter?.[0]?.Amount
-
-                //                 };
-                //                 customerDisplayWindow.postMessage(updatedData, '*');
-                //             }
               }
             }
           } catch (error) {
@@ -3212,13 +3163,6 @@ const BSC1Payment = (props) => {
       } else {
         dispatch(changeOrderCardDetails([]));
       }
-      // await dispatch(changeOrderCardDetails([]))
-      // await dispatch(changeOrderCardDetails(tabledata?.[event]?.productDetails))
-      // await dispatch(ChangeTotalAmount(tabledata?.[event]?.ExtraChargeDetails))
-      // await dispatch(changeUnpaidData(true))
-      // await dispatch(changeReorderHoldDetails([tabledata?.[event]]?.[0]));
-      // await dispatch(changeReorderProductDetails(tabledata?.[event]?.productDetails))
-      // setUnpaidOpen(false)
       setUnpaidConfirmation(true);
       setunpaidselectedindex(event);
     } else {
@@ -3435,28 +3379,6 @@ const BSC1Payment = (props) => {
       );
     }
   };
-  // const handleClick = async () => {
-  //   if (Comboglobal == false) {
-  //     await dispatch(changeCombosearch(true));
-  //   } else {
-  //     await dispatch(changeCombosearch(false));
-  //   }
-  // };
-
-  // const Combodata = async () => {
-  //   let data = {
-  //     AppId: AppId,
-  //     CompId: CompId,
-  //     BranchId: BranchId,
-  //      ActiveStatus: 'A',
-  //   };
-
-  //   let Response = await dispatch(Comboget(data)).unwrap();
-  //   if (Response?.data?.statusCode == 1) {
-  //     setComboDropDown(Response?.data?.data);
-  //   }
-  // };
-
   const openPreOrder = async () => {
     setPreOrderOpen((prevState) => !prevState);
     if (preOrderOpen) {
@@ -3555,631 +3477,642 @@ const BSC1Payment = (props) => {
   };
 
   return (
-    <>
-      <div
-        className="BSC1Payment-Container"
-        style={{
-          // backgroundColor:
-          //   BSComboData?.BookingLayout?.[0] === 'Combo1'
-          //     ? '#645CAA'
-          //     : '#08A7B8',
-          background: 'linear-gradient(to bottom right, #1e2536, #2a3447)',
-        }}
-      >
-        <Messages messageType={messageType} messageData={messageData} />
-        <div className="BSC1Payment-div1-1">
-          <div className="BSC1Payment-div1-sub1">
-            {BSComboNavbar?.[1]?.map((item) => (
-              <>
-                {item?.OptionName == 'QuickAdd' && (
-                  <Tooltip
-                    placement="top"
-                    trigger={[]}
-                    title="ALT + N"
-                    open={isAltPressed}
-                  >
-                    <TooltipWrapper title={'QuickAdd'} isMobile={isMobile}>
+    <Suspense fallback={<div>Loading...</div>}>
+      <>
+        <div
+          className="BSC1Payment-Container"
+          style={{
+            // backgroundColor:
+            //   BSComboData?.BookingLayout?.[0] === 'Combo1'
+            //     ? '#645CAA'
+            //     : '#08A7B8',
+            background: 'linear-gradient(to bottom right, #1e2536, #2a3447)',
+          }}
+        >
+          <Messages messageType={messageType} messageData={messageData} />
+          <div className="BSC1Payment-div1-1">
+            <div className="BSC1Payment-div1-sub1">
+              {BSComboNavbar?.[1]?.map((item) => (
+                <>
+                  {item?.OptionName == 'QuickAdd' && (
+                    <Tooltip
+                      placement="top"
+                      trigger={[]}
+                      title="ALT + N"
+                      open={isAltPressed}
+                    >
+                      <TooltipWrapper title={'QuickAdd'} isMobile={isMobile}>
+                        <div
+                          className="BSC1Payment-div1-btns"
+                          onClick={setQuickOpen}
+                          style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
+                          }}
+                        >
+                          <PozoQuickAddIcon className="BSC1Payment-icon " />
+                          <div
+                            style={{
+                              display: 'flex',
+                              flexDirection: 'column',
+                              alignItems: 'center',
+                              justifyContent: 'center',
+                            }}
+                          >
+                            Quick Add
+                            {!isAltPressed && (
+                              <span
+                                style={{
+                                  fontSize: '9px',
+                                  letterSpacing: '0.5px',
+                                }}
+                              >
+                                (Alt + N)
+                              </span>
+                            )}
+                          </div>
+                        </div>
+                      </TooltipWrapper>
+                    </Tooltip>
+                  )}
+                  {item?.OptionName == 'DineIn' &&
+                    DineInPreference?.SettingValue === 'Y' &&
+                    dinePreference && (
+                      <TooltipWrapper title={'Dine In'} isMobile={isMobile}>
+                        <div
+                          className={
+                            BookingType === 'Dine In'
+                              ? 'BSC1Payment-div1-btns-select'
+                              : 'BSC1Payment-div1-btns'
+                          }
+                          onClick={navigateDineIn}
+                          style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
+                          }}
+                        >
+                          <PozoDineInIcon className="BSC1Payment-icon" />
+                          DINE IN
+                        </div>
+                      </TooltipWrapper>
+                    )}
+                  {item?.OptionName == 'TakeAway' && takeAwayPreference && (
+                    <TooltipWrapper title={'TakeAway'} isMobile={isMobile}>
                       <div
-                        className="BSC1Payment-div1-btns"
-                        onClick={setQuickOpen}
+                        className={
+                          BookingType === 'TakeAway'
+                            ? 'BSC1Payment-div1-btns-select'
+                            : 'BSC1Payment-div1-btns'
+                        }
+                        onClick={() =>
+                          BookingType !== 'TakeAway' && ChangeTakeAway()
+                        }
                         style={{
                           pointerEvents:
                             OrderType === 'Failed' ? 'none' : 'auto',
                         }}
                       >
-                        <PozoQuickAddIcon className="BSC1Payment-icon " />
+                        <PozoTakeAway
+                          className="BSC1Payment-icon"
+                          style={{ width: '23px', height: '30px' }}
+                        />
+                        {/* TAKE AWAY */}
+                        Take Away
+                      </div>
+                    </TooltipWrapper>
+                  )}
+                </>
+              ))}
+
+              {OtherServiceStatus && (
+                <div
+                  className="BSC1Payment-div1-btns"
+                  onClick={handleotherservices}
+                >
+                  <TooltipWrapper title={'Other Services'} isMobile={isMobile}>
+                    <div
+                      style={{
+                        display: 'flex',
+                        gap: '2px',
+                        alignItems: 'center',
+                        whiteSpace: 'nowrap',
+                      }}
+                    >
+                      <FaParking className="BSC1Payment-icon" />
+                      Other Services
+                    </div>
+                  </TooltipWrapper>
+                </div>
+              )}
+            </div>
+
+            <div className="BSC1Payment-div1-sub2">
+              {BSComboNavbar?.[1]?.map((item) => (
+                <>
+                  {item?.OptionName == 'Offer' && (
+                    <div
+                      className="BSC1Payment-div1-btns"
+                      style={{
+                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                      }}
+                    >
+                      <BSNavBarOffer layoutType="Combo" />
+                    </div>
+                  )}
+                  {item?.OptionName == 'ExtraCharge' && (
+                    <Tooltip
+                      placement="top"
+                      trigger={[]}
+                      title="Alt + A"
+                      open={isAltPressed}
+                    >
+                      <TooltipWrapper
+                        title={'Extra Charge'}
+                        isMobile={isMobile}
+                      >
                         <div
+                          className="BSC1Payment-div1-btns"
+                          onClick={handleextraCharges}
                           style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
                             display: 'flex',
                             flexDirection: 'column',
                             alignItems: 'center',
                             justifyContent: 'center',
                           }}
                         >
-                          Quick Add
+                          <div style={{ display: 'flex' }}>
+                            <PozoExtraChargesIcon className="BSC1Payment-icon" />
+                            {/* EXTRA CHARGE */}
+                            Extra Charge
+                          </div>
+
                           {!isAltPressed && (
-                            <span
+                            <div
                               style={{
                                 fontSize: '9px',
                                 letterSpacing: '0.5px',
                               }}
                             >
-                              (Alt + N)
-                            </span>
+                              (Alt + A)
+                            </div>
                           )}
                         </div>
-                      </div>
-                    </TooltipWrapper>
-                  </Tooltip>
-                )}
-                {item?.OptionName == 'DineIn' &&
-                  DineInPreference?.SettingValue === 'Y' &&
-                  dinePreference && (
-                    <TooltipWrapper title={'Dine In'} isMobile={isMobile}>
-                      <div
-                        className={
-                          BookingType === 'Dine In'
-                            ? 'BSC1Payment-div1-btns-select'
-                            : 'BSC1Payment-div1-btns'
-                        }
-                        onClick={navigateDineIn}
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                        }}
-                      >
-                        <PozoDineInIcon className="BSC1Payment-icon" />
-                        DINE IN
-                      </div>
-                    </TooltipWrapper>
+                      </TooltipWrapper>
+                    </Tooltip>
                   )}
-                {item?.OptionName == 'TakeAway' && takeAwayPreference && (
-                  <TooltipWrapper title={'TakeAway'} isMobile={isMobile}>
-                    <div
-                      className={
-                        BookingType === 'TakeAway'
-                          ? 'BSC1Payment-div1-btns-select'
-                          : 'BSC1Payment-div1-btns'
-                      }
-                      onClick={() =>
-                        BookingType !== 'TakeAway' && ChangeTakeAway()
-                      }
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
+                  {item?.OptionName == 'RePrint' && (
+                    <Tooltip
+                      placement="top"
+                      trigger={[]}
+                      title="Alt + R"
+                      open={isAltPressed}
                     >
-                      <PozoTakeAway
-                        className="BSC1Payment-icon"
-                        style={{ width: '23px', height: '30px' }}
-                      />
-                      {/* TAKE AWAY */}
-                      Take Away
-                    </div>
-                  </TooltipWrapper>
-                )}
-              </>
-            ))}
-
-            {OtherServiceStatus && (
-              <div
-                className="BSC1Payment-div1-btns"
-                onClick={handleotherservices}
-              >
-                <TooltipWrapper title={'Other Services'} isMobile={isMobile}>
-                  <div
-                    style={{
-                      display: 'flex',
-                      gap: '2px',
-                      alignItems: 'center',
-                      whiteSpace: 'nowrap',
-                    }}
-                  >
-                    <FaParking className="BSC1Payment-icon" />
-                    Other Services
-                  </div>
-                </TooltipWrapper>
-              </div>
-            )}
-          </div>
-
-          <div className="BSC1Payment-div1-sub2">
-            {BSComboNavbar?.[1]?.map((item) => (
-              <>
-                {item?.OptionName == 'Offer' && (
-                  <div
-                    className="BSC1Payment-div1-btns"
-                    style={{
-                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                    }}
-                  >
-                    <BSNavBarOffer layoutType="Combo" />
-                  </div>
-                )}
-                {item?.OptionName == 'ExtraCharge' && (
-                  <Tooltip
-                    placement="top"
-                    trigger={[]}
-                    title="Alt + A"
-                    open={isAltPressed}
-                  >
-                    <TooltipWrapper title={'Extra Charge'} isMobile={isMobile}>
-                      <div
-                        className="BSC1Payment-div1-btns"
-                        onClick={handleextraCharges}
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                          display: 'flex',
-                          flexDirection: 'column',
-                          alignItems: 'center',
-                          justifyContent: 'center',
-                        }}
-                      >
-                        <div style={{ display: 'flex' }}>
-                          <PozoExtraChargesIcon className="BSC1Payment-icon" />
-                          {/* EXTRA CHARGE */}
-                          Extra Charge
-                        </div>
-
-                        {!isAltPressed && (
-                          <div
-                            style={{ fontSize: '9px', letterSpacing: '0.5px' }}
-                          >
-                            (Alt + A)
-                          </div>
-                        )}
-                      </div>
-                    </TooltipWrapper>
-                  </Tooltip>
-                )}
-                {item?.OptionName == 'RePrint' && (
-                  <Tooltip
-                    placement="top"
-                    trigger={[]}
-                    title="Alt + R"
-                    open={isAltPressed}
-                  >
-                    <TooltipWrapper title={'RePrint'} isMobile={isMobile}>
-                      <div
-                        className="BSC1Payment-div1-btns"
-                        onClick={handleReprint}
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                          display: 'flex',
-                          flexDirection: 'column',
-                          alignItems: 'center',
-                          justifyContent: 'center',
-                        }}
-                      >
+                      <TooltipWrapper title={'RePrint'} isMobile={isMobile}>
                         <div
+                          className="BSC1Payment-div1-btns"
+                          onClick={handleReprint}
                           style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
                             display: 'flex',
+                            flexDirection: 'column',
                             alignItems: 'center',
-                            gap: '4px',
-                            whiteSpace: 'nowrap',
+                            justifyContent: 'center',
                           }}
                         >
-                          <PozoReprintIcon className="BSC1Payment-icon" />
-                          Re-Print
-                          {!isAltPressed && (
-                            <span
-                              style={{
-                                fontSize: '9px',
-                                letterSpacing: '0.5px',
-                              }}
-                            >
-                              (Alt + R)
-                            </span>
-                          )}
+                          <div
+                            style={{
+                              display: 'flex',
+                              alignItems: 'center',
+                              gap: '4px',
+                              whiteSpace: 'nowrap',
+                            }}
+                          >
+                            <PozoReprintIcon className="BSC1Payment-icon" />
+                            Re-Print
+                            {!isAltPressed && (
+                              <span
+                                style={{
+                                  fontSize: '9px',
+                                  letterSpacing: '0.5px',
+                                }}
+                              >
+                                (Alt + R)
+                              </span>
+                            )}
+                          </div>
                         </div>
-                      </div>
-                    </TooltipWrapper>
-                  </Tooltip>
-                )}
-              </>
-            ))}
-            {/* {reprint1 && (
+                      </TooltipWrapper>
+                    </Tooltip>
+                  )}
+                </>
+              ))}
+              {/* {reprint1 && (
               <FeaturesFunctionalities
                 handleReprintCancel={handleReprintCancel}
                 reprint={reprint1}
               />
             )} */}
-            {extraCharges && (
-              <FeaturesFunctionalities
-                ExtraChargesCancle={handleextraChargesCancel}
-                ExtraCharges={extraCharges}
-              />
-            )}
-            {QuickAdd && (
-              <FeaturesFunctionalities
-                handleQuickAddCancel={handleQuickCancel}
-                QuickAdd={QuickAdd}
-              />
-            )}
-            {creditCustomerOpen && (
-              <BSCreditCustomer
-                creditCustomerOpen={creditCustomerOpen}
-                CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-              />
-            )}
-            {TotalAmount == 0 && Success && (
-              <div>
-                <QrComponent com={`WelcomeScreen**${brachName}`} />
-              </div>
-            )}
-            {TotalAmount > 0 &&
-              qrCode &&
-              PaymentUpiOptions?.length > 0 &&
-              SelectedUpiOption && (
+              {extraCharges && (
+                <FeaturesFunctionalities
+                  ExtraChargesCancle={handleextraChargesCancel}
+                  ExtraCharges={extraCharges}
+                />
+              )}
+              {QuickAdd && (
+                <FeaturesFunctionalities
+                  handleQuickAddCancel={handleQuickCancel}
+                  QuickAdd={QuickAdd}
+                />
+              )}
+              {creditCustomerOpen && (
+                <BSCreditCustomer
+                  creditCustomerOpen={creditCustomerOpen}
+                  CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
+                />
+              )}
+              {TotalAmount == 0 && Success && (
+                <div>
+                  <QrComponent com={`WelcomeScreen**${brachName}`} />
+                </div>
+              )}
+              {TotalAmount > 0 &&
+                qrCode &&
+                PaymentUpiOptions?.length > 0 &&
+                SelectedUpiOption && (
+                  <div>
+                    <QrComponent
+                      com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                    />
+                  </div>
+                )}
+
+              {PaymentUpiOptions?.length > 0 && OrderId && (
                 <div>
                   <QrComponent
-                    com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
+                    com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
                   />
                 </div>
               )}
+            </div>
+          </div>
 
-            {PaymentUpiOptions?.length > 0 && OrderId && (
-              <div>
-                <QrComponent
-                  com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
+          <div className="BSC1Payment-div1-2">
+            <div className="custom-float-menu">
+              <div
+                className="custom-float-trigger"
+                onClick={() => setIsFloatMenuOpen(!isFloatMenuOpen)}
+              >
+                <TfiMoreAlt
+                  style={{ fontSize: '40px' }}
+                  className="BSC1Payment-icon"
                 />
               </div>
-            )}
-          </div>
-        </div>
 
-        <div className="BSC1Payment-div1-2">
-          <div className="custom-float-menu">
-            <div
-              className="custom-float-trigger"
-              onClick={() => setIsFloatMenuOpen(!isFloatMenuOpen)}
-            >
-              <TfiMoreAlt
-                style={{ fontSize: '40px' }}
-                className="BSC1Payment-icon"
-              />
+              {isFloatMenuOpen && (
+                <div className="custom-float-items">
+                  {!OtherServiceStatus && (
+                    <div className="custom-float-item">
+                      <TooltipWrapper
+                        placement="rightTop"
+                        title="Other Services"
+                        isMobile={isMobile}
+                      >
+                        <div onClick={handleotherservices}>
+                          <FaParking className="BSC1Payment-icon" />
+                          <p style={{ fontSize: '9px' }}>Parking</p>
+                        </div>
+                      </TooltipWrapper>
+                    </div>
+                  )}
+                  {BSComboNavbar?.[1]?.map((item) => (
+                    <>
+                      {item?.OptionName == 'QuickAdd' && (
+                        <div className="custom-float-item">
+                          <TooltipWrapper
+                            placement="rightTop"
+                            title="QUICK ADD"
+                            isMobile={isMobile}
+                          >
+                            <div onClick={setQuickOpen}>
+                              <PozoQuickAddIcon className="BSC1Payment-icon quickaddIconCombo" />
+                              <p style={{ fontSize: '9px' }}>
+                                Quick Add <br /> (Alt +N)
+                              </p>
+                            </div>
+                          </TooltipWrapper>
+                        </div>
+                      )}
+                      {item?.OptionName == 'DineIn' &&
+                        DineInPreference?.SettingValue === 'Y' && (
+                          <>
+                            <div className="custom-float-item">
+                              <TooltipWrapper
+                                placement="rightTop"
+                                title="DINE IN"
+                                isMobile={isMobile}
+                              >
+                                <div onClick={navigateDineIn}>
+                                  <PozoDineInIcon className="BSC1Payment-icon1" />
+                                  <p style={{ fontSize: '9px' }}>Dine In</p>
+                                </div>
+                              </TooltipWrapper>
+                            </div>
+                            {FirstPaymentclick === false &&
+                              !addnewAccess &&
+                              !OrderStatus && (
+                                <div className="custom-float-item">
+                                  <BSTipAmount />
+                                </div>
+                              )}
+                          </>
+                        )}
+                      {item?.OptionName == 'TakeAway' && (
+                        <div className="custom-float-item">
+                          <TooltipWrapper
+                            placement="rightTop"
+                            title="TAKE AWAY"
+                            isMobile={isMobile}
+                          >
+                            <div>
+                              <PozoTakeAway className="BSC1Payment-icon1" />
+                              <p style={{ fontSize: '9px' }}>Take Away</p>
+                            </div>
+                          </TooltipWrapper>
+                        </div>
+                      )}
+                      {item?.OptionName == 'Offer' && (
+                        <div className="custom-float-item">
+                          <BSNavBarOffer
+                            layoutType="ComboMobile"
+                            propsPlacement="rightTop"
+                          />
+                        </div>
+                      )}
+                      {item?.OptionName == 'ExtraCharge' && (
+                        <div className="custom-float-item">
+                          <TooltipWrapper
+                            placement="rightTop"
+                            title="ADD ON"
+                            onClick={handleextraCharges}
+                            isMobile={isMobile}
+                          >
+                            <div>
+                              <PozoExtraChargesIcon className="BSC1Payment-icon1" />
+                              <p style={{ fontSize: '9px' }}>Extra Charge</p>
+                            </div>
+                          </TooltipWrapper>
+                        </div>
+                      )}
+                      {item?.OptionName == 'RePrint' && (
+                        <div className="custom-float-item">
+                          <TooltipWrapper
+                            placement="rightTop"
+                            title="RE PRINT"
+                            onClick={handleReprint}
+                            isMobile={isMobile}
+                          >
+                            <div>
+                              <PozoReprintIcon className="BSC1Payment-icon1" />
+                              <p style={{ fontSize: '9px' }}>Re Print</p>
+                            </div>
+                          </TooltipWrapper>
+                        </div>
+                      )}
+                    </>
+                  ))}
+                </div>
+              )}
             </div>
-
-            {isFloatMenuOpen && (
-              <div className="custom-float-items">
-                {!OtherServiceStatus && (
-                  <div className="custom-float-item">
-                    <TooltipWrapper
-                      placement="rightTop"
-                      title="Other Services"
-                      isMobile={isMobile}
-                    >
-                      <div onClick={handleotherservices}>
-                        <FaParking className="BSC1Payment-icon" />
-                        <p style={{ fontSize: '9px' }}>Parking</p>
-                      </div>
-                    </TooltipWrapper>
-                  </div>
-                )}
-                {BSComboNavbar?.[1]?.map((item) => (
-                  <>
-                    {item?.OptionName == 'QuickAdd' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="QUICK ADD"
-                          isMobile={isMobile}
-                        >
-                          <div onClick={setQuickOpen}>
-                            <PozoQuickAddIcon className="BSC1Payment-icon quickaddIconCombo" />
-                            <p style={{ fontSize: '9px' }}>
-                              Quick Add <br /> (Alt +N)
-                            </p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                    {item?.OptionName == 'DineIn' &&
-                      DineInPreference?.SettingValue === 'Y' && (
-                        <>
-                          <div className="custom-float-item">
-                            <TooltipWrapper
-                              placement="rightTop"
-                              title="DINE IN"
-                              isMobile={isMobile}
-                            >
-                              <div onClick={navigateDineIn}>
-                                <PozoDineInIcon className="BSC1Payment-icon1" />
-                                <p style={{ fontSize: '9px' }}>Dine In</p>
-                              </div>
-                            </TooltipWrapper>
-                          </div>
-                          {FirstPaymentclick === false &&
-                            !addnewAccess &&
-                            !OrderStatus && (
-                              <div className="custom-float-item">
-                                <BSTipAmount />
-                              </div>
-                            )}
-                        </>
-                      )}
-                    {item?.OptionName == 'TakeAway' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="TAKE AWAY"
-                          isMobile={isMobile}
-                        >
-                          <div>
-                            <PozoTakeAway className="BSC1Payment-icon1" />
-                            <p style={{ fontSize: '9px' }}>Take Away</p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                    {item?.OptionName == 'Offer' && (
-                      <div className="custom-float-item">
-                        <BSNavBarOffer
-                          layoutType="ComboMobile"
-                          propsPlacement="rightTop"
-                        />
-                      </div>
-                    )}
-                    {item?.OptionName == 'ExtraCharge' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="ADD ON"
-                          onClick={handleextraCharges}
-                          isMobile={isMobile}
-                        >
-                          <div>
-                            <PozoExtraChargesIcon className="BSC1Payment-icon1" />
-                            <p style={{ fontSize: '9px' }}>Extra Charge</p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                    {item?.OptionName == 'RePrint' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="RE PRINT"
-                          onClick={handleReprint}
-                          isMobile={isMobile}
-                        >
-                          <div>
-                            <PozoReprintIcon className="BSC1Payment-icon1" />
-                            <p style={{ fontSize: '9px' }}>Re Print</p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                  </>
-                ))}
-              </div>
-            )}
           </div>
-        </div>
 
-        <div class="BSC1Payment-vl"></div>
-        <TooltipWrapper
-          //  title={'Payment Mode (SHIFT + M)'}
-          isMobile={isMobile}
-        >
-          <div
-            className="BSC1Payment-div2-1"
-            style={{
-              pointerEvents:
-                (BookingType === 'Dine In' ||
-                  BookingTypeBoth ||
-                  CheckOrderType?.length > 0) &&
-                !unpaidFlow &&
-                OrderStatus
-                  ? 'none'
-                  : 'auto',
-              opacity:
-                (BookingType === 'Dine In' ||
-                  BookingTypeBoth ||
-                  CheckOrderType?.length > 0) &&
-                !unpaidFlow &&
-                OrderStatus
-                  ? 0.5
-                  : 1,
-            }}
+          <div class="BSC1Payment-vl"></div>
+          <TooltipWrapper
+            //  title={'Payment Mode (SHIFT + M)'}
+            isMobile={isMobile}
           >
-            {paybtns?.length > 0 &&
-            currentOrderNetAmount >= previousNetAmount ? (
-              paybtns?.map((payment) => (
-                <div className="Table3-cash">
-                  <button
-                    className={
-                      paybtnselected === payment.ModeId &&
-                      (UpinotSelected || CardoptionnotSelected)
-                        ? 'Btn-payment-mode-notupisel'
-                        : paybtnselected === payment.ModeId &&
-                            (!UpinotSelected || !CardoptionnotSelected)
-                          ? 'Btn-payment-mode'
-                          : 'Btn-payment-mode-sel'
-                    }
-                    style={{
-                      position: 'relative',
-                      animation: blink
-                        ? 'blink-animation 0.5s infinite alternate'
-                        : 'none',
-                    }}
-                    onClick={() =>
-                      payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
-                        ? handleUPIButtonClick(payment.ModeId, payment.ModeName)
-                        : handlePaymentMode(payment.ModeId, payment.ModeName)
-                    }
-                  >
-                    {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                    <div
+            <div
+              className="BSC1Payment-div2-1"
+              style={{
+                pointerEvents:
+                  (BookingType === 'Dine In' ||
+                    BookingTypeBoth ||
+                    CheckOrderType?.length > 0) &&
+                  !unpaidFlow &&
+                  OrderStatus
+                    ? 'none'
+                    : 'auto',
+                opacity:
+                  (BookingType === 'Dine In' ||
+                    BookingTypeBoth ||
+                    CheckOrderType?.length > 0) &&
+                  !unpaidFlow &&
+                  OrderStatus
+                    ? 0.5
+                    : 1,
+              }}
+            >
+              {paybtns?.length > 0 &&
+              currentOrderNetAmount >= previousNetAmount ? (
+                paybtns?.map((payment) => (
+                  <div className="Table3-cash">
+                    <button
+                      className={
+                        paybtnselected === payment.ModeId &&
+                        (UpinotSelected || CardoptionnotSelected)
+                          ? 'Btn-payment-mode-notupisel'
+                          : paybtnselected === payment.ModeId &&
+                              (!UpinotSelected || !CardoptionnotSelected)
+                            ? 'Btn-payment-mode'
+                            : 'Btn-payment-mode-sel'
+                      }
                       style={{
-                        display: 'flex',
-                        flexDirection: 'row',
-                        columnGap: '0.5rem',
-                        fontFamily: 'Poppins',
+                        position: 'relative',
+                        animation: blink
+                          ? 'blink-animation 0.5s infinite alternate'
+                          : 'none',
                       }}
+                      onClick={() =>
+                        payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
+                          ? handleUPIButtonClick(
+                              payment.ModeId,
+                              payment.ModeName
+                            )
+                          : handlePaymentMode(payment.ModeId, payment.ModeName)
+                      }
                     >
-                      {payment.ModeName}
-                      {payment?.ModeName?.toLowerCase() === 'card' && (
-                        <CardPopover
-                          CardPayOption={CardPayOption}
-                          SelectedCardOption={SelectedCardOption}
-                          AddCardOption={AddCardOption}
-                          CardOptionOpen={CardOptionOpen}
-                          EnableCardOptions={EnableCardOptions}
-                          paygate={paygate}
-                          paydevice={paydevice}
-                        />
-                      )}
-                      {payment?.ModeName?.toLowerCase() === 'upi' && (
-                        <UpiPopover
-                          defaultPaymentMode={defaultPaymentMode}
-                          defaultEnabled={defaultEnabled}
-                          setDefaultEnabled={setDefaultEnabled}
-                          UpiOptionOpen={UpiOptionOpen}
-                          UpiPayOption={UpiPayOption}
-                          SelectedUPIPayOption={SelectedUPIPayOption}
-                          AddUPIPaymentOption={AddUPIPaymentOption}
-                          PaymentUpiOptions={PaymentUpiOptions}
-                          UpiOption={UpiOption}
-                          UpiId={UpiId}
-                          BusinessPayOption={BusinessPayOption}
-                          paygate={paygate}
-                          paydevice={paydevice}
-                          EnableUpiOptions={EnableUpiOptions}
-                          PaymentgatewayUPI={PaymentgatewayUPI}
-                          PaymentDeviceUPI={PaymentDeviceUPI}
-                          SelectedUpiOption={SelectedUpiOption}
-                          addUpiOption={addUpiOption}
-                          hideDefault={hideDefault}
-                        />
-                      )}
-                    </div>
-                  </button>
-                </div>
-              ))
-            ) : currentOrderNetAmount < previousNetAmount &&
-              salesBillEdit &&
-              refundPayBtns.length > 0 ? (
-              refundPayBtns.map((payment) => (
-                <div className="Table3-cash">
-                  <button
-                    className={
-                      refundPaySelected === payment.ConfigId &&
-                      (UpinotSelected || CardoptionnotSelected)
-                        ? 'Btn-payment-mode-notupisel'
-                        : refundPaySelected === payment.ConfigId &&
-                            (!UpinotSelected || !CardoptionnotSelected)
-                          ? 'Btn-payment-mode'
-                          : 'Btn-payment-mode-sel'
-                    }
-                    style={{
-                      position: 'relative',
-                      animation: blink
-                        ? 'blink-animation 0.5s infinite alternate'
-                        : 'none',
-                    }}
-                    onClick={() =>
-                      handleRefundPaymentMode(
-                        payment?.ConfigId,
-                        payment?.ConfigName
-                      )
-                    }
-                  >
-                    {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
+                      {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
 
-                    <div
-                      style={{
-                        display: 'flex',
-                        flexDirection: 'row',
-                        columnGap: '0.5rem',
-                      }}
-                    >
-                      {payment.ConfigName}
-                    </div>
-                  </button>
-                </div>
-              ))
-            ) : (
-              <div
-                onClick={handlepaymentoptions}
-                style={{ cursor: 'pointer' }}
-                className="payment-error-msg"
-              >
-                Please Set Payment Options
-              </div>
-            )}
-
-            {paybtns?.length > 1 && (
-              <div
-                style={{
-                  pointerEvents:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                    !unpaidFlow &&
-                    OrderStatus
-                      ? 'none'
-                      : 'auto',
-                  opacity:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                    !unpaidFlow &&
-                    OrderStatus
-                      ? 0.5
-                      : 1,
-                }}
-              >
-                <TooltipWrapper
-                  title="Split Payment (Alt + S)"
-                  isMobile={isMobile}
-                >
-                  {' '}
-                  <div
-                    className="BSBillingNav-icon-table-icon splitpaymantBTNCombo"
-                    onClick={
-                      CheckBookingStatus != 'Close' && !addnewAccess
-                        ? SplitPaymentOpen
-                        : ''
-                    }
-                    style={{
-                      cursor:
-                        OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                          ? 'not-allowed'
-                          : 'pointer',
-                      color:
-                        OrderCardDetail?.length === 0 ||
-                        CheckBookingStatus == 'Close' ||
-                        addnewAccess
-                          ? '#fff'
-                          : '#ffffffff',
-                      alignItems: 'center',
-                    }}
-                  >
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        width: '100%',
-                        justifyContent: 'center',
-                        gap: '4px',
-                      }}
-                    >
-                      <PozoSplitPaymentIcon />
-                      Split Pay
-                    </div>
+                      <div
+                        style={{
+                          display: 'flex',
+                          flexDirection: 'row',
+                          columnGap: '0.5rem',
+                          fontFamily: 'Poppins',
+                        }}
+                      >
+                        {payment.ModeName}
+                        {payment?.ModeName?.toLowerCase() === 'card' && (
+                          <CardPopover
+                            CardPayOption={CardPayOption}
+                            SelectedCardOption={SelectedCardOption}
+                            AddCardOption={AddCardOption}
+                            CardOptionOpen={CardOptionOpen}
+                            EnableCardOptions={EnableCardOptions}
+                            paygate={paygate}
+                            paydevice={paydevice}
+                          />
+                        )}
+                        {payment?.ModeName?.toLowerCase() === 'upi' && (
+                          <UpiPopover
+                            defaultPaymentMode={defaultPaymentMode}
+                            defaultEnabled={defaultEnabled}
+                            setDefaultEnabled={setDefaultEnabled}
+                            UpiOptionOpen={UpiOptionOpen}
+                            UpiPayOption={UpiPayOption}
+                            SelectedUPIPayOption={SelectedUPIPayOption}
+                            AddUPIPaymentOption={AddUPIPaymentOption}
+                            PaymentUpiOptions={PaymentUpiOptions}
+                            UpiOption={UpiOption}
+                            UpiId={UpiId}
+                            BusinessPayOption={BusinessPayOption}
+                            paygate={paygate}
+                            paydevice={paydevice}
+                            EnableUpiOptions={EnableUpiOptions}
+                            PaymentgatewayUPI={PaymentgatewayUPI}
+                            PaymentDeviceUPI={PaymentDeviceUPI}
+                            SelectedUpiOption={SelectedUpiOption}
+                            addUpiOption={addUpiOption}
+                            hideDefault={hideDefault}
+                          />
+                        )}
+                      </div>
+                    </button>
                   </div>
-                </TooltipWrapper>
-              </div>
-            )}
-          </div>
-        </TooltipWrapper>
+                ))
+              ) : currentOrderNetAmount < previousNetAmount &&
+                salesBillEdit &&
+                refundPayBtns.length > 0 ? (
+                refundPayBtns.map((payment) => (
+                  <div className="Table3-cash">
+                    <button
+                      className={
+                        refundPaySelected === payment.ConfigId &&
+                        (UpinotSelected || CardoptionnotSelected)
+                          ? 'Btn-payment-mode-notupisel'
+                          : refundPaySelected === payment.ConfigId &&
+                              (!UpinotSelected || !CardoptionnotSelected)
+                            ? 'Btn-payment-mode'
+                            : 'Btn-payment-mode-sel'
+                      }
+                      style={{
+                        position: 'relative',
+                        animation: blink
+                          ? 'blink-animation 0.5s infinite alternate'
+                          : 'none',
+                      }}
+                      onClick={() =>
+                        handleRefundPaymentMode(
+                          payment?.ConfigId,
+                          payment?.ConfigName
+                        )
+                      }
+                    >
+                      {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
 
-        {/* <div className='BSC1Payment-div2-2'>
+                      <div
+                        style={{
+                          display: 'flex',
+                          flexDirection: 'row',
+                          columnGap: '0.5rem',
+                        }}
+                      >
+                        {payment.ConfigName}
+                      </div>
+                    </button>
+                  </div>
+                ))
+              ) : (
+                <div
+                  onClick={handlepaymentoptions}
+                  style={{ cursor: 'pointer' }}
+                  className="payment-error-msg"
+                >
+                  Please Set Payment Options
+                </div>
+              )}
+
+              {paybtns?.length > 1 && (
+                <div
+                  style={{
+                    pointerEvents:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 'none'
+                        : 'auto',
+                    opacity:
+                      (BookingType === 'Dine In' ||
+                        BookingTypeBoth ||
+                        CheckOrderType?.length > 0) &&
+                      !unpaidFlow &&
+                      OrderStatus
+                        ? 0.5
+                        : 1,
+                  }}
+                >
+                  <TooltipWrapper
+                    title="Split Payment (Alt + S)"
+                    isMobile={isMobile}
+                  >
+                    {' '}
+                    <div
+                      className="BSBillingNav-icon-table-icon splitpaymantBTNCombo"
+                      onClick={
+                        CheckBookingStatus != 'Close' && !addnewAccess
+                          ? SplitPaymentOpen
+                          : ''
+                      }
+                      style={{
+                        cursor:
+                          OrderCardDetail?.length === 0 ||
+                          CheckBookingStatus == 'Close' ||
+                          addnewAccess
+                            ? 'not-allowed'
+                            : 'pointer',
+                        color:
+                          OrderCardDetail?.length === 0 ||
+                          CheckBookingStatus == 'Close' ||
+                          addnewAccess
+                            ? '#fff'
+                            : '#ffffffff',
+                        alignItems: 'center',
+                      }}
+                    >
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          width: '100%',
+                          justifyContent: 'center',
+                          gap: '4px',
+                        }}
+                      >
+                        <PozoSplitPaymentIcon />
+                        Split Pay
+                      </div>
+                    </div>
+                  </TooltipWrapper>
+                </div>
+              )}
+            </div>
+          </TooltipWrapper>
+
+          {/* <div className='BSC1Payment-div2-2'>
                     <select className='BSC1Payment-div2-button'>
                         <option className='BSC1Payment-div1-btns'>CASH</option>
                         <option className='BSC1Payment-div1-btns'>CARD</option>
@@ -4187,882 +4120,868 @@ const BSC1Payment = (props) => {
                     </select>
                 </div> */}
 
-        <div class="BSC1Payment-vl"></div>
+          <div class="BSC1Payment-vl"></div>
 
-        <div className="BSC1Payment-div3">
-          <div className="BSC1Payment-div4-sub1">
-            <div
-              style={{
-                display: 'flex',
-                flexDirection: 'column',
-                rowGap: '1rem',
-              }}
-            >
+          <div className="BSC1Payment-div3">
+            <div className="BSC1Payment-div4-sub1">
               <div
-                style={{ display: 'flex', alignItems: 'center' }}
-                className="BSC1Payment-div4-naming"
+                style={{
+                  display: 'flex',
+                  flexDirection: 'column',
+                  rowGap: '1rem',
+                }}
               >
-                <div style={{ width: '3rem' }}>Items </div>
-                <div style={{ width: '4px' }}> : </div>
-                <div style={{ textAlign: 'right', width: '1rem' }}>
-                  {' '}
-                  {TotalItems}{' '}
+                <div
+                  style={{ display: 'flex', alignItems: 'center' }}
+                  className="BSC1Payment-div4-naming"
+                >
+                  <div style={{ width: '3rem' }}>Items </div>
+                  <div style={{ width: '4px' }}> : </div>
+                  <div style={{ textAlign: 'right', width: '1rem' }}>
+                    {' '}
+                    {TotalItems}{' '}
+                  </div>
                 </div>
-              </div>
-              <div
-                style={{ display: 'flex', alignItems: 'center' }}
-                className="BSC1Payment-div4-naming"
-              >
-                <div style={{ width: '3rem' }}>Qty </div>
-                <div style={{ width: '4px' }}> : </div>
-                <div style={{ textAlign: 'right', width: '1rem' }}> {Qty} </div>
-              </div>
-              <div
-                style={{ display: 'flex', alignItems: 'center' }}
-                className="BSC1Payment-div4-naming"
-              >
-                <div style={{ width: '3rem' }}>Dis </div>
-                <div style={{ width: '4px' }}> : </div>
-                <div style={{ textAlign: 'right', width: '1rem' }}>
-                  {' '}
-                  {Discount}{' '}
+                <div
+                  style={{ display: 'flex', alignItems: 'center' }}
+                  className="BSC1Payment-div4-naming"
+                >
+                  <div style={{ width: '3rem' }}>Qty </div>
+                  <div style={{ width: '4px' }}> : </div>
+                  <div style={{ textAlign: 'right', width: '1rem' }}>
+                    {' '}
+                    {Qty}{' '}
+                  </div>
+                </div>
+                <div
+                  style={{ display: 'flex', alignItems: 'center' }}
+                  className="BSC1Payment-div4-naming"
+                >
+                  <div style={{ width: '3rem' }}>Dis </div>
+                  <div style={{ width: '4px' }}> : </div>
+                  <div style={{ textAlign: 'right', width: '1rem' }}>
+                    {' '}
+                    {Discount}{' '}
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div class="BSC1Payment-vl"></div>
+          <div class="BSC1Payment-vl"></div>
 
-        <div className="BSC1Payment-div4">
-          {(addcustomer || hold) && (
-            <FeaturesFunctionalities
-              handleAddCustomerCancel={handleAddCustomerCancel}
-              addcustomer={addcustomer}
-              handleHoldCancel={handleHoldCancel}
-              modalOpen={hold}
-              closeModal={() => setHold(false)}
-            />
-          )}
-          <div className="BSC1Payment-div4-payment newPaySectionCombo">
-            {Estimation?.SettingValue == 'Y' &&
-              BookingType !== 'Dine In' &&
-              !BookingTypeBoth && (
-                <div
-                  style={{
-                    color: '#1292EE',
-                    pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                  }}
-                >
-                  <BSNavBarEstimate />
-                </div>
-              )}
-            {BSComboData?.BookingBilling?.[1]?.map((item) => (
-              <>
-                {/* {item?.OptionName=="Hold" && */}
-                {unpaidFlow == false
-                  ? item?.OptionName == 'Hold' &&
-                    BookingType !== 'Dine In' &&
-                    !BookingTypeBoth &&
-                    OrderCardDetail?.length != 0 &&
-                    CheckOrderType?.length === 0 &&
-                    OrderType != 'Failed' &&
-                    CheckBookingStatus != 'Close' &&
-                    !addnewAccess && (
-                      <Tooltip
-                        placement="bottom"
-                        trigger={[]}
-                        title="ALT + W"
-                        open={isAltPressed}
-                      >
-                        <TooltipWrapper title={'Hold'} isMobile={isMobile}>
+          <div className="BSC1Payment-div4">
+            {(addcustomer || hold) && (
+              <FeaturesFunctionalities
+                handleAddCustomerCancel={handleAddCustomerCancel}
+                addcustomer={addcustomer}
+                handleHoldCancel={handleHoldCancel}
+                modalOpen={hold}
+                closeModal={() => setHold(false)}
+              />
+            )}
+            <div className="BSC1Payment-div4-payment newPaySectionCombo">
+              {Estimation?.SettingValue == 'Y' &&
+                BookingType !== 'Dine In' &&
+                !BookingTypeBoth && (
+                  <div
+                    style={{
+                      color: '#1292EE',
+                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                    }}
+                  >
+                    <BSNavBarEstimate />
+                  </div>
+                )}
+              {BSComboData?.BookingBilling?.[1]?.map((item) => (
+                <>
+                  {/* {item?.OptionName=="Hold" && */}
+                  {unpaidFlow == false
+                    ? item?.OptionName == 'Hold' &&
+                      BookingType !== 'Dine In' &&
+                      !BookingTypeBoth &&
+                      OrderCardDetail?.length != 0 &&
+                      CheckOrderType?.length === 0 &&
+                      OrderType != 'Failed' &&
+                      CheckBookingStatus != 'Close' &&
+                      !addnewAccess && (
+                        <Tooltip
+                          placement="bottom"
+                          trigger={[]}
+                          title="ALT + W"
+                          open={isAltPressed}
+                        >
+                          <TooltipWrapper title={'Hold'} isMobile={isMobile}>
+                            {' '}
+                            <div
+                              style={{
+                                backgroundColor: '' ? '#52c41a' : '#1292EE',
+                                color: '' ? '#52c41a' : '#ffffffff',
+                                height: '40px',
+                                width: '45px',
+                                borderRadius: '6px',
+                                display: 'flex',
+                                alignItems: 'center',
+                                justifyContent: 'center',
+                                padding: '8px 8px 12px 8px',
+                              }}
+                            >
+                              <PozoHoldIcon
+                                className="BSBillingNav-icon-table-icon"
+                                onClick={() => AddBookingDetails('Hold')}
+                                style={{
+                                  cursor: 'pointer',
+                                  // color: '' ? '#52c41a' : '#1292EE',
+                                }}
+                              />{' '}
+                              {/* <p className="payOptionDecition"> Hold</p> */}
+                            </div>
+                          </TooltipWrapper>
+                        </Tooltip>
+                      )
+                    : ''}
+
+                  {unpaidFlow == false
+                    ? item?.OptionName == 'Hold' &&
+                      BookingType !== 'Dine In' &&
+                      !BookingTypeBoth &&
+                      Holddata?.length > 0 &&
+                      OrderCardDetail?.length == 0 &&
+                      CheckBookingStatus != 'Close' &&
+                      !addnewAccess && (
+                        <TooltipWrapper title={'Recall'} isMobile={isMobile}>
+                          {' '}
+                          <Badge
+                            count={Holddata?.length}
+                            size={'small'}
+                            offset={[0, 7]}
+                          >
+                            <div
+                              style={{
+                                backgroundColor: Holddata
+                                  ? '#52c41a'
+                                  : 'default',
+                                color: Holddata ? '#ffffffff' : 'default',
+                                height: '40px',
+                                width: '45px',
+                                borderRadius: '6px',
+                                display: 'flex',
+                                alignItems: 'center',
+                                justifyContent: 'center',
+                                padding: '8px 8px 12px 8px',
+                              }}
+                            >
+                              <PozoHoldIcon
+                                className="BSBillingNav-icon-table-icon"
+                                onClick={() => HandleholdModelOpen()}
+                                style={{
+                                  cursor: 'pointer',
+                                  // color: Holddata ? '#52c41a' : 'default',
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
+                                }}
+                              />
+                            </div>
+                          </Badge>
+                        </TooltipWrapper>
+                      )
+                    : ''}
+                  {tabledata?.length > 0 && dinePreference && (
+                    <>
+                      {item?.OptionName == 'UnpaidBill' && (
+                        <TooltipWrapper
+                          title="Unpaid Bills"
+                          isMobile={isMobile}
+                        >
                           {' '}
                           <div
                             style={{
-                              backgroundColor: '' ? '#52c41a' : '#1292EE',
-                              color: '' ? '#52c41a' : '#ffffffff',
+                              backgroundColor: unpaidFlow
+                                ? '#52c41a'
+                                : '#1292EE',
+                              color: unpaidFlow ? '#ffffffff' : '#ffffffff',
                               height: '40px',
-                              width: '45px',
+                              width: '40px',
                               borderRadius: '6px',
                               display: 'flex',
                               alignItems: 'center',
                               justifyContent: 'center',
-                              padding: '8px 8px 12px 8px',
+                              padding: '4px 4px 16px 4px',
                             }}
                           >
-                            <PozoHoldIcon
+                            <PozoUnpaidIcon
                               className="BSBillingNav-icon-table-icon"
-                              onClick={() => AddBookingDetails('Hold')}
                               style={{
+                                fontSize: '27px',
                                 cursor: 'pointer',
-                                // color: '' ? '#52c41a' : '#1292EE',
-                              }}
-                            />{' '}
-                            {/* <p className="payOptionDecition"> Hold</p> */}
-                          </div>
-                        </TooltipWrapper>
-                      </Tooltip>
-                    )
-                  : ''}
-
-                {unpaidFlow == false
-                  ? item?.OptionName == 'Hold' &&
-                    BookingType !== 'Dine In' &&
-                    !BookingTypeBoth &&
-                    Holddata?.length > 0 &&
-                    OrderCardDetail?.length == 0 &&
-                    CheckBookingStatus != 'Close' &&
-                    !addnewAccess && (
-                      <TooltipWrapper title={'Recall'} isMobile={isMobile}>
-                        {' '}
-                        <Badge
-                          count={Holddata?.length}
-                          size={'small'}
-                          offset={[0, 7]}
-                        >
-                          <div
-                            style={{
-                              backgroundColor: Holddata ? '#52c41a' : 'default',
-                              color: Holddata ? '#ffffffff' : 'default',
-                              height: '40px',
-                              width: '45px',
-                              borderRadius: '6px',
-                              display: 'flex',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                              padding: '8px 8px 12px 8px',
-                            }}
-                          >
-                            <PozoHoldIcon
-                              className="BSBillingNav-icon-table-icon"
-                              onClick={() => HandleholdModelOpen()}
-                              style={{
-                                cursor: 'pointer',
-                                // color: Holddata ? '#52c41a' : 'default',
                                 pointerEvents:
                                   OrderType === 'Failed' ? 'none' : 'auto',
+                                height: '45px',
+                                width: '45px',
+                                borderRadius: '6px',
+                                display: 'flex',
+                                alignItems: 'center',
+                                justifyContent: 'center',
+                                padding: '4px 6px 4px 6px',
+                              }}
+                              onClick={() => {
+                                (setUnpaidOpen(true), getUnpaiddatas());
                               }}
                             />
                           </div>
-                        </Badge>
-                      </TooltipWrapper>
-                    )
-                  : ''}
-                {tabledata?.length > 0 && dinePreference && (
-                  <>
-                    {item?.OptionName == 'UnpaidBill' && (
-                      <TooltipWrapper title="Unpaid Bills" isMobile={isMobile}>
-                        {' '}
-                        <div
-                          style={{
-                            backgroundColor: unpaidFlow ? '#52c41a' : '#1292EE',
-                            color: unpaidFlow ? '#ffffffff' : '#ffffffff',
-                            height: '40px',
-                            width: '40px',
-                            borderRadius: '6px',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            padding: '4px 4px 16px 4px',
-                          }}
+                        </TooltipWrapper>
+                      )}
+                    </>
+                  )}
+                </>
+              ))}
+              {BSComboData?.BookingBilling?.[1]?.filter(
+                (item) => item.OptionName === 'AddCustomer'
+              ).length === 1 ? (
+                <>
+                  {Object.keys(useOptions)?.length > 0 &&
+                    useOptions?.some((flow) =>
+                      flow.OptionDetails.some(
+                        (option) =>
+                          option.OptionName === 'Pay at the counter' &&
+                          option.ModeDetails.some(
+                            (mode) => mode.ModeName === 'Credit'
+                          )
+                      )
+                    ) && (
+                      <React.Fragment key="CreditCustomerFragment">
+                        <TooltipWrapper
+                          title="Advance Amount"
+                          isMobile={isMobile}
                         >
-                          <PozoUnpaidIcon
-                            className="BSBillingNav-icon-table-icon"
+                          <div
                             style={{
-                              fontSize: '27px',
-                              cursor: 'pointer',
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                              height: '45px',
+                              backgroundColor:
+                                OrderCardDetail?.length > 0 ||
+                                (selOption?.value === undefined &&
+                                  GlobalAddCustomerDetails1?.length === 0 &&
+                                  GetCustId?.CustMobile === undefined)
+                                  ? 'gray'
+                                  : '#1292eeff',
+                              color: '#fff',
+                              height: '40px',
                               width: '45px',
                               borderRadius: '6px',
                               display: 'flex',
                               alignItems: 'center',
                               justifyContent: 'center',
-                              padding: '4px 6px 4px 6px',
+                              padding: '8px 8px 12px 8px',
                             }}
+                            className="AsAmtCombo"
+                          >
+                            {' '}
+                            <PozoAdvanceIcon
+                              className="BSBillingNav-icon-table-icon"
+                              onClick={CreditCustomerFun}
+                              style={{
+                                cursor:
+                                  OrderCardDetail?.length > 0 && 'not-allowed',
+                                fontSize: '28px',
+                              }}
+                            />{' '}
+                            <p className="payOptionDecition">Adv Amt</p>
+                          </div>
+                        </TooltipWrapper>
+                      </React.Fragment>
+                    )}
+                </>
+              ) : (
+                ''
+              )}
+              {FeatureAddonData?.FeatureDtls?.find(
+                (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
+              ) && (
+                <>
+                  {
+                    <div
+                      style={{
+                        pointerEvents:
+                          OrderCardDetail?.length > 0 || OrderType === 'Failed'
+                            ? 'none'
+                            : 'auto',
+                        opacity: OrderCardDetail?.length > 0 ? 0.5 : 1,
+                      }}
+                    >
+                      <TooltipWrapper title={'Pre Order'} isMobile={isMobile}>
+                        <Badge
+                          count={preOrderPendingCount}
+                          offset={[-5, 10]}
+                          size="small"
+                        >
+                          <PozoPreOrderIcon
+                            className="BSBillingNav-icon"
+                            fill={preOrderOpen ? '#52C41A' : '#1292EE'}
                             onClick={() => {
-                              (setUnpaidOpen(true), getUnpaiddatas());
+                              openPreOrder();
+                            }}
+                          />
+                        </Badge>
+                      </TooltipWrapper>
+                    </div>
+                  }
+                </>
+              )}
+              {preOrderOpen && <BSNavBarPreOrder />}
+              {sportsAppPreference && <BSMembership />}
+              {dinePreference &&
+                (BookingType === 'Dine In' ||
+                  BookingTypeBoth ||
+                  CheckOrderType?.length > 0) &&
+                !unpaidFlow && (
+                  <>
+                    <TooltipWrapper title="ORDER" isMobile={isMobile}>
+                      {' '}
+                      <PozoDineInIcon
+                        className={
+                          FirstPaymentclick === false && !addnewAccess
+                            ? OrderStatus
+                              ? 'Dinein-order-btn pulse-element ChairClrRed'
+                              : 'Dinein-order-btn pulse-element ChairClrGreen'
+                            : 'Dinein-order-btn-disabled pulse-element'
+                        }
+                        onClick={() =>
+                          FirstPaymentclick === false && !addnewAccess
+                            ? changeOrderStatus()
+                            : ''
+                        }
+                        style={{
+                          pointerEvents:
+                            OrderType === 'Failed' ? 'none' : 'auto',
+                        }}
+                      />
+                    </TooltipWrapper>
+                    {FirstPaymentclick === false &&
+                      !addnewAccess &&
+                      !OrderStatus && <BSTipAmount />}
+                  </>
+                )}
+              {OrderCardDetail?.length > 0 && ParkingDisplay && (
+                <div
+                  style={{
+                    width: '1.5rem',
+                    color: 'rgb(18, 146, 238)',
+                    display: 'flex',
+                    alignItems: 'center',
+                    height: '2.46rem',
+                  }}
+                >
+                  <BSOtherServiceClaim />
+                </div>
+              )}
+              {unpaidFlow == true ? (
+                <TooltipWrapper title="Print Bill" isMobile={isMobile}>
+                  <PozoBillIcon
+                    className="Hover"
+                    style={{
+                      fontSize: '25px',
+                      cursor: 'pointer',
+                      color: unpaidFlow ? '#52c41a' : '#1292EE',
+                    }}
+                    onClick={() => {
+                      Recipt();
+                    }}
+                  />
+                </TooltipWrapper>
+              ) : (
+                ''
+              )}
+              {paymentfeataddon && (
+                <TooltipWrapper title="Failed Payment" isMobile={isMobile}>
+                  <div
+                    onClick={() => {
+                      paymentFailedStatusFun();
+                    }}
+                    style={{
+                      width: '27px',
+                      cursor: 'pointer',
+                      fontWeight: '600',
+                      color: 'rgb(18, 146, 238)',
+                    }}
+                  >
+                    <PozoFailedPaymentsIcon />
+                  </div>
+                </TooltipWrapper>
+              )}
+              {OpenFailData && (
+                <PaymentFailedSales
+                  paymentFailedStatusFun={paymentFailedStatusFun}
+                  OpenFailData={OpenFailData}
+                />
+              )}
+            </div>
+          </div>
+          <div className="selctcusandpayBTNforCombo">
+            {BSComboData?.BookingBilling?.[1]?.map((item) => (
+              <>
+                {item?.OptionName == 'AddCustomer' && !preOrderOpen && (
+                  <Tooltip
+                    placement="top"
+                    trigger={[]}
+                    title="ALT + Z"
+                    open={isAltPressed}
+                  >
+                    <div
+                      style={{
+                        display: 'flex',
+                        gap: '0',
+                        alignItems: 'center',
+                      }}
+                    >
+                      <BSCustomerSelect />
+                      <TooltipWrapper
+                        title={'Add Customer'}
+                        isMobile={isMobile}
+                      >
+                        <div>
+                          <PozoAddCustomerIcon
+                            className="BSBillingNav-icon-table-icon bspaymentcomboAddCus"
+                            onClick={handleAddCustomer}
+                            style={{
+                              display: 'flex',
+                              fontSize: '20px',
+                              width: '35px',
+                              height: '40px',
+                              padding: '4px',
+                              borderRadius: '0 6px 6px 0',
+                              cursor: Custdisable ? 'not-allowed' : 'pointer',
+                              color:
+                                selOption || GetCustId
+                                  ? '#ffffffff'
+                                  : '#ffffffff',
+                              backgroundColor:
+                                selOption || GetCustId ? '#52c41a' : '#1292EE',
                             }}
                           />
                         </div>
                       </TooltipWrapper>
-                    )}
-                  </>
+                    </div>
+                  </Tooltip>
                 )}
               </>
             ))}
-            {BSComboData?.BookingBilling?.[1]?.filter(
-              (item) => item.OptionName === 'AddCustomer'
-            ).length === 1 ? (
-              <>
-                {Object.keys(useOptions)?.length > 0 &&
-                  useOptions?.some((flow) =>
-                    flow.OptionDetails.some(
-                      (option) =>
-                        option.OptionName === 'Pay at the counter' &&
-                        option.ModeDetails.some(
-                          (mode) => mode.ModeName === 'Credit'
-                        )
-                    )
-                  ) && (
-                    <React.Fragment key="CreditCustomerFragment">
-                      <TooltipWrapper
-                        title="Advance Amount"
-                        isMobile={isMobile}
-                      >
-                        <div
-                          style={{
-                            backgroundColor:
-                              OrderCardDetail?.length > 0 ||
-                              (selOption?.value === undefined &&
-                                GlobalAddCustomerDetails1?.length === 0 &&
-                                GetCustId?.CustMobile === undefined)
-                                ? 'gray'
-                                : '#1292eeff',
-                            color: '#fff',
-                            height: '40px',
-                            width: '45px',
-                            borderRadius: '6px',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            padding: '8px 8px 12px 8px',
-                          }}
-                          className="AsAmtCombo"
-                        >
-                          {' '}
-                          <PozoAdvanceIcon
-                            className="BSBillingNav-icon-table-icon"
-                            onClick={CreditCustomerFun}
-                            style={{
-                              cursor:
-                                OrderCardDetail?.length > 0 && 'not-allowed',
-                              // color:
-                              //   OrderCardDetail?.length > 0 ||
-                              //   (selOption?.value === undefined &&
-                              //     GlobalAddCustomerDetails1?.length === 0 &&
-                              //     GetCustId?.CustMobile === undefined)
-                              //     ? 'gray'
-                              //     : '#1292eeff',
-                              fontSize: '28px',
-                            }}
-                          />{' '}
-                          <p className="payOptionDecition">Adv Amt</p>
-                        </div>
-                      </TooltipWrapper>
-                    </React.Fragment>
-                  )}
-              </>
-            ) : (
-              ''
-            )}
-            {FeatureAddonData?.FeatureDtls?.find(
-              (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
-            ) && (
-              <>
-                {
-                  <div
-                    style={{
-                      pointerEvents:
-                        OrderCardDetail?.length > 0 || OrderType === 'Failed'
-                          ? 'none'
-                          : 'auto',
-                      opacity: OrderCardDetail?.length > 0 ? 0.5 : 1,
-                    }}
-                  >
-                    <TooltipWrapper title={'Pre Order'} isMobile={isMobile}>
-                      <Badge
-                        count={preOrderPendingCount}
-                        offset={[-5, 10]}
-                        size="small"
-                      >
-                        <PozoPreOrderIcon
-                          className="BSBillingNav-icon"
-                          fill={preOrderOpen ? '#52C41A' : '#1292EE'}
-                          onClick={() => {
-                            openPreOrder();
-                          }}
-                        />
-                      </Badge>
-                    </TooltipWrapper>
-                  </div>
-                }
-              </>
-            )}
-            {preOrderOpen && <BSNavBarPreOrder />}
-            {sportsAppPreference && <BSMembership />}
-            {dinePreference &&
-              (BookingType === 'Dine In' ||
-                BookingTypeBoth ||
-                CheckOrderType?.length > 0) &&
-              !unpaidFlow && (
-                <>
-                  <TooltipWrapper title="ORDER" isMobile={isMobile}>
-                    {' '}
-                    <PozoDineInIcon
-                      className={
-                        FirstPaymentclick === false && !addnewAccess
-                          ? OrderStatus
-                            ? 'Dinein-order-btn pulse-element ChairClrRed'
-                            : 'Dinein-order-btn pulse-element ChairClrGreen'
-                          : 'Dinein-order-btn-disabled pulse-element'
-                      }
-                      onClick={() =>
-                        FirstPaymentclick === false && !addnewAccess
-                          ? changeOrderStatus()
-                          : ''
-                      }
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    />
-                  </TooltipWrapper>
-                  {FirstPaymentclick === false &&
-                    !addnewAccess &&
-                    !OrderStatus && <BSTipAmount />}
-                </>
-              )}
-            {OrderCardDetail?.length > 0 && ParkingDisplay && (
-              <div
-                style={{
-                  width: '1.5rem',
-                  color: 'rgb(18, 146, 238)',
-                  display: 'flex',
-                  alignItems: 'center',
-                  height: '2.46rem',
-                }}
+
+            <div className="comboTotalBillBTN">
+              <Tooltip
+                placement="left"
+                trigger={[]}
+                title="F4"
+                open={isAltPressed}
               >
-                <BSOtherServiceClaim />
-              </div>
-            )}
-            {unpaidFlow == true ? (
-              <TooltipWrapper title="Print Bill" isMobile={isMobile}>
-                <PozoBillIcon
-                  className="Hover"
-                  style={{
-                    fontSize: '25px',
-                    cursor: 'pointer',
-                    color: unpaidFlow ? '#52c41a' : '#1292EE',
-                  }}
-                  onClick={() => {
-                    Recipt();
-                  }}
-                />
-              </TooltipWrapper>
-            ) : (
-              ''
-            )}
-            {/* <div>
+                <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
+                  <button
+                    className={
+                      // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
+                      addnewAccess
+                        ? 'BSC1Payment-div4-button-disable'
+                        : FirstPaymentclick === false &&
+                            OrderCardDetail?.length > 0 &&
+                            paybtnselected &&
+                            CheckBookingStatus != 'Close'
+                          ? !OrderStatus
+                            ? salesBillEdit &&
+                              currentOrderNetAmount < previousNetAmount
+                              ? 'BSC1Payment-div4-button'
+                              : 'BSC1Payment-div4-button'
+                            : 'BSC1Payment-div4-button Order'
+                          : 'BSC1Payment-div4-button-disable'
+                    }
+                    // onClick={() => {
+                    //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
+                    // }}
+                    onClick={handleButtonClick}
+                    style={{ borderRadius: '6px 0 0 6px' }}
+                  >
+                    {!OrderStatus ? (
+                      salesBillEdit &&
+                      currentOrderNetAmount < previousNetAmount ? (
+                        <div className="Table4-Order">
+                          Refund: ₹
+                          {(previousNetAmount || 0) -
+                            (currentOrderNetAmount || 0)}
+                        </div>
+                      ) : (
+                        <>
+                          {isMobile ? (
+                            `₹ ${safeRound(
+                              OrderType === 'Failed'
+                                ? FailedTotalAmt
+                                : credit && overAllBal >= 0
+                                  ? Math.max(0, TotalAmount - overAllBal)
+                                  : TotalAmount
+                            )}`
+                          ) : (
+                            <div>
+                              ₹
+                              <CountUp
+                                duration={0.4}
+                                className="counter"
+                                end={safeRound(
+                                  OrderType === 'Failed'
+                                    ? FailedTotalAmt
+                                    : credit && overAllBal >= 0
+                                      ? Math.max(0, TotalAmount - overAllBal)
+                                      : TotalAmount
+                                )}
+                              />
+                            </div>
+                          )}
+                          <AiOutlineArrowRight width="25px" height="25px" />
+                        </>
+                      )
+                    ) : (
+                      <div className="Table4-Order">ORDER</div>
+                    )}
+                  </button>
+                </TooltipWrapper>
+              </Tooltip>
               <Popover
-                content={<><a onClick={hide}><AiOutlineClose color='black' /></a>
-                  <BSSummery1 />
-                </>
+                content={
+                  <>
+                    <a onClick={hide}>
+                      <AiOutlineClose color="black" />
+                    </a>
+                    <BSSummery1 />
+                  </>
                 }
                 trigger="click"
                 open={open}
                 onOpenChange={handleOpenChange}
               >
-                <TooltipWrapper placement="topRight" title='SUMMARY' isMobile={isMobile}><UpCircleOutlined style={{ color: "rgb(18, 146, 238)" }} className='BSC1Payment-icon-button' /></TooltipWrapper>
-              </Popover>
-            </div> */}
-            {/* {ComboDropDown?.length >= 1 && (
-              <div style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}>
-                <TooltipWrapper title="Combo Product" isMobile={isMobile}>
-                  <GiBasket
-                    fill={Comboglobal === true ? '#52C41A' : '#1292EE'}
-                    onClick={handleClick}
+                <TooltipWrapper
+                  placement="topRight"
+                  title="SUMMARY"
+                  isMobile={isMobile}
+                >
+                  <UpCircleOutlined
                     style={{
-                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      cursor: 'pointer',
+                      color: '#ffffffff',
+                      backgroundColor: '#1292ee',
+                      height: '50px',
+                      width: '35px',
+                      display: 'flex',
+                      alignItems: 'center',
+                      justifyContent: 'center',
+                      borderRadius: '0 6px 6px 0',
+                      padding: '7px',
+                      marginTop: '0px',
                     }}
+                    className="BSC1Payment-icon-button"
                   />
                 </TooltipWrapper>
-              </div>
-            )} */}
-            {paymentfeataddon && (
-              <TooltipWrapper title="Failed Payment" isMobile={isMobile}>
-                <div
-                  onClick={() => {
-                    paymentFailedStatusFun();
-                  }}
-                  style={{
-                    width: '27px',
-                    cursor: 'pointer',
-                    fontWeight: '600',
-                    color: 'rgb(18, 146, 238)',
-                  }}
-                >
-                  <PozoFailedPaymentsIcon />
-                </div>
-              </TooltipWrapper>
-            )}
-            {OpenFailData && (
-              <PaymentFailedSales
-                paymentFailedStatusFun={paymentFailedStatusFun}
-                OpenFailData={OpenFailData}
-              />
-            )}
+              </Popover>
+            </div>
           </div>
-        </div>
-        <div className="selctcusandpayBTNforCombo">
-          {BSComboData?.BookingBilling?.[1]?.map((item) => (
-            <>
-              {item?.OptionName == 'AddCustomer' && !preOrderOpen && (
-                <Tooltip
-                  placement="top"
-                  trigger={[]}
-                  title="ALT + Z"
-                  open={isAltPressed}
-                >
-                  <div
-                    style={{ display: 'flex', gap: '0', alignItems: 'center' }}
-                  >
-                    <BSCustomerSelect />
-                    <TooltipWrapper title={'Add Customer'} isMobile={isMobile}>
-                      <div>
-                        <PozoAddCustomerIcon
-                          className="BSBillingNav-icon-table-icon bspaymentcomboAddCus"
-                          onClick={handleAddCustomer}
-                          style={{
-                            display: 'flex',
-                            fontSize: '20px',
-                            width: '35px',
-                            height: '40px',
-                            padding: '4px',
-                            borderRadius: '0 6px 6px 0',
-                            cursor: Custdisable ? 'not-allowed' : 'pointer',
-                            color:
-                              selOption || GetCustId
-                                ? '#ffffffff'
-                                : '#ffffffff',
-                            backgroundColor:
-                              selOption || GetCustId ? '#52c41a' : '#1292EE',
-                          }}
-                        />
-                      </div>
-                    </TooltipWrapper>
-                  </div>
-                </Tooltip>
-              )}
-            </>
-          ))}
-
-          <div className="comboTotalBillBTN">
-            <Tooltip
-              placement="left"
-              trigger={[]}
-              title="F4"
-              open={isAltPressed}
-            >
-              <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
-                <button
-                  className={
-                    // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
-                    addnewAccess
-                      ? 'BSC1Payment-div4-button-disable'
-                      : FirstPaymentclick === false &&
-                          OrderCardDetail?.length > 0 &&
-                          paybtnselected &&
-                          CheckBookingStatus != 'Close'
-                        ? !OrderStatus
-                          ? salesBillEdit &&
-                            currentOrderNetAmount < previousNetAmount
-                            ? 'BSC1Payment-div4-button'
-                            : 'BSC1Payment-div4-button'
-                          : 'BSC1Payment-div4-button Order'
-                        : 'BSC1Payment-div4-button-disable'
-                  }
-                  // onClick={() => {
-                  //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
-                  // }}
-                  onClick={handleButtonClick}
-                  style={{ borderRadius: '6px 0 0 6px' }}
-                >
-                  {!OrderStatus ? (
-                    salesBillEdit &&
-                    currentOrderNetAmount < previousNetAmount ? (
-                      <div className="Table4-Order">
-                        Refund: ₹
-                        {(previousNetAmount || 0) -
-                          (currentOrderNetAmount || 0)}
-                      </div>
-                    ) : (
-                      <>
-                        {isMobile ? (
-                          `₹ ${safeRound(
-                            OrderType === 'Failed'
-                              ? FailedTotalAmt
-                              : credit && overAllBal >= 0
-                                ? Math.max(0, TotalAmount - overAllBal)
-                                : TotalAmount
-                          )}`
-                        ) : (
-                          <div>
-                            ₹
-                            <CountUp
-                              duration={0.4}
-                              className="counter"
-                              end={safeRound(
-                                OrderType === 'Failed'
-                                  ? FailedTotalAmt
-                                  : credit && overAllBal >= 0
-                                    ? Math.max(0, TotalAmount - overAllBal)
-                                    : TotalAmount
-                              )}
-                            />
-                          </div>
-                        )}
-                        <AiOutlineArrowRight width="25px" height="25px" />
-                      </>
+          {PrintOrderDetails?.length > 0 &&
+            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <PaymentPdfBooking
+                  index={index}
+                  table2Data={orderDetail}
+                  singleData2={orderDetail?.productDetails}
+                  orderId={
+                    orderDetail?.OrderId &&
+                    extractLastNumberOrderId(
+                      orderDetail?.OrderId,
+                      orderDetail?.FYStatus
                     )
-                  ) : (
-                    <div className="Table4-Order">ORDER</div>
-                  )}
-                </button>
-              </TooltipWrapper>
-            </Tooltip>
-            <Popover
-              content={
-                <>
-                  <a onClick={hide}>
-                    <AiOutlineClose color="black" />
-                  </a>
-                  <BSSummery1 />
-                </>
-              }
-              trigger="click"
-              open={open}
-              onOpenChange={handleOpenChange}
-            >
-              <TooltipWrapper
-                placement="topRight"
-                title="SUMMARY"
-                isMobile={isMobile}
-              >
-                <UpCircleOutlined
-                  style={{
-                    color: '#ffffffff',
-                    backgroundColor: '#1292ee',
-                    height: '50px',
-                    width: '35px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    borderRadius: '0 6px 6px 0',
-                    padding: '7px',
-                    marginTop: '0px',
-                  }}
-                  className="BSC1Payment-icon-button"
+                  }
+                  CreatedDate={orderDetail?.CreatedDate}
+                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                  Preference={SettingDataSelector}
                 />
-              </TooltipWrapper>
-            </Popover>
-          </div>
-        </div>
-        {PrintOrderDetails?.length > 0 &&
-          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <PaymentPdfBooking
-                index={index}
-                table2Data={orderDetail}
-                singleData2={orderDetail?.productDetails}
-                orderId={
-                  orderDetail?.OrderId &&
-                  extractLastNumberOrderId(
-                    orderDetail?.OrderId,
-                    orderDetail?.FYStatus
-                  )
-                }
-                CreatedDate={orderDetail?.CreatedDate}
-                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                Preference={SettingDataSelector}
-              />
-            </div>
-          ))}
-        {PrintOrderDetails?.length > 0 &&
-          (TokenOnly?.SettingValue === 'Y' ||
-            IndividualToken?.SettingValue === 'Y') &&
-          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <TokensinglePrint
-                index={index}
-                table2Data={orderDetail}
-                singleData2={orderDetail?.productDetails}
-                orderId={
-                  orderDetail?.OrderId &&
-                  extractLastNumberOrderId(
-                    orderDetail?.OrderId,
-                    orderDetail?.FYStatus
-                  )
-                }
-                CreatedDate={orderDetail?.CreatedDate}
-                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-              />
-            </div>
-          ))}
-        {CreditCustomer && (
-          <div style={{ display: 'none' }}>
-            <BsBillingCreditCustomer
-              ModalCreditCustomer={CreditCustomer}
-              handlemodalclose={() => {
-                handleCreditCustomer('Cancel');
-              }}
-              handleOk={() => {
-                handleCreditCustomer('Submit');
-              }}
-            />
-          </div>
-        )}
-      </div>
-      {UpiOpen && (
-        <DefaultModal
-          open={UpiOpen}
-          title="UPI PAYMENT"
-          width={500}
-          handleCancel={() => {
-            Upimodel('Cancel');
-          }}
-          footer={false}
-          children={
-            <div style={{ overflow: 'scroll' }}>
-              {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
-
-              <div
-                style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  justifyContent: 'space-evenly',
-                  alignItems: 'center',
-                }}
-              >
-                <div>
-                  <QrinScreen
-                    Amount={
-                      OrderType === 'Failed'
-                        ? FailedTotalAmt
-                        : Math.round(TotalAmount)
-                    }
-                    UpiId={UpiId}
-                  />
-                </div>
-
-                <div>
-                  <h1>
-                    {' '}
-                    RS :
-                    {OrderType === 'Failed'
-                      ? FailedTotalAmt
-                      : Math.round(TotalAmount)}{' '}
-                  </h1>
-                </div>
               </div>
-
-              <div className="sentok">
-                {(selOption || SelCustId) && (
-                  <div className="sentLink" onClick={onFinalSubmit}>
-                    Sent Payment Link
-                    <img
-                      src={WpIcon}
-                      alt="Your Alt Text"
-                      style={{ width: '30px', height: '30px' }}
-                    />
-                    {/* <ArrowRightOutlined /> */}
-                  </div>
-                )}
+            ))}
+          {PrintOrderDetails?.length > 0 &&
+            (TokenOnly?.SettingValue === 'Y' ||
+              IndividualToken?.SettingValue === 'Y') &&
+            PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+              <div style={{ display: 'none' }}>
+                <TokensinglePrint
+                  index={index}
+                  table2Data={orderDetail}
+                  singleData2={orderDetail?.productDetails}
+                  orderId={
+                    orderDetail?.OrderId &&
+                    extractLastNumberOrderId(
+                      orderDetail?.OrderId,
+                      orderDetail?.FYStatus
+                    )
+                  }
+                  CreatedDate={orderDetail?.CreatedDate}
+                  PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                />
+              </div>
+            ))}
+          {CreditCustomer && (
+            <div style={{ display: 'none' }}>
+              <BsBillingCreditCustomer
+                ModalCreditCustomer={CreditCustomer}
+                handlemodalclose={() => {
+                  handleCreditCustomer('Cancel');
+                }}
+                handleOk={() => {
+                  handleCreditCustomer('Submit');
+                }}
+              />
+            </div>
+          )}
+        </div>
+        {UpiOpen && (
+          <DefaultModal
+            open={UpiOpen}
+            title="UPI PAYMENT"
+            width={500}
+            handleCancel={() => {
+              Upimodel('Cancel');
+            }}
+            footer={false}
+            children={
+              <div style={{ overflow: 'scroll' }}>
+                {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
 
                 <div
                   style={{
                     display: 'flex',
-                    flexDirection: 'row-reverse',
-                    width: '100px',
+                    flexDirection: 'column',
+                    justifyContent: 'space-evenly',
+                    alignItems: 'center',
                   }}
                 >
-                  <Buttons
-                    buttonText="OK"
-                    color="901D77"
-                    icon={<ArrowRightOutlined />}
-                    handleSubmit={() => {
-                      Upimodel('Submit');
+                  <div>
+                    <QrinScreen
+                      Amount={
+                        OrderType === 'Failed'
+                          ? FailedTotalAmt
+                          : Math.round(TotalAmount)
+                      }
+                      UpiId={UpiId}
+                    />
+                  </div>
+
+                  <div>
+                    <h1>
+                      {' '}
+                      RS :
+                      {OrderType === 'Failed'
+                        ? FailedTotalAmt
+                        : Math.round(TotalAmount)}{' '}
+                    </h1>
+                  </div>
+                </div>
+
+                <div className="sentok">
+                  {(selOption || SelCustId) && (
+                    <div className="sentLink" onClick={onFinalSubmit}>
+                      Sent Payment Link
+                      <img
+                        src={WpIcon}
+                        alt="Your Alt Text"
+                        style={{ width: '30px', height: '30px' }}
+                      />
+                      {/* <ArrowRightOutlined /> */}
+                    </div>
+                  )}
+
+                  <div
+                    style={{
+                      display: 'flex',
+                      flexDirection: 'row-reverse',
+                      width: '100px',
                     }}
-                  />
+                  >
+                    <Buttons
+                      buttonText="OK"
+                      color="901D77"
+                      icon={<ArrowRightOutlined />}
+                      handleSubmit={() => {
+                        Upimodel('Submit');
+                      }}
+                    />
+                  </div>
                 </div>
               </div>
-            </div>
-          }
-        />
-      )}
-      {unpaidopen && (
-        <DefaultModal
-          open={unpaidopen}
-          title="UNPAID BILL'S"
-          width={1000}
-          handleCancel={() => {
-            setUnpaidOpen(false);
-          }}
-          footer={false}
-          children={
-            <div style={{ height: '400px', overflow: 'auto' }}>
-              <Tables
-                columns={columns}
-                data={TableData}
-                dataSource={TableData}
-                // pagination={handlePageChange}
-                // onChange={handleChange}
-              />
-            </div>
-          }
-        />
-      )}
-      {/* <Modal title="Add Customer" open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
+            }
+          />
+        )}
+        {unpaidopen && (
+          <DefaultModal
+            open={unpaidopen}
+            title="UNPAID BILL'S"
+            width={1000}
+            handleCancel={() => {
+              setUnpaidOpen(false);
+            }}
+            footer={false}
+            children={
+              <div style={{ height: '400px', overflow: 'auto' }}>
+                <Tables
+                  columns={columns}
+                  data={TableData}
+                  dataSource={TableData}
+                  // pagination={handlePageChange}
+                  // onChange={handleChange}
+                />
+              </div>
+            }
+          />
+        )}
+        {/* <Modal title="Add Customer" open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
 
             </Modal> */}
-      {UnpaidConfirmation && (
-        <Modal
-          open={UnpaidConfirmation}
+        {UnpaidConfirmation && (
+          <Modal
+            open={UnpaidConfirmation}
+            width={500}
+            children={
+              <>
+                <div>
+                  You have already selected a table. If you click 'OK,' the
+                  table selection will be removed, and the unpaid flow will
+                  continue. If you click 'Cancel,' the dine-in flow will proceed
+                  as selected.
+                </div>
+              </>
+            }
+            onOk={UnpaidOk}
+            onCancel={Unpaidclose}
+          />
+        )}
+        {Splitpayment && (
+          <SplitPayment
+            SplitPaymentModal={Splitpayment}
+            handlesplitpaymentclose={handlesplitpaymentclose}
+            TotalNetAmount={
+              OrderType === 'Failed'
+                ? FailedTotalAmt
+                : Math.round(
+                    OrderCardDetail?.reduce(
+                      (acc, data) => data?.TotalAmt + acc,
+                      0
+                    ) -
+                      ((OverAllSales > 0 ? OverAllSales : 0) +
+                        (OverAllEstimate > 0 ? OverAllEstimate : 0) +
+                        (Discount > 0 ? Discount : 0))
+                  )
+            }
+            failedOrderData={failedOrderData}
+          />
+        )}
+        {PrintOrderDetails?.length > 0 && (
+          <div
+            style={{
+              display: 'flex',
+              gap: '1rem',
+              justifyContent: 'center',
+              margin: '1rem 0',
+            }}
+          >
+            {filteredSettingNames?.includes('whatsapp') &&
+              MobileNoWhatsApp?.value && (
+                <FaWhatsapp
+                  size={32}
+                  color="#25D366"
+                  style={{ cursor: 'pointer' }}
+                  onClick={handleWhatsAppClick}
+                  title="Share on WhatsApp"
+                />
+              )}
+
+            <FaPrint
+              size={32}
+              color="#1292EE"
+              style={{ cursor: 'pointer' }}
+              onClick={handlePrintOrToken}
+              title="Print"
+            />
+
+            {filteredSettingNames?.includes('SMS') && isMobile && (
+              <MdSms
+                size={32}
+                color="#FF8800"
+                style={{ cursor: 'pointer' }}
+                onClick={handleSMSClick}
+                title="Send SMS"
+              />
+            )}
+            {/* WhatsAppShare modal/component */}
+            {showWhatsAppShare && (
+              <WhatsAppShare
+                message={encodedMessage}
+                mobileNumber={MobileNoWhatsApp?.value}
+                onClose={() => closePrintOption(false)}
+              />
+            )}
+            {showSMSShare && isMobile && (
+              <SMSShare
+                message={encodedMessage}
+                mobileNumber={MobileNoWhatsApp?.value}
+                onClose={() => closePrintOption(false)}
+              />
+            )}
+          </div>
+        )}
+        <DefaultModal
+          className={'paymentoptionsModal'}
+          open={GlobalSalesPaymentoptions}
+          width={500}
+          height={1000}
+          destroyOnClose={true}
+          handleCancel={() => {
+            dispatch(changeSalesPaymentoption(false));
+          }}
+          footer={false}
+          children={
+            <div
+              className="paymentoptionsModalContent"
+              style={{ overflow: 'scroll' }}
+            >
+              <Paymentoption onSuccess={getPaymentOptionFeature} />
+            </div>
+          }
+        />
+        <DefaultModal
+          open={businessUPI}
+          handleCancel={() => setShowCancelConfirm(true)}
+          footer={false}
           width={500}
           children={
             <>
-              <div>
-                You have already selected a table. If you click 'OK,' the table
-                selection will be removed, and the unpaid flow will continue. If
-                you click 'Cancel,' the dine-in flow will proceed as selected.
-              </div>
+              <PaymentGatewayEmbedded
+                orderId={businessUPIOrderId}
+                setBusinessUPIOrderId={setBusinessUPIOrderId}
+                businessUPILink={businessUPILink}
+                setBusinessUPI={setBusinessUPI}
+                setPaymentSuccess={setPaymentSuccess}
+                paymentSucess={paymentSucess}
+                ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
+                CustomerDisplay={CustomerDisplay}
+              />
             </>
           }
-          onOk={UnpaidOk}
-          onCancel={Unpaidclose}
         />
-      )}
-      {Splitpayment && (
-        <SplitPayment
-          SplitPaymentModal={Splitpayment}
-          handlesplitpaymentclose={handlesplitpaymentclose}
-          TotalNetAmount={
-            OrderType === 'Failed'
-              ? FailedTotalAmt
-              : Math.round(
-                  OrderCardDetail?.reduce(
-                    (acc, data) => data?.TotalAmt + acc,
-                    0
-                  ) -
-                    ((OverAllSales > 0 ? OverAllSales : 0) +
-                      (OverAllEstimate > 0 ? OverAllEstimate : 0) +
-                      (Discount > 0 ? Discount : 0))
-                )
-          }
-          failedOrderData={failedOrderData}
-        />
-      )}
-      {PrintOrderDetails?.length > 0 && (
-        <div
-          style={{
-            display: 'flex',
-            gap: '1rem',
-            justifyContent: 'center',
-            margin: '1rem 0',
-          }}
-        >
-          {filteredSettingNames?.includes('whatsapp') &&
-            MobileNoWhatsApp?.value && (
-              <FaWhatsapp
-                size={32}
-                color="#25D366"
-                style={{ cursor: 'pointer' }}
-                onClick={handleWhatsAppClick}
-                title="Share on WhatsApp"
-              />
-            )}
-
-          <FaPrint
-            size={32}
-            color="#1292EE"
-            style={{ cursor: 'pointer' }}
-            onClick={handlePrintOrToken}
-            title="Print"
-          />
-
-          {filteredSettingNames?.includes('SMS') && isMobile && (
-            <MdSms
-              size={32}
-              color="#FF8800"
-              style={{ cursor: 'pointer' }}
-              onClick={handleSMSClick}
-              title="Send SMS"
-            />
-          )}
-          {/* WhatsAppShare modal/component */}
-          {showWhatsAppShare && (
-            <WhatsAppShare
-              message={encodedMessage}
-              mobileNumber={MobileNoWhatsApp?.value}
-              onClose={() => closePrintOption(false)}
-            />
-          )}
-          {showSMSShare && isMobile && (
-            <SMSShare
-              message={encodedMessage}
-              mobileNumber={MobileNoWhatsApp?.value}
-              onClose={() => closePrintOption(false)}
-            />
-          )}
-        </div>
-      )}
-      <DefaultModal
-        className={'paymentoptionsModal'}
-        open={GlobalSalesPaymentoptions}
-        width={500}
-        height={1000}
-        destroyOnClose={true}
-        handleCancel={() => {
-          dispatch(changeSalesPaymentoption(false));
-        }}
-        footer={false}
-        children={
-          <div
-            className="paymentoptionsModalContent"
-            style={{ overflow: 'scroll' }}
+        {showCancelConfirm && (
+          <Modal
+            open={showCancelConfirm}
+            title="Cancel Payment"
+            onOk={() => {
+              setBusinessUPI(false);
+              setShowCancelConfirm(false);
+              ClearAllGlobalStateDatas();
+              CustomerDisplay();
+            }}
+            onCancel={() => setShowCancelConfirm(false)}
+            okText="Yes"
+            cancelText="No"
           >
-            <Paymentoption onSuccess={getPaymentOptionFeature} />
-          </div>
-        }
-      />
-      <DefaultModal
-        open={businessUPI}
-        handleCancel={() => setShowCancelConfirm(true)}
-        footer={false}
-        width={500}
-        children={
-          <>
-            <PaymentGatewayEmbedded
-              orderId={businessUPIOrderId}
-              setBusinessUPIOrderId={setBusinessUPIOrderId}
-              businessUPILink={businessUPILink}
-              setBusinessUPI={setBusinessUPI}
-              setPaymentSuccess={setPaymentSuccess}
-              paymentSucess={paymentSucess}
-              ClearAllGlobalStateDatas={ClearAllGlobalStateDatas}
-              CustomerDisplay={CustomerDisplay}
-            />
-          </>
-        }
-      />
-      {showCancelConfirm && (
-        <Modal
-          open={showCancelConfirm}
-          title="Cancel Payment"
-          onOk={() => {
-            setBusinessUPI(false);
-            setShowCancelConfirm(false);
-            ClearAllGlobalStateDatas();
-            CustomerDisplay();
-          }}
-          onCancel={() => setShowCancelConfirm(false)}
-          okText="Yes"
-          cancelText="No"
-        >
-          Do you want to cancel the payment?
-        </Modal>
-      )}
-    </>
+            Do you want to cancel the payment?
+          </Modal>
+        )}
+      </>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSCombo/BSC1Search.jsx b/src/Pages/BookingScreen/Components/BSCombo/BSC1Search.jsx
index a567aa5..a29016f 100644
--- a/src/Pages/BookingScreen/Components/BSCombo/BSC1Search.jsx
+++ b/src/Pages/BookingScreen/Components/BSCombo/BSC1Search.jsx
@@ -1,4 +1,11 @@
-import { useEffect, useRef, useState, useCallback } from 'react';
+import {
+  useEffect,
+  useRef,
+  useState,
+  useCallback,
+  Suspense,
+  lazy,
+} from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import moment from 'moment';
 import { BiBarcodeReader } from 'react-icons/bi';
@@ -54,7 +61,9 @@ import { Messages } from '../../../../Components/Notifications/Messages';
 import FormHeader from '../../../PageComponents/FormHeader';
 import { DefaultModal } from '../../../../Components/Modal/DefaultModal';
 import { Tables } from '../../../../Components/Tables/Table';
-import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities';
+const FeaturesFunctionalities = lazy(
+  () => import('../BookingFunctionality/FeaturesFunctionalities')
+);
 import { isMobile } from 'react-device-detect';
 import BarcodeScanner from '../UtillComponents/BarcodeScanner.jsx';
 import {
@@ -80,11 +89,20 @@ import {
 import { Global_PromoCodeOffers } from '../../../../Features/Offer/Offer.js';
 import { validateOffers } from '../BSItemCards/ValidateOffer.jsx';
 import { useSaleswiseOfferWatcher } from '../BSItemCards/SalesWiseOffer.jsx';
-import ExpireConfirmModal from '../BookingFunctionality/ExpireConfirmModal.jsx';
-import BarCodeScan from '../../../../Services/BarCodeScan.jsx';
+const ExpireConfirmModal = lazy(
+  () => import('../BookingFunctionality/ExpireConfirmModal.jsx')
+);
+
+const BarcodeScanner = lazy(
+  () => import('../UtillComponents/BarcodeScanner.jsx')
+);
+
+const BSNavBarWeightScale = lazy(
+  () => import('../UtillComponents/BSNavBarWeightScale.jsx')
+);
 
 export default function BSC1Search(props) {
-  const dispatch = useDispatch(); 
+  const dispatch = useDispatch();
   const searchPromiseRef = useRef(null);
   const debounceTimerRef = useRef(null);
   const SessionData = useSelector(StoredSessionData);
@@ -4499,335 +4517,349 @@ export default function BSC1Search(props) {
   const widthBasedOnProdVariantDetails = getMaxBrandWidth();
 
   return (
-    <>
-      <div
-        className="BSC1Search-container"
-        ref={containerRef}
-        onFocus={handleFocus}
-      >
-        <Messages
-          messageType={messageType}
-          messageData={messageData}
-          onComplete={onComplete}
-        />
+    <Suspense fallback={<div>Loading...</div>}>
+      <>
         <div
-          className="BSC1Search-div1"
-          style={{ pointerEvents: OrderType === 'Failed' ? 'none' : 'auto' }}
-          onClick={() => OnfocusTrue()}
+          className="BSC1Search-container"
+          ref={containerRef}
+          onFocus={handleFocus}
         >
-          <Form ref={formRef}>
-            <Form.Item name="ItemName">
-              <AutoComplete
-                options={
-                  Array.isArray(ProductList) &&
-                  ProductList?.map((option) => ({
-                    value: option.ProdName,
-                    label: (
-                      <div style={{ display: 'flex' }}>
-                        <div
-                          style={{
-                            display: 'flex',
-                            justifyContent: 'space-between',
-                            width: '100%',
-                          }}
-                          onClick={() => {
-                            setOnePeiceFlow(false);
-                          }}
-                        >
-                          {option.ProdName}
-                        </div>
-                        <div>
-                          {option.ProductDetail?.filter(
-                            (item) => item.OnePcsAvailable == 'Y'
-                          ).length !== 0 && (
-                            <GoTriangleRight
-                              style={{
-                                fontSize: '25px',
-                              }}
-                              onClick={() => {
-                                setOnePeiceFlow(true);
-                              }}
-                            />
-                          )}
-                        </div>
-                      </div>
-                    ),
-                  }))
-                }
-                className="Search-auto-field"
-                ref={inputRef}
-                onChange={ProductNameOnChange}
-                onSelect={ProductOnSelect}
-                placeholder="Product Name (SHIFT + S)"
-                allowClear={{
-                  clearIcon: <CloseSquareFilled />,
-                }}
-                autoFocus={autoCompleteVisible}
-                onFocus={handleFocus}
-              />
-            </Form.Item>
-          </Form>
-          {isMobile && screenWidth <= 768 && (
-            // <BiBarcodeReader
-            //   className="BSC1Search-barcodeicon"
-            //   onClick={() => handleQrcode()}
-            //   // onClick={() => OnfocusTrue()}
-            // />
-            <BarCodeScan
-              onScan={(value) => {
-                ProductNameOnChange(value, true);
-              }}
-            />
-          )}
-
-          <FiSearch
-            className="BSC1Search-searchicon"
-            // onClick={() => OnfocusTrue()}
+          <Messages
+            messageType={messageType}
+            messageData={messageData}
+            onComplete={onComplete}
           />
-        </div>
-        {ProductSearch?.length > 5 &&
-          QuickAdd &&
-          GetmultipleSearchDatas.some((e) => e.toLowerCase() === 'qrcode') && (
-            <div>
-              <FeaturesFunctionalities
-                handleQuickAddCancel={handleQuickCancel}
-                QuickAdd={QuickAdd}
-                ProductSearch={true}
-                ProductSearchType={'C'}
-                cardData={SelectedDatas}
+          <div
+            className="BSC1Search-div1"
+            style={{ pointerEvents: OrderType === 'Failed' ? 'none' : 'auto' }}
+            onClick={() => OnfocusTrue()}
+          >
+            <Form ref={formRef}>
+              <Form.Item name="ItemName">
+                <AutoComplete
+                  options={
+                    Array.isArray(ProductList) &&
+                    ProductList?.map((option) => ({
+                      value: option.ProdName,
+                      label: (
+                        <div style={{ display: 'flex' }}>
+                          <div
+                            style={{
+                              display: 'flex',
+                              justifyContent: 'space-between',
+                              width: '100%',
+                            }}
+                            onClick={() => {
+                              setOnePeiceFlow(false);
+                            }}
+                          >
+                            {option.ProdName}
+                          </div>
+                          <div>
+                            {option.ProductDetail?.filter(
+                              (item) => item.OnePcsAvailable == 'Y'
+                            ).length !== 0 && (
+                              <GoTriangleRight
+                                style={{
+                                  fontSize: '25px',
+                                }}
+                                onClick={() => {
+                                  setOnePeiceFlow(true);
+                                }}
+                              />
+                            )}
+                          </div>
+                        </div>
+                      ),
+                    }))
+                  }
+                  className="Search-auto-field"
+                  ref={inputRef}
+                  onChange={ProductNameOnChange}
+                  onSelect={ProductOnSelect}
+                  placeholder="Product Name (SHIFT + S)"
+                  allowClear={{
+                    clearIcon: <CloseSquareFilled />,
+                  }}
+                  autoFocus={autoCompleteVisible}
+                  onFocus={handleFocus}
+                />
+              </Form.Item>
+            </Form>
+            {isMobile && screenWidth <= 768 && (
+              // <BiBarcodeReader
+              //   className="BSC1Search-barcodeicon"
+              //   onClick={() => handleQrcode()}
+              //   // onClick={() => OnfocusTrue()}
+              // />
+              <BarCodeScan
+                onScan={(value) => {
+                  ProductNameOnChange(value, true);
+                }}
               />
-            </div>
-          )}
-        {BSComboData == 'Combo1' &&
-          FeatureAddonData?.FeatureDtls?.find(
-            (item) => item?.FeatureAddonName?.toLowerCase() === 'weight scale'
-          ) && <BSNavBarWeightScale Combo="combolayout" />}
-      </div>
-      {expireModal?.open && (
-        <ExpireConfirmModal
-          open={expireModal?.open}
-          title={expireModal?.title}
-          onOk={() => {
-            expireModal.onOk?.();
-            closeExpireModal();
-          }}
-          onCancel={() => {
-            expireModal.onCancel?.();
-            closeExpireModal();
-          }}
-        />
-      )}
+            )}
 
-      <DefaultModal
-        title={
-          <div className="EditQuantity-title">
-            <FormHeader title={'Item Quantity'} />
+            <FiSearch
+              className="BSC1Search-searchicon"
+              // onClick={() => OnfocusTrue()}
+            />
           </div>
-        }
-        open={modelQty}
-        width={widthBasedOnProdVariantDetails}
-        footer={null}
-        handleCancel={CloseModal}
-      >
-        <div>
-          <div className="EditQuantity-heading">
-            <div className="EditQuantity-headingname">
-              <p className="EditQuantity-itemname">Item Name:</p>
+          {ProductSearch?.length > 5 &&
+            QuickAdd &&
+            GetmultipleSearchDatas.some(
+              (e) => e.toLowerCase() === 'qrcode'
+            ) && (
+              <div>
+                <FeaturesFunctionalities
+                  handleQuickAddCancel={handleQuickCancel}
+                  QuickAdd={QuickAdd}
+                  ProductSearch={true}
+                  ProductSearchType={'C'}
+                  cardData={SelectedDatas}
+                />
+              </div>
+            )}
+          {BSComboData == 'Combo1' &&
+            FeatureAddonData?.FeatureDtls?.find(
+              (item) => item?.FeatureAddonName?.toLowerCase() === 'weight scale'
+            ) && <BSNavBarWeightScale Combo="combolayout" />}
+        </div>
+        {expireModal?.open && (
+          <ExpireConfirmModal
+            open={expireModal?.open}
+            title={expireModal?.title}
+            onOk={() => {
+              expireModal.onOk?.();
+              closeExpireModal();
+            }}
+            onCancel={() => {
+              expireModal.onCancel?.();
+              closeExpireModal();
+            }}
+          />
+        )}
+
+        <DefaultModal
+          title={
+            <div className="EditQuantity-title">
+              <FormHeader title={'Item Quantity'} />
+            </div>
+          }
+          open={modelQty}
+          width={widthBasedOnProdVariantDetails}
+          footer={null}
+          handleCancel={CloseModal}
+        >
+          <div>
+            <div className="EditQuantity-heading">
+              <div className="EditQuantity-headingname">
+                <p className="EditQuantity-itemname">Item Name:</p>
+              </div>
+              <div
+                className="EditQuantity-headingproductname"
+                style={{ marginLeft: '1rem' }}
+              >
+                <p className="EditQuantity-productname">{qtydata?.ProdName}</p>
+              </div>
             </div>
             <div
-              className="EditQuantity-headingproductname"
-              style={{ marginLeft: '1rem' }}
+              className={
+                BrandCheckresult ? 'Card-modal-table' : 'Brand-Card-modal-table'
+              }
             >
-              <p className="EditQuantity-productname">{qtydata?.ProdName}</p>
-            </div>
-          </div>
-          <div
-            className={
-              BrandCheckresult ? 'Card-modal-table' : 'Brand-Card-modal-table'
-            }
-          >
-            {Object.keys(brandMapping)?.map((brandId) => (
-              <div key={brandId} className="Brand-Card">
-                <div className="Brandname">
-                  <h4>
-                    {' '}
-                    {brandId !== 'null' && brandId !== 'undefined'
-                      ? brandId
-                      : ''}
-                  </h4>
-                </div>
+              {Object.keys(brandMapping)?.map((brandId) => (
+                <div key={brandId} className="Brand-Card">
+                  <div className="Brandname">
+                    <h4>
+                      {' '}
+                      {brandId !== 'null' && brandId !== 'undefined'
+                        ? brandId
+                        : ''}
+                    </h4>
+                  </div>
 
-                <div className="BrandDetail">
-                  {brandMapping[brandId]?.map((item, index) => (
-                    <div key={index}>
-                      <div
-                        className={
-                          returnQtyCount(item?.ProdId, item, CartOrderDetails) >
-                            0 || item?.StockAvailable !== 'Y'
-                            ? 'ItemQtyCard'
-                            : 'ItemQtyCard-disabled'
-                        }
-                        onClick={() => VarientFun(item)}
-                      >
-                        <div className="ItemQtyImgCard">
-                          <img
-                            src={
-                              item?.ProdLogo &&
-                              item?.ProdLogo != null &&
-                              item?.ProdLogo != undefined
-                                ? item?.ProdLogo
-                                : defaultimage
-                            }
-                            width={'80px'}
-                            height={'70px'}
-                            alt={`Product ${index}`}
-                          />
-                        </div>
-
-                        <div className="qtyDetail">
-                          <p className="qtyUomName">
-                            {item?.Size + ' ' + item?.UomName}
-                          </p>
-                          {returnQtyCount(
-                            item?.ProdId,
-                            item,
-                            CartOrderDetails
-                          ) > 0 || item?.StockAvailable !== 'Y' ? (
-                            <p className="qtyprice">
-                              <sup style={{ fontFamily: 'Gilroy' }}>₹</sup>
-                              &nbsp;
-                              {
-                                item?.ProdVariantDetails?.[0]?.StockDetails?.[0]
-                                  ?.SellPrice
+                  <div className="BrandDetail">
+                    {brandMapping[brandId]?.map((item, index) => (
+                      <div key={index}>
+                        <div
+                          className={
+                            returnQtyCount(
+                              item?.ProdId,
+                              item,
+                              CartOrderDetails
+                            ) > 0 || item?.StockAvailable !== 'Y'
+                              ? 'ItemQtyCard'
+                              : 'ItemQtyCard-disabled'
+                          }
+                          onClick={() => VarientFun(item)}
+                        >
+                          <div className="ItemQtyImgCard">
+                            <img
+                              src={
+                                item?.ProdLogo &&
+                                item?.ProdLogo != null &&
+                                item?.ProdLogo != undefined
+                                  ? item?.ProdLogo
+                                  : defaultimage
                               }
+                              width={'80px'}
+                              height={'70px'}
+                              alt={`Product ${index}`}
+                            />
+                          </div>
+
+                          <div className="qtyDetail">
+                            <p className="qtyUomName">
+                              {item?.Size + ' ' + item?.UomName}
                             </p>
-                          ) : (
-                            ''
-                          )}
+                            {returnQtyCount(
+                              item?.ProdId,
+                              item,
+                              CartOrderDetails
+                            ) > 0 || item?.StockAvailable !== 'Y' ? (
+                              <p className="qtyprice">
+                                <sup style={{ fontFamily: 'Gilroy' }}>₹</sup>
+                                &nbsp;
+                                {
+                                  item?.ProdVariantDetails?.[0]
+                                    ?.StockDetails?.[0]?.SellPrice
+                                }
+                              </p>
+                            ) : (
+                              ''
+                            )}
+                          </div>
                         </div>
                       </div>
-                    </div>
-                  ))}
+                    ))}
+                  </div>
+                  {brandId !== 'null' && brandId !== 'undefined' ? (
+                    <hr></hr>
+                  ) : (
+                    ''
+                  )}
                 </div>
-                {brandId !== 'null' && brandId !== 'undefined' ? <hr></hr> : ''}
-              </div>
-            ))}
+              ))}
 
-            {Object.keys(brandMapping).length === 0 && (
-              <p>No product details available</p>
-            )}
-          </div>
-        </div>
-      </DefaultModal>
-      <DefaultModal
-        title={
-          <div className="EditQuantity-title">
-            <FormHeader title={'Item Stock'} />
-          </div>
-        }
-        open={modelstock}
-        // width={500}
-        footer={null}
-        handleCancel={CloseModal1}
-      >
-        <div>
-          <div
-            className="EditQuantity-heading"
-            style={{
-              display: 'flex',
-              flexDirection: 'column',
-              marginBottom: '3rem',
-              alignItems: 'start',
-            }}
-          >
-            <div style={{ display: 'flex' }}>
-              <div className="EditQuantity-headingname">
-                <p className="EditQuantity-itemname">Item Name:</p>
-              </div>
-              <div
-                className="EditQuantity-headingproductname"
-                style={{ marginLeft: '1rem' }}
-              >
-                <p className="EditQuantity-productname">{qtydata?.ProdName}</p>
-              </div>
-            </div>
-            <div style={{ display: 'flex' }}>
-              <div className="EditQuantity-headingname">
-                <p className="EditQuantity-itemname">Item Quantity:</p>
-              </div>
-              <div
-                className="EditQuantity-headingproductname"
-                style={{ marginLeft: '1rem' }}
-              >
-                <p className="EditQuantity-productname">
-                  {qtydata?.ProductDetail?.[QtyIndex]?.Size}{' '}
-                  {onePeiceFlow
-                    ? 'PCS'
-                    : qtydata?.ProductDetail?.[QtyIndex]?.UomName}
-                </p>
-              </div>
+              {Object.keys(brandMapping).length === 0 && (
+                <p>No product details available</p>
+              )}
             </div>
           </div>
-          <div className="StockVariantModal">
-            <Tables columns={stockcolumns} data={stockdataSource} />
-          </div>
-        </div>
-      </DefaultModal>
-      <DefaultModal
-        title={
-          <div className="EditQuantity-title">
-            <FormHeader title={'Item Varients'} />
-          </div>
-        }
-        open={ModalVarient}
-        width={500}
-        footer={null}
-        handleCancel={CloseVarientModal}
-      >
-        <div>
-          <div
-            className="EditQuantity-heading"
-            style={{
-              display: 'flex',
-              flexDirection: 'column',
-              marginBottom: '3rem',
-              alignItems: 'start',
-            }}
-          >
-            <div style={{ display: 'flex' }}>
-              <div className="EditQuantity-headingname">
-                <p className="EditQuantity-itemname">Item Name:</p>
+        </DefaultModal>
+        <DefaultModal
+          title={
+            <div className="EditQuantity-title">
+              <FormHeader title={'Item Stock'} />
+            </div>
+          }
+          open={modelstock}
+          // width={500}
+          footer={null}
+          handleCancel={CloseModal1}
+        >
+          <div>
+            <div
+              className="EditQuantity-heading"
+              style={{
+                display: 'flex',
+                flexDirection: 'column',
+                marginBottom: '3rem',
+                alignItems: 'start',
+              }}
+            >
+              <div style={{ display: 'flex' }}>
+                <div className="EditQuantity-headingname">
+                  <p className="EditQuantity-itemname">Item Name:</p>
+                </div>
+                <div
+                  className="EditQuantity-headingproductname"
+                  style={{ marginLeft: '1rem' }}
+                >
+                  <p className="EditQuantity-productname">
+                    {qtydata?.ProdName}
+                  </p>
+                </div>
               </div>
-              <div
-                className="EditQuantity-headingproductname"
-                style={{ marginLeft: '1rem' }}
-              >
-                <p className="EditQuantity-productname">{qtydata?.ProdName}</p>
+              <div style={{ display: 'flex' }}>
+                <div className="EditQuantity-headingname">
+                  <p className="EditQuantity-itemname">Item Quantity:</p>
+                </div>
+                <div
+                  className="EditQuantity-headingproductname"
+                  style={{ marginLeft: '1rem' }}
+                >
+                  <p className="EditQuantity-productname">
+                    {qtydata?.ProductDetail?.[QtyIndex]?.Size}{' '}
+                    {onePeiceFlow
+                      ? 'PCS'
+                      : qtydata?.ProductDetail?.[QtyIndex]?.UomName}
+                  </p>
+                </div>
               </div>
             </div>
-            <div style={{ display: 'flex' }}>
-              <div className="EditQuantity-headingname">
-                <p className="EditQuantity-itemname">Item Quantity:</p>
-              </div>
-              <div
-                className="EditQuantity-headingproductname"
-                style={{ marginLeft: '1rem' }}
-              >
-                <p className="EditQuantity-productname">
-                  {qtydata?.ProductDetail?.[QtyIndex]?.Size}{' '}
-                  {onePeiceFlow
-                    ? 'PCS'
-                    : qtydata?.ProductDetail?.[QtyIndex]?.UomName}
-                </p>
-              </div>
+            <div className="StockVariantModal">
+              <Tables columns={stockcolumns} data={stockdataSource} />
             </div>
           </div>
-          <div className="Card-modal-table">
-            <Tables columns={varientcolumns} data={varientdataSource} />
+        </DefaultModal>
+        <DefaultModal
+          title={
+            <div className="EditQuantity-title">
+              <FormHeader title={'Item Varients'} />
+            </div>
+          }
+          open={ModalVarient}
+          width={500}
+          footer={null}
+          handleCancel={CloseVarientModal}
+        >
+          <div>
+            <div
+              className="EditQuantity-heading"
+              style={{
+                display: 'flex',
+                flexDirection: 'column',
+                marginBottom: '3rem',
+                alignItems: 'start',
+              }}
+            >
+              <div style={{ display: 'flex' }}>
+                <div className="EditQuantity-headingname">
+                  <p className="EditQuantity-itemname">Item Name:</p>
+                </div>
+                <div
+                  className="EditQuantity-headingproductname"
+                  style={{ marginLeft: '1rem' }}
+                >
+                  <p className="EditQuantity-productname">
+                    {qtydata?.ProdName}
+                  </p>
+                </div>
+              </div>
+              <div style={{ display: 'flex' }}>
+                <div className="EditQuantity-headingname">
+                  <p className="EditQuantity-itemname">Item Quantity:</p>
+                </div>
+                <div
+                  className="EditQuantity-headingproductname"
+                  style={{ marginLeft: '1rem' }}
+                >
+                  <p className="EditQuantity-productname">
+                    {qtydata?.ProductDetail?.[QtyIndex]?.Size}{' '}
+                    {onePeiceFlow
+                      ? 'PCS'
+                      : qtydata?.ProductDetail?.[QtyIndex]?.UomName}
+                  </p>
+                </div>
+              </div>
+            </div>
+            <div className="Card-modal-table">
+              <Tables columns={varientcolumns} data={varientdataSource} />
+            </div>
           </div>
-        </div>
-      </DefaultModal>
-      {/* {isMobile && screenWidth <= 768 && (
+        </DefaultModal>
+        {/* {isMobile && screenWidth <= 768 && (
         <DefaultModal
           title="Barcode Reader"
           width={800}
@@ -4846,6 +4878,7 @@ export default function BSC1Search(props) {
           )}
         </DefaultModal>
       )} */}
-    </>
+      </>
+    </Suspense>
   );
 }
diff --git a/src/Pages/BookingScreen/Components/BSItemCards/BSItemCard.jsx b/src/Pages/BookingScreen/Components/BSItemCards/BSItemCard.jsx
index c71de64..b120a6c 100644
--- a/src/Pages/BookingScreen/Components/BSItemCards/BSItemCard.jsx
+++ b/src/Pages/BookingScreen/Components/BSItemCards/BSItemCard.jsx
@@ -6098,7 +6098,7 @@ const BSItemCard = (props) => {
                                 style={{
                                   position: 'relative',
                                   overflow: 'hidden',
-                                  scrollbarWidth:"none"
+                                  scrollbarWidth: 'none',
                                 }}
                                 className={
                                   (item?.OverAllQty !== undefined &&
diff --git a/src/Pages/BookingScreen/Components/BSItemCards/BSOtherServiceItemCard.jsx b/src/Pages/BookingScreen/Components/BSItemCards/BSOtherServiceItemCard.jsx
index b2b0f12..8c0d2cc 100644
--- a/src/Pages/BookingScreen/Components/BSItemCards/BSOtherServiceItemCard.jsx
+++ b/src/Pages/BookingScreen/Components/BSItemCards/BSOtherServiceItemCard.jsx
@@ -75,9 +75,7 @@ import WebFont from 'webfontloader';
 import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities';
 import { isMobile } from 'react-device-detect';
 import { Global_OfferStatus } from '../../../../Features/Offer/Offer';
-import {
-  useApplyOfferto_CardDetail
-} from '../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
+import { useApplyOfferto_CardDetail } from '../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import { GlobalAddCustomerDetails } from '../../../../Features/BookingScreen/Customer/addCustomer.js';
 import {
   DndContext,
@@ -94,8 +92,10 @@ import {
 import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
 import { getCombolist } from '../../../../Features/ComboMaster/ComboMaster.js';
-import { GlobalOtherServicesdata, OtherServicesCardlistdata } from '../../../../Features/OtherServices/OtherServices.js';
-
+import {
+  GlobalOtherServicesdata,
+  OtherServicesCardlistdata,
+} from '../../../../Features/OtherServices/OtherServices.js';
 
 export function SortableCard({ id, children, item }) {
   const {
@@ -185,10 +185,13 @@ const BSOtherServiceItemCard = (props) => {
     SelectedGlobalCardColorDetail,
     shallowEqual
   );
-  const GetmultipleSearchDatas = useSelector(GlobalGetmultipleSearchDatas, shallowEqual)
+  const GetmultipleSearchDatas = useSelector(
+    GlobalGetmultipleSearchDatas,
+    shallowEqual
+  );
   const SelectedCardFont = useSelector(SelectedGlobalCardFont, shallowEqual);
   const CartOrderDetails = useSelector(GlobalOrderCardDetails, shallowEqual);
-  console.log(CartOrderDetails, "CartOrderDetailsOTHERSERVICESITEMCARD");
+  console.log(CartOrderDetails, 'CartOrderDetailsOTHERSERVICESITEMCARD');
   const SelectedDatas = useSelector(GlobalSelectedDatas, shallowEqual);
   const otherscarddata = useSelector(Globalothersdata, shallowEqual);
   const WSProductdata = useSelector(GlobalWSProduct, shallowEqual);
@@ -209,7 +212,6 @@ const BSOtherServiceItemCard = (props) => {
   const SessionData = useSelector(StoredSessionData, shallowEqual);
   const GlobalOtherServicescarddatas = useSelector(GlobalOtherServicesdata);
 
-
   const [messageType, setMessageType] = useState(null);
   const [messageData, setMessageData] = useState(null);
   const [repeatedModel, setRepeatedModel] = useState(false);
@@ -224,7 +226,7 @@ const BSOtherServiceItemCard = (props) => {
 
   const [ComboCardata, setCombocardata] = useState([]);
 
-  const [ExpiredProduct, setExpiredProduct] = useState()
+  const [ExpiredProduct, setExpiredProduct] = useState();
 
   const AppId = SessionData?.AppId;
   const CompId = SessionData?.CompId;
@@ -250,7 +252,7 @@ const BSOtherServiceItemCard = (props) => {
           ? []
           : SelectedDatas
       : ItemCard?.length == 0 ||
-        (ItemCard?.[0]?.AppId === 0 && ItemCard?.[0]?.CompId === 0)
+          (ItemCard?.[0]?.AppId === 0 && ItemCard?.[0]?.CompId === 0)
         ? noSubcatCardData
         : ItemCard
     : '';
@@ -272,7 +274,7 @@ const BSOtherServiceItemCard = (props) => {
   useEffect(() => {
     if (AppId && CompId && BranchId) {
       fetchedit();
-      GetmultipleSearchData()
+      GetmultipleSearchData();
     }
 
     // dispatch(changepreOrder(false)); Commented to Add Normal Produts After Adding the Combo Pack !!!!!! Dont Touch Without Shifayath Permission
@@ -285,10 +287,9 @@ const BSOtherServiceItemCard = (props) => {
     };
 
     try {
-      const response = await dispatch(getmultipleSearch(data))
-
+      const response = await dispatch(getmultipleSearch(data));
     } catch (error) {
-      console.error("Get Search Terms Error:", error);
+      console.error('Get Search Terms Error:', error);
     }
   };
   useEffect(() => {
@@ -307,12 +308,12 @@ const BSOtherServiceItemCard = (props) => {
     if (noSubcatCardData) {
       setNoSubcatCardData();
     }
-    if (ProductSearch?.length > 5 && GetmultipleSearchDatas.some(
-      e => e.toLowerCase() === "qrcode"
-    )) {
+    if (
+      ProductSearch?.length > 5 &&
+      GetmultipleSearchDatas.some((e) => e.toLowerCase() === 'qrcode')
+    ) {
       setQuickAdd(true);
     }
-
   }, [ProductSearch, GetmultipleSearchDatas]);
 
   useEffect(() => {
@@ -418,95 +419,94 @@ const BSOtherServiceItemCard = (props) => {
       let Data = response?.data?.data;
 
       setCombocardata(Data);
-
     }
   };
 
   let Otherservicedata = [
     {
-      "CompId": 1,
-      "BranchId": 101,
-      "AppId": 2025,
-      "ConfigTypeId": 10,
-      "ConfigTypeIdName": "Other Services",
-      "ServiceCategories": [
+      CompId: 1,
+      BranchId: 101,
+      AppId: 2025,
+      ConfigTypeId: 10,
+      ConfigTypeIdName: 'Other Services',
+      ServiceCategories: [
         {
-          "ServiceCategory": 1,
-          "ServiceCategoryName": "Parking",
-          "ServiceDetails": [
+          ServiceCategory: 1,
+          ServiceCategoryName: 'Parking',
+          ServiceDetails: [
             {
-              "ServiceId": "PK2W",
-              "ServiceCategory": 1,
-              "ServiceCategoryName": "Parking",
-              "ServiceName": "2-Wheeler Parking",
-              "ServiceShortName": "2W",
-              "TaxId": "T1",
-              "TaxName": "GST 5%",
-              "TaxAmt": 1.50,
-              "Rate": 30.00,
-              "TotalAmt": 31.50,
-              "ActiveStatus": "Active"
+              ServiceId: 'PK2W',
+              ServiceCategory: 1,
+              ServiceCategoryName: 'Parking',
+              ServiceName: '2-Wheeler Parking',
+              ServiceShortName: '2W',
+              TaxId: 'T1',
+              TaxName: 'GST 5%',
+              TaxAmt: 1.5,
+              Rate: 30.0,
+              TotalAmt: 31.5,
+              ActiveStatus: 'Active',
             },
             {
-              "ServiceId": "PK4W",
-              "ServiceCategory": 1,
-              "ServiceCategoryName": "Parking",
-              "ServiceName": "4-Wheeler Parking",
-              "ServiceShortName": "4W",
-              "TaxId": "T1",
-              "TaxName": "GST 5%",
-              "TaxAmt": 2.50,
-              "Rate": 50.00,
-              "TotalAmt": 52.50,
-              "ActiveStatus": "Active"
-            }
-          ]
+              ServiceId: 'PK4W',
+              ServiceCategory: 1,
+              ServiceCategoryName: 'Parking',
+              ServiceName: '4-Wheeler Parking',
+              ServiceShortName: '4W',
+              TaxId: 'T1',
+              TaxName: 'GST 5%',
+              TaxAmt: 2.5,
+              Rate: 50.0,
+              TotalAmt: 52.5,
+              ActiveStatus: 'Active',
+            },
+          ],
         },
         {
-          "ServiceCategory": 2,
-          "ServiceCategoryName": "Entrance",
-          "ServiceDetails": [
+          ServiceCategory: 2,
+          ServiceCategoryName: 'Entrance',
+          ServiceDetails: [
             {
-              "ServiceId": "ENAD",
-              "ServiceCategory": 2,
-              "ServiceCategoryName": "Entrance",
-              "ServiceName": "Adult Entry",
-              "ServiceShortName": "Adult",
-              "TaxId": "T2",
-              "TaxName": "GST 12%",
-              "TaxAmt": 6.00,
-              "Rate": 50.00,
-              "TotalAmt": 56.00,
-              "ActiveStatus": "Active"
+              ServiceId: 'ENAD',
+              ServiceCategory: 2,
+              ServiceCategoryName: 'Entrance',
+              ServiceName: 'Adult Entry',
+              ServiceShortName: 'Adult',
+              TaxId: 'T2',
+              TaxName: 'GST 12%',
+              TaxAmt: 6.0,
+              Rate: 50.0,
+              TotalAmt: 56.0,
+              ActiveStatus: 'Active',
             },
             {
-              "ServiceId": "ENCH",
-              "ServiceCategory": 2,
-              "ServiceCategoryName": "Entrance",
-              "ServiceName": "Child Entry",
-              "ServiceShortName": "Child",
-              "TaxId": "T2",
-              "TaxName": "GST 12%",
-              "TaxAmt": 3.00,
-              "Rate": 25.00,
-              "TotalAmt": 28.00,
-              "ActiveStatus": "Active"
-            }
-          ]
-        }
-      ]
-    }
-  ]
-
+              ServiceId: 'ENCH',
+              ServiceCategory: 2,
+              ServiceCategoryName: 'Entrance',
+              ServiceName: 'Child Entry',
+              ServiceShortName: 'Child',
+              TaxId: 'T2',
+              TaxName: 'GST 12%',
+              TaxAmt: 3.0,
+              Rate: 25.0,
+              TotalAmt: 28.0,
+              ActiveStatus: 'Active',
+            },
+          ],
+        },
+      ],
+    },
+  ];
 
   const processGlobalComboData = () => {
-
     const serviceCategories = GlobalOtherServicescarddatas?.[0]?.ServiceDetails;
 
     if (!Array.isArray(serviceCategories)) return [];
 
     // Flatten all ServiceDetails into a single array
-    const allServiceDetails = serviceCategories.map((category) => category.ServiceDetails || []);
+    const allServiceDetails = serviceCategories.map(
+      (category) => category.ServiceDetails || []
+    );
 
     const comboList = serviceCategories.map((item, index) => ({
       ...item,
@@ -520,7 +520,6 @@ const BSOtherServiceItemCard = (props) => {
 
   const comboList = processGlobalComboData() || [];
 
-
   useEffect(() => {
     DispatchData();
   }, [SelectedProdNames]);
@@ -536,7 +535,6 @@ const BSOtherServiceItemCard = (props) => {
   }, [WSProductdata]);
 
   useEffect(() => {
-
     if (ItemCard?.[0]?.QrBasedSearch === 'Y') {
       if (ItemCard?.[0]?.OverAllExpStatus == 'Y' && ExpiredProduct) {
         setexpModel(true);
@@ -632,10 +630,11 @@ const BSOtherServiceItemCard = (props) => {
     );
     setBillOrderPre(BillOrder?.SettingValue);
 
-    const expiredDate = PreferenceStckDtl?.find(
-      (item) => item.SettingIdName === 'ExpiredSelection'
-    )?.SettingValue === 'Y';
-    setExpiredProduct(expiredDate)
+    const expiredDate =
+      PreferenceStckDtl?.find(
+        (item) => item.SettingIdName === 'ExpiredSelection'
+      )?.SettingValue === 'Y';
+    setExpiredProduct(expiredDate);
   };
 
   const CloseModal = () => {
@@ -681,13 +680,13 @@ const BSOtherServiceItemCard = (props) => {
           (cartItem) =>
             cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-              VarientIndex
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             cartItem?.OrderRate ===
-            item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-              VarientIndex
-            ]?.StockDetails?.[0]?.SellPrice &&
+              item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                VarientIndex
+              ]?.StockDetails?.[0]?.SellPrice &&
             !cartItem?.SalesId
         );
 
@@ -696,9 +695,9 @@ const BSOtherServiceItemCard = (props) => {
             (cartItem) =>
               cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
               cartItem?.InwardDtlId ===
-              item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                VarientIndex
-              ]?.StockDetails?.[0]?.InwardDtlId &&
+                item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  VarientIndex
+                ]?.StockDetails?.[0]?.InwardDtlId &&
               // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
               !cartItem?.SalesId
           );
@@ -740,11 +739,11 @@ const BSOtherServiceItemCard = (props) => {
         (cartItem) =>
           cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
           cartItem?.InwardDtlId ===
-          item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-            ?.StockDetails?.[0]?.InwardDtlId &&
+            item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
+              ?.StockDetails?.[0]?.InwardDtlId &&
           cartItem?.OrderRate ===
-          item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-            ?.StockDetails?.[0]?.SellPrice &&
+            item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
+              ?.StockDetails?.[0]?.SellPrice &&
           !cartItem?.SalesId
       );
 
@@ -753,9 +752,9 @@ const BSOtherServiceItemCard = (props) => {
           (cartItem) =>
             cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-              VarientIndex
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
             !cartItem?.SalesId
         );
@@ -808,7 +807,7 @@ const BSOtherServiceItemCard = (props) => {
         if (
           overallExpStatus === 'N' ||
           // (overallExpStatus === 'Y' && prodexpir)
-          (overallExpStatus === 'Y')
+          overallExpStatus === 'Y'
         ) {
           setModalVarient(false);
           setModelstock(true);
@@ -829,13 +828,13 @@ const BSOtherServiceItemCard = (props) => {
             (cartItem) =>
               cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
               cartItem?.InwardDtlId ===
-              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                index.key
-              ]?.StockDetails?.[0]?.InwardDtlId &&
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.InwardDtlId &&
               cartItem?.OrderRate ===
-              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                index.key
-              ]?.StockDetails?.[0]?.SellPrice &&
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.SellPrice &&
               !cartItem?.SalesId
           );
 
@@ -843,11 +842,11 @@ const BSOtherServiceItemCard = (props) => {
             let Isincartonepc = CartOrderDetails?.filter(
               (cartItem) =>
                 cartItem?.ProdId ===
-                qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
+                  qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
                 cartItem?.InwardDtlId ===
-                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                  index.key
-                ]?.StockDetails?.[0]?.InwardDtlId &&
+                  qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                    index.key
+                  ]?.StockDetails?.[0]?.InwardDtlId &&
                 // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
                 !cartItem?.SalesId
             );
@@ -896,32 +895,28 @@ const BSOtherServiceItemCard = (props) => {
         }
       }
     } else {
-
-      if (
-        overallExpStatus === 'N' ||
-        (overallExpStatus === 'Y' && prodexpir)
-      ) {
+      if (overallExpStatus === 'N' || (overallExpStatus === 'Y' && prodexpir)) {
         setModalVarient(false);
         setModelstock(true);
         setVarItem(index.key);
         if (overallExpStatus === 'Y' && prodexpir) {
           setRepeatedModel(true);
         }
-        return
+        return;
       } else if (overallExpStatus === 'Y' && ExpiredProduct) {
         setVarItem(index.key);
         setexpVarModel(true);
-        return
+        return;
       }
       let Isincart = CartOrderDetails?.find(
         (cartItem) =>
           cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
           cartItem?.InwardDtlId ===
-          qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[index.key]
-            ?.StockDetails?.[0]?.InwardDtlId &&
+            qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[index.key]
+              ?.StockDetails?.[0]?.InwardDtlId &&
           cartItem?.OrderRate ===
-          qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[index.key]
-            ?.StockDetails?.[0]?.SellPrice &&
+            qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[index.key]
+              ?.StockDetails?.[0]?.SellPrice &&
           !cartItem?.SalesId
       );
       if (onePeiceFlow) {
@@ -929,9 +924,9 @@ const BSOtherServiceItemCard = (props) => {
           (cartItem) =>
             cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-              index.key
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                index.key
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
             !cartItem?.SalesId
         );
@@ -1026,15 +1021,15 @@ const BSOtherServiceItemCard = (props) => {
         let Isincart = CartOrderDetails?.find(
           (cartItem) =>
             cartItem?.ProdId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-              item?.VarientIndex
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             cartItem?.OrderRate ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-              item?.VarientIndex
-            ]?.StockDetails?.[0]?.SellPrice &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.SellPrice &&
             !cartItem?.SalesId
         );
 
@@ -1042,11 +1037,11 @@ const BSOtherServiceItemCard = (props) => {
           let Isincartonepc = CartOrderDetails?.filter(
             (cartItem) =>
               cartItem?.ProdId ===
-              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+                qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
               cartItem?.InwardDtlId ===
-              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-                item?.VarientIndex
-              ]?.StockDetails?.[0]?.InwardDtlId &&
+                qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                  item?.VarientIndex
+                ]?.StockDetails?.[0]?.InwardDtlId &&
               // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
               !cartItem?.SalesId
           );
@@ -1124,15 +1119,15 @@ const BSOtherServiceItemCard = (props) => {
       let Isincart = CartOrderDetails?.find(
         (cartItem) =>
           cartItem?.ProdId ===
-          qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
           cartItem?.InwardDtlId ===
-          qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-            item?.VarientIndex
-          ]?.StockDetails?.[0]?.InwardDtlId &&
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+              item?.VarientIndex
+            ]?.StockDetails?.[0]?.InwardDtlId &&
           cartItem?.OrderRate ===
-          qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-            item?.VarientIndex
-          ]?.StockDetails?.[0]?.SellPrice &&
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+              item?.VarientIndex
+            ]?.StockDetails?.[0]?.SellPrice &&
           !cartItem?.SalesId
       );
 
@@ -1140,11 +1135,11 @@ const BSOtherServiceItemCard = (props) => {
         let Isincartonepc = CartOrderDetails?.filter(
           (cartItem) =>
             cartItem?.ProdId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-              item?.VarientIndex
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
             !cartItem?.SalesId
         );
@@ -1575,7 +1570,7 @@ const BSOtherServiceItemCard = (props) => {
         <span
           style={
             record.StockCount > 0 ||
-              record.StockCount === 'Stock Not Maintained'
+            record.StockCount === 'Stock Not Maintained'
               ? { color: '#000', cursor: 'pointer' }
               : { color: '#f49898', cursor: 'not-allowed' }
           }
@@ -1605,7 +1600,7 @@ const BSOtherServiceItemCard = (props) => {
         <span
           style={
             record.StockCount > 0 ||
-              record.StockCount === 'Stock Not Maintained'
+            record.StockCount === 'Stock Not Maintained'
               ? { color: '#000', cursor: 'pointer' }
               : { color: '#f49898', cursor: 'not-allowed' }
           }
@@ -1635,7 +1630,7 @@ const BSOtherServiceItemCard = (props) => {
         <span
           style={
             record.StockCount > 0 ||
-              record.StockCount === 'Stock Not Maintained'
+            record.StockCount === 'Stock Not Maintained'
               ? { color: '#000', cursor: 'pointer' }
               : { color: '#f49898', cursor: 'not-allowed' }
           }
@@ -1679,17 +1674,17 @@ const BSOtherServiceItemCard = (props) => {
         qtydata?.ProductDetail?.[QtyIndex]?.StockAvailable === 'Y'
           ? onePeiceFlow
             ? returnVariantStock(
-              qtydata?.ProductDetail?.[QtyIndex]?.ProdId,
-              item?.OverAllPcs,
-              CartOrderDetails,
-              item?.ProdVariantName
-            )
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdId,
+                item?.OverAllPcs,
+                CartOrderDetails,
+                item?.ProdVariantName
+              )
             : returnVariantStock(
-              qtydata?.ProductDetail?.[QtyIndex]?.ProdId,
-              item?.OverAllQty,
-              CartOrderDetails,
-              item?.ProdVariantName
-            )
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdId,
+                item?.OverAllQty,
+                CartOrderDetails,
+                item?.ProdVariantName
+              )
           : 'Stock Not Maintained',
     });
   });
@@ -1698,7 +1693,7 @@ const BSOtherServiceItemCard = (props) => {
     if (WeightScalePort === true) {
       if (
         a?.ProductDetail?.[QtyIndex]?.UomName?.toLowerCase() ===
-        'KGS'?.toLowerCase() &&
+          'KGS'?.toLowerCase() &&
         a?.ProductDetail?.[QtyIndex]?.Size == '1'
       ) {
         if (WeightScaleWeight > 0 && WeightScaleWeight !== null) {
@@ -1706,13 +1701,13 @@ const BSOtherServiceItemCard = (props) => {
             parseFloat(
               onePcs
                 ? (a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                  VarientIndex
-                ]?.StockDetails?.[stockIndex]?.OnePcsPrice /
-                  1000) *
-                (parseFloat(WeightScaleWeight) * 1000)
+                    VarientIndex
+                  ]?.StockDetails?.[stockIndex]?.OnePcsPrice /
+                    1000) *
+                    (parseFloat(WeightScaleWeight) * 1000)
                 : a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                  VarientIndex
-                ]?.StockDetails?.[stockIndex]?.SellPrice / 1000
+                    VarientIndex
+                  ]?.StockDetails?.[stockIndex]?.SellPrice / 1000
             ) *
             (parseFloat(WeightScaleWeight) * 1000);
           let data = {
@@ -1775,9 +1770,9 @@ const BSOtherServiceItemCard = (props) => {
                 ?.StockDetails?.[stockIndex]?.InwardId,
             MRP: onePcs
               ? a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-                ?.StockDetails?.[stockIndex]?.OnePcsPrice
+                  ?.StockDetails?.[stockIndex]?.OnePcsPrice
               : a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-                ?.StockDetails?.[stockIndex]?.MRP,
+                  ?.StockDetails?.[stockIndex]?.MRP,
             OrderRate: parseFloat(TotalOrderRate).toFixed(2),
             SellingPrice: parseFloat(TotalOrderRate).toFixed(2),
             SuppId:
@@ -1801,7 +1796,7 @@ const BSOtherServiceItemCard = (props) => {
           setQtyIndex(0);
           setVarientIndex(0);
           setVarItem(0);
-          setItem(), setStockItem();
+          (setItem(), setStockItem());
           dispatch(changeSearchedData(''));
           AddOrderDetails(data);
           dispatch(changeWeightScaleWeight(null));
@@ -1889,19 +1884,19 @@ const BSOtherServiceItemCard = (props) => {
               ?.StockDetails?.[stockIndex]?.InwardId,
           MRP: onePcs
             ? a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-              ?.StockDetails?.[stockIndex]?.OnePcsPrice
+                ?.StockDetails?.[stockIndex]?.OnePcsPrice
             : a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-              ?.StockDetails?.[stockIndex]?.MRP,
+                ?.StockDetails?.[stockIndex]?.MRP,
           OrderRate: onePcs
             ? a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-              ?.StockDetails?.[stockIndex]?.OnePcsPrice
+                ?.StockDetails?.[stockIndex]?.OnePcsPrice
             : a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-              ?.StockDetails?.[stockIndex]?.SellPrice,
+                ?.StockDetails?.[stockIndex]?.SellPrice,
           SellingPrice: onePcs
             ? a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-              ?.StockDetails?.[stockIndex]?.OnePcsPrice
+                ?.StockDetails?.[stockIndex]?.OnePcsPrice
             : a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
-              ?.StockDetails?.[stockIndex]?.SellPrice,
+                ?.StockDetails?.[stockIndex]?.SellPrice,
           SuppId:
             a?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
               ?.StockDetails?.[stockIndex]?.SuppId,
@@ -1923,7 +1918,7 @@ const BSOtherServiceItemCard = (props) => {
         setQtyIndex(0);
         setVarientIndex(0);
         setVarItem(0);
-        setItem(), setStockItem();
+        (setItem(), setStockItem());
         dispatch(changeSearchedData(''));
         AddOrderDetails(data);
         setOnePeiceFlow(false);
@@ -1938,7 +1933,7 @@ const BSOtherServiceItemCard = (props) => {
         setQtyIndex(0);
         setVarientIndex(0);
         setVarItem(0);
-        setItem(), setStockItem();
+        (setItem(), setStockItem());
         dispatch(changeSearchedData(''));
         setOnePeiceFlow(false);
       }
@@ -2903,12 +2898,9 @@ const BSOtherServiceItemCard = (props) => {
   };
 
   const onAutocompleteChange = async (selectedOption) => {
-
-
-    console.log(selectedOption, "selectedOptionselectedOption");
+    console.log(selectedOption, 'selectedOptionselectedOption');
 
     let data = {
-
       Type: 'OS',
 
       ActiveStatus: selectedOption?.ActiveStatus,
@@ -2927,7 +2919,6 @@ const BSOtherServiceItemCard = (props) => {
 
       ProdLogo: selectedOption?.ImageUrl,
 
-
       OrderRate: selectedOption?.TotalAmt,
       TotalAmt: selectedOption?.TotalAmt,
       TotalSellPrice: selectedOption?.TotalAmt,
@@ -2963,7 +2954,7 @@ const BSOtherServiceItemCard = (props) => {
   };
 
   const AddOrderDetails = async (item) => {
-    console.log("AddOrderDetails item", item)
+    console.log('AddOrderDetails item', item);
     if (preOrder) {
       let Response = await dispatch(
         getConfigType({ TypeName: 'Booking Type' })
@@ -2983,8 +2974,7 @@ const BSOtherServiceItemCard = (props) => {
       if (Condition !== undefined && Condition === true) {
         setMessageData('Dublicate Data');
         setMessageType('error');
-      }
-      else {
+      } else {
         let OfferPri =
           item?.OfferType === 'F'
             ? item?.OfferPrice
@@ -3050,9 +3040,7 @@ const BSOtherServiceItemCard = (props) => {
           dispatch(changepreOrderList(Data));
         }
       }
-    }
-    else {
-
+    } else {
       dispatch(changeHoldOrderDtl(false));
       dispatch(changePreviousOrderLength(CartOrderDetails?.length));
       const OtherOrderDatas = CartOrderDetails?.filter(
@@ -3121,56 +3109,7 @@ const BSOtherServiceItemCard = (props) => {
       const BookingTypeProd = item?.BookingTypeName;
       if (isItemInCart && BookingTypeProd != 'Dine In' && OrderType != 'Hold') {
         if (BillOrderPre === 'Y') {
-
           const UpdatedCartItem =
-          // if the item is already in the cart, increase the quantity of the item
-          {
-            ...isItemInCart,
-            OrderQty: isItemInCart?.OrderQty + 1,
-            TotalAmt:
-              isItemInCart?.OfferPrice > 0
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
-                (isItemInCart?.OfferType === 'F'
-                  ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemInCart?.OrderQty + 1) *
-                    isItemInCart?.OrderRate *
-                    isItemInCart?.OfferPrice) /
-                  100)
-                : (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate,
-            // TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
-            OfferValue:
-              item?.OfferType === 'F'
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                : isItemInCart?.OfferPrice,
-
-            TaxAmt: (
-              ((isItemInCart?.OrderQty + 1) *
-                isItemInCart?.OrderRate *
-                isItemInCart?.TaxPercentage) /
-              (100 + isItemInCart?.TaxPercentage)
-            ).toFixed(2),
-            WithoutTaxRate:
-              (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
-              (
-                ((isItemInCart?.OrderQty + 1) *
-                  isItemInCart?.OrderRate *
-                  isItemInCart?.TaxPercentage) /
-                (100 + isItemInCart?.TaxPercentage)
-              ).toFixed(2),
-          };
-
-          dispatch(
-            changeOrderCardDetails([
-              UpdatedCartItem,
-              ...OtherorderDataforNormal,
-            ])
-          );
-        }
-        else {
-
-          const isGroupService = isItemInCart?.ServiceType == 'G';
-          if (isGroupService) {
-            const UpdatedCartItem =
             // if the item is already in the cart, increase the quantity of the item
             {
               ...isItemInCart,
@@ -3178,21 +3117,19 @@ const BSOtherServiceItemCard = (props) => {
               TotalAmt:
                 isItemInCart?.OfferPrice > 0
                   ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
-                  (isItemInCart?.OfferType === 'F'
-                    ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                    : ((isItemInCart?.OrderQty + 1) *
-                      isItemInCart?.OrderRate *
-                      isItemInCart?.OfferPrice) /
-                    100)
+                    (isItemInCart?.OfferType === 'F'
+                      ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                      : ((isItemInCart?.OrderQty + 1) *
+                          isItemInCart?.OrderRate *
+                          isItemInCart?.OfferPrice) /
+                        100)
                   : (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate,
+              // TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
               OfferValue:
                 item?.OfferType === 'F'
                   ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemInCart?.OrderQty + 1) *
-                    isItemInCart?.OrderRate *
-                    isItemInCart?.OfferPrice) /
-                  100,
-              //  TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
+                  : isItemInCart?.OfferPrice,
+
               TaxAmt: (
                 ((isItemInCart?.OrderQty + 1) *
                   isItemInCart?.OrderRate *
@@ -3209,6 +3146,55 @@ const BSOtherServiceItemCard = (props) => {
                 ).toFixed(2),
             };
 
+          dispatch(
+            changeOrderCardDetails([
+              UpdatedCartItem,
+              ...OtherorderDataforNormal,
+            ])
+          );
+        } else {
+          const isGroupService = isItemInCart?.ServiceType == 'G';
+          if (isGroupService) {
+            const UpdatedCartItem =
+              // if the item is already in the cart, increase the quantity of the item
+              {
+                ...isItemInCart,
+                OrderQty: isItemInCart?.OrderQty + 1,
+                TotalAmt:
+                  isItemInCart?.OfferPrice > 0
+                    ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
+                      (isItemInCart?.OfferType === 'F'
+                        ? (isItemInCart?.OrderQty + 1) *
+                          isItemInCart?.OfferPrice
+                        : ((isItemInCart?.OrderQty + 1) *
+                            isItemInCart?.OrderRate *
+                            isItemInCart?.OfferPrice) /
+                          100)
+                    : (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate,
+                OfferValue:
+                  item?.OfferType === 'F'
+                    ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                    : ((isItemInCart?.OrderQty + 1) *
+                        isItemInCart?.OrderRate *
+                        isItemInCart?.OfferPrice) /
+                      100,
+                //  TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
+                TaxAmt: (
+                  ((isItemInCart?.OrderQty + 1) *
+                    isItemInCart?.OrderRate *
+                    isItemInCart?.TaxPercentage) /
+                  (100 + isItemInCart?.TaxPercentage)
+                ).toFixed(2),
+                WithoutTaxRate:
+                  (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
+                  (
+                    ((isItemInCart?.OrderQty + 1) *
+                      isItemInCart?.OrderRate *
+                      isItemInCart?.TaxPercentage) /
+                    (100 + isItemInCart?.TaxPercentage)
+                  ).toFixed(2),
+              };
+
             dispatch(
               changeOrderCardDetails([
                 ...OtherorderDataforNormal,
@@ -3218,50 +3204,51 @@ const BSOtherServiceItemCard = (props) => {
           } else {
             // ❌ Not a group service
             setMessageType('error');
-            setMessageData("Service Already Exist")
+            setMessageData('Service Already Exist');
           }
-
         }
-      }
-      else if (isItemInCart && BookingTypeProd === 'Dine In' && OrderType != 'Hold') {
-
+      } else if (
+        isItemInCart &&
+        BookingTypeProd === 'Dine In' &&
+        OrderType != 'Hold'
+      ) {
         if (BillOrderPre === 'Y') {
           const UpdatedCartItem =
-          // if the item is already in the cart, increase the quantity of the item
-          {
-            ...isItemInCart,
-            OrderQty: isItemInCart?.OrderQty + 1,
-            TotalAmt:
-              isItemInCart?.OfferPrice > 0
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
-                (isItemInCart?.OfferType === 'F'
+            // if the item is already in the cart, increase the quantity of the item
+            {
+              ...isItemInCart,
+              OrderQty: isItemInCart?.OrderQty + 1,
+              TotalAmt:
+                isItemInCart?.OfferPrice > 0
+                  ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
+                    (isItemInCart?.OfferType === 'F'
+                      ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                      : ((isItemInCart?.OrderQty + 1) *
+                          isItemInCart?.OrderRate *
+                          isItemInCart?.OfferPrice) /
+                        100)
+                  : (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate,
+              OfferValue:
+                item?.OfferType === 'F'
                   ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemInCart?.OrderQty + 1) *
-                    isItemInCart?.OrderRate *
-                    isItemInCart?.OfferPrice) /
-                  100)
-                : (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate,
-            OfferValue:
-              item?.OfferType === 'F'
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                : isItemInCart?.OfferPrice,
+                  : isItemInCart?.OfferPrice,
 
-            // TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
-            TaxAmt: (
-              ((isItemInCart?.OrderQty + 1) *
-                isItemInCart?.OrderRate *
-                isItemInCart?.TaxPercentage) /
-              (100 + isItemInCart?.TaxPercentage)
-            ).toFixed(2),
-            WithoutTaxRate:
-              (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
-              (
+              // TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
+              TaxAmt: (
                 ((isItemInCart?.OrderQty + 1) *
                   isItemInCart?.OrderRate *
                   isItemInCart?.TaxPercentage) /
                 (100 + isItemInCart?.TaxPercentage)
               ).toFixed(2),
-          };
+              WithoutTaxRate:
+                (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
+                (
+                  ((isItemInCart?.OrderQty + 1) *
+                    isItemInCart?.OrderRate *
+                    isItemInCart?.TaxPercentage) /
+                  (100 + isItemInCart?.TaxPercentage)
+                ).toFixed(2),
+            };
 
           dispatch(
             changeOrderCardDetails([
@@ -3269,44 +3256,43 @@ const BSOtherServiceItemCard = (props) => {
               ...OtherorderDataforNormal,
             ])
           );
-        }
-        else {
+        } else {
           const UpdatedCartItem =
-          // if the item is already in the cart, increase the quantity of the item
-          {
-            ...isItemInCart,
-            OrderQty: isItemInCart?.OrderQty + 1,
-            TotalAmt:
-              isItemInCart?.OfferPrice > 0
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
-                (isItemInCart?.OfferType === 'F'
+            // if the item is already in the cart, increase the quantity of the item
+            {
+              ...isItemInCart,
+              OrderQty: isItemInCart?.OrderQty + 1,
+              TotalAmt:
+                isItemInCart?.OfferPrice > 0
+                  ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
+                    (isItemInCart?.OfferType === 'F'
+                      ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                      : ((isItemInCart?.OrderQty + 1) *
+                          isItemInCart?.OrderRate *
+                          isItemInCart?.OfferPrice) /
+                        100)
+                  : (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate,
+              OfferValue:
+                item?.OfferType === 'F'
                   ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemInCart?.OrderQty + 1) *
-                    isItemInCart?.OrderRate *
-                    isItemInCart?.OfferPrice) /
-                  100)
-                : (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate,
-            OfferValue:
-              item?.OfferType === 'F'
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                : isItemInCart?.OfferPrice,
+                  : isItemInCart?.OfferPrice,
 
-            // TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
-            TaxAmt: (
-              ((isItemInCart?.OrderQty + 1) *
-                isItemInCart?.OrderRate *
-                isItemInCart?.TaxPercentage) /
-              (100 + isItemInCart?.TaxPercentage)
-            ).toFixed(2),
-            WithoutTaxRate:
-              (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
-              (
+              // TotalAmt: ((isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate),
+              TaxAmt: (
                 ((isItemInCart?.OrderQty + 1) *
                   isItemInCart?.OrderRate *
                   isItemInCart?.TaxPercentage) /
                 (100 + isItemInCart?.TaxPercentage)
               ).toFixed(2),
-          };
+              WithoutTaxRate:
+                (isItemInCart?.OrderQty + 1) * isItemInCart?.OrderRate -
+                (
+                  ((isItemInCart?.OrderQty + 1) *
+                    isItemInCart?.OrderRate *
+                    isItemInCart?.TaxPercentage) /
+                  (100 + isItemInCart?.TaxPercentage)
+                ).toFixed(2),
+            };
 
           dispatch(
             changeOrderCardDetails([
@@ -3315,48 +3301,46 @@ const BSOtherServiceItemCard = (props) => {
             ])
           );
         }
-      }
-      else if (isItemInCartHold && OrderType === 'Hold') {
-
+      } else if (isItemInCartHold && OrderType === 'Hold') {
         if (BillOrderPre === 'Y') {
           const UpdatedCartItem =
-          // if the item is already in the cart, increase the quantity of the item
-          {
-            ...isItemInCartHold,
-            OrderQty: isItemInCartHold?.OrderQty + 1,
-            TotalAmt:
-              isItemInCartHold?.OfferPrice > 0
-                ? (isItemInCartHold?.OrderQty + 1) *
-                isItemInCartHold?.OrderRate -
-                (isItemInCartHold?.OfferType === 'F'
+            // if the item is already in the cart, increase the quantity of the item
+            {
+              ...isItemInCartHold,
+              OrderQty: isItemInCartHold?.OrderQty + 1,
+              TotalAmt:
+                isItemInCartHold?.OfferPrice > 0
+                  ? (isItemInCartHold?.OrderQty + 1) *
+                      isItemInCartHold?.OrderRate -
+                    (isItemInCartHold?.OfferType === 'F'
+                      ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                      : ((isItemInCartHold?.OrderQty + 1) *
+                          isItemInCartHold?.OrderRate *
+                          isItemInCartHold?.OfferPrice) /
+                        100)
+                  : (isItemInCartHold?.OrderQty + 1) *
+                    isItemInCartHold?.OrderRate,
+              OfferValue:
+                item?.OfferType === 'F'
                   ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemInCartHold?.OrderQty + 1) *
-                    isItemInCartHold?.OrderRate *
-                    isItemInCartHold?.OfferPrice) /
-                  100)
-                : (isItemInCartHold?.OrderQty + 1) *
-                isItemInCartHold?.OrderRate,
-            OfferValue:
-              item?.OfferType === 'F'
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                : isItemInCart?.OfferPrice,
+                  : isItemInCart?.OfferPrice,
 
-            // TotalAmt: ((isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate),
-            TaxAmt: (
-              ((isItemInCartHold?.OrderQty + 1) *
-                isItemInCartHold?.OrderRate *
-                isItemInCartHold?.TaxPercentage) /
-              (100 + isItemInCartHold?.TaxPercentage)
-            ).toFixed(2),
-            WithoutTaxRate:
-              (isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate -
-              (
+              // TotalAmt: ((isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate),
+              TaxAmt: (
                 ((isItemInCartHold?.OrderQty + 1) *
                   isItemInCartHold?.OrderRate *
                   isItemInCartHold?.TaxPercentage) /
                 (100 + isItemInCartHold?.TaxPercentage)
               ).toFixed(2),
-          };
+              WithoutTaxRate:
+                (isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate -
+                (
+                  ((isItemInCartHold?.OrderQty + 1) *
+                    isItemInCartHold?.OrderRate *
+                    isItemInCartHold?.TaxPercentage) /
+                  (100 + isItemInCartHold?.TaxPercentage)
+                ).toFixed(2),
+            };
 
           dispatch(
             changeOrderCardDetails([
@@ -3364,46 +3348,45 @@ const BSOtherServiceItemCard = (props) => {
               ...OtherorderDataforNormalWithoutSalesId,
             ])
           );
-        }
-        else {
+        } else {
           const UpdatedCartItem =
-          // if the item is already in the cart, increase the quantity of the item
-          {
-            ...isItemInCartHold,
-            OrderQty: isItemInCartHold?.OrderQty + 1,
-            TotalAmt:
-              isItemInCartHold?.OfferPrice > 0
-                ? (isItemInCartHold?.OrderQty + 1) *
-                isItemInCartHold?.OrderRate -
-                (isItemInCartHold?.OfferType === 'F'
+            // if the item is already in the cart, increase the quantity of the item
+            {
+              ...isItemInCartHold,
+              OrderQty: isItemInCartHold?.OrderQty + 1,
+              TotalAmt:
+                isItemInCartHold?.OfferPrice > 0
+                  ? (isItemInCartHold?.OrderQty + 1) *
+                      isItemInCartHold?.OrderRate -
+                    (isItemInCartHold?.OfferType === 'F'
+                      ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                      : ((isItemInCartHold?.OrderQty + 1) *
+                          isItemInCartHold?.OrderRate *
+                          isItemInCartHold?.OfferPrice) /
+                        100)
+                  : (isItemInCartHold?.OrderQty + 1) *
+                    isItemInCartHold?.OrderRate,
+              OfferValue:
+                item?.OfferType === 'F'
                   ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemInCartHold?.OrderQty + 1) *
-                    isItemInCartHold?.OrderRate *
-                    isItemInCartHold?.OfferPrice) /
-                  100)
-                : (isItemInCartHold?.OrderQty + 1) *
-                isItemInCartHold?.OrderRate,
-            OfferValue:
-              item?.OfferType === 'F'
-                ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                : isItemInCart?.OfferPrice,
+                  : isItemInCart?.OfferPrice,
 
-            // TotalAmt: ((isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate),
-            TaxAmt: (
-              ((isItemInCartHold?.OrderQty + 1) *
-                isItemInCartHold?.OrderRate *
-                isItemInCartHold?.TaxPercentage) /
-              (100 + isItemInCartHold?.TaxPercentage)
-            ).toFixed(2),
-            WithoutTaxRate:
-              (isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate -
-              (
+              // TotalAmt: ((isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate),
+              TaxAmt: (
                 ((isItemInCartHold?.OrderQty + 1) *
                   isItemInCartHold?.OrderRate *
                   isItemInCartHold?.TaxPercentage) /
                 (100 + isItemInCartHold?.TaxPercentage)
               ).toFixed(2),
-          };
+              WithoutTaxRate:
+                (isItemInCartHold?.OrderQty + 1) * isItemInCartHold?.OrderRate -
+                (
+                  ((isItemInCartHold?.OrderQty + 1) *
+                    isItemInCartHold?.OrderRate *
+                    isItemInCartHold?.TaxPercentage) /
+                  (100 + isItemInCartHold?.TaxPercentage)
+                ).toFixed(2),
+            };
 
           dispatch(
             changeOrderCardDetails([
@@ -3412,9 +3395,11 @@ const BSOtherServiceItemCard = (props) => {
             ])
           );
         }
-      }
-      else if (isItemNotInDine && BookingTypeProd == 'Dine In' && OrderType != 'Hold') {
-
+      } else if (
+        isItemNotInDine &&
+        BookingTypeProd == 'Dine In' &&
+        OrderType != 'Hold'
+      ) {
         if (BillOrderPre === 'Y') {
           const UpdatedCartItem = {
             ...isItemNotInDine,
@@ -3422,12 +3407,12 @@ const BSOtherServiceItemCard = (props) => {
             TotalAmt:
               isItemNotInDine?.OfferPrice > 0
                 ? (isItemNotInDine?.OrderQty + 1) * isItemNotInDine?.OrderRate -
-                (isItemNotInDine?.OfferType === 'F'
-                  ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemNotInDine?.OrderQty + 1) *
-                    isItemNotInDine?.OrderRate *
-                    isItemNotInDine?.OfferPrice) /
-                  100)
+                  (isItemNotInDine?.OfferType === 'F'
+                    ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                    : ((isItemNotInDine?.OrderQty + 1) *
+                        isItemNotInDine?.OrderRate *
+                        isItemNotInDine?.OfferPrice) /
+                      100)
                 : (isItemNotInDine?.OrderQty + 1) * isItemNotInDine?.OrderRate,
             OfferValue:
               item?.OfferType === 'F'
@@ -3458,20 +3443,19 @@ const BSOtherServiceItemCard = (props) => {
               ...OtherOrderDatawithsales,
             ])
           );
-        }
-        else {
+        } else {
           const UpdatedCartItem = {
             ...isItemNotInDine,
             OrderQty: isItemNotInDine?.OrderQty + 1,
             TotalAmt:
               isItemNotInDine?.OfferPrice > 0
                 ? (isItemNotInDine?.OrderQty + 1) * isItemNotInDine?.OrderRate -
-                (isItemNotInDine?.OfferType === 'F'
-                  ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
-                  : ((isItemNotInDine?.OrderQty + 1) *
-                    isItemNotInDine?.OrderRate *
-                    isItemNotInDine?.OfferPrice) /
-                  100)
+                  (isItemNotInDine?.OfferType === 'F'
+                    ? (isItemInCart?.OrderQty + 1) * isItemInCart?.OfferPrice
+                    : ((isItemNotInDine?.OrderQty + 1) *
+                        isItemNotInDine?.OrderRate *
+                        isItemNotInDine?.OfferPrice) /
+                      100)
                 : (isItemNotInDine?.OrderQty + 1) * isItemNotInDine?.OrderRate,
             OfferValue:
               item?.OfferType === 'F'
@@ -3503,51 +3487,49 @@ const BSOtherServiceItemCard = (props) => {
             ])
           );
         }
-      }
-
-      else {
+      } else {
         if (item?.OtherProduct === 'Others') {
           BillOrderPre === 'Y'
             ? dispatch(
-              changeOrderCardDetails([
-                {
-                  ...item,
-                  // TotalAmt: (((item?.OrderQty + 1) * item?.OrderRate)- (item?.OfferType === "F" ?item?.OfferPrice :(((item?.OrderQty + 1) * item?.OrderRate) * item?.OfferPrice)/100)),
+                changeOrderCardDetails([
+                  {
+                    ...item,
+                    // TotalAmt: (((item?.OrderQty + 1) * item?.OrderRate)- (item?.OfferType === "F" ?item?.OfferPrice :(((item?.OrderQty + 1) * item?.OrderRate) * item?.OfferPrice)/100)),
 
-                  TotalAmt: item?.OrderQty * item?.OrderRate,
-                  TaxAmt: (
-                    (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
-                    (100 + item?.TaxPercentage)
-                  ).toFixed(2),
-                  WithoutTaxRate: (
-                    item?.OrderQty * item?.OrderRate -
-                    (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
-                    (100 + item?.TaxPercentage)
-                  ).toFixed(2),
-                },
-                ...CartOrderDetails,
-              ])
-            ) // if the item is not in the cart, add the item to the cart
+                    TotalAmt: item?.OrderQty * item?.OrderRate,
+                    TaxAmt: (
+                      (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
+                      (100 + item?.TaxPercentage)
+                    ).toFixed(2),
+                    WithoutTaxRate: (
+                      item?.OrderQty * item?.OrderRate -
+                      (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
+                        (100 + item?.TaxPercentage)
+                    ).toFixed(2),
+                  },
+                  ...CartOrderDetails,
+                ])
+              ) // if the item is not in the cart, add the item to the cart
             : dispatch(
-              changeOrderCardDetails([
-                ...CartOrderDetails,
-                {
-                  ...item,
-                  TotalAmt: item?.OrderQty * item?.OrderRate,
+                changeOrderCardDetails([
+                  ...CartOrderDetails,
+                  {
+                    ...item,
+                    TotalAmt: item?.OrderQty * item?.OrderRate,
 
-                  // TotalAmt: (((item?.OrderQty + 1) * item?.OrderRate)- (item?.OfferType === "F" ?item?.OfferPrice :(((item?.OrderQty + 1) * item?.OrderRate) * item?.OfferPrice)/100)),
-                  TaxAmt: (
-                    (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
-                    (100 + item?.TaxPercentage)
-                  ).toFixed(2),
-                  WithoutTaxRate: (
-                    item?.OrderQty * item?.OrderRate -
-                    (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
-                    (100 + item?.TaxPercentage)
-                  ).toFixed(2),
-                },
-              ])
-            );
+                    // TotalAmt: (((item?.OrderQty + 1) * item?.OrderRate)- (item?.OfferType === "F" ?item?.OfferPrice :(((item?.OrderQty + 1) * item?.OrderRate) * item?.OfferPrice)/100)),
+                    TaxAmt: (
+                      (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
+                      (100 + item?.TaxPercentage)
+                    ).toFixed(2),
+                    WithoutTaxRate: (
+                      item?.OrderQty * item?.OrderRate -
+                      (item?.OrderQty * item?.OrderRate * item?.TaxPercentage) /
+                        (100 + item?.TaxPercentage)
+                    ).toFixed(2),
+                  },
+                ])
+              );
         }
 
         //         else {
@@ -3593,7 +3575,6 @@ const BSOtherServiceItemCard = (props) => {
         //                 ]));
         //           }
         //         }
-
         else {
           const baseItem = {
             ...item,
@@ -3602,9 +3583,9 @@ const BSOtherServiceItemCard = (props) => {
             TotalAmt:
               item?.OfferPrice > 0
                 ? item?.OrderRate -
-                (item?.OfferType === 'F'
-                  ? item?.OfferPrice
-                  : (item?.OrderRate * item?.OfferPrice) / 100)
+                  (item?.OfferType === 'F'
+                    ? item?.OfferPrice
+                    : (item?.OrderRate * item?.OfferPrice) / 100)
                 : item?.OrderRate,
             TaxAmt: (
               (item?.OrderRate * item?.TaxPercentage) /
@@ -3613,34 +3594,35 @@ const BSOtherServiceItemCard = (props) => {
             WithoutTaxRate: (
               item?.OrderRate -
               (item?.OrderRate * item?.TaxPercentage) /
-              (100 + item?.TaxPercentage)
+                (100 + item?.TaxPercentage)
             ).toFixed(2),
           };
 
           if (item?.ServiceType === 'I') {
-
             // Add the item and include a __index to track vehicle number uniquely
-            const updatedCart = [...CartOrderDetails, baseItem].map((itm, idx) => ({
-              ...itm,
-              __index: idx, // Temporary index used for vehicle number assignment
-            }));
+            const updatedCart = [...CartOrderDetails, baseItem].map(
+              (itm, idx) => ({
+                ...itm,
+                __index: idx, // Temporary index used for vehicle number assignment
+              })
+            );
 
             dispatch(changeOrderCardDetails(updatedCart));
           } else {
-
             // Use existing flow with optional BillOrderPre control
             // const updatedCart =
             //   BillOrderPre === 'Y'
             //     ? [baseItem, ...CartOrderDetails]
             //     : [...CartOrderDetails, baseItem];
-            const updatedCart = [...CartOrderDetails, baseItem].map((itm, idx) => ({
-              ...itm,
-              __index: idx, // Temporary index used for vehicle number assignment
-            }));
+            const updatedCart = [...CartOrderDetails, baseItem].map(
+              (itm, idx) => ({
+                ...itm,
+                __index: idx, // Temporary index used for vehicle number assignment
+              })
+            );
             dispatch(changeOrderCardDetails(updatedCart));
           }
         }
-
       }
 
       dispatch(changeothersdata({}));
@@ -3767,8 +3749,8 @@ const BSOtherServiceItemCard = (props) => {
         Cartdata?.[0]?.OfferType === 'F'
           ? Cartdata?.[0]?.OfferPrice
           : (qtydata?.[0]?.ComboInwardDetails?.[0]?.TotalSellPrice *
-            Cartdata?.[0]?.OfferPrice) /
-          100,
+              Cartdata?.[0]?.OfferPrice) /
+            100,
       OfferPrice: Cartdata?.[0]?.OfferPrice,
       SinglePc: 'N',
     };
@@ -3810,9 +3792,9 @@ const BSOtherServiceItemCard = (props) => {
 
     return DropDown && Array.isArray(DropDown)
       ? DropDown.map((item) => ({
-        label: `${item.ComboName}`, // Display the combo name
-        value: `${item.ComboId}`, // Use combo ID as the value
-      }))
+          label: `${item.ComboName}`, // Display the combo name
+          value: `${item.ComboId}`, // Use combo ID as the value
+        }))
       : [];
     // });
   };
@@ -3839,7 +3821,6 @@ const BSOtherServiceItemCard = (props) => {
   function encrypt(code, key) {
     let encrypted = (
       <>
-
         <div
           className="bs-item-card-masterdiv"
           style={{
@@ -3849,7 +3830,6 @@ const BSOtherServiceItemCard = (props) => {
             height: containerHeight,
           }}
         >
-
           {messageType && messageData && (
             <Messages
               messageType={messageType}
@@ -3893,18 +3873,18 @@ const BSOtherServiceItemCard = (props) => {
                           >
                             <div
                               style={{ position: 'relative' }}
-                            //   className={
-                            //     (item?.OverallQuantity !== undefined &&
-                            //       returnCount(
-                            //         item?.ComboName,
-                            //         item?.OverallQuantity,
-                            //         CartOrderDetails,
-                            //         item?.OverAllPcs
-                            //       ) > 0) ||
-                            //     item?.StockAvailable !== 'Y'
-                            //       ? 'BkPrdCardActive'
-                            //       : 'BkPrdCardDeActive'
-                            //   }
+                              //   className={
+                              //     (item?.OverallQuantity !== undefined &&
+                              //       returnCount(
+                              //         item?.ComboName,
+                              //         item?.OverallQuantity,
+                              //         CartOrderDetails,
+                              //         item?.OverAllPcs
+                              //       ) > 0) ||
+                              //     item?.StockAvailable !== 'Y'
+                              //       ? 'BkPrdCardActive'
+                              //       : 'BkPrdCardDeActive'
+                              //   }
                             >
                               {!isMobile ? (
                                 <Tooltip title={item?.ServiceName}>
@@ -3939,38 +3919,38 @@ const BSOtherServiceItemCard = (props) => {
                                         cardFunction?.Background &&
                                         (SelectedCardColor
                                           ? SelectedCardColor?.[
-                                          'BackgroundColor'
-                                          ]
+                                              'BackgroundColor'
+                                            ]
                                           : ''),
                                       padding:
                                         !cardFunction?.ImageUp &&
-                                          !cardFunction?.ImageDown
+                                        !cardFunction?.ImageDown
                                           ? cardFunction?.SmallImage &&
-                                          '5px 9px'
+                                            '5px 9px'
                                           : '8px 2px',
                                       flexDirection:
                                         cardFunction?.ImageRight &&
-                                          'row-reverse'
+                                        'row-reverse'
                                           ? cardFunction?.ImageRight &&
-                                          'row-reverse'
+                                            'row-reverse'
                                           : cardFunction?.ImageUp && 'column'
                                             ? cardFunction?.ImageUp && 'column'
                                             : cardFunction?.ImageDown &&
-                                              'column-reverse'
+                                                'column-reverse'
                                               ? cardFunction?.ImageDown &&
-                                              'column-reverse'
+                                                'column-reverse'
                                               : cardFunction?.ImageLeft &&
-                                              'row',
+                                                'row',
                                       borderRadius:
                                         cardFunction?.EdgeCurve && '6px',
                                       width:
                                         !cardFunction?.ImageUp &&
-                                          !cardFunction?.ImageDown &&
-                                          !cardFunction?.BigImage &&
-                                          !cardFunction?.ImageRight &&
-                                          cardFunction?.SmallImage &&
-                                          (cardFunction?.ImageUp ||
-                                            cardFunction?.ImageDown)
+                                        !cardFunction?.ImageDown &&
+                                        !cardFunction?.BigImage &&
+                                        !cardFunction?.ImageRight &&
+                                        cardFunction?.SmallImage &&
+                                        (cardFunction?.ImageUp ||
+                                          cardFunction?.ImageDown)
                                           ? '6rem'
                                           : cardFunction?.BigImage && '9rem',
                                       height:
@@ -4010,31 +3990,35 @@ const BSOtherServiceItemCard = (props) => {
                                   >
                                     {(cardFunction?.BigImage ||
                                       cardFunction?.SmallImage) && (
-                                        <img
-                                          style={{
-                                            objectFit:
-                                              cardFunction?.BigImage && '',
-                                            height: !cardFunction?.BigImage
-                                              ? (!cardFunction?.BigImage &&
+                                      <img
+                                        style={{
+                                          objectFit:
+                                            cardFunction?.BigImage && '',
+                                          height: !cardFunction?.BigImage
+                                            ? (!cardFunction?.BigImage &&
                                                 cardFunction?.SmallImage) ||
-                                                cardFunction?.ImageLeft ||
-                                                cardFunction?.ImageUp ||
-                                                cardFunction?.ImageDown
-                                                ? '3rem'
-                                                : cardFunction?.BigImage && '7rem'
-                                              : '5rem',
-                                          }}
-                                          className={
-                                            cardFunction?.SmallImage
-                                              ? 'BSItemCard-image-smallimage'
-                                              : 'BSItemCard-image'
-                                          }
-                                          src={item?.ImageUrl === null ? defaultimage : item?.ImageUrl ? item?.ImageUrl
-                                            : defaultimage
-                                          }
-                                          alt=""
-                                        />
-                                      )}
+                                              cardFunction?.ImageLeft ||
+                                              cardFunction?.ImageUp ||
+                                              cardFunction?.ImageDown
+                                              ? '3rem'
+                                              : cardFunction?.BigImage && '7rem'
+                                            : '5rem',
+                                        }}
+                                        className={
+                                          cardFunction?.SmallImage
+                                            ? 'BSItemCard-image-smallimage'
+                                            : 'BSItemCard-image'
+                                        }
+                                        src={
+                                          item?.ImageUrl === null
+                                            ? defaultimage
+                                            : item?.ImageUrl
+                                              ? item?.ImageUrl
+                                              : defaultimage
+                                        }
+                                        alt=""
+                                      />
+                                    )}
 
                                     <div
                                       className={
@@ -4047,8 +4031,8 @@ const BSOtherServiceItemCard = (props) => {
                                           cardFunction?.Background &&
                                           (SelectedCardColor
                                             ? SelectedCardColor?.[
-                                            'BackgroundColor'
-                                            ]
+                                                'BackgroundColor'
+                                              ]
                                             : ''),
 
                                         position: !cardFunction?.BigImage
@@ -4092,9 +4076,9 @@ const BSOtherServiceItemCard = (props) => {
                                           width: !cardFunction?.SmallImage
                                             ? cardFunction?.BigImage && '120px'
                                             : cardFunction?.SmallImage &&
-                                            !cardFunction?.ImageUp &&
-                                            !cardFunction?.ImageDown &&
-                                            '85px',
+                                              !cardFunction?.ImageUp &&
+                                              !cardFunction?.ImageDown &&
+                                              '85px',
                                           // Width: cardFunction?.BigImage && "70px",
                                           fontSize:
                                             !cardFunction?.BigImage &&
@@ -4142,27 +4126,20 @@ const BSOtherServiceItemCard = (props) => {
                                         <p
                                           className="BSItemCard-itemPrice"
                                           style={{
-                                            fontSize:
-                                              !cardFunction?.SmallImage
-                                                ? cardFunction?.BigImage &&
-                                                '12px'
-                                                : '12px',
+                                            fontSize: !cardFunction?.SmallImage
+                                              ? cardFunction?.BigImage && '12px'
+                                              : '12px',
                                             textAlign: 'center',
                                             lineHeight: '2',
                                             fontFamily: SelectedCardFont
                                               ? SelectedCardFont
                                               : '',
                                             color: SelectedCardColor
-                                              ? SelectedCardColor?.[
-                                              'FontColor'
-                                              ]
+                                              ? SelectedCardColor?.['FontColor']
                                               : '',
                                           }}
                                         >
-                                          ₹{' '}
-                                          {
-                                            item?.TotalAmt
-                                          }
+                                          ₹ {item?.TotalAmt}
                                           &nbsp;
                                           {/* {item?.TotalAmt}&nbsp; */}
                                           {/*  {ItemSellingPrice(item)} */}
@@ -4170,8 +4147,7 @@ const BSOtherServiceItemCard = (props) => {
                                               {'(1 Combo Pack)'}
                                             </span> */}
                                         </p>
-                                      )
-                                      }
+                                      )}
                                     </div>
 
                                     {cardFunction?.StockCount &&
@@ -4206,213 +4182,211 @@ const BSOtherServiceItemCard = (props) => {
                                       )}
                                   </div>
                                 </Tooltip>
-                              ) :
+                              ) : (
+                                <>
+                                  {globaldata && (
+                                    <input
+                                      type="checkbox"
+                                      value={item.ProductDetail?.[0]?.ProdId}
+                                      name={item.ProdName}
+                                      onChange={(e) => pickData(e, item)}
+                                      style={{
+                                        position: 'absolute',
+                                        zIndex: 1,
+                                        transform: 'scale(1.5)',
+                                        cursor: 'pointer',
+                                      }}
+                                      checked={(
+                                        globalAllItemdata || EditfavItems
+                                      )?.some(
+                                        // (a) => a?.ProdName === item?.ProdName
+                                        (a) =>
+                                          a?.ProdName === item?.ProdName &&
+                                          a?.ProdCat === item?.ProdCat
+                                      )}
+                                    />
+                                  )}
 
-                                (
-                                  <>
-                                    {globaldata && (
-                                      <input
-                                        type="checkbox"
-                                        value={item.ProductDetail?.[0]?.ProdId}
-                                        name={item.ProdName}
-                                        onChange={(e) => pickData(e, item)}
+                                  <div
+                                    style={{
+                                      alignItems: 'center',
+                                      backgroundColor:
+                                        cardFunction?.SmallImage &&
+                                        cardFunction?.Background &&
+                                        (SelectedCardColor
+                                          ? SelectedCardColor?.[
+                                              'BackgroundColor'
+                                            ]
+                                          : ''),
+                                      padding:
+                                        !cardFunction?.ImageUp &&
+                                        !cardFunction?.ImageDown
+                                          ? cardFunction?.SmallImage &&
+                                            '5px 9px'
+                                          : '8px 2px',
+                                      flexDirection:
+                                        cardFunction?.ImageRight &&
+                                        'row-reverse'
+                                          ? cardFunction?.ImageRight &&
+                                            'row-reverse'
+                                          : cardFunction?.ImageUp && 'column'
+                                            ? cardFunction?.ImageUp && 'column'
+                                            : cardFunction?.ImageDown &&
+                                                'column-reverse'
+                                              ? cardFunction?.ImageDown &&
+                                                'column-reverse'
+                                              : cardFunction?.ImageLeft &&
+                                                'row',
+                                      borderRadius:
+                                        cardFunction?.EdgeCurve && '6px',
+                                      width:
+                                        !cardFunction?.ImageUp &&
+                                        !cardFunction?.ImageDown &&
+                                        !cardFunction?.BigImage &&
+                                        !cardFunction?.ImageRight &&
+                                        cardFunction?.SmallImage &&
+                                        (cardFunction?.ImageUp ||
+                                          cardFunction?.ImageDown)
+                                          ? '6rem'
+                                          : cardFunction?.BigImage && '9rem',
+                                      height:
+                                        !cardFunction?.ImageUp &&
+                                        !cardFunction?.BigImage &&
+                                        '',
+                                      pointerEvents: globaldata && 'none',
+                                    }}
+                                    className={
+                                      cardFunction?.SmallImage
+                                        ? 'BSItemCard-containers-smallimage-mobile'
+                                        : 'BSItemCard-containers-mobile'
+                                    }
+                                    onClick={(e) => {
+                                      //   if (
+                                      //     !(
+                                      //       item?.OverallQuantity !== undefined &&
+                                      //       returnCount(
+                                      //         item?.ComboName,
+                                      //         item?.OverallQuantity,
+                                      //         CartOrderDetails
+                                      //       ) > 0
+                                      //     )
+                                      //   ) {
+                                      //     e.stopPropagation();
+                                      //   } else {
+                                      CardOnclick(item);
+                                      //   }
+                                    }}
+                                    // data-aos="zoom-in" data-aos-duration="600"
+                                  >
+                                    {(cardFunction?.BigImage ||
+                                      cardFunction?.SmallImage) && (
+                                      <img
                                         style={{
-                                          position: 'absolute',
-                                          zIndex: 1,
-                                          transform: 'scale(1.5)',
-                                          cursor: 'pointer',
+                                          objectFit:
+                                            cardFunction?.BigImage && '',
+                                          height: !cardFunction?.BigImage
+                                            ? (!cardFunction?.BigImage &&
+                                                cardFunction?.SmallImage) ||
+                                              cardFunction?.ImageLeft ||
+                                              cardFunction?.ImageUp ||
+                                              cardFunction?.ImageDown
+                                              ? '3rem'
+                                              : cardFunction?.BigImage && '7rem'
+                                            : '4rem',
                                         }}
-                                        checked={(
-                                          globalAllItemdata || EditfavItems
-                                        )?.some(
-                                          // (a) => a?.ProdName === item?.ProdName
-                                          (a) =>
-                                            a?.ProdName === item?.ProdName &&
-                                            a?.ProdCat === item?.ProdCat
-                                        )}
+                                        className={
+                                          cardFunction?.SmallImage
+                                            ? 'BSItemCard-image-smallimage'
+                                            : 'BSItemCard-image'
+                                        }
+                                        src={
+                                          item?.ProductDetail?.[0]?.ProdLogo ===
+                                          ''
+                                            ? defaultimage
+                                            : item?.ProductDetail?.[0]?.ProdLogo
+                                              ? item?.ProductDetail?.[0]
+                                                  ?.ProdLogo
+                                              : defaultimage
+                                        }
+                                        alt=""
                                       />
                                     )}
-
                                     <div
+                                      className={
+                                        cardFunction?.SmallImage
+                                          ? 'BSItemCard-content-smallimage'
+                                          : 'BSItemCard-content'
+                                      }
                                       style={{
-                                        alignItems: 'center',
                                         backgroundColor:
-                                          cardFunction?.SmallImage &&
                                           cardFunction?.Background &&
                                           (SelectedCardColor
                                             ? SelectedCardColor?.[
-                                            'BackgroundColor'
-                                            ]
-                                            : ''),
-                                        padding:
-                                          !cardFunction?.ImageUp &&
-                                            !cardFunction?.ImageDown
-                                            ? cardFunction?.SmallImage &&
-                                            '5px 9px'
-                                            : '8px 2px',
-                                        flexDirection:
-                                          cardFunction?.ImageRight &&
-                                            'row-reverse'
-                                            ? cardFunction?.ImageRight &&
-                                            'row-reverse'
-                                            : cardFunction?.ImageUp && 'column'
-                                              ? cardFunction?.ImageUp && 'column'
-                                              : cardFunction?.ImageDown &&
-                                                'column-reverse'
-                                                ? cardFunction?.ImageDown &&
-                                                'column-reverse'
-                                                : cardFunction?.ImageLeft &&
-                                                'row',
-                                        borderRadius:
-                                          cardFunction?.EdgeCurve && '6px',
-                                        width:
-                                          !cardFunction?.ImageUp &&
-                                            !cardFunction?.ImageDown &&
-                                            !cardFunction?.BigImage &&
-                                            !cardFunction?.ImageRight &&
-                                            cardFunction?.SmallImage &&
-                                            (cardFunction?.ImageUp ||
-                                              cardFunction?.ImageDown)
-                                            ? '6rem'
-                                            : cardFunction?.BigImage && '9rem',
-                                        height:
-                                          !cardFunction?.ImageUp &&
-                                          !cardFunction?.BigImage &&
-                                          '',
-                                        pointerEvents: globaldata && 'none',
-                                      }}
-                                      className={
-                                        cardFunction?.SmallImage
-                                          ? 'BSItemCard-containers-smallimage-mobile'
-                                          : 'BSItemCard-containers-mobile'
-                                      }
-                                      onClick={(e) => {
-                                        //   if (
-                                        //     !(
-                                        //       item?.OverallQuantity !== undefined &&
-                                        //       returnCount(
-                                        //         item?.ComboName,
-                                        //         item?.OverallQuantity,
-                                        //         CartOrderDetails
-                                        //       ) > 0
-                                        //     )
-                                        //   ) {
-                                        //     e.stopPropagation();
-                                        //   } else {
-                                        CardOnclick(item);
-                                        //   }
-                                      }}
-                                    // data-aos="zoom-in" data-aos-duration="600"
-                                    >
-                                      {(cardFunction?.BigImage ||
-                                        cardFunction?.SmallImage) && (
-                                          <img
-                                            style={{
-                                              objectFit:
-                                                cardFunction?.BigImage && '',
-                                              height: !cardFunction?.BigImage
-                                                ? (!cardFunction?.BigImage &&
-                                                  cardFunction?.SmallImage) ||
-                                                  cardFunction?.ImageLeft ||
-                                                  cardFunction?.ImageUp ||
-                                                  cardFunction?.ImageDown
-                                                  ? '3rem'
-                                                  : cardFunction?.BigImage && '7rem'
-                                                : '4rem',
-                                            }}
-                                            className={
-                                              cardFunction?.SmallImage
-                                                ? 'BSItemCard-image-smallimage'
-                                                : 'BSItemCard-image'
-                                            }
-                                            src={
-                                              item?.ProductDetail?.[0]?.ProdLogo ===
-                                                ''
-                                                ? defaultimage
-                                                : item?.ProductDetail?.[0]?.ProdLogo
-                                                  ? item?.ProductDetail?.[0]
-                                                    ?.ProdLogo
-                                                  : defaultimage
-                                            }
-                                            alt=""
-                                          />
-                                        )}
-                                      <div
-                                        className={
-                                          cardFunction?.SmallImage
-                                            ? 'BSItemCard-content-smallimage'
-                                            : 'BSItemCard-content'
-                                        }
-                                        style={{
-                                          backgroundColor:
-                                            cardFunction?.Background &&
-                                            (SelectedCardColor
-                                              ? SelectedCardColor?.[
-                                              'BackgroundColor'
+                                                'BackgroundColor'
                                               ]
-                                              : ''),
-                                          position: !cardFunction?.BigImage
-                                            ? 'relative'
-                                            : 'absolute',
-                                          flexDirection:
-                                            !cardFunction?.BigImage && 'column',
-                                          borderRadius:
-                                            !cardFunction?.BigImage &&
-                                            cardFunction?.EdgeCurve &&
-                                            '6px',
-                                          bottom: cardFunction?.BigImage && '',
-                                          cardFunction,
-                                          width:
-                                            !cardFunction?.BigImage &&
-                                            !cardFunction?.SmallImage &&
-                                            '',
-                                          height: cardFunction?.SmallImage
-                                            ? '5.5rem'
-                                            : !cardFunction?.BigImage && '4.5rem',
-                                          alignItems:
-                                            !cardFunction?.BigImage &&
-                                            !cardFunction?.SmallImage &&
-                                            'center',
-                                          textAlign:
-                                            !cardFunction?.BigImage &&
-                                            !cardFunction?.SmallImage &&
-                                            'center',
-                                          flexWrap:
-                                            cardFunction?.BigImage && 'wrap',
-                                        }}
-                                      >
-                                        <p
-                                          style={{
-                                            textTransform:
-                                              cardFunction?.TextCapitalize &&
-                                              'uppercase',
-                                            width: !cardFunction?.SmallImage
-                                              ? cardFunction?.BigImage && '120px'
-                                              : cardFunction?.SmallImage &&
+                                            : ''),
+                                        position: !cardFunction?.BigImage
+                                          ? 'relative'
+                                          : 'absolute',
+                                        flexDirection:
+                                          !cardFunction?.BigImage && 'column',
+                                        borderRadius:
+                                          !cardFunction?.BigImage &&
+                                          cardFunction?.EdgeCurve &&
+                                          '6px',
+                                        bottom: cardFunction?.BigImage && '',
+                                        cardFunction,
+                                        width:
+                                          !cardFunction?.BigImage &&
+                                          !cardFunction?.SmallImage &&
+                                          '',
+                                        height: cardFunction?.SmallImage
+                                          ? '5.5rem'
+                                          : !cardFunction?.BigImage && '4.5rem',
+                                        alignItems:
+                                          !cardFunction?.BigImage &&
+                                          !cardFunction?.SmallImage &&
+                                          'center',
+                                        textAlign:
+                                          !cardFunction?.BigImage &&
+                                          !cardFunction?.SmallImage &&
+                                          'center',
+                                        flexWrap:
+                                          cardFunction?.BigImage && 'wrap',
+                                      }}
+                                    >
+                                      <p
+                                        style={{
+                                          textTransform:
+                                            cardFunction?.TextCapitalize &&
+                                            'uppercase',
+                                          width: !cardFunction?.SmallImage
+                                            ? cardFunction?.BigImage && '120px'
+                                            : cardFunction?.SmallImage &&
                                               !cardFunction?.ImageUp &&
                                               !cardFunction?.ImageDown &&
                                               '85px',
-                                            // Width: cardFunction?.BigImage && "70px",
-                                            fontSize:
-                                              !cardFunction?.BigImage &&
-                                              !cardFunction?.SmallImage &&
-                                              '12px', //naresh27
-                                            whiteSpace:
-                                              !cardFunction?.BigImage &&
-                                              'pre-wrap',
-                                            margin: 'auto',
-                                            fontFamily: SelectedCardFont
-                                              ? SelectedCardFont
-                                              : '',
-                                            color: SelectedCardColor
-                                              ? SelectedCardColor?.['FontColor']
-                                              : '',
-                                            textOverflow: 'ellipsis',
-                                          }}
-                                          className="BSItemCard-itemName"
-                                        >
-                                          {item?.ProdName}{' '}
-                                          {/* {(item?.OverallQuantity !== undefined &&
+                                          // Width: cardFunction?.BigImage && "70px",
+                                          fontSize:
+                                            !cardFunction?.BigImage &&
+                                            !cardFunction?.SmallImage &&
+                                            '12px', //naresh27
+                                          whiteSpace:
+                                            !cardFunction?.BigImage &&
+                                            'pre-wrap',
+                                          margin: 'auto',
+                                          fontFamily: SelectedCardFont
+                                            ? SelectedCardFont
+                                            : '',
+                                          color: SelectedCardColor
+                                            ? SelectedCardColor?.['FontColor']
+                                            : '',
+                                          textOverflow: 'ellipsis',
+                                        }}
+                                        className="BSItemCard-itemName"
+                                      >
+                                        {item?.ProdName}{' '}
+                                        {/* {(item?.OverallQuantity !== undefined &&
                                           returnCount(
                                             item?.ComboName,
                                             item?.OverallQuantity,
@@ -4432,80 +4406,79 @@ const BSOtherServiceItemCard = (props) => {
                                             No Stock
                                           </p>
                                         )} */}
-                                        </p>
-                                        {cardFunction?.Price &&
-                                          ((item?.OverallQuantity !== undefined &&
-                                            item?.OverallQuantity !== 0 &&
-                                            item?.OverallQuantity !== null) ||
-                                            item?.ProductDetail?.some(
-                                              (item) =>
-                                                item?.StockAvailable !== 'Y'
-                                            )) && (
-                                            <p
-                                              className="BSItemCard-itemPrice"
-                                              style={{
-                                                fontSize:
-                                                  !cardFunction?.SmallImage
-                                                    ? cardFunction?.BigImage &&
-                                                    '12px'
-                                                    : '12px',
-                                                textAlign: 'center',
-                                                lineHeight: '2',
-                                                fontFamily: SelectedCardFont
-                                                  ? SelectedCardFont
-                                                  : '',
-                                                color: SelectedCardColor
-                                                  ? SelectedCardColor?.[
-                                                  'FontColor'
-                                                  ]
-                                                  : '',
-                                              }}
-                                            >
-                                              ₹ {ItemSellingPrice(item)}&nbsp;
-                                              {/* {item?.ProductDetail?.[0]?.ProdVariantDetails?.[0]?.StockDetails?.[0]?.SellPrice}&nbsp; */}
-                                              {/*  {ItemSellingPrice(item)} */}
-                                              <span className="BSItemCard-itemCount">
-                                                ({ItemSize(item)}
-                                                {ItemUomName(item)})
-                                              </span>
-                                            </p>
-                                          )}
-                                      </div>
-
-                                      {cardFunction?.StockCount &&
-                                        item?.OverallQuantity !== undefined &&
-                                        item?.OverallQuantity !== 0 && (
-                                          <div
+                                      </p>
+                                      {cardFunction?.Price &&
+                                        ((item?.OverallQuantity !== undefined &&
+                                          item?.OverallQuantity !== 0 &&
+                                          item?.OverallQuantity !== null) ||
+                                          item?.ProductDetail?.some(
+                                            (item) =>
+                                              item?.StockAvailable !== 'Y'
+                                          )) && (
+                                          <p
+                                            className="BSItemCard-itemPrice"
                                             style={{
-                                              top: !cardFunction?.BigImage && '0',
-                                              right:
-                                                !cardFunction?.BigImage &&
-                                                !cardFunction?.SmallImage &&
-                                                '0px',
-                                              position: 'absolute',
+                                              fontSize:
+                                                !cardFunction?.SmallImage
+                                                  ? cardFunction?.BigImage &&
+                                                    '12px'
+                                                  : '12px',
+                                              textAlign: 'center',
+                                              lineHeight: '2',
+                                              fontFamily: SelectedCardFont
+                                                ? SelectedCardFont
+                                                : '',
+                                              color: SelectedCardColor
+                                                ? SelectedCardColor?.[
+                                                    'FontColor'
+                                                  ]
+                                                : '',
                                             }}
-                                            className={
-                                              cardFunction?.BigImage
-                                                ? 'BSItemCard-badge'
-                                                : 'BSItemCard-badge-withoutimage'
-                                            }
                                           >
-                                            {item?.OverallQuantity !== null && (
-                                              <Badge
-                                                count={returnCount(
-                                                  item?.ProdName,
-                                                  item?.OverallQuantity,
-                                                  CartOrderDetails
-                                                )}
-                                                overflowCount={10000}
-                                              ></Badge>
-                                            )}
-                                          </div>
+                                            ₹ {ItemSellingPrice(item)}&nbsp;
+                                            {/* {item?.ProductDetail?.[0]?.ProdVariantDetails?.[0]?.StockDetails?.[0]?.SellPrice}&nbsp; */}
+                                            {/*  {ItemSellingPrice(item)} */}
+                                            <span className="BSItemCard-itemCount">
+                                              ({ItemSize(item)}
+                                              {ItemUomName(item)})
+                                            </span>
+                                          </p>
                                         )}
                                     </div>
-                                  </>
-                                )
-                              }
+
+                                    {cardFunction?.StockCount &&
+                                      item?.OverallQuantity !== undefined &&
+                                      item?.OverallQuantity !== 0 && (
+                                        <div
+                                          style={{
+                                            top: !cardFunction?.BigImage && '0',
+                                            right:
+                                              !cardFunction?.BigImage &&
+                                              !cardFunction?.SmallImage &&
+                                              '0px',
+                                            position: 'absolute',
+                                          }}
+                                          className={
+                                            cardFunction?.BigImage
+                                              ? 'BSItemCard-badge'
+                                              : 'BSItemCard-badge-withoutimage'
+                                          }
+                                        >
+                                          {item?.OverallQuantity !== null && (
+                                            <Badge
+                                              count={returnCount(
+                                                item?.ProdName,
+                                                item?.OverallQuantity,
+                                                CartOrderDetails
+                                              )}
+                                              overflowCount={10000}
+                                            ></Badge>
+                                          )}
+                                        </div>
+                                      )}
+                                  </div>
+                                </>
+                              )}
                             </div>
                           </SortableCard>
                         ))}
@@ -4513,9 +4486,10 @@ const BSOtherServiceItemCard = (props) => {
                     </SortableContext>
                   </DndContext>
                 </>
-              ) : ProductSearch?.length > 5 && GetmultipleSearchDatas.some(
-                e => e.toLowerCase() === "qrcode"
-              ) &&
+              ) : ProductSearch?.length > 5 &&
+                GetmultipleSearchDatas.some(
+                  (e) => e.toLowerCase() === 'qrcode'
+                ) &&
                 (cardData?.length == 0 || cardData == undefined) ? (
                 <div>
                   {/* cardData mohan 18-04-2025 */}
@@ -4535,19 +4509,19 @@ const BSOtherServiceItemCard = (props) => {
                       display: globalAccessForOthers && 'none',
                     }}
                   >
-                    <div align="center" class="fond">
-                      <div class="contener_general">
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_1">&nbsp;</div>
+                    <div align="center" className="fond">
+                      <div className="contener_general">
+                        <div className="contener_mixte">
+                          <div className="ballcolor ball_1">&nbsp;</div>
                         </div>
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_2">&nbsp;</div>
+                        <div className="contener_mixte">
+                          <div className="ballcolor ball_2">&nbsp;</div>
                         </div>
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_3">&nbsp;</div>
+                        <div className="contener_mixte">
+                          <div className="ballcolor ball_3">&nbsp;</div>
                         </div>
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_4">&nbsp;</div>
+                        <div className="contener_mixte">
+                          <div className="ballcolor ball_4">&nbsp;</div>
                         </div>
                       </div>
                     </div>
@@ -4556,19 +4530,19 @@ const BSOtherServiceItemCard = (props) => {
               )}
 
               {paymentloader === true && (
-                <div class="Payment-loader1">
-                  <div class="Payment-loader">
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_1">&nbsp;</div>
+                <div className="Payment-loader1">
+                  <div className="Payment-loader">
+                    <div className="contener_mixte">
+                      <div className="ballcolor ball_1">&nbsp;</div>
                     </div>
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_2">&nbsp;</div>
+                    <div className="contener_mixte">
+                      <div className="ballcolor ball_2">&nbsp;</div>
                     </div>
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_3">&nbsp;</div>
+                    <div className="contener_mixte">
+                      <div className="ballcolor ball_3">&nbsp;</div>
                     </div>
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_4">&nbsp;</div>
+                    <div className="contener_mixte">
+                      <div className="ballcolor ball_4">&nbsp;</div>
                     </div>
                     <p style={{ marginTop: '2rem' }}>
                       {' '}
@@ -4582,10 +4556,8 @@ const BSOtherServiceItemCard = (props) => {
                   </div>
                 </div>
               )}
-
             </div>
           </div>
-
         </div>
 
         {expModel && (
@@ -4629,9 +4601,9 @@ const BSOtherServiceItemCard = (props) => {
             open={expQtyModel}
             onOk={() => expQtyFun(qtyExpData)}
             onCancel={() => {
-              setRepeatedModel(false),
+              (setRepeatedModel(false),
                 setProdexpir(false),
-                setExpQtyModel(false);
+                setExpQtyModel(false));
             }}
             okText="Submit"
             cancelText="Don't Submit"
@@ -4655,9 +4627,9 @@ const BSOtherServiceItemCard = (props) => {
             open={expVarModel}
             onOk={() => expVerFun(VarItem)}
             onCancel={() => {
-              setexpVarModel(false),
+              (setexpVarModel(false),
                 setRepeatedModel(false),
-                setProdexpir(false);
+                setProdexpir(false));
             }}
             okText="Submit"
             cancelText="Don't Submit"
@@ -4681,9 +4653,9 @@ const BSOtherServiceItemCard = (props) => {
             open={expStockModel}
             onOk={() => expStockFun(StockItem)}
             onCancel={() => {
-              setexpStockModel(false),
+              (setexpStockModel(false),
                 setRepeatedModel(false),
-                setProdexpir(false);
+                setProdexpir(false));
             }}
             okText="Submit"
             cancelText="Don't Submit"
@@ -4843,16 +4815,16 @@ const BSOtherServiceItemCard = (props) => {
                         ]?.ProdVariantName?.toLowerCase()?.includes(
                           'variant'
                         ) && (
-                            <span>
-                              (
-                              {
-                                qtydata?.ProductDetail?.[QtyIndex]
-                                  ?.ProdVariantDetails?.[VarientIndex]
-                                  ?.ProdVariantName
-                              }
-                              ){' '}
-                            </span>
-                          )}
+                          <span>
+                            (
+                            {
+                              qtydata?.ProductDetail?.[QtyIndex]
+                                ?.ProdVariantDetails?.[VarientIndex]
+                                ?.ProdVariantName
+                            }
+                            ){' '}
+                          </span>
+                        )}
                       </p>
                     </div>
                   </div>
@@ -4943,7 +4915,6 @@ const BSOtherServiceItemCard = (props) => {
             }
           />
         )}
-
       </>
     );
 
@@ -4974,5 +4945,4 @@ const BSOtherServiceItemCard = (props) => {
   return <>{encrypt()}</>;
 };
 
-
-export default BSOtherServiceItemCard
\ No newline at end of file
+export default BSOtherServiceItemCard;
diff --git a/src/Pages/BookingScreen/Components/BSItemCards/BsBookingitemCard.jsx b/src/Pages/BookingScreen/Components/BSItemCards/BsBookingitemCard.jsx
index 2755054..1285b7f 100644
--- a/src/Pages/BookingScreen/Components/BSItemCards/BsBookingitemCard.jsx
+++ b/src/Pages/BookingScreen/Components/BSItemCards/BsBookingitemCard.jsx
@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
-import {  Badge, DatePicker, Modal, Tooltip, message } from 'antd';
+import { Badge, DatePicker, Modal, Tooltip, message } from 'antd';
 import { ExclamationCircleOutlined, PlusOutlined } from '@ant-design/icons';
 import defaultimage from '../../../../Images/defaultItemImg.png';
 import FormHeader from '../../../PageComponents/FormHeader';
@@ -67,6 +67,7 @@ import {
   GlobalAddBookingDetailsTrigger,
   GlobalGetmultipleSearchDatas,
   getmultipleSearch,
+  GlobalAllBookingType,
 } from '../../../../Features/BookingScreen/BookingData/BookingData';
 import {
   GlobalPreOrderAdditem,
@@ -108,7 +109,7 @@ import { ExtractDateFormate } from '../../../../Services/Others.js';
 import {
   changeFullOfferAppliedProducts,
   changeOfferAppliedProductsForMembership,
-  GlobalOfferAppliedProducts
+  GlobalOfferAppliedProducts,
 } from '../../../../Features/Offer/Offernew/BookingOffernew.js';
 import { useSaleswiseOfferWatcher } from './SalesWiseOffer.jsx';
 import { ApplicationPreferences } from '../../../../Features/BrachLogin/BranchLogin.js';
@@ -164,6 +165,8 @@ const BsBookingitemCard = (props) => {
   const voiceTriggerRef = useRef(null);
   const unsubscribeRef = useRef(null);
 
+  const AllBookingType = useSelector(GlobalAllBookingType);
+
   const { removeFromCart, clearAllItems, decline } = useRemoveFromCart();
   const handleRemoveFromCart = async (item) => {
     await removeFromCart(item, setPreviousdataLength);
@@ -172,9 +175,6 @@ const BsBookingitemCard = (props) => {
     await decline(item, setPreviousdataLength);
   };
 
-
-
-
   const cardFunction = props?.cardFunctionality;
   // const applyOffer = useApplyOfferto_CardDetail();
   const preferenceDatas = useSelector(PreferenceData, shallowEqual);
@@ -194,7 +194,10 @@ const BsBookingitemCard = (props) => {
     shallowEqual
   );
   // const SelectedCust = useSelector(GlobalSelOption, shallowEqual);
-  const GetmultipleSearchDatas = useSelector(GlobalGetmultipleSearchDatas, shallowEqual)
+  const GetmultipleSearchDatas = useSelector(
+    GlobalGetmultipleSearchDatas,
+    shallowEqual
+  );
   const RetailWSSalesType = useSelector(GlobalRetailWSSalesType, shallowEqual);
   // const CustDetails = SelectedCust ? SelectedCust : AddCustomerDetails?.[0];
   const BookingTypeBoth = useSelector(GlobalBookingTypeBoth);
@@ -425,9 +428,9 @@ const BsBookingitemCard = (props) => {
             AppId: AppId,
             ...(AvailableDate && selectedDate
               ? {
-                fromDate: selectedDate?.[0],
-                toDate: selectedDate?.[1],
-              }
+                  fromDate: selectedDate?.[0],
+                  toDate: selectedDate?.[1],
+                }
               : {}),
           };
           await dispatch(getSelectedFavItems(data)).unwrap();
@@ -660,9 +663,9 @@ const BsBookingitemCard = (props) => {
             AppId: AppId,
             ...(AvailableDate && selectedDate
               ? {
-                fromDate: selectedDate?.[0],
-                toDate: selectedDate?.[1],
-              }
+                  fromDate: selectedDate?.[0],
+                  toDate: selectedDate?.[1],
+                }
               : {}),
           };
           await dispatch(getSelectedFavItems(data)).unwrap();
@@ -754,9 +757,9 @@ const BsBookingitemCard = (props) => {
             AppId: AppId,
             ...(AvailableDate && selectedDate
               ? {
-                fromDate: selectedDate?.[0],
-                toDate: selectedDate?.[1],
-              }
+                  fromDate: selectedDate?.[0],
+                  toDate: selectedDate?.[1],
+                }
               : {}),
           };
           await dispatch(getSelectedFavItems(data)).unwrap();
@@ -1001,7 +1004,7 @@ const BsBookingitemCard = (props) => {
           ? []
           : SelectedDatas
       : ItemCard?.length == 0 ||
-        (ItemCard?.[0]?.AppId === 0 && ItemCard?.[0]?.CompId === 0)
+          (ItemCard?.[0]?.AppId === 0 && ItemCard?.[0]?.CompId === 0)
         ? noSubcatCardData
         : ItemCard
     : '';
@@ -1069,7 +1072,7 @@ const BsBookingitemCard = (props) => {
   useEffect(() => {
     if (AppId && CompId && BranchId) {
       fetchedit();
-      GetmultipleSearchData()
+      GetmultipleSearchData();
     }
 
     // dispatch(changepreOrder(false)); Commented to Add Normal Produts After Adding the Combo Pack !!!!!! Dont Touch Without Shifayath Permission
@@ -1082,10 +1085,9 @@ const BsBookingitemCard = (props) => {
     };
 
     try {
-      const response = await dispatch(getmultipleSearch(data))
-
+      const response = await dispatch(getmultipleSearch(data));
     } catch (error) {
-      console.error("Get Search Terms Error:", error);
+      console.error('Get Search Terms Error:', error);
     }
   };
   useEffect(() => {
@@ -1106,9 +1108,9 @@ const BsBookingitemCard = (props) => {
         AppId: AppId,
         ...(AvailableDate && selectedDate
           ? {
-            fromDate: selectedDate?.[0],
-            toDate: selectedDate?.[1],
-          }
+              fromDate: selectedDate?.[0],
+              toDate: selectedDate?.[1],
+            }
           : {}),
       };
       dispatch(getSelectedFavItems(data)).unwrap();
@@ -1120,9 +1122,10 @@ const BsBookingitemCard = (props) => {
     if (noSubcatCardData) {
       setNoSubcatCardData();
     }
-    if (ProductSearch?.length > 5 && GetmultipleSearchDatas.some(
-      e => e.toLowerCase() === "qrcode"
-    )) {
+    if (
+      ProductSearch?.length > 5 &&
+      GetmultipleSearchDatas.some((e) => e.toLowerCase() === 'qrcode')
+    ) {
       setQuickAdd(true);
     }
   }, [ProductSearch, GetmultipleSearchDatas]);
@@ -1169,9 +1172,9 @@ const BsBookingitemCard = (props) => {
         ProdSubCat: currentProdSubCat,
         ...(AvailableDate && currentDateRef
           ? {
-            fromDate: currentDateRef?.[0],
-            toDate: currentDateRef?.[1],
-          }
+              fromDate: currentDateRef?.[0],
+              toDate: currentDateRef?.[1],
+            }
           : {}),
       };
       //mohan
@@ -1192,9 +1195,9 @@ const BsBookingitemCard = (props) => {
         prodCat: currentProdCat,
         ...(AvailableDate && currentDateRef
           ? {
-            fromDate: currentDateRef?.[0],
-            toDate: currentDateRef?.[1],
-          }
+              fromDate: currentDateRef?.[0],
+              toDate: currentDateRef?.[1],
+            }
           : {}),
       };
 
@@ -1218,9 +1221,9 @@ const BsBookingitemCard = (props) => {
         prodCat: currentProdCat,
         ...(AvailableDate && currentDateRef
           ? {
-            fromDate: currentDateRef?.[0],
-            toDate: currentDateRef?.[1],
-          }
+              fromDate: currentDateRef?.[0],
+              toDate: currentDateRef?.[1],
+            }
           : {}),
       };
 
@@ -1233,20 +1236,12 @@ const BsBookingitemCard = (props) => {
   };
 
   const getBookingTypeId = async () => {
-    let tempconfigdata = await dispatch(
-      getConfigType({ TypeName: 'Booking Type' })
-    ).unwrap();
+    setConfigDataList(AllBookingType);
+    let configdata = AllBookingType;
+    let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
 
-    if (tempconfigdata?.data?.statusCode == 1) {
-      setConfigDataList(tempconfigdata?.data?.data);
-      let configdata = tempconfigdata?.data?.data;
-      let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
-
-      let filterconfigdata = configdata?.find(
-        (a) => a?.ConfigName === checkName
-      );
-      // setSelectedBookingType(filterconfigdata?.ConfigId);
-    }
+    let filterconfigdata = configdata?.find((a) => a?.ConfigName === checkName);
+    // setSelectedBookingType(filterconfigdata?.ConfigId);
   };
 
   function getCurrentMembership(memberships) {
@@ -1276,9 +1271,9 @@ const BsBookingitemCard = (props) => {
       AppId: AppId,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
     let res = await dispatch(getEditFavItems(data)).unwrap();
@@ -1484,13 +1479,13 @@ const BsBookingitemCard = (props) => {
             (cartItem) =>
               cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
               cartItem?.InwardDtlId ===
-              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                index.key
-              ]?.StockDetails?.[0]?.InwardDtlId &&
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.InwardDtlId &&
               cartItem?.OrderRate ===
-              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                index.key
-              ]?.StockDetails?.[0]?.SellPrice &&
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.SellPrice &&
               !cartItem?.SalesId
           );
 
@@ -1498,11 +1493,11 @@ const BsBookingitemCard = (props) => {
             let Isincartonepc = CartOrderDetails?.filter(
               (cartItem) =>
                 cartItem?.ProdId ===
-                qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
+                  qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
                 cartItem?.InwardDtlId ===
-                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                  index.key
-                ]?.StockDetails?.[0]?.InwardDtlId &&
+                  qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                    index.key
+                  ]?.StockDetails?.[0]?.InwardDtlId &&
                 // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
                 !cartItem?.SalesId
             );
@@ -1595,13 +1590,13 @@ const BsBookingitemCard = (props) => {
           (cartItem) =>
             cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-              index.key
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                index.key
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             cartItem?.OrderRate ===
-            qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-              index.key
-            ]?.StockDetails?.[0]?.SellPrice &&
+              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                index.key
+              ]?.StockDetails?.[0]?.SellPrice &&
             !cartItem?.SalesId
         );
 
@@ -1610,9 +1605,9 @@ const BsBookingitemCard = (props) => {
             (cartItem) =>
               cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
               cartItem?.InwardDtlId ===
-              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
-                index.key
-              ]?.StockDetails?.[0]?.InwardDtlId &&
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.InwardDtlId &&
               // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
               !cartItem?.SalesId
           );
@@ -1760,15 +1755,15 @@ const BsBookingitemCard = (props) => {
         let Isincart = CartOrderDetails?.find(
           (cartItem) =>
             cartItem?.ProdId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-              item?.VarientIndex
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             cartItem?.OrderRate ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-              item?.VarientIndex
-            ]?.StockDetails?.[0]?.SellPrice &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.SellPrice &&
             !cartItem?.SalesId
         );
 
@@ -1776,11 +1771,11 @@ const BsBookingitemCard = (props) => {
           let Isincartonepc = CartOrderDetails?.filter(
             (cartItem) =>
               cartItem?.ProdId ===
-              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+                qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
               cartItem?.InwardDtlId ===
-              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-                item?.VarientIndex
-              ]?.StockDetails?.[0]?.InwardDtlId &&
+                qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                  item?.VarientIndex
+                ]?.StockDetails?.[0]?.InwardDtlId &&
               // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
               !cartItem?.SalesId
           );
@@ -1859,15 +1854,15 @@ const BsBookingitemCard = (props) => {
       let Isincart = CartOrderDetails?.find(
         (cartItem) =>
           cartItem?.ProdId ===
-          qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
           cartItem?.InwardDtlId ===
-          qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-            item?.VarientIndex
-          ]?.StockDetails?.[0]?.InwardDtlId &&
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+              item?.VarientIndex
+            ]?.StockDetails?.[0]?.InwardDtlId &&
           cartItem?.OrderRate ===
-          qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-            item?.VarientIndex
-          ]?.StockDetails?.[0]?.SellPrice &&
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+              item?.VarientIndex
+            ]?.StockDetails?.[0]?.SellPrice &&
           !cartItem?.SalesId
       );
 
@@ -1875,11 +1870,11 @@ const BsBookingitemCard = (props) => {
         let Isincartonepc = CartOrderDetails?.filter(
           (cartItem) =>
             cartItem?.ProdId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
             cartItem?.InwardDtlId ===
-            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
-              item?.VarientIndex
-            ]?.StockDetails?.[0]?.InwardDtlId &&
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
             // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
             !cartItem?.SalesId
         );
@@ -2314,7 +2309,7 @@ const BsBookingitemCard = (props) => {
           parseInt(totalSelectedProductQty || 0) +
           parseInt(reorderComboConsumed || 0);
       }
-    } catch (_) { }
+    } catch (_) {}
     let getCurrentProdDtl = orderDetails?.filter(
       (a) => a?.ProdName === ProdName
     );
@@ -2515,7 +2510,7 @@ const BsBookingitemCard = (props) => {
             parseInt(totalSelectedProductQty || 0) +
             parseInt(reorderComboConsumed || 0);
         }
-      } catch (_) { }
+      } catch (_) {}
       let getCurrentProdDtl = orderDetails?.filter((a) => a?.ProdId === ProdId);
       let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
         return (
@@ -2551,7 +2546,7 @@ const BsBookingitemCard = (props) => {
         }, 0);
         totalOrderQty =
           parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
-      } catch (_) { }
+      } catch (_) {}
       let OverallProdQty = totalOrderQty - totalSelectedProductQty;
       if (
         parseInt(ItemQuantity) >
@@ -2637,7 +2632,7 @@ const BsBookingitemCard = (props) => {
             parseInt(totalSelectedProductQty || 0) +
             parseInt(reorderComboConsumed || 0);
         }
-      } catch (_) { }
+      } catch (_) {}
       let getCurrentProdDtl = orderDetails?.filter((a) => a?.ProdId === ProdId);
       let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
         return (
@@ -2676,7 +2671,7 @@ const BsBookingitemCard = (props) => {
         }, 0);
         totalOrderQty =
           parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
-      } catch (_) { }
+      } catch (_) {}
       let OverallProdQty = totalOrderQty - totalSelectedProductQty;
       if (
         parseInt(ItemQuantity) >
@@ -2768,7 +2763,7 @@ const BsBookingitemCard = (props) => {
             parseInt(totalSelectedProductQty || 0) +
             parseInt(reorderComboConsumed || 0);
         }
-      } catch (_) { }
+      } catch (_) {}
       let getCurrentProdDtl = orderDetails?.filter(
         (a) => a?.ProdId === ProdId && a?.InwardDtlId === InwardDtlId
       );
@@ -2811,7 +2806,7 @@ const BsBookingitemCard = (props) => {
         }, 0);
         totalOrderQty =
           parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
-      } catch (_) { }
+      } catch (_) {}
 
       let OverallProdQty = totalOrderQty - totalSelectedProductQty;
       if (
@@ -2895,7 +2890,7 @@ const BsBookingitemCard = (props) => {
             parseInt(totalSelectedProductQty || 0) +
             parseInt(reorderComboConsumed || 0);
         }
-      } catch (_) { }
+      } catch (_) {}
       let getCurrentProdDtl = orderDetails?.filter(
         (a) => a?.ProdId === ProdId && a?.InwardDtlId === InwardDtlId
       );
@@ -2942,7 +2937,7 @@ const BsBookingitemCard = (props) => {
         }, 0);
         totalOrderQty =
           parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
-      } catch (_) { }
+      } catch (_) {}
 
       let OverallProdQty = totalOrderQty - totalSelectedProductQty;
       if (
@@ -2981,7 +2976,7 @@ const BsBookingitemCard = (props) => {
       const same =
         item?.InwardDtlId === data?.InwardDtlId &&
         item?.ProdVariantName?.toLowerCase() ===
-        data?.VarientName?.toLowerCase() &&
+          data?.VarientName?.toLowerCase() &&
         item?.VariantAvailableFrom === data?.VariantAvailableFrom &&
         item?.VariantAvailableTo === data?.VariantAvailableTo &&
         item?.BookedDate &&
@@ -3006,7 +3001,7 @@ const BsBookingitemCard = (props) => {
         <span
           style={
             record.StockCount > 0 ||
-              record.StockCount === 'Stock Not Maintained'
+            record.StockCount === 'Stock Not Maintained'
               ? { color: '#000', cursor: 'pointer' }
               : { color: '#f49898', cursor: 'not-allowed' }
           }
@@ -3036,7 +3031,7 @@ const BsBookingitemCard = (props) => {
         <span
           style={
             record.StockCount > 0 ||
-              record.StockCount === 'Stock Not Maintained'
+            record.StockCount === 'Stock Not Maintained'
               ? { color: '#000', cursor: 'pointer' }
               : { color: '#f49898', cursor: 'not-allowed' }
           }
@@ -3066,7 +3061,7 @@ const BsBookingitemCard = (props) => {
         <span
           style={
             record.StockCount > 0 ||
-              record.StockCount === 'Stock Not Maintained'
+            record.StockCount === 'Stock Not Maintained'
               ? { color: '#000', cursor: 'pointer' }
               : { color: '#f49898', cursor: 'not-allowed' }
           }
@@ -3320,20 +3315,20 @@ const BsBookingitemCard = (props) => {
       'Batch No': item?.BatchRef,
       StockCount: onePeiceFlow
         ? returnCountStock(
-          item?.ProdId,
-          item?.OverAllPcs,
-          CartOrderDetails,
-          item?.InwardDtlId,
-          'Y'
-        )
+            item?.ProdId,
+            item?.OverAllPcs,
+            CartOrderDetails,
+            item?.InwardDtlId,
+            'Y'
+          )
         : returnCountStock(
-          item?.ProdId,
-          item?.BalanceQty,
-          CartOrderDetails,
-          item?.InwardDtlId,
-          'N',
-          item?.OverAllPcs
-        ),
+            item?.ProdId,
+            item?.BalanceQty,
+            CartOrderDetails,
+            item?.InwardDtlId,
+            'N',
+            item?.OverAllPcs
+          ),
       'Stock Date': ExtractDateFormate(item?.InwardDate),
       Price: onePeiceFlow ? item?.OnePcsPrice : item?.SellPrice,
       ExpDate:
@@ -3637,9 +3632,9 @@ const BsBookingitemCard = (props) => {
       AppId,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -3671,9 +3666,9 @@ const BsBookingitemCard = (props) => {
       prodCat: ProdCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -4499,9 +4494,9 @@ const BsBookingitemCard = (props) => {
   allProducts.forEach((product) => {
     const brandName =
       product.BrandName &&
-        product.BrandName !== 'null' &&
-        product.BrandName !== 'undefined' &&
-        product.BrandName.trim() !== ''
+      product.BrandName !== 'null' &&
+      product.BrandName !== 'undefined' &&
+      product.BrandName.trim() !== ''
         ? product.BrandName
         : 'Others';
 
@@ -4535,13 +4530,13 @@ const BsBookingitemCard = (props) => {
 
   const result = prodname
     ? (cardData || [])?.filter(
-      (item) =>
-        normalize(item.ProdName).includes(normalize(prodname)) ||
-        normalize(item.ProdCatName).includes(normalize(prodname)) ||
-        item.ProductDetail?.some((detail) =>
-          normalize(detail.ProdName).includes(normalize(prodname))
-        )
-    )
+        (item) =>
+          normalize(item.ProdName).includes(normalize(prodname)) ||
+          normalize(item.ProdCatName).includes(normalize(prodname)) ||
+          item.ProductDetail?.some((detail) =>
+            normalize(detail.ProdName).includes(normalize(prodname))
+          )
+      )
     : cardData;
 
   const getDatePickerValue = (selectedDate) => {
@@ -4598,8 +4593,8 @@ const BsBookingitemCard = (props) => {
               zIndex: '12',
               top:
                 templateData?.BookingLayout?.[0] === 'Layout5' ||
-                  templateData?.BookingLayout?.[0] === 'Layout4' ||
-                  templateData?.BookingLayout?.[0] === 'Layout6'
+                templateData?.BookingLayout?.[0] === 'Layout4' ||
+                templateData?.BookingLayout?.[0] === 'Layout6'
                   ? '2.5rem'
                   : '',
             }}
@@ -4711,39 +4706,39 @@ const BsBookingitemCard = (props) => {
                                           cardFunction?.Background &&
                                           (SelectedCardColor
                                             ? SelectedCardColor?.[
-                                            'BackgroundColor'
-                                            ]
+                                                'BackgroundColor'
+                                              ]
                                             : ''),
                                         padding:
                                           !cardFunction?.ImageUp &&
-                                            !cardFunction?.ImageDown
+                                          !cardFunction?.ImageDown
                                             ? cardFunction?.SmallImage &&
-                                            '5px 9px'
+                                              '5px 9px'
                                             : '8px 2px',
                                         flexDirection:
                                           cardFunction?.ImageRight &&
-                                            'row-reverse'
+                                          'row-reverse'
                                             ? cardFunction?.ImageRight &&
-                                            'row-reverse'
+                                              'row-reverse'
                                             : cardFunction?.ImageUp && 'column'
                                               ? cardFunction?.ImageUp &&
-                                              'column'
+                                                'column'
                                               : cardFunction?.ImageDown &&
-                                                'column-reverse'
+                                                  'column-reverse'
                                                 ? cardFunction?.ImageDown &&
-                                                'column-reverse'
+                                                  'column-reverse'
                                                 : cardFunction?.ImageLeft &&
-                                                'row',
+                                                  'row',
                                         borderRadius:
                                           cardFunction?.EdgeCurve && '6px',
                                         width:
                                           !cardFunction?.ImageUp &&
-                                            !cardFunction?.ImageDown &&
-                                            !cardFunction?.BigImage &&
-                                            !cardFunction?.ImageRight &&
-                                            cardFunction?.SmallImage &&
-                                            (cardFunction?.ImageUp ||
-                                              cardFunction?.ImageDown)
+                                          !cardFunction?.ImageDown &&
+                                          !cardFunction?.BigImage &&
+                                          !cardFunction?.ImageRight &&
+                                          cardFunction?.SmallImage &&
+                                          (cardFunction?.ImageUp ||
+                                            cardFunction?.ImageDown)
                                             ? '6rem'
                                             : cardFunction?.BigImage && '9rem',
                                         height:
@@ -4765,39 +4760,39 @@ const BsBookingitemCard = (props) => {
                                     >
                                       {(cardFunction?.BigImage ||
                                         cardFunction?.SmallImage) && (
-                                          <img
-                                            style={{
-                                              objectFit:
-                                                cardFunction?.BigImage && '',
-                                              height: !cardFunction?.BigImage
-                                                ? (!cardFunction?.BigImage &&
+                                        <img
+                                          style={{
+                                            objectFit:
+                                              cardFunction?.BigImage && '',
+                                            height: !cardFunction?.BigImage
+                                              ? (!cardFunction?.BigImage &&
                                                   cardFunction?.SmallImage) ||
-                                                  cardFunction?.ImageLeft ||
-                                                  cardFunction?.ImageUp ||
-                                                  cardFunction?.ImageDown
-                                                  ? '3rem'
-                                                  : cardFunction?.BigImage &&
+                                                cardFunction?.ImageLeft ||
+                                                cardFunction?.ImageUp ||
+                                                cardFunction?.ImageDown
+                                                ? '3rem'
+                                                : cardFunction?.BigImage &&
                                                   '7rem'
-                                                : '5rem',
-                                            }}
-                                            className={
-                                              cardFunction?.SmallImage
-                                                ? 'BSItemCard-image-smallimage'
-                                                : 'BSItemCard-image'
-                                            }
-                                            src={
-                                              item?.ProductDetail?.[0]
-                                                ?.ProdLogo === ''
-                                                ? defaultimage
-                                                : item?.ProductDetail?.[0]
-                                                  ?.ProdLogo
-                                                  ? item?.ProductDetail?.[0]
+                                              : '5rem',
+                                          }}
+                                          className={
+                                            cardFunction?.SmallImage
+                                              ? 'BSItemCard-image-smallimage'
+                                              : 'BSItemCard-image'
+                                          }
+                                          src={
+                                            item?.ProductDetail?.[0]
+                                              ?.ProdLogo === ''
+                                              ? defaultimage
+                                              : item?.ProductDetail?.[0]
                                                     ?.ProdLogo
-                                                  : defaultimage
-                                            }
-                                            alt=""
-                                          />
-                                        )}
+                                                ? item?.ProductDetail?.[0]
+                                                    ?.ProdLogo
+                                                : defaultimage
+                                          }
+                                          alt=""
+                                        />
+                                      )}
                                       <div
                                         className={
                                           cardFunction?.SmallImage
@@ -4809,8 +4804,8 @@ const BsBookingitemCard = (props) => {
                                             cardFunction?.Background &&
                                             (SelectedCardColor
                                               ? SelectedCardColor?.[
-                                              'BackgroundColor'
-                                              ]
+                                                  'BackgroundColor'
+                                                ]
                                               : ''),
 
                                           position: !cardFunction?.BigImage
@@ -4831,7 +4826,7 @@ const BsBookingitemCard = (props) => {
                                           height: cardFunction?.SmallImage
                                             ? '5.5rem'
                                             : !cardFunction?.BigImage &&
-                                            '5.5rem',
+                                              '5.5rem',
                                           alignItems:
                                             !cardFunction?.BigImage &&
                                             !cardFunction?.SmallImage &&
@@ -4854,11 +4849,11 @@ const BsBookingitemCard = (props) => {
                                               'uppercase',
                                             width: !cardFunction?.SmallImage
                                               ? cardFunction?.BigImage &&
-                                              '120px'
+                                                '120px'
                                               : cardFunction?.SmallImage &&
-                                              !cardFunction?.ImageUp &&
-                                              !cardFunction?.ImageDown &&
-                                              '85px',
+                                                !cardFunction?.ImageUp &&
+                                                !cardFunction?.ImageDown &&
+                                                '85px',
                                             // Width: cardFunction?.BigImage && "70px",
                                             fontSize:
                                               !cardFunction?.BigImage &&
@@ -4879,7 +4874,7 @@ const BsBookingitemCard = (props) => {
                                           className="BSItemCard-itemName"
                                         >
                                           {item?.ProdName}
-                                          { }
+                                          {}
                                         </p>
                                         {cardFunction?.Price && (
                                           <p
@@ -4888,7 +4883,7 @@ const BsBookingitemCard = (props) => {
                                               fontSize:
                                                 !cardFunction?.SmallImage
                                                   ? cardFunction?.BigImage &&
-                                                  '12px'
+                                                    '12px'
                                                   : '12px',
                                               textAlign: 'center',
                                               lineHeight: '2',
@@ -4897,8 +4892,8 @@ const BsBookingitemCard = (props) => {
                                                 : '',
                                               color: SelectedCardColor
                                                 ? SelectedCardColor?.[
-                                                'FontColor'
-                                                ]
+                                                    'FontColor'
+                                                  ]
                                                 : '',
                                             }}
                                           >
@@ -4984,39 +4979,39 @@ const BsBookingitemCard = (props) => {
                                           cardFunction?.Background &&
                                           (SelectedCardColor
                                             ? SelectedCardColor?.[
-                                            'BackgroundColor'
-                                            ]
+                                                'BackgroundColor'
+                                              ]
                                             : ''),
                                         padding:
                                           !cardFunction?.ImageUp &&
-                                            !cardFunction?.ImageDown
+                                          !cardFunction?.ImageDown
                                             ? cardFunction?.SmallImage &&
-                                            '5px 9px'
+                                              '5px 9px'
                                             : '8px 2px',
                                         flexDirection:
                                           cardFunction?.ImageRight &&
-                                            'row-reverse'
+                                          'row-reverse'
                                             ? cardFunction?.ImageRight &&
-                                            'row-reverse'
+                                              'row-reverse'
                                             : cardFunction?.ImageUp && 'column'
                                               ? cardFunction?.ImageUp &&
-                                              'column'
+                                                'column'
                                               : cardFunction?.ImageDown &&
-                                                'column-reverse'
+                                                  'column-reverse'
                                                 ? cardFunction?.ImageDown &&
-                                                'column-reverse'
+                                                  'column-reverse'
                                                 : cardFunction?.ImageLeft &&
-                                                'row',
+                                                  'row',
                                         borderRadius:
                                           cardFunction?.EdgeCurve && '6px',
                                         width:
                                           !cardFunction?.ImageUp &&
-                                            !cardFunction?.ImageDown &&
-                                            !cardFunction?.BigImage &&
-                                            !cardFunction?.ImageRight &&
-                                            cardFunction?.SmallImage &&
-                                            (cardFunction?.ImageUp ||
-                                              cardFunction?.ImageDown)
+                                          !cardFunction?.ImageDown &&
+                                          !cardFunction?.BigImage &&
+                                          !cardFunction?.ImageRight &&
+                                          cardFunction?.SmallImage &&
+                                          (cardFunction?.ImageUp ||
+                                            cardFunction?.ImageDown)
                                             ? '6rem'
                                             : cardFunction?.BigImage && '9rem',
                                         height:
@@ -5033,43 +5028,43 @@ const BsBookingitemCard = (props) => {
                                       onClick={(e) => {
                                         CardOnclick(item, index);
                                       }}
-                                    // data-aos="zoom-in" data-aos-duration="600"
+                                      // data-aos="zoom-in" data-aos-duration="600"
                                     >
                                       {(cardFunction?.BigImage ||
                                         cardFunction?.SmallImage) && (
-                                          <img
-                                            style={{
-                                              objectFit:
-                                                cardFunction?.BigImage && '',
-                                              height: !cardFunction?.BigImage
-                                                ? (!cardFunction?.BigImage &&
+                                        <img
+                                          style={{
+                                            objectFit:
+                                              cardFunction?.BigImage && '',
+                                            height: !cardFunction?.BigImage
+                                              ? (!cardFunction?.BigImage &&
                                                   cardFunction?.SmallImage) ||
-                                                  cardFunction?.ImageLeft ||
-                                                  cardFunction?.ImageUp ||
-                                                  cardFunction?.ImageDown
-                                                  ? '3rem'
-                                                  : cardFunction?.BigImage &&
+                                                cardFunction?.ImageLeft ||
+                                                cardFunction?.ImageUp ||
+                                                cardFunction?.ImageDown
+                                                ? '3rem'
+                                                : cardFunction?.BigImage &&
                                                   '7rem'
-                                                : '4rem',
-                                            }}
-                                            className={
-                                              cardFunction?.SmallImage
-                                                ? 'BSItemCard-image-smallimage'
-                                                : 'BSItemCard-image'
-                                            }
-                                            src={
-                                              item?.ProductDetail?.[0]
-                                                ?.ProdLogo === ''
-                                                ? defaultimage
-                                                : item?.ProductDetail?.[0]
-                                                  ?.ProdLogo
-                                                  ? item?.ProductDetail?.[0]
+                                              : '4rem',
+                                          }}
+                                          className={
+                                            cardFunction?.SmallImage
+                                              ? 'BSItemCard-image-smallimage'
+                                              : 'BSItemCard-image'
+                                          }
+                                          src={
+                                            item?.ProductDetail?.[0]
+                                              ?.ProdLogo === ''
+                                              ? defaultimage
+                                              : item?.ProductDetail?.[0]
                                                     ?.ProdLogo
-                                                  : defaultimage
-                                            }
-                                            alt=""
-                                          />
-                                        )}
+                                                ? item?.ProductDetail?.[0]
+                                                    ?.ProdLogo
+                                                : defaultimage
+                                          }
+                                          alt=""
+                                        />
+                                      )}
                                       <div
                                         className={
                                           cardFunction?.SmallImage
@@ -5081,8 +5076,8 @@ const BsBookingitemCard = (props) => {
                                             cardFunction?.Background &&
                                             (SelectedCardColor
                                               ? SelectedCardColor?.[
-                                              'BackgroundColor'
-                                              ]
+                                                  'BackgroundColor'
+                                                ]
                                               : ''),
 
                                           position: !cardFunction?.BigImage
@@ -5103,7 +5098,7 @@ const BsBookingitemCard = (props) => {
                                           height: cardFunction?.SmallImage
                                             ? '5.5rem'
                                             : !cardFunction?.BigImage &&
-                                            '4.5rem',
+                                              '4.5rem',
                                           alignItems:
                                             !cardFunction?.BigImage &&
                                             !cardFunction?.SmallImage &&
@@ -5123,11 +5118,11 @@ const BsBookingitemCard = (props) => {
                                               'uppercase',
                                             width: !cardFunction?.SmallImage
                                               ? cardFunction?.BigImage &&
-                                              '120px'
+                                                '120px'
                                               : cardFunction?.SmallImage &&
-                                              !cardFunction?.ImageUp &&
-                                              !cardFunction?.ImageDown &&
-                                              '85px',
+                                                !cardFunction?.ImageUp &&
+                                                !cardFunction?.ImageDown &&
+                                                '85px',
                                             // Width: cardFunction?.BigImage && "70px",
                                             fontSize:
                                               !cardFunction?.BigImage &&
@@ -5163,7 +5158,7 @@ const BsBookingitemCard = (props) => {
                                                 fontSize:
                                                   !cardFunction?.SmallImage
                                                     ? cardFunction?.BigImage &&
-                                                    '12px'
+                                                      '12px'
                                                     : '12px',
                                                 textAlign: 'center',
                                                 lineHeight: '2',
@@ -5172,8 +5167,8 @@ const BsBookingitemCard = (props) => {
                                                   : '',
                                                 color: SelectedCardColor
                                                   ? SelectedCardColor?.[
-                                                  'FontColor'
-                                                  ]
+                                                      'FontColor'
+                                                    ]
                                                   : '',
                                               }}
                                             >
@@ -5272,7 +5267,7 @@ const BsBookingitemCard = (props) => {
                                       height={60}
                                       src={
                                         item?.ProductDetail?.[0]?.ProdLogo ===
-                                          ''
+                                        ''
                                           ? defaultimage
                                           : item?.ProductDetail?.[0]?.ProdLogo
                                             ? item?.ProductDetail?.[0]?.ProdLogo
@@ -5289,15 +5284,15 @@ const BsBookingitemCard = (props) => {
                                   </div>
                                   {item?.ProductDetail?.[0]?.ProdVariantDetails
                                     ?.length > 0 && (
-                                      <div className="card4PriceUom">
-                                        <div className="card4Price">
-                                          ₹ {ItemSellingPrice(item)}
-                                        </div>
-                                        <div className="card4Uom">
-                                          {ItemSize(item)} {ItemUomName(item)}
-                                        </div>
+                                    <div className="card4PriceUom">
+                                      <div className="card4Price">
+                                        ₹ {ItemSellingPrice(item)}
                                       </div>
-                                    )}
+                                      <div className="card4Uom">
+                                        {ItemSize(item)} {ItemUomName(item)}
+                                      </div>
+                                    </div>
+                                  )}
                                 </div>
 
                                 {/* Stock Count Badge */}
@@ -5336,9 +5331,10 @@ const BsBookingitemCard = (props) => {
                     </SortableContext>
                   </DndContext>
                 </>
-              ) : ProductSearch?.length > 5 && GetmultipleSearchDatas.some(
-                e => e.toLowerCase() === "qrcode"
-              ) &&
+              ) : ProductSearch?.length > 5 &&
+                GetmultipleSearchDatas.some(
+                  (e) => e.toLowerCase() === 'qrcode'
+                ) &&
                 (cardData?.length == 0 || cardData == undefined) ? (
                 <div>
                   {/* cardData mohan 18-04-2025 */}
@@ -5358,39 +5354,46 @@ const BsBookingitemCard = (props) => {
                       display: globalAccessForOthers && 'none',
                     }}
                   >
-                    <div align="center" class="fond">
-                      <div class="contener_general">
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_1">&nbsp;</div>
+                    Name
+                    <div align="Namecenter" className="fond">
+                      <div className="Namecontener_general">
+                        <div className="Namecontener_mixte">
+                          <div className="ballcolor ball_1">&nbsp;</div>
                         </div>
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_2">&nbsp;</div>
+                        Name
+                        <div className="Namecontener_mixte">
+                          <div className="ballcolor ball_2">&nbsp;</div>
                         </div>
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_3">&nbsp;</div>
+                        Name
+                        <div className="Namecontener_mixte">
+                          <div className="ballcolor ball_3">&nbsp;</div>
                         </div>
-                        <div class="contener_mixte">
-                          <div class="ballcolor ball_4">&nbsp;</div>
+                        Name
+                        <div className="Namecontener_mixte">
+                          <div className="ballcolor ball_4">&nbsp;</div>
                         </div>
                       </div>
                     </div>
                   </div>
                 </>
               )}
-              {paymentloader === true && (
-                <div class="Payment-loader1">
-                  <div class="Payment-loader">
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_1">&nbsp;</div>
+              {paymentloadNameer === true && (
+                <div className="NamePayment-loader1">
+                  <div className="NamePayment-loader">
+                    <div className="Namecontener_mixte">
+                      <div className="ballcolor ball_1">&nbsp;</div>
                     </div>
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_2">&nbsp;</div>
+                    Name
+                    <div className="Namecontener_mixte">
+                      <div className="ballcolor ball_2">&nbsp;</div>
                     </div>
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_3">&nbsp;</div>
+                    Name
+                    <div className="Namecontener_mixte">
+                      <div className="ballcolor ball_3">&nbsp;</div>
                     </div>
-                    <div class="contener_mixte">
-                      <div class="ballcolor ball_4">&nbsp;</div>
+                    Name
+                    <div className="Namecontener_mixte">
+                      <div className="ballcolor ball_4">&nbsp;</div>
                     </div>
                     <p style={{ marginTop: '2rem' }}>
                       {' '}
@@ -5989,30 +5992,30 @@ const BsBookingitemCard = (props) => {
                                           {slots.map((timeSlot, idx) => {
                                             const isBooked =
                                               timeSlot?.SlotStatus?.toLowerCase() ==
-                                              'booked' || false;
+                                                'booked' || false;
                                             const isBlocked =
                                               timeSlot?.SlotStatus?.toLowerCase() ==
-                                              'blocked' || false;
+                                                'blocked' || false;
                                             const isPartiallyBooked =
                                               timeSlot?.SlotStatus?.toLowerCase() ===
-                                              'partially booked' || false;
+                                                'partially booked' || false;
                                             const isPartiallyBlocked =
                                               timeSlot?.SlotStatus?.toLowerCase() ===
-                                              'partially blocked' || false;
+                                                'partially blocked' || false;
 
                                             const isSelected =
                                               CartOrderDetails?.some(
                                                 (selected) =>
                                                   selected.ProdId ===
-                                                  timeSlot?.ProdId &&
+                                                    timeSlot?.ProdId &&
                                                   selected.InwardDtlId ===
-                                                  timeSlot?.InwardDtlId &&
+                                                    timeSlot?.InwardDtlId &&
                                                   selected.VariantAvailableFrom ===
-                                                  timeSlot?.VariantAvailableFrom &&
+                                                    timeSlot?.VariantAvailableFrom &&
                                                   selected.VariantAvailableTo ===
-                                                  timeSlot?.VariantAvailableTo &&
+                                                    timeSlot?.VariantAvailableTo &&
                                                   selected.BookedDate ===
-                                                  timeSlot?.BookedDate
+                                                    timeSlot?.BookedDate
                                               );
 
                                             const isAlreadyAdded =
@@ -6020,25 +6023,25 @@ const BsBookingitemCard = (props) => {
                                                 const itemDate =
                                                   item?.BookedDate
                                                     ? new Date(
-                                                      item?.BookedDate
-                                                    ).toLocaleDateString()
+                                                        item?.BookedDate
+                                                      ).toLocaleDateString()
                                                     : null;
 
                                                 return (
                                                   item?.InwardDtlId ===
-                                                  timeSlot?.InwardDtlId &&
+                                                    timeSlot?.InwardDtlId &&
                                                   item?.VariantAvailableFrom ===
-                                                  timeSlot?.VariantAvailableFrom &&
+                                                    timeSlot?.VariantAvailableFrom &&
                                                   item?.VariantAvailableTo ===
-                                                  timeSlot?.VariantAvailableTo &&
+                                                    timeSlot?.VariantAvailableTo &&
                                                   item?.ProdVariantName?.toLowerCase() ===
-                                                  timeSlot?.VarientName?.toLowerCase() &&
+                                                    timeSlot?.VarientName?.toLowerCase() &&
                                                   itemDate === dataDate &&
                                                   (item?.SinglePc === 'Y'
                                                     ? returnVariantStock(
-                                                      data,
-                                                      CartOrderDetails
-                                                    ) === 0
+                                                        data,
+                                                        CartOrderDetails
+                                                      ) === 0
                                                     : true)
                                                 );
                                               });
@@ -6051,13 +6054,13 @@ const BsBookingitemCard = (props) => {
                                               selectedSlots?.some(
                                                 (selected) =>
                                                   selected.InwardDtlId ===
-                                                  timeSlot?.InwardDtlId &&
+                                                    timeSlot?.InwardDtlId &&
                                                   selected.VariantAvailableFrom ===
-                                                  timeSlot?.VariantAvailableFrom &&
+                                                    timeSlot?.VariantAvailableFrom &&
                                                   selected.VariantAvailableTo ===
-                                                  timeSlot?.VariantAvailableTo &&
+                                                    timeSlot?.VariantAvailableTo &&
                                                   selected.TempDate ===
-                                                  timeSlot?.BookedDate
+                                                    timeSlot?.BookedDate
                                               );
                                             const isDisabled =
                                               isBooked ||
@@ -6070,25 +6073,26 @@ const BsBookingitemCard = (props) => {
                                             return (
                                               <div
                                                 key={idx}
-                                                className={`slotTimingSelect  ${isBooked
-                                                  ? 'booked'
-                                                  : isAlreadyAdded
-                                                    ? 'incart'
-                                                    : isPartiallyBooked
-                                                      ? 'partial'
-                                                      : isBlocked &
-                                                        !isSelected ||
-                                                        slotEnded
-                                                        ? 'blocked'
-                                                        : isBlocked ||
-                                                          isSelected ||
-                                                          isPartiallyBlocked ||
-                                                          isSelected
-                                                          ? 'selected'
-                                                          : BlockSelectedSlots
-                                                            ? 'blocked'
-                                                            : 'available'
-                                                  } ${timeSlot?.OnePcsPrice <= 0 && activeMode === 'individual' ? 'hide' : ''}`}
+                                                className={`slotTimingSelect  ${
+                                                  isBooked
+                                                    ? 'booked'
+                                                    : isAlreadyAdded
+                                                      ? 'incart'
+                                                      : isPartiallyBooked
+                                                        ? 'partial'
+                                                        : isBlocked &
+                                                              !isSelected ||
+                                                            slotEnded
+                                                          ? 'blocked'
+                                                          : isBlocked ||
+                                                              isSelected ||
+                                                              isPartiallyBlocked ||
+                                                              isSelected
+                                                            ? 'selected'
+                                                            : BlockSelectedSlots
+                                                              ? 'blocked'
+                                                              : 'available'
+                                                } ${timeSlot?.OnePcsPrice <= 0 && activeMode === 'individual' ? 'hide' : ''}`}
                                                 //  ${isSelected ? 'selected' : ''}
                                                 disabled={isDisabled}
                                                 onClick={(e) => {
@@ -6107,7 +6111,7 @@ const BsBookingitemCard = (props) => {
                                                         timeSlot,
                                                         product,
                                                         onePeiceFlow ||
-                                                        isPartiallyBooked,
+                                                          isPartiallyBooked,
                                                         !slotEnded
                                                       );
                                                   }
@@ -6125,7 +6129,7 @@ const BsBookingitemCard = (props) => {
                                                 <div className="slot-price">
                                                   ₹
                                                   {onePeiceFlow ||
-                                                    isPartiallyBooked
+                                                  isPartiallyBooked
                                                     ? timeSlot?.OnePcsPrice
                                                     : timeSlot?.SellPrice || 0}
                                                 </div>
@@ -6151,15 +6155,15 @@ const BsBookingitemCard = (props) => {
                                                             !CartOrderDetails?.some(
                                                               (selected) =>
                                                                 selected.ProdId ===
-                                                                timeSlot.ProdId &&
+                                                                  timeSlot.ProdId &&
                                                                 selected.InwardDtlId ===
-                                                                timeSlot.InwardDtlId &&
+                                                                  timeSlot.InwardDtlId &&
                                                                 selected.VariantAvailableFrom ===
-                                                                timeSlot.VariantAvailableFrom &&
+                                                                  timeSlot.VariantAvailableFrom &&
                                                                 selected.VariantAvailableTo ===
-                                                                timeSlot.VariantAvailableTo &&
+                                                                  timeSlot.VariantAvailableTo &&
                                                                 selected.BookedDate ===
-                                                                timeSlot.BookedDate
+                                                                  timeSlot.BookedDate
                                                             )
                                                           }
                                                           icon={
@@ -6220,30 +6224,29 @@ const BsBookingitemCard = (props) => {
                                                     />
                                                   )}
 
-                                                {
-                                                  (timeSlot?.SlotStatus ===
-                                                    'Partially Booked' ||
-                                                    timeSlot?.SlotStatus ===
+                                                {(timeSlot?.SlotStatus ===
+                                                  'Partially Booked' ||
+                                                  timeSlot?.SlotStatus ===
                                                     'Booked') && (
-                                                    <div
-                                                      onClick={(e) => {
-                                                        e.stopPropagation();
-                                                        handleBookedDetails({
-                                                          ...timeSlot,
-                                                          ProdName:
-                                                            product
-                                                              ?.ProductDetail?.[0]
-                                                              ?.ProdName,
-                                                          ProdSubCatName:
-                                                            product?.ProdSubCatName,
-                                                        });
-                                                      }}
-                                                    >
-                                                      <span className="slot-booked">
-                                                        {timeSlot?.SlotStatus}
-                                                      </span>
-                                                    </div>
-                                                  )}
+                                                  <div
+                                                    onClick={(e) => {
+                                                      e.stopPropagation();
+                                                      handleBookedDetails({
+                                                        ...timeSlot,
+                                                        ProdName:
+                                                          product
+                                                            ?.ProductDetail?.[0]
+                                                            ?.ProdName,
+                                                        ProdSubCatName:
+                                                          product?.ProdSubCatName,
+                                                      });
+                                                    }}
+                                                  >
+                                                    <span className="slot-booked">
+                                                      {timeSlot?.SlotStatus}
+                                                    </span>
+                                                  </div>
+                                                )}
                                               </div>
                                             );
                                           })}
@@ -6410,7 +6413,7 @@ const BsBookingitemCard = (props) => {
                                       <td>{customer.CustMobile || 'N/A'}</td>
                                       <td className="action-buttons">
                                         {customer?.CustBookDetails?.length >
-                                          1 ? (
+                                        1 ? (
                                           <button
                                             className="show-all-btn"
                                             onClick={() =>
@@ -6421,7 +6424,7 @@ const BsBookingitemCard = (props) => {
                                             {customer.CustBookDetails.length})
                                           </button>
                                         ) : customer?.CustBookDetails
-                                          ?.length === 1 ? (
+                                            ?.length === 1 ? (
                                           <>
                                             <button
                                               className="start-btn"
@@ -6511,22 +6514,22 @@ const BsBookingitemCard = (props) => {
                                         <td>
                                           {booking.CreatedDate
                                             ? dayjs(booking.CreatedDate).format(
-                                              'DD MMM YYYY hh:mm A'
-                                            )
+                                                'DD MMM YYYY hh:mm A'
+                                              )
                                             : 'N/A'}
                                         </td>
                                         <td>
                                           {booking.StartTime
                                             ? dayjs(booking.StartTime).format(
-                                              'hh:mm A'
-                                            )
+                                                'hh:mm A'
+                                              )
                                             : '-'}
                                         </td>
                                         <td>
                                           {booking.EndTime
                                             ? dayjs(booking.EndTime).format(
-                                              'hh:mm A'
-                                            )
+                                                'hh:mm A'
+                                              )
                                             : '-'}
                                         </td>
                                         <td className="action-buttons">
diff --git a/src/Pages/BookingScreen/Components/BSItemCards/RemoveFromCartFunction.jsx b/src/Pages/BookingScreen/Components/BSItemCards/RemoveFromCartFunction.jsx
index cabd0b2..d0150e2 100644
--- a/src/Pages/BookingScreen/Components/BSItemCards/RemoveFromCartFunction.jsx
+++ b/src/Pages/BookingScreen/Components/BSItemCards/RemoveFromCartFunction.jsx
@@ -223,9 +223,9 @@ export const useRemoveFromCart = () => {
       AppId: AppId,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
     await dispatch(getSelectedFavItems(data)).unwrap();
@@ -237,9 +237,9 @@ export const useRemoveFromCart = () => {
       ProdSubCat: useSelector((state) => state.BookingData.ProductSubCategorie),
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -250,9 +250,9 @@ export const useRemoveFromCart = () => {
       prodCat: useSelector((state) => state.BookingData.ProductCategorie),
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -345,26 +345,26 @@ export const useRemoveFromCart = () => {
     console.log('isItemInCart', isItemInCart);
     if (isItemInCart?.OrderQty > 1) {
       const UpdatedCartItem =
-      // if the item is already in the cart, increase the quantity of the item
-      {
-        ...isItemInCart,
-        OrderQty: isItemInCart?.OrderQty - 1,
-        TotalAmt: (isItemInCart?.OrderQty - 1) * isItemInCart?.OrderRate,
-        TaxAmt: (
-          ((isItemInCart?.OrderQty - 1) *
-            isItemInCart?.OrderRate *
-            isItemInCart?.TaxPercentage) /
-          (100 + isItemInCart?.TaxPercentage)
-        ).toFixed(2),
-        WithoutTaxRate:
-          (isItemInCart?.OrderQty - 1) * isItemInCart?.OrderRate -
-          (
+        // if the item is already in the cart, increase the quantity of the item
+        {
+          ...isItemInCart,
+          OrderQty: isItemInCart?.OrderQty - 1,
+          TotalAmt: (isItemInCart?.OrderQty - 1) * isItemInCart?.OrderRate,
+          TaxAmt: (
             ((isItemInCart?.OrderQty - 1) *
               isItemInCart?.OrderRate *
               isItemInCart?.TaxPercentage) /
             (100 + isItemInCart?.TaxPercentage)
           ).toFixed(2),
-      };
+          WithoutTaxRate:
+            (isItemInCart?.OrderQty - 1) * isItemInCart?.OrderRate -
+            (
+              ((isItemInCart?.OrderQty - 1) *
+                isItemInCart?.OrderRate *
+                isItemInCart?.TaxPercentage) /
+              (100 + isItemInCart?.TaxPercentage)
+            ).toFixed(2),
+        };
       const UpdatedcardData = [UpdatedCartItem, ...UpdatedData];
 
       if (OfferCheckedInSetup && preferenceOffer) {
diff --git a/src/Pages/BookingScreen/Components/BSNavbar/BSNavBarUserInfo.jsx b/src/Pages/BookingScreen/Components/BSNavbar/BSNavBarUserInfo.jsx
index a0b2f90..c7a2d04 100644
--- a/src/Pages/BookingScreen/Components/BSNavbar/BSNavBarUserInfo.jsx
+++ b/src/Pages/BookingScreen/Components/BSNavbar/BSNavBarUserInfo.jsx
@@ -1,15 +1,16 @@
-import React from 'react';
+import React, { lazy, Suspense } from 'react';
 import { MdEdit } from 'react-icons/md';
 import { FaUserLarge } from 'react-icons/fa6';
 import { BiSolidPhoneCall } from 'react-icons/bi';
 import { PiSignOutLight } from 'react-icons/pi';
 import user from '../../../../Images/dashboard/user.jpg';
 import { clearSession, getSession } from '../../../../Services/Others';
-import UserRelieveManager from '../../Template/RealivingUser';
 import { GlobalCompBranchData } from '../../../../Features/BrachLogin/BranchLogin';
 import { userDataByUserId } from '../../../../Features/UserAccount/userData';
 import { useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
+const UserRelieveManager = lazy(() => import('../../Template/RealivingUser'));
+// Scss
 import "../../../../Styles/BookingScreen/Components/BSNavbar/BSNavbar1.scss"
 const subDirectory = import.meta.env.ENV_BASE_URL;
 
@@ -37,65 +38,67 @@ const BSNavBarUserInfo = ({
     navigate(`${subDirectory}app-page/branch-login`);
   };
   return (
-    <div ref={divRef} className="BSNavBar1-Accmenu">
-      <div className="BSNavBar1-Acc-menu">
-        {CompBranchData?.length > 1 && (
-          <div onClick={BacktoLogin}>
-            <p className="BSNavBar1-Acc-menu-list">Back to Signin</p>
-          </div>
-        )}
-        <div className="salesUserProfile" style={{ position: 'relative' }}>
-          <div
-            style={{
-              position: 'absolute',
-              top: '5px',
-              right: '5px',
-              cursor: 'pointer',
-              display: 'flex',
-              justifyContent: 'flex-end',
-              gap: '1rem',
-            }}
-          >
-            {/* {UserType != 'Employee' &&  */}
-            <MdEdit size={16} onClick={handleEditProfile} />
-            {/* } */}
-            <UserRelieveManager />
-          </div>
-          <img
-            src={
-              userProfileData?.UserImage && userProfileData.UserImage !== ''
-                ? userProfileData.UserImage
-                : user
-            }
-            alt={userProfileData?.UserName || 'User'}
-            onError={(e) => {
-              e.target.onerror = null;
-              e.target.src = user;
-            }}
-          />
-          <div>
-            <FaUserLarge size={14} /> {userProfileData?.UserName || 'Name'}
-            <p
+    <Suspense fallback={<div>Loading…</div>}>
+      <div ref={divRef} className="BSNavBar1-Accmenu">
+        <div className="BSNavBar1-Acc-menu">
+          {CompBranchData?.length > 1 && (
+            <div onClick={BacktoLogin}>
+              <p className="BSNavBar1-Acc-menu-list">Back to Signin</p>
+            </div>
+          )}
+          <div className="salesUserProfile" style={{ position: 'relative' }}>
+            <div
               style={{
-                fontSize: '12px',
-                textTransform: 'uppercase',
-                color: '#0b53b3',
-                fontWeight: '500',
+                position: 'absolute',
+                top: '5px',
+                right: '5px',
+                cursor: 'pointer',
+                display: 'flex',
+                justifyContent: 'flex-end',
+                gap: '1rem',
               }}
             >
-              ({UserType})
+              {/* {UserType != 'Employee' &&  */}
+              <MdEdit size={16} onClick={handleEditProfile} />
+              {/* } */}
+              <UserRelieveManager />
+            </div>
+            <img
+              src={
+                userProfileData?.UserImage && userProfileData.UserImage !== ''
+                  ? userProfileData.UserImage
+                  : user
+              }
+              alt={userProfileData?.UserName || 'User'}
+              onError={(e) => {
+                e.target.onerror = null;
+                e.target.src = user;
+              }}
+            />
+            <div>
+              <FaUserLarge size={14} /> {userProfileData?.UserName || 'Name'}
+              <p
+                style={{
+                  fontSize: '12px',
+                  textTransform: 'uppercase',
+                  color: '#0b53b3',
+                  fontWeight: '500',
+                }}
+              >
+                ({UserType})
+              </p>
+            </div>
+            <div>
+              <BiSolidPhoneCall size={16} />{' '}
+              {userProfileData?.MobileNo || 'Number'}
+            </div>
+            <p className="BSNavBar1-Acc-menu-list" onClick={Logout}>
+              Sign Out <PiSignOutLight size={16} strokeWidth={10} />
             </p>
           </div>
-          <div>
-            <BiSolidPhoneCall size={16} />{' '}
-            {userProfileData?.MobileNo || 'Number'}
-          </div>
-          <p className="BSNavBar1-Acc-menu-list" onClick={Logout}>
-            Sign Out <PiSignOutLight size={16} strokeWidth={10} />
-          </p>
         </div>
       </div>
-    </div>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar1.jsx b/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar1.jsx
index 9ff6275..603cd61 100644
--- a/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar1.jsx
+++ b/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar1.jsx
@@ -1,16 +1,20 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useRef,
+  useState,
+  lazy,
+  Suspense,
+} from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
-import { Badge, Button, Popconfirm, Popover, Tooltip } from 'antd';
+import { Badge, Popconfirm, Popover, Tooltip } from 'antd';
 import {
-  FeatureAddon,
   GlobalBookingType,
   GlobalBookingTypeBoth,
   PreferenceData,
-  changeCombosearch,
   GlobalCombosearch,
   getPreferenceData,
-  Comboget,
   GlobalOrderCardDetails,
   changeEstimateBooking,
   GlobalOrderStatus,
@@ -31,46 +35,8 @@ import {
   changeComboRedirectionToDefaultLayoutForParking,
   GlobalCommonPaymentOptions,
   GlobalSelCustId,
-} from '../../../../Features/BookingScreen/BookingData/BookingData';
-import PozoPreOrderIcon from '../UtillComponents/Pozo retail icons/PozoPreOrderIcon.jsx';
-import BSNavBarPrinter from '../UtillComponents/BSNavBarPrinter';
-import BSNavBarHand from '../UtillComponents/BSNavBarHand';
-import BSNavBarTable from '../UtillComponents/BSNavBarTable';
-import BSNavBarHandbag from '../UtillComponents/BSNavBarHandbag';
-import BSNavBarOffer from '../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx';
-import BSNavBarAddons from '../UtillComponents/BSNavBarAddons';
-import BSNavBarAddUser from '../UtillComponents/BSNavBarAddUser';
-import BSNavBarQuickAdd from '../UtillComponents/BSNavBarQuickAdd';
-import BSNavBarSearch from '../UtillComponents/BSNavBarSearch';
-import BSNavBarWeightScale from '../UtillComponents/BSNavBarWeightScale';
-import BSNavBarFavItems from '../UtillComponents/BSNavBarFavItems';
-import BSNavBarEstimate from '../UtillComponents/BSNavBarEst.jsx';
-import BSNavBarPreOrder from '../../Components/UtillComponents/BSNavBarPreOrder.jsx';
-import '../../../../Styles/BookingScreen/Components/BSNavbar/BSNavbar1.scss';
-import {
-  getSession,
-  clearSession,
-  sessionStore,
-} from '../../../../Services/Others';
-import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities';
-import BSCustomerSelect from '../UtillComponents/BSSelectCustomer.jsx';
-import PozoHomeIcon from '../UtillComponents/Pozo retail icons/PozoHomeIcon';
-import PozoUserIcon from '../UtillComponents/Pozo retail icons/PozoUserIcon';
-import TimerClock from '../BSCombo/BSTimer.jsx';
-import {
-  ApplicationPreferences,
-  GenerateLogout,
-  GlobalCompBranchData,
-  getCompBranchData,
-} from '../../../../Features/BrachLogin/BranchLogin.js';
-import BSPrinterSetting from '../UtillComponents/BSPrinterSetting.jsx';
-import { isMobile } from 'react-device-detect';
-import { FaDisplay } from 'react-icons/fa6';
-import BSNavBarComboSearch from '../UtillComponents/BSNavBarComboSearch.jsx';
-import {
-  setCustomerDisplayWindow,
-  closeCustomerDisplayWindow,
-} from '../../../../Features/customerDisplayWindow/customerDisplayWindow';
+} from '../../../../Features/BookingScreen/BookingData/BookingData.js';
+// js Files
 import {
   GlobalPreOrderPendingCount,
   PreOrderGet,
@@ -79,49 +45,125 @@ import {
   changePreOrderAdditem,
   changepreOrderList,
 } from '../../../../Features/BookingScreen/PreOrder/PreOrder.js';
+import {
+  ApplicationPreferences,
+  GenerateLogout,
+  GlobalCompBranchData,
+  getCompBranchData,
+} from '../../../../Features/BrachLogin/BranchLogin.js';
 import { getCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
-import PozoAddCustomerIcon from '../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
-import PaymentFailedSales from '../../../Payment/PaymentFailedDetails/PaymentFailedSales.jsx';
-import PozoComboProductIcon from '../UtillComponents/Pozo retail icons/PozoComboProductIcon.jsx';
-import CustomerDisplayicon from '../UtillComponents/Pozo retail icons/PozoCustomerDisplayicon.jsx';
-import PozoPaymentFailesIcon from '../UtillComponents/Pozo retail icons/PozoFailedPaymentsIcon.jsx';
-import PozoMenuIcon from '../UtillComponents/Pozo retail icons/PozoMenuIcon.jsx';
-import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
 import { Global_OfferStatus } from '../../../../Features/Offer/Offer.js';
 import {
-  getPrintSelectionComponentData,
   getTemplate,
   getTemplateData,
   StoredSessionData,
 } from '../../../../Features/ThemeChange/ThemeChange.js';
-import { IoMdClose } from 'react-icons/io';
 import { GlobalBookingStatus } from '../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail.js';
 import { getEmpAccess } from '../../../../Features/AppPage/CenterPage.js';
-import { useAuth } from '../../../../AuthContext.jsx';
-import BSNavBarDragItems from '../UtillComponents/BSNavBarDragItems.jsx';
 import {
   getUserProfile,
   userDataByUserId,
 } from '../../../../Features/UserAccount/userData.js';
-import { FaUserLarge } from 'react-icons/fa6';
-import { BiSolidPhoneCall } from 'react-icons/bi';
-import { PiSignOutLight } from 'react-icons/pi';
-import PozoSwapIcon from '../UtillComponents/Pozo retail icons/PozoSwapIcon.jsx';
-import { MdEdit } from 'react-icons/md';
+import { OtherServicesCardlistdata } from '../../../../Features/OtherServices/OtherServices.js';
+import { clearSession, sessionStore } from '../../../../Services/Others.js';
+import { setCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
+import BSMobilePrintSettings from '../UtillComponents/BSMobilePrintSettings.jsx';
+
+// Jsx Files
+const BSNavBarOffer = lazy(
+  () => import('../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx')
+);
+
+const BSNavBarPreOrder = lazy(
+  () => import('../../Components/UtillComponents/BSNavBarPreOrder.jsx')
+);
+const BSNavBarEstimate = lazy(
+  () => import('../UtillComponents/BSNavBarEst.jsx')
+);
+const BSCustomerSelect = lazy(
+  () => import('../UtillComponents/BSSelectCustomer.jsx')
+);
+const TimerClock = lazy(() => import('../BSCombo/BSTimer.jsx'));
+const BSPrinterSetting = lazy(
+  () => import('../UtillComponents/BSPrinterSetting.jsx')
+);
+const BSNavBarComboSearch = lazy(
+  () => import('../UtillComponents/BSNavBarComboSearch.jsx')
+);
+const PaymentFailedSales = lazy(
+  () => import('../../../Payment/PaymentFailedDetails/PaymentFailedSales.jsx')
+);
+const BSNavBarWholeSale = lazy(
+  () => import('../UtillComponents/BSNavBarWholeSale.jsx')
+);
+const BSScanTemplate = lazy(
+  () => import('../UtillComponents/BSScanTemplate.jsx')
+);
+const VerfiedProducts = lazy(
+  () => import('./verfiedProduct/VerfiedProducts.jsx')
+);
+const BSMembership = lazy(() => import('../UtillComponents/BSMembership.jsx'));
+const BranchName = lazy(() => import('../../Template/BranchName.jsx'));
+const MultipleSearch = lazy(
+  () => import('../UtillComponents/MultipleSearch.jsx')
+);
+const BSNavBarDragItems = lazy(
+  () => import('../UtillComponents/BSNavBarDragItems.jsx')
+);
+const UserRelieveManager = lazy(
+  () => import('../../Template/RealivingUser.jsx')
+);
+const FeaturesFunctionalities = lazy(
+  () => import('../BookingFunctionality/FeaturesFunctionalities.jsx')
+);
+
+import { useAuth } from '../../../../AuthContext.jsx';
+const BSNavBarAddons = lazy(
+  () => import('../UtillComponents/BSNavBarAddons.jsx')
+);
+
+const BSNavBarQuickAdd = lazy(
+  () => import('../UtillComponents/BSNavBarQuickAdd.jsx')
+);
+const BSNavBarAddUser = lazy(
+  () => import('../UtillComponents/BSNavBarAddUser.jsx')
+);
+const BSNavBarSearch = lazy(
+  () => import('../UtillComponents/BSNavBarSearch.jsx')
+);
+
+const BSNavBarWeightScale = lazy(
+  () => import('../UtillComponents/BSNavBarWeightScale.jsx')
+);
+const BSNavBarFavItems = lazy(
+  () => import('../UtillComponents/BSNavBarFavItems.jsx')
+);
+const BSNavBarHand = lazy(() => import('../UtillComponents/BSNavBarHand.jsx'));
+const BSNavBarTable = lazy(
+  () => import('../UtillComponents/BSNavBarTable.jsx')
+);
+const BSNavBarHandbag = lazy(
+  () => import('../UtillComponents/BSNavBarHandbag.jsx')
+);
+
+// Icon Files
+
+import PozoHomeIcon from '../UtillComponents/Pozo retail icons/PozoHomeIcon';
+import PozoPreOrderIcon from '../UtillComponents/Pozo retail icons/PozoPreOrderIcon.jsx';
+import PozoUserIcon from '../UtillComponents/Pozo retail icons/PozoUserIcon';
+import PozoAddCustomerIcon from '../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
+import CustomerDisplayicon from '../UtillComponents/Pozo retail icons/PozoCustomerDisplayicon.jsx';
+import PozoPaymentFailesIcon from '../UtillComponents/Pozo retail icons/PozoFailedPaymentsIcon.jsx';
+import PozoMenuIcon from '../UtillComponents/Pozo retail icons/PozoMenuIcon.jsx';
+
+import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
+import { IoMdClose } from 'react-icons/io';
 import { CgSearchLoading } from 'react-icons/cg';
-import UserRelieveManager from '../../Template/RealivingUser.jsx';
-import user from '../../../../Images/dashboard/user.jpg';
 import BSNavBarUserInfo from './BSNavBarUserInfo';
 import { FaParking } from 'react-icons/fa';
-import { OtherServicesCardlistdata } from '../../../../Features/OtherServices/OtherServices.js';
-import BSNavBarWholeSale from '../UtillComponents/BSNavBarWholeSale.jsx';
-import BSMobilePrintSettings from '../UtillComponents/BSMobilePrintSettings.jsx';
-import BSScanTemplate from '../UtillComponents/BSScanTemplate.jsx';
-import VerfiedProducts from './verfiedProduct/VerfiedProducts.jsx';
-import BSMembership from '../UtillComponents/BSMembership.jsx';
-import BranchName from '../../Template/BranchName.jsx';
-import MultipleSearch from '../UtillComponents/MultipleSearch.jsx';
+import { isMobile } from 'react-device-detect';
 import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
+import '../../../../Styles/BookingScreen/Components/BSNavbar/BSNavbar1.scss';
 
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const commonUrl = import.meta.env.ENV_COMMON_BASE_URL;
@@ -221,17 +263,28 @@ const BSNavbar1 = (props) => {
   const comboRedirectionToDefaultLayoutForParking = useSelector(
     GlobalComboRedirectionToDefaultLayoutForParking
   );
-  const CartOrderDetails = useSelector(GlobalOrderCardDetails);
+
   const divRef = useRef(null);
   const handleClickOutside = (event) => {
     if (divRef.current && !divRef.current.contains(event.target)) {
       setAccIsOpen(false);
     }
   };
+  useEffect(() => {
+    if (!FeatureAddonData?.FeatureDtls?.length) return;
+
+    const preorderFeature = FeatureAddonData.FeatureDtls.find(
+      (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
+    );
+
+    if (preorderFeature) {
+      BadgePendingApi();
+    }
+  }, [FeatureAddonData]);
 
   useEffect(() => {
     handleOtherData();
-    BadgePendingApi();
+
     // if (UserType === "Employee") {
     //   fetchApi()
     // }
@@ -558,433 +611,457 @@ const BSNavbar1 = (props) => {
   };
 
   return (
-    <div
-      className="BSBillingNavBar1"
-      style={{
-        backgroundColor: background,
-        color:
-          background == 'white' && '#fff' && '#ffff' && 'rgb(1, 1, 1)'
-            ? 'white'
-            : 'black',
-      }}
-    >
-      <Popconfirm
-        title="Are you sure you want to go home?"
-        onConfirm={handleHome}
-        okText="Yes"
-        cancelText="No"
+    <Suspense fallback={<div>Suspense Loading...</div>}>
+      <div
+        className="BSBillingNavBar1"
+        style={{
+          backgroundColor: background,
+          color:
+            background == 'white' && '#fff' && '#ffff' && 'rgb(1, 1, 1)'
+              ? 'white'
+              : 'black',
+        }}
       >
-        <div>
-          <TooltipWrapper
-            title="Back to Home"
-            placement="right"
-            isMobile={isMobile}
-          >
-            <PozoHomeIcon
-              style={{ color: '#1292EE', fontSize: '28px', cursor: 'pointer' }}
-              className="BSBillingNav2-toggle-icon"
-            />
-          </TooltipWrapper>
-        </div>
-      </Popconfirm>
-      {(addcustomer || hold) && (
-        <FeaturesFunctionalities
-          handleAddCustomerCancel={handleAddCustomerCancel}
-          addcustomer={addcustomer}
-          handleHoldCancel={handleHoldCancel}
-          modalOpen={hold}
-        />
-      )}
-      <div className="BSBillingNav1div2">
-        <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
-          <div className="salesStoreName">
-            <BranchName />
+        <Popconfirm
+          title="Are you sure you want to go home?"
+          onConfirm={handleHome}
+          okText="Yes"
+          cancelText="No"
+        >
+          <div>
+            <TooltipWrapper
+              title="Back to Home"
+              placement="right"
+              isMobile={isMobile}
+            >
+              <PozoHomeIcon
+                style={{
+                  color: '#1292EE',
+                  fontSize: '28px',
+                  cursor: 'pointer',
+                }}
+                className="BSBillingNav2-toggle-icon"
+              />
+            </TooltipWrapper>
+          </div>
+        </Popconfirm>
+        {(addcustomer || hold) && (
+          <FeaturesFunctionalities
+            handleAddCustomerCancel={handleAddCustomerCancel}
+            addcustomer={addcustomer}
+            handleHoldCancel={handleHoldCancel}
+            modalOpen={hold}
+          />
+        )}
+        <div className="BSBillingNav1div2">
+          <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+            <div className="salesStoreName">
+              <BranchName />
+            </div>
+
+            {OtherServiceStatus && (
+              <div style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}>
+                <TooltipWrapper title="Other Services" isMobile={isMobile}>
+                  <div
+                    onClick={handleotherservices}
+                    className="BSBillingNavBar1-AllIcons"
+                    style={{
+                      width: '1.49rem',
+                      margin: '0',
+                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                      cursor: 'pointer',
+                    }}
+                  >
+                    <FaParking
+                      fill={
+                        OtherServicesglobal === true ? '#52C41A' : '#1292EE'
+                      }
+                    />
+                  </div>
+                </TooltipWrapper>
+              </div>
+            )}
           </div>
 
-          {OtherServiceStatus && (
-            <div style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}>
-              <TooltipWrapper title="Other Services" isMobile={isMobile}>
-                <div
-                  onClick={handleotherservices}
-                  className="BSBillingNavBar1-AllIcons"
-                  style={{
-                    width: '1.49rem',
-                    margin: '0',
-                    pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                    cursor: 'pointer',
-                  }}
-                >
-                  <FaParking
-                    fill={OtherServicesglobal === true ? '#52C41A' : '#1292EE'}
-                  />
-                </div>
-              </TooltipWrapper>
-            </div>
-          )}
-        </div>
+          <div
+            style={{
+              display: 'flex',
+              alignItems: 'center',
+              columnGap: '0.5rem',
+              position: 'relative',
+            }}
+          >
+            {/* Multiple search  */}
+            <Tooltip title={'Multiple Search'}>
+              <div className="MultiSearchIconDiv">
+                <CgSearchLoading onClick={() => setMultiple(true)} />
+              </div>
+            </Tooltip>
 
-        <div
-          style={{
-            display: 'flex',
-            alignItems: 'center',
-            columnGap: '0.5rem',
-            position: 'relative',
-          }}
-        >
-          {/* Multiple search  */}
-          <Tooltip title={'Multiple Search'}>
-            <div className="MultiSearchIconDiv">
-              <CgSearchLoading onClick={() => setMultiple(true)} />
-            </div>
-          </Tooltip>
-
-          {!OtherServicesglobal && (
-            <>
-              {navbarOptions?.map((item) => (
-                <>
-                  {item?.OptionName == 'Search' &&
-                    Comboglobal === false &&
-                    !sportsAppPreference && (
-                      <div
-                        className="BSBillingNavBar1-Inputsearch-container"
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                        }}
-                      >
-                        <BSNavBarSearch nosearch={true} OrderType={OrderType} />
-                      </div>
-                    )}
-                </>
-              ))}
-              {Comboglobal === true && (
-                <div>
-                  <BSNavBarComboSearch SessionData={SessionData} />
-                </div>
-              )}
-            </>
-          )}
-        </div>
-
-        {!OtherServicesglobal && (
-          <>
-            {OpenFailData && (
-              <PaymentFailedSales
-                paymentFailedStatusFun={paymentFailedStatusFun}
-                OpenFailData={OpenFailData}
-              />
-            )}
-          </>
-        )}
-        <div className="BSBillingNavBar1-AllIcons">
-          {navbarOptions?.map((item) => (
-            <>
+            {!OtherServicesglobal && (
               <>
-                {item?.OptionName == 'RePrint' && !OtherServicesglobal && (
-                  <TooltipWrapper title="RePrint (Alt+R)" isMobile={isMobile}>
-                    <div
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <BSPrinterSetting />
-                    </div>
-                  </TooltipWrapper>
+                {navbarOptions?.map((item) => (
+                  <>
+                    {item?.OptionName == 'Search' &&
+                      Comboglobal === false &&
+                      !sportsAppPreference && (
+                        <div
+                          className="BSBillingNavBar1-Inputsearch-container"
+                          style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
+                          }}
+                        >
+                          <BSNavBarSearch
+                            nosearch={true}
+                            OrderType={OrderType}
+                          />
+                        </div>
+                      )}
+                  </>
+                ))}
+                {Comboglobal === true && (
+                  <div>
+                    <BSNavBarComboSearch SessionData={SessionData} />
+                  </div>
                 )}
               </>
-              {!OtherServicesglobal && (
-                <>
-                  {item?.OptionName == 'Hold' &&
-                    OrderType != 'Failed' &&
-                    OrderType != 'Reorder' &&
-                    CheckBookingStatus != 'Close' &&
-                    isHoldEnable &&
-                    !addnewAccess && (
-                      <div className="BSBillingNavBar1-hand">
-                        <BSNavBarHand />
-                      </div>
-                    )}
-                  {item?.OptionName == 'QuickAdd' && (
-                    <div
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <BSNavBarQuickAdd />
-                    </div>
-                  )}
-                  {item?.OptionName == 'DineIn' &&
-                    dinePreference &&
-                    PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                      (item) => item.SettingIdName === 'DineIn'
-                    )?.SettingValue === 'Y' && (
-                      <div
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' || addnewAccess
-                              ? 'none'
-                              : 'auto',
-                        }}
-                      >
-                        <BSNavBarTable />
-                      </div>
-                    )}
-                  {item?.OptionName == 'TakeAway' && takeAwayPreference && (
-                    <div
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <BSNavBarHandbag />
-                    </div>
-                  )}
+            )}
+          </div>
 
-                  {item?.OptionName === 'Offer' &&
-                    GlobEstBooking !== 'OvrAllEst' &&
-                    GlobEstBooking !== 'ParEst' &&
-                    GlobEstBooking === 'Sales' &&
-                    PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                      (item) => item.SettingIdName === 'Offer'
-                    )?.SettingValue === 'Y' && (
+          {!OtherServicesglobal && (
+            <>
+              {OpenFailData && (
+                <PaymentFailedSales
+                  paymentFailedStatusFun={paymentFailedStatusFun}
+                  OpenFailData={OpenFailData}
+                />
+              )}
+            </>
+          )}
+          <div className="BSBillingNavBar1-AllIcons">
+            {navbarOptions?.map((item) => (
+              <>
+                <>
+                  {item?.OptionName == 'RePrint' && !OtherServicesglobal && (
+                    <TooltipWrapper title="RePrint (Alt+R)" isMobile={isMobile}>
                       <div
                         style={{
                           pointerEvents:
                             OrderType === 'Failed' ? 'none' : 'auto',
                         }}
                       >
-                        <BSNavBarOffer />
+                        <BSPrinterSetting />
                       </div>
-                    )}
-                  {item?.OptionName == 'ExtraCharge' && (
-                    // CartOrderDetails?.length > 0 &&
-                    <div
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <BSNavBarAddons />
-                    </div>
-                  )}
-                  {item?.OptionName == 'AddCustomer' && !preOrderOpen && (
-                    <>
-                      <BSCustomerSelect TopName={'navbar-top'} />
-                      <BSNavBarAddUser />
-                    </>
+                    </TooltipWrapper>
                   )}
                 </>
-              )}
-            </>
-          ))}
-
-          {!OtherServicesglobal && (
-            <>
-              {FeatureAddonData?.FeatureDtls?.find(
-                (item) =>
-                  item?.FeatureAddonName?.toLowerCase() === 'weight scale'
-              ) && (
-                <div
-                  style={{
-                    pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                  }}
-                >
-                  <BSNavBarWeightScale />
-                </div>
-              )}
-              {FeatureAddonData?.FeatureDtls?.find(
-                (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
-              ) && (
-                <div
-                  style={{
-                    pointerEvents:
-                      tableData || OrderType === 'Failed' ? 'none' : 'auto',
-                    opacity: tableData ? 0.5 : 1,
-                  }}
-                >
-                  <TooltipWrapper title={'Pre Booking'} isMobile={isMobile}>
-                    <Badge
-                      count={preOrderPendingCount}
-                      offset={[-5, 10]}
-                      size="small"
-                    >
-                      <PozoPreOrderIcon
-                        className="BSBillingNav-icon"
-                        fill={preOrderOpen ? '#52C41A' : '#1292EE'}
-                        onClick={() => {
-                          openPreOrder();
+                {!OtherServicesglobal && (
+                  <>
+                    {item?.OptionName == 'Hold' &&
+                      OrderType != 'Failed' &&
+                      OrderType != 'Reorder' &&
+                      CheckBookingStatus != 'Close' &&
+                      isHoldEnable &&
+                      !addnewAccess && (
+                        <div className="BSBillingNavBar1-hand">
+                          <BSNavBarHand />
+                        </div>
+                      )}
+                    {item?.OptionName == 'QuickAdd' && (
+                      <div
+                        style={{
+                          pointerEvents:
+                            OrderType === 'Failed' ? 'none' : 'auto',
                         }}
-                        HandleClose={preOrderHandleclose}
-                      />
-                    </Badge>
-                  </TooltipWrapper>
-                </div>
-              )}
-              {preOrderOpen && (
-                <BSNavBarPreOrder HandleClose={preOrderHandleclose} />
-              )}
-              {sportsAppPreference && <BSMembership />}
-              {Estimation?.SettingValue === 'Y' &&
-                BookingType !== 'Dine In' &&
-                !BookingTypeBoth &&
-                !OrderOfferStatus && (
+                      >
+                        <BSNavBarQuickAdd />
+                      </div>
+                    )}
+                    {item?.OptionName == 'DineIn' &&
+                      dinePreference &&
+                      PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                        (item) => item.SettingIdName === 'DineIn'
+                      )?.SettingValue === 'Y' && (
+                        <div
+                          style={{
+                            pointerEvents:
+                              OrderType === 'Failed' || addnewAccess
+                                ? 'none'
+                                : 'auto',
+                          }}
+                        >
+                          <BSNavBarTable />
+                        </div>
+                      )}
+                    {item?.OptionName == 'TakeAway' && takeAwayPreference && (
+                      <div
+                        style={{
+                          pointerEvents:
+                            OrderType === 'Failed' ? 'none' : 'auto',
+                        }}
+                      >
+                        <BSNavBarHandbag />
+                      </div>
+                    )}
+
+                    {item?.OptionName === 'Offer' &&
+                      GlobEstBooking !== 'OvrAllEst' &&
+                      GlobEstBooking !== 'ParEst' &&
+                      GlobEstBooking === 'Sales' &&
+                      PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                        (item) => item.SettingIdName === 'Offer'
+                      )?.SettingValue === 'Y' && (
+                        <div
+                          style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
+                          }}
+                        >
+                          <BSNavBarOffer />
+                        </div>
+                      )}
+                    {item?.OptionName == 'ExtraCharge' && (
+                      // CartOrderDetails?.length > 0 &&
+                      <div
+                        style={{
+                          pointerEvents:
+                            OrderType === 'Failed' ? 'none' : 'auto',
+                        }}
+                      >
+                        <BSNavBarAddons />
+                      </div>
+                    )}
+                    {item?.OptionName == 'AddCustomer' && !preOrderOpen && (
+                      <>
+                        <BSCustomerSelect TopName={'navbar-top'} />
+                        <BSNavBarAddUser />
+                      </>
+                    )}
+                  </>
+                )}
+              </>
+            ))}
+
+            {!OtherServicesglobal && (
+              <>
+                {FeatureAddonData?.FeatureDtls?.find(
+                  (item) =>
+                    item?.FeatureAddonName?.toLowerCase() === 'weight scale'
+                ) && (
                   <div
                     style={{
                       pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
                     }}
                   >
-                    <BSNavBarEstimate />
+                    <BSNavBarWeightScale />
+                  </div>
+                )}
+                {FeatureAddonData?.FeatureDtls?.find(
+                  (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
+                ) && (
+                  <div
+                    style={{
+                      pointerEvents:
+                        tableData || OrderType === 'Failed' ? 'none' : 'auto',
+                      opacity: tableData ? 0.5 : 1,
+                    }}
+                  >
+                    <TooltipWrapper title={'Pre Booking'} isMobile={isMobile}>
+                      <Badge
+                        count={preOrderPendingCount}
+                        offset={[-5, 10]}
+                        size="small"
+                      >
+                        <PozoPreOrderIcon
+                          className="BSBillingNav-icon"
+                          fill={preOrderOpen ? '#52C41A' : '#1292EE'}
+                          onClick={() => {
+                            openPreOrder();
+                          }}
+                          HandleClose={preOrderHandleclose}
+                        />
+                      </Badge>
+                    </TooltipWrapper>
+                  </div>
+                )}
+                {preOrderOpen && (
+                  <BSNavBarPreOrder HandleClose={preOrderHandleclose} />
+                )}
+                {sportsAppPreference && <BSMembership />}
+                {Estimation?.SettingValue === 'Y' &&
+                  BookingType !== 'Dine In' &&
+                  !BookingTypeBoth &&
+                  !OrderOfferStatus && (
+                    <div
+                      style={{
+                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                      }}
+                    >
+                      <BSNavBarEstimate />
+                    </div>
+                  )}
+                {/* mohan */}
+                {SalesMode?.SettingValue === 'Y' && !OtherServicesglobal && (
+                  <BSNavBarWholeSale />
+                )}
+                {!OtherServicesglobal &&
+                  ScanLayoutScreen?.SettingValue === 'Y' && <BSScanTemplate />}
+                {!sportsAppPreference && (
+                  <div
+                    style={{
+                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                    }}
+                  >
+                    <BSNavBarFavItems />
                   </div>
                 )}
-              {/* mohan */}
-              {SalesMode?.SettingValue === 'Y' && !OtherServicesglobal && (
-                <BSNavBarWholeSale />
-              )}
-              {!OtherServicesglobal &&
-                ScanLayoutScreen?.SettingValue === 'Y' && <BSScanTemplate />}
-              {!sportsAppPreference && (
                 <div
+                  className="favIcon"
                   style={{
                     pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
                   }}
                 >
-                  <BSNavBarFavItems />
+                  <BSNavBarDragItems />
                 </div>
-              )}
-              <div
-                className="favIcon"
-                style={{
-                  pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                }}
-              >
-                <BSNavBarDragItems />
-              </div>
-              {FeatureAddonData?.FeatureDtls?.find(
-                (item) =>
-                  item?.FeatureAddonName?.toLowerCase() === 'customer display'
-              ) && (
-                <TooltipWrapper title="Customer Display" isMobile={isMobile}>
-                  {/* <div onClick={openNewTab} style={{ display: "flex", alignItems: "center", cursor: "pointer" }}>
+                {FeatureAddonData?.FeatureDtls?.find(
+                  (item) =>
+                    item?.FeatureAddonName?.toLowerCase() === 'customer display'
+                ) && (
+                  <TooltipWrapper title="Customer Display" isMobile={isMobile}>
+                    {/* <div onClick={openNewTab} style={{ display: "flex", alignItems: "center", cursor: "pointer" }}>
                 <FaDisplay />
               </div> */}
-                  <div
-                    onClick={openNewTab}
-                    className="BSBillingNavBar1-AllIcons"
-                    style={{
-                      width: '1.3rem',
-                      margin: '10px',
-                      cursor: 'pointer',
-                    }}
-                  >
-                    <CustomerDisplayicon />
-                  </div>
-                </TooltipWrapper>
-              )}
-              {paymentfeataddon && (
-                <TooltipWrapper title="Failed Payment" isMobile={isMobile}>
-                  {/* <img src={paymentFailure} width={20} height={20} style={{ cursor: "pointer" }} onClick={() => { paymentFailedStatusFun() }}></img> */}
-                  {/* <MdMoneyOff size={20} style={{ color: "rgb(33, 150, 243)",cursor:"pointer" }} onClick={() => { paymentFailedStatusFun() }} /> */}
-                  <div
-                    onClick={() => {
-                      paymentFailedStatusFun();
-                    }}
-                    className="BSBillingNavBar1-AllIcons"
-                    style={{ width: '1.4rem', cursor: 'pointer' }}
-                  >
-                    <PozoPaymentFailesIcon />
-                  </div>
-                </TooltipWrapper>
-              )}
+                    <div
+                      onClick={openNewTab}
+                      className="BSBillingNavBar1-AllIcons"
+                      style={{
+                        width: '1.3rem',
+                        margin: '10px',
+                        cursor: 'pointer',
+                      }}
+                    >
+                      <CustomerDisplayicon />
+                    </div>
+                  </TooltipWrapper>
+                )}
+                {paymentfeataddon && (
+                  <TooltipWrapper title="Failed Payment" isMobile={isMobile}>
+                    {/* <img src={paymentFailure} width={20} height={20} style={{ cursor: "pointer" }} onClick={() => { paymentFailedStatusFun() }}></img> */}
+                    {/* <MdMoneyOff size={20} style={{ color: "rgb(33, 150, 243)",cursor:"pointer" }} onClick={() => { paymentFailedStatusFun() }} /> */}
+                    <div
+                      onClick={() => {
+                        paymentFailedStatusFun();
+                      }}
+                      className="BSBillingNavBar1-AllIcons"
+                      style={{ width: '1.4rem', cursor: 'pointer' }}
+                    >
+                      <PozoPaymentFailesIcon />
+                    </div>
+                  </TooltipWrapper>
+                )}
 
-              {VerifyTheProducts && (
-                <TooltipWrapper title={'Verfied Products'} isMobile={isMobile}>
-                  <div>
-                    <VerfiedProducts />
-                  </div>
-                </TooltipWrapper>
-              )}
-            </>
-          )}
-        </div>
-        {isMobile && (
-          <div
-            style={{
-              color: 'rgb(33, 150, 243)',
-            }}
-          >
-            <BSMobilePrintSettings />
+                {VerifyTheProducts && (
+                  <TooltipWrapper
+                    title={'Verfied Products'}
+                    isMobile={isMobile}
+                  >
+                    <div>
+                      <VerfiedProducts />
+                    </div>
+                  </TooltipWrapper>
+                )}
+              </>
+            )}
           </div>
-        )}
-        {!OtherServicesglobal && (
-          <>
-            <div className="BSNavbar1-time-user">
-              <div
-                className="BSBillingNavBar1-SearchBar"
-                style={{ color: '#212529', flexDirection: 'column' }}
-              >
-                <TimerClock />
-                {formattedDate}
-              </div>
+          {isMobile && (
+            <div
+              style={{
+                color: 'rgb(33, 150, 243)',
+              }}
+            >
+              <BSMobilePrintSettings />
             </div>
-            <TooltipWrapper title="User Profile" isMobile={isMobile}>
-              <div className="UserProfile">
-                <PozoUserIcon onClick={UserAcc} />
+          )}
+          {!OtherServicesglobal && (
+            <>
+              <div className="BSNavbar1-time-user">
+                <div
+                  className="BSBillingNavBar1-SearchBar"
+                  style={{ color: '#212529', flexDirection: 'column' }}
+                >
+                  <TimerClock />
+                  {formattedDate}
+                </div>
               </div>
-            </TooltipWrapper>
+              <TooltipWrapper title="User Profile" isMobile={isMobile}>
+                <div className="UserProfile">
+                  <PozoUserIcon onClick={UserAcc} />
+                </div>
+              </TooltipWrapper>
 
-            {/* {isMobile && ( */}
-            {/* <div>
+              {/* {isMobile && ( */}
+              {/* <div>
               <BSPrinterSetting />
             </div> */}
-            {/* )} */}
+              {/* )} */}
 
-            {/* Use BSNavBarUserInfo for the account menu */}
-            <BSNavBarUserInfo
-              isOpen={isAccOpen}
-              divRef={divRef}
-              CompBranchData={CompBranchData}
-              BacktoLogin={BacktoLogin}
-              userProfileData={userProfileData}
-              handleEditProfile={handleEditProfile}
-              UserRelieveManager={<UserRelieveManager />}
-              Logout={Logout}
-            />
-          </>
-        )}
+              {/* Use BSNavBarUserInfo for the account menu */}
+              <BSNavBarUserInfo
+                isOpen={isAccOpen}
+                divRef={divRef}
+                CompBranchData={CompBranchData}
+                BacktoLogin={BacktoLogin}
+                userProfileData={userProfileData}
+                handleEditProfile={handleEditProfile}
+                UserRelieveManager={<UserRelieveManager />}
+                Logout={Logout}
+              />
+            </>
+          )}
 
-        {/* small screen nav bar */}
-        {Navmenu && (
-          <div>
-            <div
-              className="BSBillingnav1-Smallscreen"
-              style={{ backgroundColor: background }}
-            >
-              <div className="BSBillingNavBar1-AllIcons-column">
-                {OtherServiceStatus && (
-                  <div
-                    style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}
-                  >
-                    <TooltipWrapper title="Other Services" isMobile={isMobile}>
-                      <div onClick={handleotherservices}>
-                        <FaParking
-                          fill={
-                            OtherServicesglobal === true ? '#52C41A' : '#1292EE'
-                          }
-                        />
-                      </div>
-                    </TooltipWrapper>
-                  </div>
-                )}
-                {!OtherServicesglobal &&
-                  ScanLayoutScreen?.SettingValue === 'Y' && <BSScanTemplate />}
-
-                {!OtherServicesglobal && (
-                  <>
-                    {OpenFailData && (
-                      <PaymentFailedSales
-                        paymentFailedStatusFun={paymentFailedStatusFun}
-                        OpenFailData={OpenFailData}
-                      />
+          {/* small screen nav bar */}
+          {Navmenu && (
+            <div>
+              <div
+                className="BSBillingnav1-Smallscreen"
+                style={{ backgroundColor: background }}
+              >
+                <div className="BSBillingNavBar1-AllIcons-column">
+                  {OtherServiceStatus && (
+                    <div
+                      style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}
+                    >
+                      <TooltipWrapper
+                        title="Other Services"
+                        isMobile={isMobile}
+                      >
+                        <div onClick={handleotherservices}>
+                          <FaParking
+                            fill={
+                              OtherServicesglobal === true
+                                ? '#52C41A'
+                                : '#1292EE'
+                            }
+                          />
+                        </div>
+                      </TooltipWrapper>
+                    </div>
+                  )}
+                  {!OtherServicesglobal &&
+                    ScanLayoutScreen?.SettingValue === 'Y' && (
+                      <BSScanTemplate />
                     )}
-                    {/* {ComboDropDown?.length >= 1 && (
+
+                  {!OtherServicesglobal && (
+                    <>
+                      {OpenFailData && (
+                        <PaymentFailedSales
+                          paymentFailedStatusFun={paymentFailedStatusFun}
+                          OpenFailData={OpenFailData}
+                        />
+                      )}
+                      {/* {ComboDropDown?.length >= 1 && (
                       <div
                         style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}
                       >
@@ -1005,40 +1082,40 @@ const BSNavbar1 = (props) => {
                         </TooltipWrapper>
                       </div>
                     )} */}
-                    {navbarOptions?.map((item) => (
-                      <>
-                        {item?.OptionName == 'RePrint' &&
-                          !OtherServicesglobal && (
+                      {navbarOptions?.map((item) => (
+                        <>
+                          {item?.OptionName == 'RePrint' &&
+                            !OtherServicesglobal && (
+                              <div
+                                style={{
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
+                                }}
+                              >
+                                <BSPrinterSetting />
+                              </div>
+                            )}
+                          {item?.OptionName == 'Hold' &&
+                            OrderType != 'Failed' &&
+                            OrderType != 'Reorder' &&
+                            CheckBookingStatus != 'Close' &&
+                            isHoldEnable &&
+                            !addnewAccess && (
+                              <div>
+                                <BSNavBarHand className="BSBillingNavBar1-hand" />
+                              </div>
+                            )}
+                          {item?.OptionName == 'QuickAdd' && (
                             <div
                               style={{
                                 pointerEvents:
                                   OrderType === 'Failed' ? 'none' : 'auto',
                               }}
                             >
-                              <BSPrinterSetting />
+                              <BSNavBarQuickAdd />
                             </div>
                           )}
-                        {item?.OptionName == 'Hold' &&
-                          OrderType != 'Failed' &&
-                          OrderType != 'Reorder' &&
-                          CheckBookingStatus != 'Close' &&
-                          isHoldEnable &&
-                          !addnewAccess && (
-                            <div>
-                              <BSNavBarHand className="BSBillingNavBar1-hand" />
-                            </div>
-                          )}
-                        {item?.OptionName == 'QuickAdd' && (
-                          <div
-                            style={{
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                            }}
-                          >
-                            <BSNavBarQuickAdd />
-                          </div>
-                        )}
-                        {/* {item?.OptionName == 'Quick Transfer' && (
+                          {/* {item?.OptionName == 'Quick Transfer' && (
                       <div
                         style={{
                           pointerEvents:
@@ -1056,240 +1133,243 @@ const BSNavbar1 = (props) => {
                         </Tooltip>
                       </div>
                     )} */}
-                        {item?.OptionName == 'DineIn' &&
-                          dinePreference &&
-                          PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                            (item) => item.SettingIdName === 'DineIn'
-                          )?.SettingValue === 'Y' && (
-                            <div
-                              style={{
-                                pointerEvents:
-                                  OrderType === 'Failed' || addnewAccess
-                                    ? 'none'
-                                    : 'auto',
-                              }}
-                            >
-                              <BSNavBarTable />
-                            </div>
-                          )}
-                        {item?.OptionName == 'TakeAway' && (
-                          <div
-                            style={{
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                            }}
-                          >
-                            <BSNavBarHandbag />
-                          </div>
-                        )}
-
-                        {item?.OptionName === 'Offer' &&
-                          GlobEstBooking !== 'OvrAllEst' &&
-                          GlobEstBooking !== 'ParEst' &&
-                          GlobEstBooking === 'Sales' &&
-                          PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                            (item) => item.SettingIdName === 'Offer'
-                          )?.SettingValue === 'Y' && (
+                          {item?.OptionName == 'DineIn' &&
+                            dinePreference &&
+                            PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                              (item) => item.SettingIdName === 'DineIn'
+                            )?.SettingValue === 'Y' && (
+                              <div
+                                style={{
+                                  pointerEvents:
+                                    OrderType === 'Failed' || addnewAccess
+                                      ? 'none'
+                                      : 'auto',
+                                }}
+                              >
+                                <BSNavBarTable />
+                              </div>
+                            )}
+                          {item?.OptionName == 'TakeAway' && (
                             <div
                               style={{
                                 pointerEvents:
                                   OrderType === 'Failed' ? 'none' : 'auto',
                               }}
                             >
-                              <BSNavBarOffer />
+                              <BSNavBarHandbag />
                             </div>
                           )}
-                        {item?.OptionName == 'ExtraCharge' && (
-                          // CartOrderDetails?.length > 0 &&
-                          <div
-                            style={{
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                            }}
-                          >
-                            <BSNavBarAddons />
-                          </div>
-                        )}
-                        {item?.OptionName == 'AddCustomer' && (
-                          <Popover
-                            content={
+
+                          {item?.OptionName === 'Offer' &&
+                            GlobEstBooking !== 'OvrAllEst' &&
+                            GlobEstBooking !== 'ParEst' &&
+                            GlobEstBooking === 'Sales' &&
+                            PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                              (item) => item.SettingIdName === 'Offer'
+                            )?.SettingValue === 'Y' && (
                               <div
                                 style={{
-                                  display: 'flex',
-                                  alignItems: 'center',
-                                  columnGap: '0.5rem',
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
                                 }}
                               >
-                                <BSCustomerSelect TopName={'navbar-top'} />
-                                <BSNavBarAddUser />
+                                <BSNavBarOffer />
                               </div>
-                            }
-                            trigger="click"
-                            placement="left"
-                            open={open}
-                            onOpenChange={handleOpenChange}
-                          >
-                            <PozoAddCustomerIcon className="BSBillingNav-icon" />
-                          </Popover>
-                        )}
-                      </>
-                    ))}
-                    {FeatureAddonData?.FeatureDtls?.find(
-                      (item) =>
-                        item?.FeatureAddonName?.toLowerCase() === 'Weight Scale'
-                    ) && (
-                      <div
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                        }}
-                      >
-                        <BSNavBarWeightScale />
-                      </div>
-                    )}
-                    {FeatureAddonData?.FeatureDtls?.find(
-                      (item) =>
-                        item?.FeatureAddonName?.toLowerCase() === 'preorder'
-                    ) && (
-                      <div
-                        style={{
-                          pointerEvents:
-                            tableData || OrderType === 'Failed'
-                              ? 'none'
-                              : 'auto',
-                          opacity: tableData ? 0.5 : 1,
-                        }}
-                      >
-                        <TooltipWrapper
-                          title={'Pre Booking'}
-                          isMobile={isMobile}
-                        >
-                          <Badge
-                            count={preOrderPendingCount}
-                            offset={[-5, 10]}
-                            size="small"
-                          >
-                            <PozoPreOrderIcon
-                              className="BSBillingNav-icon"
-                              fill={preOrderOpen ? '#52C41A' : '#1292EE'}
-                              onClick={() => {
-                                openPreOrder('small-screen');
+                            )}
+                          {item?.OptionName == 'ExtraCharge' && (
+                            // CartOrderDetails?.length > 0 &&
+                            <div
+                              style={{
+                                pointerEvents:
+                                  OrderType === 'Failed' ? 'none' : 'auto',
                               }}
-                            />
-                          </Badge>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                    {preOrderOpen && (
-                      <BSNavBarPreOrder
-                        preOrderhiseandShow={handlepreOrderhiseandShow}
-                        preOrderhideshow={preOrderhiseandShow}
-                        HandleClose={preOrderHandleclose}
-                      />
-                    )}
-                    {sportsAppPreference && <BSMembership />}
-                    {Estimation?.SettingValue == 'Y' &&
-                      !OrderOfferStatus &&
-                      BookingType !== 'Dine In' &&
-                      !BookingTypeBoth && (
+                            >
+                              <BSNavBarAddons />
+                            </div>
+                          )}
+                          {item?.OptionName == 'AddCustomer' && (
+                            <Popover
+                              content={
+                                <div
+                                  style={{
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    columnGap: '0.5rem',
+                                  }}
+                                >
+                                  <BSCustomerSelect TopName={'navbar-top'} />
+                                  <BSNavBarAddUser />
+                                </div>
+                              }
+                              trigger="click"
+                              placement="left"
+                              open={open}
+                              onOpenChange={handleOpenChange}
+                            >
+                              <PozoAddCustomerIcon className="BSBillingNav-icon" />
+                            </Popover>
+                          )}
+                        </>
+                      ))}
+                      {FeatureAddonData?.FeatureDtls?.find(
+                        (item) =>
+                          item?.FeatureAddonName?.toLowerCase() ===
+                          'Weight Scale'
+                      ) && (
                         <div
                           style={{
                             pointerEvents:
                               OrderType === 'Failed' ? 'none' : 'auto',
                           }}
                         >
-                          <BSNavBarEstimate />
+                          <BSNavBarWeightScale />
+                        </div>
+                      )}
+                      {FeatureAddonData?.FeatureDtls?.find(
+                        (item) =>
+                          item?.FeatureAddonName?.toLowerCase() === 'preorder'
+                      ) && (
+                        <div
+                          style={{
+                            pointerEvents:
+                              tableData || OrderType === 'Failed'
+                                ? 'none'
+                                : 'auto',
+                            opacity: tableData ? 0.5 : 1,
+                          }}
+                        >
+                          <TooltipWrapper
+                            title={'Pre Booking'}
+                            isMobile={isMobile}
+                          >
+                            <Badge
+                              count={preOrderPendingCount}
+                              offset={[-5, 10]}
+                              size="small"
+                            >
+                              <PozoPreOrderIcon
+                                className="BSBillingNav-icon"
+                                fill={preOrderOpen ? '#52C41A' : '#1292EE'}
+                                onClick={() => {
+                                  openPreOrder('small-screen');
+                                }}
+                              />
+                            </Badge>
+                          </TooltipWrapper>
+                        </div>
+                      )}
+                      {preOrderOpen && (
+                        <BSNavBarPreOrder
+                          preOrderhiseandShow={handlepreOrderhiseandShow}
+                          preOrderhideshow={preOrderhiseandShow}
+                          HandleClose={preOrderHandleclose}
+                        />
+                      )}
+                      {sportsAppPreference && <BSMembership />}
+                      {Estimation?.SettingValue == 'Y' &&
+                        !OrderOfferStatus &&
+                        BookingType !== 'Dine In' &&
+                        !BookingTypeBoth && (
+                          <div
+                            style={{
+                              pointerEvents:
+                                OrderType === 'Failed' ? 'none' : 'auto',
+                            }}
+                          >
+                            <BSNavBarEstimate />
+                          </div>
+                        )}
+                      {SalesMode?.SettingValue === 'Y' &&
+                        !OtherServicesglobal && <BSNavBarWholeSale />}
+
+                      {!sportsAppPreference && (
+                        <div
+                          style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
+                          }}
+                        >
+                          <BSNavBarFavItems type="small-screen" />
                         </div>
                       )}
-                    {SalesMode?.SettingValue === 'Y' &&
-                      !OtherServicesglobal && <BSNavBarWholeSale />}
 
-                    {!sportsAppPreference && (
                       <div
                         style={{
                           pointerEvents:
                             OrderType === 'Failed' ? 'none' : 'auto',
                         }}
                       >
-                        <BSNavBarFavItems type="small-screen" />
+                        <BSNavBarDragItems type="small-screen" />
                       </div>
-                    )}
-
-                    <div
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <BSNavBarDragItems type="small-screen" />
-                    </div>
-                    {FeatureAddonData?.FeatureDtls?.find(
-                      (item) =>
-                        item?.FeatureAddonName?.toLowerCase() ===
-                        'customer display'
-                    ) && (
-                      <TooltipWrapper
-                        title="Customer Display"
-                        isMobile={isMobile}
-                      >
-                        {/* <div onClick={openNewTab} style={{ display: "flex", alignItems: "center", cursor: "pointer" }}>
+                      {FeatureAddonData?.FeatureDtls?.find(
+                        (item) =>
+                          item?.FeatureAddonName?.toLowerCase() ===
+                          'customer display'
+                      ) && (
+                        <TooltipWrapper
+                          title="Customer Display"
+                          isMobile={isMobile}
+                        >
+                          {/* <div onClick={openNewTab} style={{ display: "flex", alignItems: "center", cursor: "pointer" }}>
                       <FaDisplay />
                     </div> */}
-                        <div
-                          onClick={openNewTab}
-                          style={{ width: '1.3rem', cursor: 'pointer' }}
-                        >
-                          <CustomerDisplayicon />
-                        </div>
-                      </TooltipWrapper>
-                    )}
+                          <div
+                            onClick={openNewTab}
+                            style={{ width: '1.3rem', cursor: 'pointer' }}
+                          >
+                            <CustomerDisplayicon />
+                          </div>
+                        </TooltipWrapper>
+                      )}
 
-                    {VerifyTheProducts && <VerfiedProducts />}
+                      {VerifyTheProducts && <VerfiedProducts />}
 
-                    {paymentfeataddon && (
-                      <TooltipWrapper
-                        title="Failed Payment"
-                        isMobile={isMobile}
-                      >
-                        {/* PozoPaymentFailesIcon */}
-                        <div
-                          onClick={() => {
-                            paymentFailedStatusFun();
-                          }}
-                          style={{ width: '1.4rem', cursor: 'pointer' }}
+                      {paymentfeataddon && (
+                        <TooltipWrapper
+                          title="Failed Payment"
+                          isMobile={isMobile}
                         >
-                          <PozoPaymentFailesIcon />
-                        </div>
-                      </TooltipWrapper>
-                    )}
-                  </>
-                )}
+                          {/* PozoPaymentFailesIcon */}
+                          <div
+                            onClick={() => {
+                              paymentFailedStatusFun();
+                            }}
+                            style={{ width: '1.4rem', cursor: 'pointer' }}
+                          >
+                            <PozoPaymentFailesIcon />
+                          </div>
+                        </TooltipWrapper>
+                      )}
+                    </>
+                  )}
+                </div>
               </div>
             </div>
-          </div>
-        )}
-      </div>
-      <div className="BSBillingnav1-threedots" onClick={NavmenuOpenClose}>
-        {Navmenu ? (
-          <IoMdClose size={24} color="#ff0000" />
-        ) : (
-          <PozoMenuIcon size={20} />
-        )}
-      </div>
+          )}
+        </div>
+        <div className="BSBillingnav1-threedots" onClick={NavmenuOpenClose}>
+          {Navmenu ? (
+            <IoMdClose size={24} color="#ff0000" />
+          ) : (
+            <PozoMenuIcon size={20} />
+          )}
+        </div>
 
-      <DefaultModal
-        open={multiple}
-        title="Multiple Search"
-        footer={false}
-        width={350}
-        handleCancel={() => setMultiple(false)}
-        destroyOnClose={true}
-        children={
-          <>
-            <MultipleSearch close={setMultiple} />
-          </>
-        }
-      />
-    </div>
+        <DefaultModal
+          open={multiple}
+          title="Multiple Search"
+          footer={false}
+          width={350}
+          handleCancel={() => setMultiple(false)}
+          destroyOnClose={true}
+          children={
+            <>
+              <MultipleSearch close={setMultiple} />
+            </>
+          }
+        />
+      </div>
+    </Suspense>
   );
 };
 export default BSNavbar1;
diff --git a/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar2.jsx b/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar2.jsx
index 2fbb0f7..d8f3e6a 100644
--- a/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar2.jsx
+++ b/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar2.jsx
@@ -1,4 +1,11 @@
-import React, { useEffect, useRef, useState, useCallback } from 'react';
+import React, {
+  useEffect,
+  useRef,
+  useState,
+  useCallback,
+  lazy,
+  Suspense,
+} from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import { AiFillHome } from 'react-icons/ai';
@@ -8,14 +15,10 @@ import {
   getEditFavItems,
   PreferenceData,
   getPreferenceData,
-  GlobalCustId,
-  GlobalOrderCardDetails,
   GlobalBookingType,
   GlobalBookingTypeBoth,
-  FeatureAddon,
   changeCombosearch,
   GlobalCombosearch,
-  Comboget,
   changeEstimateBooking,
   changeSelectedOption,
   changeSelectedCustId,
@@ -37,23 +40,30 @@ import {
   GlobalCommonPaymentOptions,
   GlobalSelCustId,
 } from '../../../../Features/BookingScreen/BookingData/BookingData';
-import BSNavBarSearch from '../UtillComponents/BSNavBarSearch';
-import BSNavBarPrinter from '../UtillComponents/BSNavBarPrinter';
-import BSNavBarHand from '../UtillComponents/BSNavBarHand';
-import BSNavBarTable from '../UtillComponents/BSNavBarTable';
-import BSNavBarHandbag from '../UtillComponents/BSNavBarHandbag';
-import BSNavBarOffer from '../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx';
-import BSNavBarAddons from '../UtillComponents/BSNavBarAddons';
-import BSNavBarAddUser from '../UtillComponents/BSNavBarAddUser';
-import BSNavBarQuickAdd from '../UtillComponents/BSNavBarQuickAdd';
+
+const BSNavBarSearch = lazy(() => import('../UtillComponents/BSNavBarSearch'));
+
+const BSNavBarHand = lazy(() => import('../UtillComponents/BSNavBarHand'));
+
+const BSNavBarHandbag = lazy(
+  () => import('../UtillComponents/BSNavBarHandbag')
+);
+
+const BSNavBarAddons = lazy(() => import('../UtillComponents/BSNavBarAddons'));
+
+const BSNavBarAddUser = lazy(
+  () => import('../UtillComponents/BSNavBarAddUser')
+);
+
+const BSNavBarQuickAdd = lazy(
+  () => import('../UtillComponents/BSNavBarQuickAdd')
+);
+
+const BSNavBarFavItems = lazy(
+  () => import('../UtillComponents/BSNavBarFavItems')
+);
 import BSNavBarWeightScale from '../UtillComponents/BSNavBarWeightScale';
-import BSNavBarFavItems from '../UtillComponents/BSNavBarFavItems';
-import BSNavBarPreOrder from '../../Components/UtillComponents/BSNavBarPreOrder.jsx';
-import BSMembership from '../UtillComponents/BSMembership.jsx';
-import '../../../../Styles/BookingScreen/Components/BSNavbar/BSNavbar2.scss';
 import { clearSession, sessionStore } from '../../../../Services/Others';
-import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities.jsx';
-import BSCustomerSelect from '../UtillComponents/BSSelectCustomer.jsx';
 import PozoUserIcon from '../UtillComponents/Pozo retail icons/PozoUserIcon.jsx';
 import {
   ApplicationPreferences,
@@ -73,48 +83,61 @@ import {
   changePreOrderAdditem,
   changepreOrderList,
 } from '../../../../Features/BookingScreen/PreOrder/PreOrder.js';
+import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
 import { getCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
 import PozoAddCustomerIcon from '../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
 import PaymentFailedSales from '../../../Payment/PaymentFailedDetails/PaymentFailedSales.jsx';
-import PozoComboProductIcon from '../UtillComponents/Pozo retail icons/PozoComboProductIcon.jsx';
 import CustomerDisplayicon from '../UtillComponents/Pozo retail icons/PozoCustomerDisplayicon.jsx';
 import PozoPaymentFailesIcon from '../UtillComponents/Pozo retail icons/PozoFailedPaymentsIcon.jsx';
 import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
 import { Global_OfferStatus } from '../../../../Features/Offer/Offer.js';
-import { IoMdClose } from 'react-icons/io';
 import { isMobile } from 'react-device-detect';
+import { useAuth } from '../../../../AuthContext.jsx';
 import {
-  getPrintSelectionComponentData,
   getTemplate,
   getTemplateData,
   StoredSessionData,
 } from '../../../../Features/ThemeChange/ThemeChange.js';
 import PozoPreOrderIcon from '../UtillComponents/Pozo retail icons/PozoPreOrderIcon.jsx';
+import BSNavBarWholeSale from '../UtillComponents/BSNavBarWholeSale.jsx';
 import { GlobalBookingStatus } from '../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail.js';
-import { getEmpAccess } from '../../../../Features/AppPage/CenterPage.js';
-import { useAuth } from '../../../../AuthContext.jsx';
-import { TfiHandDrag } from 'react-icons/tfi';
-import BSNavBarDragItems from '../UtillComponents/BSNavBarDragItems.jsx';
-import { PiSignOutLight } from 'react-icons/pi';
 import {
   getUserProfile,
   userDataByUserId,
 } from '../../../../Features/UserAccount/userData.js';
-import { FaUserLarge } from 'react-icons/fa6';
-import { BiSolidPhoneCall } from 'react-icons/bi';
-import PozoSwapIcon from '../UtillComponents/Pozo retail icons/PozoSwapIcon.jsx';
 import { CgSearchLoading } from 'react-icons/cg';
-import UserRelieveManager from '../../Template/RealivingUser.jsx';
 import { FaParking } from 'react-icons/fa';
 import BSNavBarUserInfo from './BSNavBarUserInfo';
 import { OtherServicesCardlistdata } from '../../../../Features/OtherServices/OtherServices.js';
-import BSNavBarWholeSale from '../UtillComponents/BSNavBarWholeSale.jsx';
 import BSMobilePrintSettings from '../UtillComponents/BSMobilePrintSettings.jsx';
 import BSScanTemplate from '../UtillComponents/BSScanTemplate.jsx';
-import VerfiedProducts from './verfiedProduct/VerfiedProducts';
-import BranchName from '../../Template/BranchName.jsx';
 import MultipleSearch from '../UtillComponents/MultipleSearch.jsx';
-import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
+// Jsx Files
+const VerfiedProducts = lazy(() => import('./verfiedProduct/VerfiedProducts'));
+const UserRelieveManager = lazy(
+  () => import('../../Template/RealivingUser.jsx')
+);
+const BranchName = lazy(() => import('../../Template/BranchName.jsx'));
+const BSNavBarOffer = lazy(
+  () => import('../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx')
+);
+const BSNavBarDragItems = lazy(
+  () => import('../UtillComponents/BSNavBarDragItems.jsx')
+);
+const BSNavBarTable = lazy(() => import('../UtillComponents/BSNavBarTable'));
+const BSMembership = lazy(() => import('../UtillComponents/BSMembership.jsx'));
+const BSNavBarPreOrder = lazy(
+  () => import('../../Components/UtillComponents/BSNavBarPreOrder.jsx')
+);
+const FeaturesFunctionalities = lazy(
+  () => import('../BookingFunctionality/FeaturesFunctionalities.jsx')
+);
+const BSCustomerSelect = lazy(
+  () => import('../UtillComponents/BSSelectCustomer.jsx')
+);
+// Scss
+import '../../../../Styles/BookingScreen/Components/BSNavbar/BSNavbar2.scss';
+
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const commonUrl = import.meta.env.ENV_COMMON_BASE_URL;
 
@@ -222,6 +245,18 @@ const BSNavbar2 = () => {
     (item) =>
       item.SettingIdName === 'VerifyProduct' && item?.SettingValue === 'Y'
   );
+
+  useEffect(() => {
+    if (!FeatureAddonData?.FeatureDtls?.length) return;
+
+    const preorderFeature = FeatureAddonData.FeatureDtls.find(
+      (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
+    );
+
+    if (preorderFeature) {
+      BadgePendingApi();
+    }
+  }, [FeatureAddonData]);
   useEffect(() => {
     handleOtherData();
     BadgePendingApi();
@@ -258,7 +293,7 @@ const BSNavbar2 = () => {
     setisisHoldEnable(filterPayCounter?.[0]?.ModeDetails?.length > 0);
   };
   useEffect(() => {
-    fetchEditFavItems();
+    // fetchEditFavItems();
     dispatch(
       getPreferenceData({ CompId: CompId, AppId: AppId, BranchId: BranchId })
     );
@@ -294,27 +329,7 @@ const BSNavbar2 = () => {
 
     setaddnewAccess(!hasAccess);
   }, [empData, SAAccessCommonMaster, UserType]);
-  const fetchApi = async () => {
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      EmpId: UserId,
-    };
-    let response = await dispatch(getEmpAccess(data)).unwrap();
-    let datas = response?.data?.data?.[0]?.EmpAccessDetails?.filter(
-      (item) => item.ConfigName === 'Sales'
-    );
-    setEmpData(datas?.[0]);
-  };
-  const fetchEditFavItems = async () => {
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-    };
-    await dispatch(getEditFavItems(data)).unwrap();
-  };
+
   const fetchBranchData = async () => {
     if (UserType === 'Super Admin' || UserType === 'Super Admin User') {
       await dispatch(
@@ -341,11 +356,6 @@ const BSNavbar2 = () => {
     }
   };
   const getFeatureAddonData = async () => {
-    // let featureAddon = await dispatch(
-    //   FeatureAddon({ AppId: AppId, UserId: UserId })
-    // ).unwrap();
-    // if (featureAddon?.data?.statusCode === 1) {
-    //   setFeatureAddonData(featureAddon?.data?.data?.[0]?.FeatAddonHdr?.[0]);
     const hasPaymentFeatures = FeatureAddonData?.FeatureDtls.some(
       (item) =>
         item.FeatureAddonName === 'Payment Gateway' ||
@@ -575,425 +585,407 @@ const BSNavbar2 = () => {
   };
 
   return (
-    <div className="BSBillingNavBar2" style={{ backgroundColor: 'white' }}>
-      <div style={{ display: 'flex', alignItems: 'center', gap: '10px' }}>
-        <div>
-          <Popconfirm
-            title="Are you sure you want to go home?"
-            onConfirm={handleHome}
-            okText="Yes"
-            cancelText="No"
-          >
-            <AiFillHome
-              style={{ color: '#1292EE', fontSize: '30px' }}
-              className="BSBillingNav2-toggle-icon"
-            />
-          </Popconfirm>
-        </div>{' '}
-        <div className="salesStoreName">
-          <BranchName />
-        </div>
-        {(addcustomer || hold) && (
-          <FeaturesFunctionalities
-            handleAddCustomerCancel={handleAddCustomerCancel}
-            addcustomer={addcustomer}
-            handleHoldCancel={handleHoldCancel}
-            modalOpen={hold}
-          />
-        )}
-        {OtherServiceStatus && (
-          <div
-            style={{
-              fontSize: '1.5rem',
-              color: 'rgb(18, 146, 238)',
-              position: 'sticky',
-            }}
-          >
-            <TooltipWrapper title="Other Services" isMobile={isMobile}>
-              <div onClick={handleotherservices}>
-                <FaParking
-                  fill={OtherServicesglobal === true ? '#52C41A' : '#1292EE'}
-                />
-              </div>
-            </TooltipWrapper>
+    <Suspense fallback={<div>Loading…</div>}>
+      <div className="BSBillingNavBar2" style={{ backgroundColor: 'white' }}>
+        <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+          <div>
+            <Popconfirm
+              title="Are you sure you want to go home?"
+              onConfirm={handleHome}
+              okText="Yes"
+              cancelText="No"
+            >
+              <AiFillHome
+                style={{ color: '#1292EE', fontSize: '30px' }}
+                className="BSBillingNav2-toggle-icon"
+              />
+            </Popconfirm>
+          </div>{' '}
+          <div className="salesStoreName">
+            <BranchName />
           </div>
-        )}
-      </div>
-      {/* Multiple search  */}
-      <Tooltip title={'Multiple Search'}>
-        <div className="MultiSearchIconDiv2">
-          <CgSearchLoading onClick={() => setMultiple(true)} />
-        </div>
-      </Tooltip>
-      <div className="BSBillingNav2div2">
-        {searchOption &&
-          !Comboglobal &&
-          !OtherServicesglobal &&
-          !sportsAppPreference && (
+          {(addcustomer || hold) && (
+            <FeaturesFunctionalities
+              handleAddCustomerCancel={handleAddCustomerCancel}
+              addcustomer={addcustomer}
+              handleHoldCancel={handleHoldCancel}
+              modalOpen={hold}
+            />
+          )}
+          {OtherServiceStatus && (
             <div
-              className="BSBillingNavBar2-SearchBar"
               style={{
-                pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                fontSize: '1.5rem',
+                color: 'rgb(18, 146, 238)',
+                position: 'sticky',
               }}
             >
-              <BSNavBarSearch nosearch={true} OrderType={OrderType} />
+              <TooltipWrapper title="Other Services" isMobile={isMobile}>
+                <div onClick={handleotherservices}>
+                  <FaParking
+                    fill={OtherServicesglobal === true ? '#52C41A' : '#1292EE'}
+                  />
+                </div>
+              </TooltipWrapper>
             </div>
           )}
-
-        {Comboglobal === true && !OtherServicesglobal && (
-          <BSNavBarComboSearch SessionData={SessionData} />
-        )}
-
-        {/* {ComboDropDown?.length >= 1 && !OtherServicesglobal && (
-          <div style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}>
-            <TooltipWrapper title="Combo Product" isMobile={isMobile}>
+        </div>
+        {/* Multiple search  */}
+        <Tooltip title={'Multiple Search'}>
+          <div className="MultiSearchIconDiv2" style={{ margin: '0 6px' }}>
+            <CgSearchLoading onClick={() => setMultiple(true)} />
+          </div>
+        </Tooltip>
+        <div className="BSBillingNav2div2">
+          {searchOption &&
+            !Comboglobal &&
+            !OtherServicesglobal &&
+            !sportsAppPreference && (
               <div
-                onClick={handleClick}
-                className="BSBillingNavBar1-AllIcons"
+                className="BSBillingNavBar2-SearchBar"
                 style={{
-                  width: '1.49rem',
-                  margin: '10px',
                   pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                  cursor: 'pointer',
                 }}
               >
-                <PozoComboProductIcon
-                  fill={Comboglobal === true ? '#52C41A' : '#1292EE'}
-                />
+                <BSNavBarSearch nosearch={true} OrderType={OrderType} />
               </div>
-            </TooltipWrapper>
-          </div>
-        )} */}
-        {OpenFailData && (
-          <PaymentFailedSales
-            paymentFailedStatusFun={paymentFailedStatusFun}
-            OpenFailData={OpenFailData}
-          />
-        )}
+            )}
 
-        {navbarOptions?.map((item) => (
-          <>
-            <div className="BSBillingNavBar2-AllIcons">
-              <div style={{ display: 'flex', alignItems: 'center' }}>
-                <div style={{ display: 'flex', flexGrow: '1' }}>
-                  <>
-                    {item?.OptionName == 'RePrint' && !OtherServicesglobal && (
-                      <TooltipWrapper
-                        title="RePrint (Alt+R)"
-                        isMobile={isMobile}
-                      >
-                        <div
-                          style={{
-                            pointerEvents:
-                              OrderType === 'Failed' ? 'none' : 'auto',
-                          }}
-                        >
-                          <BSPrinterSetting />
-                        </div>
-                      </TooltipWrapper>
-                    )}
-                  </>
+          {Comboglobal === true && !OtherServicesglobal && (
+            <BSNavBarComboSearch SessionData={SessionData} />
+          )}
+          {OpenFailData && (
+            <PaymentFailedSales
+              paymentFailedStatusFun={paymentFailedStatusFun}
+              OpenFailData={OpenFailData}
+            />
+          )}
 
-                  {!OtherServicesglobal && (
+          {navbarOptions?.map((item) => (
+            <>
+              <div className="BSBillingNavBar2-AllIcons">
+                <div style={{ display: 'flex', alignItems: 'center' }}>
+                  <div style={{ display: 'flex', flexGrow: '1' }}>
                     <>
-                      {item?.OptionName == 'Hold' &&
-                        OrderType != 'Failed' &&
-                        OrderType != 'Reorder' &&
-                        CheckBookingStatus != 'Close' &&
-                        isHoldEnable &&
-                        !addnewAccess && (
-                          <div>
-                            <BSNavBarHand />
-                          </div>
-                        )}
-
-                      {item?.OptionName == 'QuickAdd' && (
-                        <div
-                          style={{
-                            pointerEvents:
-                              OrderType === 'Failed' ? 'none' : 'auto',
-                          }}
-                        >
-                          <BSNavBarQuickAdd />
-                        </div>
-                      )}
-                    </>
-                  )}
-                </div>
-              </div>
-
-              {!OtherServicesglobal && (
-                <>
-                  {item?.OptionName == 'QuickAdd' && dinePreference && (
-                    <div style={{ padding: '1rem 1rem' }}>
-                      {' '}
-                      <hr style={{ height: '20px' }} />{' '}
-                    </div>
-                  )}
-
-                  {(dinePreference || takeAwayPreference) && (
-                    <div style={{ display: 'flex', alignItems: 'center' }}>
-                      <div>
-                        {item?.OptionName == 'DineIn' &&
-                          dinePreference &&
-                          !BookingTypeBoth &&
-                          PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                            (item) => item.SettingIdName === 'DineIn'
-                          )?.SettingValue === 'Y' && (
-                            <div
-                              style={{
-                                pointerEvents:
-                                  OrderType === 'Failed' || addnewAccess
-                                    ? 'none'
-                                    : 'auto',
-                              }}
-                            >
-                              <BSNavBarTable />
-                            </div>
-                          )}
-                        {item?.OptionName == 'TakeAway' &&
-                          takeAwayPreference && (
+                      {item?.OptionName == 'RePrint' &&
+                        !OtherServicesglobal && (
+                          <TooltipWrapper
+                            title="RePrint (Alt+R)"
+                            isMobile={isMobile}
+                          >
                             <div
                               style={{
                                 pointerEvents:
                                   OrderType === 'Failed' ? 'none' : 'auto',
                               }}
                             >
-                              <BSNavBarHandbag />
+                              <BSPrinterSetting />
+                            </div>
+                          </TooltipWrapper>
+                        )}
+                    </>
+
+                    {!OtherServicesglobal && (
+                      <>
+                        {item?.OptionName == 'Hold' &&
+                          OrderType != 'Failed' &&
+                          OrderType != 'Reorder' &&
+                          CheckBookingStatus != 'Close' &&
+                          isHoldEnable &&
+                          !addnewAccess && (
+                            <div>
+                              <BSNavBarHand />
                             </div>
                           )}
+
+                        {item?.OptionName == 'QuickAdd' && (
+                          <div
+                            style={{
+                              pointerEvents:
+                                OrderType === 'Failed' ? 'none' : 'auto',
+                            }}
+                          >
+                            <BSNavBarQuickAdd />
+                          </div>
+                        )}
+                      </>
+                    )}
+                  </div>
+                </div>
+
+                {!OtherServicesglobal && (
+                  <>
+                    {item?.OptionName == 'QuickAdd' && dinePreference && (
+                      <div style={{ padding: '1rem 1rem' }}>
+                        {' '}
+                        <hr style={{ height: '20px' }} />{' '}
                       </div>
-                    </div>
-                  )}
+                    )}
 
-                  {item?.OptionName == 'TakeAway' && takeAwayPreference && (
-                    <div style={{ padding: '1rem 1rem' }}>
-                      {' '}
-                      <hr style={{ height: '20px' }} />{' '}
-                    </div>
-                  )}
+                    {(dinePreference || takeAwayPreference) && (
+                      <div style={{ display: 'flex', alignItems: 'center' }}>
+                        <div>
+                          {item?.OptionName == 'DineIn' &&
+                            dinePreference &&
+                            !BookingTypeBoth &&
+                            PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                              (item) => item.SettingIdName === 'DineIn'
+                            )?.SettingValue === 'Y' && (
+                              <div
+                                style={{
+                                  pointerEvents:
+                                    OrderType === 'Failed' || addnewAccess
+                                      ? 'none'
+                                      : 'auto',
+                                }}
+                              >
+                                <BSNavBarTable />
+                              </div>
+                            )}
+                          {item?.OptionName == 'TakeAway' &&
+                            takeAwayPreference && (
+                              <div
+                                style={{
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
+                                }}
+                              >
+                                <BSNavBarHandbag />
+                              </div>
+                            )}
+                        </div>
+                      </div>
+                    )}
 
-                  <div>
-                    {item?.OptionName === 'Offer' &&
-                      GlobEstBooking !== 'OvrAllEst' &&
-                      GlobEstBooking !== 'ParEst' &&
-                      GlobEstBooking === 'Sales' &&
-                      PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                        (item) => item.SettingIdName === 'Offer'
-                      )?.SettingValue === 'Y' && (
+                    {item?.OptionName == 'TakeAway' && takeAwayPreference && (
+                      <div style={{ padding: '1rem 1rem' }}>
+                        {' '}
+                        <hr style={{ height: '20px' }} />{' '}
+                      </div>
+                    )}
+
+                    <div>
+                      {item?.OptionName === 'Offer' &&
+                        GlobEstBooking !== 'OvrAllEst' &&
+                        GlobEstBooking !== 'ParEst' &&
+                        GlobEstBooking === 'Sales' &&
+                        PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                          (item) => item.SettingIdName === 'Offer'
+                        )?.SettingValue === 'Y' && (
+                          <div
+                            style={{
+                              pointerEvents:
+                                OrderType === 'Failed' ? 'none' : 'auto',
+                            }}
+                          >
+                            <BSNavBarOffer />
+                          </div>
+                        )}
+                      {item?.OptionName == 'ExtraCharge' && (
                         <div
                           style={{
                             pointerEvents:
                               OrderType === 'Failed' ? 'none' : 'auto',
                           }}
                         >
-                          <BSNavBarOffer />
+                          <BSNavBarAddons />
                         </div>
                       )}
-                    {item?.OptionName == 'ExtraCharge' && (
-                      <div
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                        }}
-                      >
-                        <BSNavBarAddons />
-                      </div>
-                    )}
-                    {item?.OptionName == 'AddCustomer' && !preOrderOpen && (
-                      <>
-                        <div style={{ display: 'flex', gap: '1rem' }}>
-                          <BSCustomerSelect TopName={'navbar-top'} />
-                          <BSNavBarAddUser />
-                        </div>
-                      </>
-                    )}
-                  </div>
-                </>
-              )}
-            </div>
-          </>
-        ))}
-        {FeatureAddonData?.FeatureDtls?.find(
-          (item) => item?.FeatureAddonName?.toLowerCase() === 'weight scale'
-        ) &&
-          !OtherServicesglobal && (
-            <div
-              style={{
-                pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-              }}
-            >
-              <BSNavBarWeightScale />
-            </div>
-          )}
-
-        {!OtherServicesglobal && (
-          <>
-            {FeatureAddonData?.FeatureDtls?.find(
-              (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
-            ) && (
+                      {item?.OptionName == 'AddCustomer' && !preOrderOpen && (
+                        <>
+                          <div style={{ display: 'flex', gap: '1rem' }}>
+                            <BSCustomerSelect TopName={'navbar-top'} />
+                            <BSNavBarAddUser />
+                          </div>
+                        </>
+                      )}
+                    </div>
+                  </>
+                )}
+              </div>
+            </>
+          ))}
+          {FeatureAddonData?.FeatureDtls?.find(
+            (item) => item?.FeatureAddonName?.toLowerCase() === 'weight scale'
+          ) &&
+            !OtherServicesglobal && (
               <div
-                className="BSBillingNavBar2-AllIcons"
                 style={{
-                  pointerEvents:
-                    tableData || OrderType === 'Failed' ? 'none' : 'auto',
-                  opacity: tableData ? 0.5 : 1,
+                  pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
                 }}
               >
-                <TooltipWrapper title={'Pre Booking'} isMobile={isMobile}>
-                  <Badge
-                    count={preOrderPendingCount}
-                    offset={[-5, 10]}
-                    size="small"
-                  >
-                    <PozoPreOrderIcon
-                      className="BSBillingNav-icon"
-                      fill={preOrderOpen ? '#52C41A' : '#1292EE'}
-                      onClick={() => {
-                        openPreOrder();
-                      }}
-                      HandleClose={preOrderHandleclose}
-                    />
-                  </Badge>
-                </TooltipWrapper>
+                <BSNavBarWeightScale />
               </div>
             )}
-          </>
-        )}
-        {preOrderOpen && (
-          <div className="smallScreenclose">
-            <BSNavBarPreOrder HandleClose={preOrderHandleclose} />
-          </div>
-        )}
-        {sportsAppPreference && <BSMembership />}
-        {!OtherServicesglobal && (
-          <>
-            {Estimation?.SettingValue === 'Y' &&
-              BookingType !== 'Dine In' &&
-              !BookingTypeBoth &&
-              !OrderOfferStatus && (
+
+          {!OtherServicesglobal && (
+            <>
+              {FeatureAddonData?.FeatureDtls?.find(
+                (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
+              ) && (
                 <div
                   className="BSBillingNavBar2-AllIcons"
+                  style={{
+                    pointerEvents:
+                      tableData || OrderType === 'Failed' ? 'none' : 'auto',
+                    opacity: tableData ? 0.5 : 1,
+                  }}
+                >
+                  <TooltipWrapper title={'Pre Booking'} isMobile={isMobile}>
+                    <Badge
+                      count={preOrderPendingCount}
+                      offset={[-5, 10]}
+                      size="small"
+                    >
+                      <PozoPreOrderIcon
+                        className="BSBillingNav-icon"
+                        fill={preOrderOpen ? '#52C41A' : '#1292EE'}
+                        onClick={() => {
+                          openPreOrder();
+                        }}
+                        HandleClose={preOrderHandleclose}
+                      />
+                    </Badge>
+                  </TooltipWrapper>
+                </div>
+              )}
+            </>
+          )}
+          {preOrderOpen && (
+            <div className="smallScreenclose">
+              <BSNavBarPreOrder HandleClose={preOrderHandleclose} />
+            </div>
+          )}
+          {sportsAppPreference && <BSMembership />}
+          {!OtherServicesglobal && (
+            <>
+              {Estimation?.SettingValue === 'Y' &&
+                BookingType !== 'Dine In' &&
+                !BookingTypeBoth &&
+                !OrderOfferStatus && (
+                  <div
+                    className="BSBillingNavBar2-AllIcons"
+                    style={{
+                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                    }}
+                  >
+                    <BSNavBarEstimate />
+                  </div>
+                )}
+            </>
+          )}
+          {SalesMode?.SettingValue === 'Y' && !OtherServicesglobal && (
+            <BSNavBarWholeSale />
+          )}
+          {!OtherServicesglobal && ScanLayoutScreen?.SettingValue === 'Y' && (
+            <BSScanTemplate />
+          )}
+
+          {!OtherServicesglobal && (
+            <>
+              {!sportsAppPreference && (
+                <div
+                  className="favIcon"
                   style={{
                     pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
                   }}
                 >
-                  <BSNavBarEstimate />
+                  <BSNavBarFavItems />
                 </div>
               )}
-          </>
-        )}
-        {SalesMode?.SettingValue === 'Y' && !OtherServicesglobal && (
-          <BSNavBarWholeSale />
-        )}
-        {!OtherServicesglobal && ScanLayoutScreen?.SettingValue === 'Y' && (
-          <BSScanTemplate />
-        )}
-
-        {!OtherServicesglobal && (
-          <>
-            {!sportsAppPreference && (
               <div
                 className="favIcon"
                 style={{
                   pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
                 }}
               >
-                <BSNavBarFavItems />
+                <BSNavBarDragItems />
               </div>
-            )}
-            <div
-              className="favIcon"
-              style={{
-                pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-              }}
-            >
-              {/* <TfiHandDrag onClick={() => dispatch(Changedragging(!Isdragging))} style={{ color: Isdragging ? "green" : "#1292ee",fontSize:"25px" }} /> */}
+            </>
+          )}
 
-              <BSNavBarDragItems />
-            </div>
-          </>
-        )}
+          {FeatureAddonData?.FeatureDtls?.find(
+            (item) =>
+              item?.FeatureAddonName?.toLowerCase() === 'customer display'
+          ) && (
+            <TooltipWrapper title="Customer Display" isMobile={isMobile}>
+              <div
+                onClick={openNewTab}
+                className="BSBillingNavBar1-AllIcons"
+                style={{ width: '1.3rem', margin: '10px', cursor: 'pointer' }}
+              >
+                <CustomerDisplayicon />
+              </div>
+            </TooltipWrapper>
+          )}
+          {VerifyTheProducts && (
+            <TooltipWrapper title={'Verfied Products'} isMobile={isMobile}>
+              <div>
+                <VerfiedProducts />
+              </div>
+            </TooltipWrapper>
+          )}
+          {paymentfeataddon && !OtherServicesglobal && (
+            <TooltipWrapper title="Failed Payment" isMobile={isMobile}>
+              <div
+                onClick={() => {
+                  paymentFailedStatusFun();
+                }}
+                className="BSBillingNavBar1-AllIcons"
+                style={{ width: '1.4rem', cursor: 'pointer' }}
+              >
+                <PozoPaymentFailesIcon />
+              </div>
+            </TooltipWrapper>
+          )}
 
-        {FeatureAddonData?.FeatureDtls?.find(
-          (item) => item?.FeatureAddonName?.toLowerCase() === 'customer display'
-        ) && (
-          <TooltipWrapper title="Customer Display" isMobile={isMobile}>
-            {/* <div onClick={openNewTab} style={{ display: "flex", alignItems: "center", cursor: "pointer" }} className="BSBillingNavBar2-AllIcons">
-              <FaDisplay />
-            </div> */}
-            <div
-              onClick={openNewTab}
-              className="BSBillingNavBar1-AllIcons"
-              style={{ width: '1.3rem', margin: '10px', cursor: 'pointer' }}
-            >
-              <CustomerDisplayicon />
-            </div>
-          </TooltipWrapper>
-        )}
-        {VerifyTheProducts && (
-          <TooltipWrapper title={'Verfied Products'} isMobile={isMobile}>
+          {!OtherServicesglobal && (
             <div>
-              <VerfiedProducts />
+              <BSNavBarUserInfo
+                isOpen={isAccOpen}
+                divRef={divRef}
+                CompBranchData={CompBranchData}
+                BacktoLogin={BacktoLogin}
+                userProfileData={userProfileData}
+                handleEditProfile={handleEditProfile}
+                UserRelieveManager={<UserRelieveManager />}
+                Logout={Logout}
+              />
             </div>
-          </TooltipWrapper>
-        )}
-        {paymentfeataddon && !OtherServicesglobal && (
-          <TooltipWrapper title="Failed Payment" isMobile={isMobile}>
-            <div
-              onClick={() => {
-                paymentFailedStatusFun();
-              }}
-              className="BSBillingNavBar1-AllIcons"
-              style={{ width: '1.4rem', cursor: 'pointer' }}
-            >
-              <PozoPaymentFailesIcon />
-            </div>
-          </TooltipWrapper>
-        )}
+          )}
+          {/* small screen nav bar */}
+          {Navmenu && (
+            <>
+              <div className="BSBillingnav2-Smallscreen">
+                <div className="BSBillingNavBar2-AllIcons-column">
+                  {OtherServiceStatus && (
+                    <div
+                      style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}
+                    >
+                      <TooltipWrapper
+                        title="Other Services"
+                        isMobile={isMobile}
+                      >
+                        <div onClick={handleotherservices}>
+                          <FaParking
+                            fill={
+                              OtherServicesglobal === true
+                                ? '#52C41A'
+                                : '#1292EE'
+                            }
+                          />
+                        </div>
+                      </TooltipWrapper>
+                    </div>
+                  )}
 
-        {!OtherServicesglobal && (
-          <div>
-            <BSNavBarUserInfo
-              isOpen={isAccOpen}
-              divRef={divRef}
-              CompBranchData={CompBranchData}
-              BacktoLogin={BacktoLogin}
-              userProfileData={userProfileData}
-              handleEditProfile={handleEditProfile}
-              UserRelieveManager={<UserRelieveManager />}
-              Logout={Logout}
-            />
-          </div>
-        )}
-        {/* small screen nav bar */}
-        {Navmenu && (
-          <>
-            <div className="BSBillingnav2-Smallscreen">
-              <div className="BSBillingNavBar2-AllIcons-column">
-                {OtherServiceStatus && (
-                  <div
-                    style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}
-                  >
-                    <TooltipWrapper title="Other Services" isMobile={isMobile}>
-                      <div onClick={handleotherservices}>
-                        <FaParking
-                          fill={
-                            OtherServicesglobal === true ? '#52C41A' : '#1292EE'
-                          }
-                        />
-                      </div>
-                    </TooltipWrapper>
-                  </div>
-                )}
-
-                {OpenFailData && (
-                  <PaymentFailedSales
-                    paymentFailedStatusFun={paymentFailedStatusFun}
-                    OpenFailData={OpenFailData}
-                  />
-                )}
-                {/* {ComboDropDown?.length >= 1 && !OtherServicesglobal && (
+                  {OpenFailData && (
+                    <PaymentFailedSales
+                      paymentFailedStatusFun={paymentFailedStatusFun}
+                      OpenFailData={OpenFailData}
+                    />
+                  )}
+                  {/* {ComboDropDown?.length >= 1 && !OtherServicesglobal && (
                   <div
                     style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}
                   >
@@ -1014,31 +1006,32 @@ const BSNavbar2 = () => {
                     </TooltipWrapper>
                   </div>
                 )} */}
-                {navbarOptions?.map((item) => (
-                  <>
-                    {item?.OptionName == 'RePrint' && !OtherServicesglobal && (
-                      <div
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                        }}
-                      >
-                        <BSPrinterSetting />
-                      </div>
-                    )}
-                    {!OtherServicesglobal && (
-                      <>
-                        {item?.OptionName == 'Hold' &&
-                          OrderType != 'Failed' &&
-                          OrderType != 'Reorder' &&
-                          CheckBookingStatus != 'Close' &&
-                          isHoldEnable &&
-                          !addnewAccess && (
-                            <div className="BSBillingNavBar2-hand">
-                              <BSNavBarHand />
-                            </div>
-                          )}
-                        {/* {item?.OptionName == 'Quick Transfer' && (
+                  {navbarOptions?.map((item) => (
+                    <>
+                      {item?.OptionName == 'RePrint' &&
+                        !OtherServicesglobal && (
+                          <div
+                            style={{
+                              pointerEvents:
+                                OrderType === 'Failed' ? 'none' : 'auto',
+                            }}
+                          >
+                            <BSPrinterSetting />
+                          </div>
+                        )}
+                      {!OtherServicesglobal && (
+                        <>
+                          {item?.OptionName == 'Hold' &&
+                            OrderType != 'Failed' &&
+                            OrderType != 'Reorder' &&
+                            CheckBookingStatus != 'Close' &&
+                            isHoldEnable &&
+                            !addnewAccess && (
+                              <div className="BSBillingNavBar2-hand">
+                                <BSNavBarHand />
+                              </div>
+                            )}
+                          {/* {item?.OptionName == 'Quick Transfer' && (
                       <div
                         style={{
                           pointerEvents:
@@ -1056,284 +1049,288 @@ const BSNavbar2 = () => {
                         </Tooltip>
                       </div>
                     )} */}
-                        {item?.OptionName == 'QuickAdd' && (
-                          <div
-                            style={{
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                            }}
-                          >
-                            <BSNavBarQuickAdd />
-                          </div>
-                        )}
-                        {item?.OptionName == 'DineIn' &&
-                          dinePreference &&
-                          PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                            (item) => item.SettingIdName === 'DineIn'
-                          )?.SettingValue === 'Y' && (
-                            <div
-                              style={{
-                                pointerEvents:
-                                  OrderType === 'Failed' || addnewAccess
-                                    ? 'none'
-                                    : 'auto',
-                              }}
-                            >
-                              <BSNavBarTable />
-                            </div>
-                          )}
-                        {item?.OptionName == 'TakeAway' && (
-                          <div
-                            style={{
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                            }}
-                          >
-                            <BSNavBarHandbag />
-                          </div>
-                        )}
-                        {item?.OptionName === 'Offer' &&
-                          GlobEstBooking !== 'OvrAllEst' &&
-                          GlobEstBooking !== 'ParEst' &&
-                          GlobEstBooking === 'Sales' &&
-                          PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
-                            (item) => item.SettingIdName === 'Offer'
-                          )?.SettingValue === 'Y' && (
+                          {item?.OptionName == 'QuickAdd' && (
                             <div
                               style={{
                                 pointerEvents:
                                   OrderType === 'Failed' ? 'none' : 'auto',
                               }}
                             >
-                              <BSNavBarOffer />
+                              <BSNavBarQuickAdd />
                             </div>
                           )}
-                        {item?.OptionName == 'ExtraCharge' && (
-                          <div
-                            style={{
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                            }}
-                          >
-                            <BSNavBarAddons />
-                          </div>
-                        )}
-
-                        {item?.OptionName == 'AddCustomer' && (
-                          <Popover
-                            content={
+                          {item?.OptionName == 'DineIn' &&
+                            dinePreference &&
+                            PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                              (item) => item.SettingIdName === 'DineIn'
+                            )?.SettingValue === 'Y' && (
                               <div
                                 style={{
-                                  display: 'flex',
-                                  alignItems: 'center',
-                                  columnGap: '0.5rem',
+                                  pointerEvents:
+                                    OrderType === 'Failed' || addnewAccess
+                                      ? 'none'
+                                      : 'auto',
                                 }}
                               >
-                                <BSCustomerSelect TopName={'navbar-top'} />
-                                <BSNavBarAddUser />
+                                <BSNavBarTable />
                               </div>
-                            }
-                            trigger="click"
-                            placement="left"
-                            open={open}
-                            onOpenChange={handleOpenChange}
-                          >
-                            <div>
-                              <PozoAddCustomerIcon className="BSBillingNav-icon" />
-                            </div>
-                          </Popover>
-                        )}
-                      </>
-                    )}
-                  </>
-                ))}
-                {!OtherServicesglobal && (
-                  <>
-                    {FeatureAddonData?.FeatureDtls?.find(
-                      (item) =>
-                        item?.FeatureAddonName?.toLowerCase() === 'Weight Scale'
-                    ) && (
-                      <div
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                        }}
-                      >
-                        <BSNavBarWeightScale />
-                      </div>
-                    )}
-                    {!OtherServicesglobal && (
-                      <>
-                        {FeatureAddonData?.FeatureDtls?.find(
-                          (item) =>
-                            item?.FeatureAddonName?.toLowerCase() === 'preorder'
-                        ) && (
-                          <div
-                            style={{
-                              pointerEvents:
-                                tableData || OrderType === 'Failed'
-                                  ? 'none'
-                                  : 'auto',
-                              opacity: tableData ? 0.5 : 1,
-                            }}
-                          >
-                            <TooltipWrapper
-                              title={'Pre Booking'}
-                              isMobile={isMobile}
+                            )}
+                          {item?.OptionName == 'TakeAway' && (
+                            <div
+                              style={{
+                                pointerEvents:
+                                  OrderType === 'Failed' ? 'none' : 'auto',
+                              }}
                             >
-                              <Badge
-                                count={preOrderPendingCount}
-                                offset={[-5, 10]}
-                                size="small"
+                              <BSNavBarHandbag />
+                            </div>
+                          )}
+                          {item?.OptionName === 'Offer' &&
+                            GlobEstBooking !== 'OvrAllEst' &&
+                            GlobEstBooking !== 'ParEst' &&
+                            GlobEstBooking === 'Sales' &&
+                            PreferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+                              (item) => item.SettingIdName === 'Offer'
+                            )?.SettingValue === 'Y' && (
+                              <div
+                                style={{
+                                  pointerEvents:
+                                    OrderType === 'Failed' ? 'none' : 'auto',
+                                }}
                               >
-                                <PozoPreOrderIcon
-                                  className="BSBillingNav-icon"
-                                  fill={preOrderOpen ? '#52C41A' : '#1292EE'}
-                                  onClick={() => {
-                                    openPreOrder('small-screen');
+                                <BSNavBarOffer />
+                              </div>
+                            )}
+                          {item?.OptionName == 'ExtraCharge' && (
+                            <div
+                              style={{
+                                pointerEvents:
+                                  OrderType === 'Failed' ? 'none' : 'auto',
+                              }}
+                            >
+                              <BSNavBarAddons />
+                            </div>
+                          )}
+
+                          {item?.OptionName == 'AddCustomer' && (
+                            <Popover
+                              content={
+                                <div
+                                  style={{
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    columnGap: '0.5rem',
                                   }}
-                                />
-                              </Badge>
-                            </TooltipWrapper>
-                          </div>
-                        )}
-                      </>
-                    )}
-                    {preOrderOpen && (
-                      <BSNavBarPreOrder
-                        preOrderhiseandShow={handlepreOrderhiseandShow}
-                        preOrderhideshow={preOrderhiseandShow}
-                        HandleClose={preOrderHandleclose}
-                      />
-                    )}
-                    {sportsAppPreference && <BSMembership />}
-                    {Estimation?.SettingValue === 'Y' &&
-                      !OrderOfferStatus &&
-                      BookingType !== 'Dine In' &&
-                      !BookingTypeBoth && (
+                                >
+                                  <BSCustomerSelect TopName={'navbar-top'} />
+                                  <BSNavBarAddUser />
+                                </div>
+                              }
+                              trigger="click"
+                              placement="left"
+                              open={open}
+                              onOpenChange={handleOpenChange}
+                            >
+                              <div>
+                                <PozoAddCustomerIcon className="BSBillingNav-icon" />
+                              </div>
+                            </Popover>
+                          )}
+                        </>
+                      )}
+                    </>
+                  ))}
+                  {!OtherServicesglobal && (
+                    <>
+                      {FeatureAddonData?.FeatureDtls?.find(
+                        (item) =>
+                          item?.FeatureAddonName?.toLowerCase() ===
+                          'Weight Scale'
+                      ) && (
                         <div
                           style={{
                             pointerEvents:
                               OrderType === 'Failed' ? 'none' : 'auto',
                           }}
                         >
-                          <BSNavBarEstimate />
+                          <BSNavBarWeightScale />
                         </div>
                       )}
-                    {SalesMode?.SettingValue === 'Y' &&
-                      !OtherServicesglobal && <BSNavBarWholeSale />}
-                    {!OtherServicesglobal &&
-                      ScanLayoutScreen?.SettingValue === 'Y' && (
-                        <BSScanTemplate />
+                      {!OtherServicesglobal && (
+                        <>
+                          {FeatureAddonData?.FeatureDtls?.find(
+                            (item) =>
+                              item?.FeatureAddonName?.toLowerCase() ===
+                              'preorder'
+                          ) && (
+                            <div
+                              style={{
+                                pointerEvents:
+                                  tableData || OrderType === 'Failed'
+                                    ? 'none'
+                                    : 'auto',
+                                opacity: tableData ? 0.5 : 1,
+                              }}
+                            >
+                              <TooltipWrapper
+                                title={'Pre Booking'}
+                                isMobile={isMobile}
+                              >
+                                <Badge
+                                  count={preOrderPendingCount}
+                                  offset={[-5, 10]}
+                                  size="small"
+                                >
+                                  <PozoPreOrderIcon
+                                    className="BSBillingNav-icon"
+                                    fill={preOrderOpen ? '#52C41A' : '#1292EE'}
+                                    onClick={() => {
+                                      openPreOrder('small-screen');
+                                    }}
+                                  />
+                                </Badge>
+                              </TooltipWrapper>
+                            </div>
+                          )}
+                        </>
+                      )}
+                      {preOrderOpen && (
+                        <BSNavBarPreOrder
+                          preOrderhiseandShow={handlepreOrderhiseandShow}
+                          preOrderhideshow={preOrderhiseandShow}
+                          HandleClose={preOrderHandleclose}
+                        />
+                      )}
+                      {sportsAppPreference && <BSMembership />}
+                      {Estimation?.SettingValue === 'Y' &&
+                        !OrderOfferStatus &&
+                        BookingType !== 'Dine In' &&
+                        !BookingTypeBoth && (
+                          <div
+                            style={{
+                              pointerEvents:
+                                OrderType === 'Failed' ? 'none' : 'auto',
+                            }}
+                          >
+                            <BSNavBarEstimate />
+                          </div>
+                        )}
+                      {SalesMode?.SettingValue === 'Y' &&
+                        !OtherServicesglobal && <BSNavBarWholeSale />}
+                      {!OtherServicesglobal &&
+                        ScanLayoutScreen?.SettingValue === 'Y' && (
+                          <BSScanTemplate />
+                        )}
+                      {!sportsAppPreference && (
+                        <div
+                          style={{
+                            pointerEvents:
+                              OrderType === 'Failed' ? 'none' : 'auto',
+                          }}
+                        >
+                          <BSNavBarFavItems type="small-screen" />
+                        </div>
                       )}
-                    {!sportsAppPreference && (
                       <div
                         style={{
                           pointerEvents:
                             OrderType === 'Failed' ? 'none' : 'auto',
                         }}
                       >
-                        <BSNavBarFavItems type="small-screen" />
+                        <BSNavBarDragItems type="small-screen" />
                       </div>
-                    )}
-                    <div
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <BSNavBarDragItems type="small-screen" />
-                    </div>
-                    {FeatureAddonData?.FeatureDtls?.find(
-                      (item) =>
-                        item?.FeatureAddonName?.toLowerCase() ===
-                        'customer display'
-                    ) && (
-                      <TooltipWrapper
-                        title="Customer Display"
-                        isMobile={isMobile}
-                      >
-                        {/* <div onClick={openNewTab} style={{ display: "flex", alignItems: "center", cursor: "pointer" }}>
+                      {FeatureAddonData?.FeatureDtls?.find(
+                        (item) =>
+                          item?.FeatureAddonName?.toLowerCase() ===
+                          'customer display'
+                      ) && (
+                        <TooltipWrapper
+                          title="Customer Display"
+                          isMobile={isMobile}
+                        >
+                          {/* <div onClick={openNewTab} style={{ display: "flex", alignItems: "center", cursor: "pointer" }}>
                       <FaDisplay />
                     </div> */}
-                        <div
-                          onClick={openNewTab}
-                          style={{ width: '1.3rem', cursor: 'pointer' }}
+                          <div
+                            onClick={openNewTab}
+                            style={{ width: '1.3rem', cursor: 'pointer' }}
+                          >
+                            <CustomerDisplayicon />
+                          </div>
+                        </TooltipWrapper>
+                      )}
+                      {VerifyTheProducts && (
+                        <TooltipWrapper
+                          title={'Verfied Products'}
+                          isMobile={isMobile}
                         >
-                          <CustomerDisplayicon />
-                        </div>
-                      </TooltipWrapper>
-                    )}
-                    {VerifyTheProducts && (
-                      <TooltipWrapper
-                        title={'Verfied Products'}
-                        isMobile={isMobile}
-                      >
-                        <div>
-                          <VerfiedProducts />
-                        </div>
-                      </TooltipWrapper>
-                    )}
-                    {paymentfeataddon && (
-                      <TooltipWrapper
-                        title="Failed Payment"
-                        isMobile={isMobile}
-                      >
-                        <div
-                          onClick={() => {
-                            paymentFailedStatusFun();
-                          }}
-                          style={{ width: '1.4rem', cursor: 'pointer' }}
+                          <div>
+                            <VerfiedProducts />
+                          </div>
+                        </TooltipWrapper>
+                      )}
+                      {paymentfeataddon && (
+                        <TooltipWrapper
+                          title="Failed Payment"
+                          isMobile={isMobile}
                         >
-                          <PozoPaymentFailesIcon />
-                        </div>
-                      </TooltipWrapper>
-                    )}
-                  </>
-                )}
+                          <div
+                            onClick={() => {
+                              paymentFailedStatusFun();
+                            }}
+                            style={{ width: '1.4rem', cursor: 'pointer' }}
+                          >
+                            <PozoPaymentFailesIcon />
+                          </div>
+                        </TooltipWrapper>
+                      )}
+                    </>
+                  )}
+                </div>
               </div>
+            </>
+          )}
+          {isMobile && (
+            <div
+              style={{
+                color: 'rgb(33, 150, 243)',
+              }}
+            >
+              <BSMobilePrintSettings />
             </div>
-          </>
-        )}
-        {isMobile && (
-          <div
-            style={{
-              color: 'rgb(33, 150, 243)',
-            }}
-          >
-            <BSMobilePrintSettings />
-          </div>
-        )}
-        {!OtherServicesglobal && (
-          <TooltipWrapper title="User Profile" isMobile={isMobile}>
-            <div>
-              <PozoUserIcon
-                className="BSBillingNav-icon"
-                onClick={UserAcc}
-                style={{ color: '#1292EE', fontSize: '21px' }}
-              />
-            </div>
-          </TooltipWrapper>
-        )}
-      </div>
+          )}
+          {!OtherServicesglobal && (
+            <TooltipWrapper title="User Profile" isMobile={isMobile}>
+              <div>
+                <PozoUserIcon
+                  className="BSBillingNav-icon"
+                  onClick={UserAcc}
+                  style={{ color: '#1292EE', fontSize: '21px' }}
+                />
+              </div>
+            </TooltipWrapper>
+          )}
+        </div>
 
-      <div className="BSBillingnav2-threedots" onClick={NavmenuOpenClose}>
-        <MenuOutlined />
-      </div>
+        <div className="BSBillingnav2-threedots" onClick={NavmenuOpenClose}>
+          <MenuOutlined />
+        </div>
 
-      <DefaultModal
-        open={multiple}
-        title="Multiple Search"
-        footer={false}
-        width={350}
-        handleCancel={() => setMultiple(false)}
-        destroyOnClose={true}
-        children={
-          <>
-            <MultipleSearch close={setMultiple} />
-          </>
-        }
-      />
-    </div>
+        <DefaultModal
+          open={multiple}
+          title="Multiple Search"
+          footer={false}
+          width={350}
+          handleCancel={() => setMultiple(false)}
+          destroyOnClose={true}
+          children={
+            <>
+              <MultipleSearch close={setMultiple} />
+            </>
+          }
+        />
+      </div>
+    </Suspense>
   );
 };
 export default BSNavbar2;
diff --git a/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar3.jsx b/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar3.jsx
index 83709fd..e103151 100644
--- a/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar3.jsx
+++ b/src/Pages/BookingScreen/Components/BSNavbar/BSNavbar3.jsx
@@ -1,4 +1,12 @@
-import { useState, useEffect, useRef, useCallback, useMemo } from 'react';
+import {
+  useState,
+  useEffect,
+  useRef,
+  useCallback,
+  useMemo,
+  lazy,
+  Suspense,
+} from 'react';
 import { useNavigate } from 'react-router-dom';
 import { useDispatch, useSelector, shallowEqual } from 'react-redux';
 import {
@@ -38,7 +46,6 @@ import '../../../../Styles/BookingScreen/Components/BSNavbar/BSNavbar3.scss';
 // UI Imports
 import { Badge, Popconfirm, Tooltip } from 'antd';
 import { AiFillHome } from 'react-icons/ai';
-import { GoClockFill } from 'react-icons/go';
 import {
   FaPlus,
   FaHandPaper,
@@ -48,30 +55,23 @@ import {
   FaParking,
 } from 'react-icons/fa';
 import { CiMenuBurger } from 'react-icons/ci';
-import { IoClose, IoCloseOutline } from 'react-icons/io5';
-import { FaCalendar } from 'react-icons/fa6';
+import { IoCloseOutline } from 'react-icons/io5';
 import {
   RiFullscreenExitFill,
   RiFullscreenFill,
   RiPrinterFill,
 } from 'react-icons/ri';
 import { GiShoppingBag } from 'react-icons/gi';
-import { PiSignOutFill } from 'react-icons/pi';
-import { TfiHandDrag } from 'react-icons/tfi';
-import { CgClose } from 'react-icons/cg';
-
-import { DropDowns } from '../../../../Components/Forms/DropDown';
-import PozoDineInIcon from '../UtillComponents/Pozo retail icons/PozoDineIn.jsx';
-import BSNavBarFavItems from '../UtillComponents/BSNavBarFavItems.jsx';
-import BSNavBarAddUser from '../UtillComponents/BSNavBarAddUser.jsx';
-import BSCustomerSelect from '../UtillComponents/BSSelectCustomer.jsx';
-import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities.jsx';
-import BSNavBarHand from '../UtillComponents/BSNavBarHand.jsx';
-import BSNavBarDragItems from '../UtillComponents/BSNavBarDragItems.jsx';
+const BSNavBarAddUser = lazy(
+  () => import('../UtillComponents/BSNavBarAddUser.jsx')
+);
+const BSCustomerSelect = lazy(
+  () => import('../UtillComponents/BSSelectCustomer.jsx')
+);
+const FeaturesFunctionalities = lazy(
+  () => import('../BookingFunctionality/FeaturesFunctionalities.jsx')
+);
 import CustomerDisplayicon from '../UtillComponents/Pozo retail icons/PozoCustomerDisplayicon.jsx';
-
-import BSNavBarPrinter from '../UtillComponents/BSNavBarPrinter.jsx';
-import BSNavBarUserInfo from './BSNavBarUserInfo.jsx';
 import {
   getUserProfile,
   userDataByUserId,
@@ -81,8 +81,6 @@ import {
   getSession,
   sessionStore,
 } from '../../../../Services/Others.js';
-import UserRelieveManager from '../../Template/RealivingUser.jsx';
-import BSNavbarSearchStandard from '../UtillComponents/BSNavbarSearchStandard.jsx';
 import {
   getTemplate,
   getTemplateData,
@@ -92,22 +90,12 @@ import {
   CurrentTimeDisplay,
   CurrentDateDisplay,
 } from '../UtillComponents/CurrentDateTimeDisplay.jsx';
-import BSPrinterSetting from '../UtillComponents/BSPrinterSetting.jsx';
-import BSNavBarTable from '../UtillComponents/BSNavBarTable.jsx';
 import TooltipWrapper from '../../../../Components/Tooltip/Tooltip.jsx';
 import { isMobile } from 'react-device-detect';
 import {
   getCustomerDisplayWindow,
   setCustomerDisplayWindow,
 } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
-import BSMobilePrintSettings from '../UtillComponents/BSMobilePrintSettings.jsx';
-import BSScanTemplate from '../UtillComponents/BSScanTemplate.jsx';
-import VerfiedProducts from './verfiedProduct/VerfiedProducts.jsx';
-import BSMembership from '../UtillComponents/BSMembership.jsx';
-import BranchName from '../../Template/BranchName.jsx';
-import BSNavBarAddons from '../UtillComponents/BSNavBarAddons.jsx';
-import BSNavBarOffer from '../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx';
-import BSNavBarQuickAdd from '../UtillComponents/BSNavBarQuickAdd.jsx';
 import BSNavBarPreOrder from '../UtillComponents/BSNavBarPreOrder.jsx';
 import {
   changepreOrder,
@@ -126,6 +114,49 @@ import { CgSearchLoading } from 'react-icons/cg';
 import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
 import MultipleSearch from '../UtillComponents/MultipleSearch.jsx';
 
+// Jsx Files
+const BSNavBarFavItems = lazy(
+  () => import('../UtillComponents/BSNavBarFavItems.jsx')
+);
+const BSNavBarHand = lazy(() => import('../UtillComponents/BSNavBarHand.jsx'));
+const BSNavBarDragItems = lazy(
+  () => import('../UtillComponents/BSNavBarDragItems.jsx')
+);
+const BSNavBarUserInfo = lazy(() => import('./BSNavBarUserInfo.jsx'));
+
+const UserRelieveManager = lazy(
+  () => import('../../Template/RealivingUser.jsx')
+);
+const BSNavbarSearchStandard = lazy(
+  () => import('../UtillComponents/BSNavbarSearchStandard.jsx')
+);
+const BSPrinterSetting = lazy(
+  () => import('../UtillComponents/BSPrinterSetting.jsx')
+);
+const BSNavBarTable = lazy(
+  () => import('../UtillComponents/BSNavBarTable.jsx')
+);
+const BSMobilePrintSettings = lazy(
+  () => import('../UtillComponents/BSMobilePrintSettings.jsx')
+);
+const BSScanTemplate = lazy(
+  () => import('../UtillComponents/BSScanTemplate.jsx')
+);
+const VerfiedProducts = lazy(
+  () => import('./verfiedProduct/VerfiedProducts.jsx')
+);
+const BSMembership = lazy(() => import('../UtillComponents/BSMembership.jsx'));
+const BranchName = lazy(() => import('../../Template/BranchName.jsx'));
+const BSNavBarAddons = lazy(
+  () => import('../UtillComponents/BSNavBarAddons.jsx')
+);
+const BSNavBarOffer = lazy(
+  () => import('../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx')
+);
+const BSNavBarQuickAdd = lazy(
+  () => import('../UtillComponents/BSNavBarQuickAdd.jsx')
+);
+// Api
 const subDirectory = import.meta.env.ENV_BASE_URL;
 const commonUrl = import.meta.env.ENV_COMMON_BASE_URL;
 
@@ -156,6 +187,7 @@ const BSNavbar3 = ({ optionNames }) => {
   const [isUserAccOpen, setIsUserAccOpen] = useState(false);
   const [quickAdd, setQuickAdd] = useState(false);
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
+
   const [isFullscreen, setIsFullscreen] = useState(false);
   const [multiple, setMultiple] = useState(false);
   const GlobEstBooking = useSelector(GlobalEstimateBooking);
@@ -563,568 +595,179 @@ const BSNavbar3 = ({ optionNames }) => {
   };
 
   return (
-    <>
-      <div className="BSNavbar3Main">
-        <div className="homeTime">
-          <div className="homeIcon">
-            <Popconfirm
-              title="Are you sure you want to go to home page?"
-              onConfirm={handleHomePageNavigate}
-              okText="Yes"
-              cancelText="No"
-            >
-              <AiFillHome color="#fff" size={24} />
-            </Popconfirm>{' '}
-            <div>
-              {' '}
-              <BranchName />
+    <Suspense fallback={<div>Loading…</div>}>
+      <>
+        <div className="BSNavbar3Main">
+          <div className="homeTime">
+            <div className="homeIcon">
+              <Popconfirm
+                title="Are you sure you want to go to home page?"
+                onConfirm={handleHomePageNavigate}
+                okText="Yes"
+                cancelText="No"
+              >
+                <AiFillHome color="#fff" size={24} />
+              </Popconfirm>{' '}
+              <div>
+                {' '}
+                <BranchName />
+              </div>
             </div>
+
+            {OtherServiceStatus && Parking && (
+              <div
+                style={{
+                  fontSize: '1.5rem',
+                  color: 'rgb(18, 146, 238)',
+                  position: 'sticky',
+                }}
+              >
+                <TooltipWrapper title="Other Services" isMobile={isMobile}>
+                  <div onClick={handleotherservices}>
+                    <FaParking
+                      style={{
+                        display: 'flex',
+                        justifyContent: 'center',
+                        cursor: 'pointer',
+                      }}
+                      fill={
+                        OtherServicesglobal === true ? '#52C41A' : '#1292EE'
+                      }
+                    />
+                  </div>
+                </TooltipWrapper>
+              </div>
+            )}
           </div>
 
-          {OtherServiceStatus && Parking && (
+          {/* Multiple search  */}
+          <Tooltip title={'Multiple Search'}>
+            <div className="MultiSearchIconDiv3">
+              <CgSearchLoading onClick={() => setMultiple(true)} />
+            </div>
+          </Tooltip>
+          {!sportsAppPreference && searchOption && (
             <div
-              style={{
-                fontSize: '1.5rem',
-                color: 'rgb(18, 146, 238)',
-                position: 'sticky',
-              }}
+              className="BsnavbarSearchMain"
+              onClick={() => searchInputRef.current?.focus()}
             >
-              <TooltipWrapper title="Other Services" isMobile={isMobile}>
-                <div onClick={handleotherservices}>
-                  <FaParking
-                    style={{
-                      display: 'flex',
-                      justifyContent: 'center',
-                      cursor: 'pointer',
-                    }}
-                    fill={OtherServicesglobal === true ? '#52C41A' : '#1292EE'}
-                  />
-                </div>
-              </TooltipWrapper>
+              <BSNavbarSearchStandard inputRef={searchInputRef} />
             </div>
           )}
-        </div>
 
-        {/* Multiple search  */}
-        <Tooltip title={'Multiple Search'}>
-          <div className="MultiSearchIconDiv3">
-            <CgSearchLoading onClick={() => setMultiple(true)} />
-          </div>
-        </Tooltip>
-        {!sportsAppPreference && searchOption && (
-          <div
-            className="BsnavbarSearchMain"
-            onClick={() => searchInputRef.current?.focus()}
-          >
-            <BSNavbarSearchStandard inputRef={searchInputRef} />
-          </div>
-        )}
-
-        {/* Customer Select - Always visible */}
-        <div className="DropDownsCustomer always-visible">
-          <BSCustomerSelect
-            placeholder="Customer Name"
-            TopName={'navbar-top'}
-          />
+          {/* Customer Select - Always visible */}
           {addCustomerOption && (
-            <span>
-              {renderWithTooltip(<BSNavBarAddUser />, 'Add Customer')}
-            </span>
-          )}
-          {/* <IoClose className="DropDownsCustomerClose" strokeWidth={3} /> */}
-        </div>
-
-        {offerOption && (
-          <div className="standard-extra-charges">
-            {GlobEstBooking !== 'OvrAllEst' &&
-              GlobEstBooking !== 'ParEst' &&
-              GlobEstBooking === 'Sales' &&
-              preferences?.[0]?.['SettingDtlDetails']?.find(
-                (item) => item.SettingIdName === 'Offer'
-              )?.SettingValue === 'Y' && (
-                <div
-                  style={{
-                    pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
-                  }}
-                >
-                  <BSNavBarOffer />
-                </div>
+            <div className="DropDownsCustomer always-visible">
+              <BSCustomerSelect
+                placeholder="Customer Name"
+                TopName={'navbar-top'}
+              />
+              {addCustomerOption && (
+                <span>
+                  {renderWithTooltip(<BSNavBarAddUser />, 'Add Customer')}
+                </span>
               )}
-          </div>
-        )}
-        {extraChargeOption && !sportsAppPreference && (
-          <div
-            className="standard-extra-charges"
-            style={{
-              pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
-            }}
-          >
-            <BSNavBarAddons />
-          </div>
-        )}
-
-        {!sportsAppPreference && quickAddOption && (
-          <div
-            className="standard-extra-charges"
-            style={{
-              pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
-            }}
-          >
-            <BSNavBarQuickAdd />
-          </div>
-        )}
-        {/* Desktop CustomerActions */}
-        <div className="CustomerActions desktop-only">
-          {/* {(takeAwayPreference && takeAwayOption) && renderWithTooltip(
-                        <GiShoppingBag size={43} className="FaTruckIcon" color={bookingType === 'TakeAway' ? '#52c41a' :
-                            '#6b7280'} onClick={handleTakeAway} />, 'Takeaway')}
-                    {(dineInPreference && dineIn && dineInOption) && renderWithTooltip(
-                        <PozoDineInIcon width='40' height='40' className="FaTruckIcon" onClick={handleDineInNavigate} />, 'Dine-in')} */}
-
-          {dineInPreference && dineIn && dineInOption && (
-            <div className="mobile-action-item">
-              <BSNavBarTable />
             </div>
           )}
 
-          {!OtherServicesglobal && (
-            <>
-              {FeatureAddonData?.FeatureDtls?.find(
-                (item) =>
-                  item?.FeatureAddonName?.toLowerCase() !== 'weight scale'
-              ) && (
-                <div
-                  style={{
-                    pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
-                  }}
-                >
-                  <BSNavBarWeightScale />
-                </div>
-              )}
-              {FeatureAddonData?.FeatureDtls?.find(
-                (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
-              ) && (
-                <div
-                  className="BSBillingNavBar2-AllIcons"
-                  style={{
-                    pointerEvents:
-                      tableData || orderType === 'Failed' ? 'none' : 'auto',
-                    opacity: tableData ? 0.5 : 1,
-                  }}
-                >
-                  <TooltipWrapper title={'Pre Booking'} isMobile={isMobile}>
-                    <Badge
-                      count={preOrderPendingCount}
-                      offset={[-5, 10]}
-                      size="small"
-                    >
-                      <PozoPreOrderIcon
-                        className="BSBillingNav-icon"
-                        fill={preOrderOpen ? '#52C41A' : '#1292EE'}
-                        onClick={() => {
-                          openPreOrder();
-                        }}
-                        HandleClose={preOrderHandleclose}
-                      />
-                    </Badge>
-                  </TooltipWrapper>
-                </div>
-              )}
-            </>
-          )}
-          {preOrderOpen && (
-            <div className="smallScreenclose">
-              <BSNavBarPreOrder HandleClose={preOrderHandleclose} />
-            </div>
-          )}
-          {sportsAppPreference && <BSMembership />}
-          {!OtherServicesglobal && (
-            <>
-              {Estimation?.SettingValue === 'Y' &&
-                bookingType !== 'Dine In' &&
-                !BookingTypeBoth &&
-                !OrderOfferStatus && (
+          {offerOption && (
+            <div className="standard-extra-charges">
+              {GlobEstBooking !== 'OvrAllEst' &&
+                GlobEstBooking !== 'ParEst' &&
+                GlobEstBooking === 'Sales' &&
+                preferences?.[0]?.['SettingDtlDetails']?.find(
+                  (item) => item.SettingIdName === 'Offer'
+                )?.SettingValue === 'Y' && (
                   <div
-                    className="BSBillingNavBar2-AllIcons"
                     style={{
                       pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
                     }}
                   >
-                    <BSNavBarEstimate />
+                    <BSNavBarOffer />
                   </div>
                 )}
-            </>
-          )}
-
-          {SalesMode?.SettingValue === 'Y' && !OtherServicesglobal && (
-            <BSNavBarWholeSale />
-          )}
-
-          {!sportsAppPreference && (
-            <div className="FaTruckIconFavItem" style={{ padding: '4px 6px' }}>
-              {renderWithTooltip(
-                <BSNavBarFavItems
-                  size={41}
-                  className="FaTruckIcon"
-                  fill={'#fff'}
-                />,
-                'Favourites'
-              )}
             </div>
           )}
-          {/* 
-          {!sportsAppPreference &&
-            quickAddOption &&
-            renderWithTooltip(
-              <FaPlus className="FaTruckIcon" onClick={handleQuickAddOpen} />,
-              'QUICK ADD (SHIFT + Q)'
-            )} */}
-
-          {holdOption &&
-            ((bookingType !== 'Dine In' && OrderCardDetail?.length != 0) ||
-              (bookingType !== 'Dine In' &&
-                Holddata?.length > 0 &&
-                OrderCardDetail?.length == 0)) &&
-            isHoldEnable &&
-            renderWithTooltip(
-              <BSNavBarHand
-                ComponentIcon={FaHandPaper}
-                iconSize={50}
-                iconClassName="FaTruckIconHold"
-              />,
-              'Hold'
-            )}
-          {ScanLayoutScreen?.SettingValue === 'Y' && <BSScanTemplate />}
-          <div
-            className="FaTruckIconDragItems"
-            style={{ pointerEvents: orderType === 'Failed' ? 'none' : 'auto' }}
-          >
-            <BSNavBarDragItems />
-          </div>
-          {FeatureAddonData?.FeatureDtls?.find(
-            (item) =>
-              item?.FeatureAddonName?.toLowerCase() === 'customer display'
-          ) && (
-            <TooltipWrapper title="Customer Display" isMobile={isMobile}>
-              <div
-                onClick={openNewTab}
-                className="BSBillingNavBar1-AllIcons"
-                style={{ width: '1.3rem', margin: '10px', cursor: 'pointer' }}
-              >
-                <CustomerDisplayicon />
-              </div>
-            </TooltipWrapper>
-          )}
-          <TooltipWrapper title="Reprint (Alt+R)" isMobile={isMobile}>
-            {reprintOption && (
-              <div
-                style={{
-                  pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
-                  color: '#6b7280',
-                }}
-              >
-                <div className="FaTruckIconreprint">
-                  <BSPrinterSetting IconComponent={RiPrinterFill} />
-                </div>
-              </div>
-            )}
-          </TooltipWrapper>
-
-          {verifyproduct && (
-            <div style={{ color: 'green' }}>
-              <TooltipWrapper
-                title={
-                  sportsAppPreference
-                    ? 'Booking Verification'
-                    : 'Verified Products'
-                }
-                isMobile={isMobile}
-              >
-                <div>
-                  <VerfiedProducts />
-                </div>
-              </TooltipWrapper>
-            </div>
-          )}
-        </div>
-        {isMobile && (
-          <div
-            style={{
-              color: '#6b7280',
-            }}
-          >
-            <BSMobilePrintSettings />
-          </div>
-        )}
-
-        <div className="userDates">
-          <div className="datesNewtimedate">
-            <CurrentDateDisplay />
-            <CurrentTimeDisplay />
-          </div>
-
-          <Tooltip title={isFullscreen ? 'Exit Full Screen' : 'Full Screen'}>
+          {extraChargeOption && !sportsAppPreference && (
             <div
-              className={
-                isFullscreen ? 'BsNavbar3FullScreenExit' : 'BsNavbar3FullScreen'
-              }
-              onClick={handleFullscreen}
-            >
-              {isFullscreen ? <RiFullscreenExitFill /> : <RiFullscreenFill />}
-            </div>
-          </Tooltip>
-
-          <div className="BsNavbarUser">
-            <FaUserAlt size={18} onClick={handleUserAcc} />
-            <BSNavBarUserInfo
-              isOpen={isUserAccOpen}
-              divRef={userMenuRef}
-              CompBranchData={compBranchData}
-              BacktoLogin={handleBackToLogin}
-              userProfileData={userProfileData}
-              handleEditProfile={handleEditProfile}
-              UserRelieveManager={<UserRelieveManager />}
-              Logout={Logout}
-            />
-          </div>
-
-          {/* Mobile Toggle Button */}
-          <div className="mobile-toggle-btn" onClick={handleMobileMenuToggle}>
-            <CiMenuBurger size={20} color="#fff" />
-          </div>
-        </div>
-      </div>
-
-      {/* Mobile Menu */}
-      <div
-        className={`mobile-menu ${isMobileMenuOpen ? 'open' : ''}`}
-        ref={mobileMenuRef}
-      >
-        <div className="mobile-menu-content">
-          <div
-            className="mobile-toggle-btn"
-            style={{
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'flex-end',
-              width: '100%',
-              cursor: 'pointer',
-              padding: '2px 0',
-            }}
-            onClick={handleMobileMenuToggle}
-          >
-            {isMobileMenuOpen ? (
-              <IoCloseOutline size={25} strokeWidth={2} color="#fff" />
-            ) : (
-              <CiMenuBurger height={20} size={20} color="#fff" />
-            )}
-          </div>
-          <div className="mobile-customer-actions">
-            {takeAwayPreference && takeAwayOption && (
-              <div className="mobile-action-item" onClick={handleTakeAway}>
-                <GiShoppingBag
-                  size={30}
-                  color={bookingType === 'TakeAway' ? '#52c41a' : '#6b7280'}
-                />
-                <div>Take Away</div>
-              </div>
-            )}
-            {dineInPreference && dineIn && dineInOption && (
-              <div className="mobile-action-item">
-                <BSNavBarTable width="30" height="30" />
-                <div>{bookingType}</div>
-              </div>
-            )}
-            {!sportsAppPreference && (
-              <div
-                className="mobile-action-item"
-                onClick={() =>
-                  setDrawerOpen((prev) => ({
-                    ...prev,
-                    favourite: !prev?.favourite,
-                  }))
-                }
-              >
-                <BSNavBarFavItems
-                  size={30}
-                  drawerOpen={drawerOpen?.favourite}
-                  fill={'#fff'}
-                />
-                <div>Favourite</div>
-              </div>
-            )}
-            {addCustomerOption && (
-              <div
-                className="mobile-action-item"
-                onClick={() =>
-                  setDrawerOpen((prev) => ({
-                    ...prev,
-                    customer: !prev?.customer,
-                  }))
-                }
-              >
-                <BSNavBarAddUser
-                  drawerOpen={drawerOpen?.customer}
-                  setDrawerOpen={setDrawerOpen}
-                />
-                <div>Add Customer</div>
-              </div>
-            )}
-            {quickAddOption && (
-              <div className="mobile-action-item" onClick={handleQuickAddOpen}>
-                {renderWithTooltip(<FaPlus size={30} />, 'Quick Add', 'top')}
-                <div>Quick Add</div>
-              </div>
-            )}
-            {holdOption &&
-              ((bookingType !== 'Dine In' && OrderCardDetail?.length != 0) ||
-                (bookingType !== 'Dine In' &&
-                  Holddata?.length > 0 &&
-                  isHoldEnable &&
-                  OrderCardDetail?.length == 0)) && (
-                <div
-                  className="mobile-action-item"
-                  onClick={() =>
-                    setDrawerOpen((prev) => ({ ...prev, hold: !prev?.hold }))
-                  }
-                >
-                  <BSNavBarHand
-                    ComponentIcon={FaHandPaper}
-                    iconSize={20}
-                    style={{ width: '15px' }}
-                    drawerOpen={drawerOpen}
-                    setDrawerOpen={setDrawerOpen}
-                  />
-                  <div>Hold</div>
-                </div>
-              )}
-            {ScanLayoutScreen?.SettingValue === 'Y' && <BSScanTemplate />}
-            <div
-              className="mobile-action-item"
-              onClick={(e) => {
-                if (e.target === e.currentTarget) {
-                  setDrawerOpen((prev) => ({
-                    ...prev,
-                    dragItem: !prev?.dragItem,
-                  }));
-                }
+              className="standard-extra-charges"
+              style={{
+                pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
               }}
             >
-              <BSNavBarDragItems
-                drawerOpen={drawerOpen}
-                setDrawerOpen={setDrawerOpen}
-              />
-              <div
-                onClick={(e) => {
-                  if (e.target === e.currentTarget) {
-                    setDrawerOpen((prev) => ({
-                      ...prev,
-                      dragItem: !prev?.dragItem,
-                    }));
-                  }
-                }}
-              >
-                Drag Item
-              </div>
+              <BSNavBarAddons />
             </div>
-            {reprintOption && (
-              <div
-                className="mobile-action-item"
-                onClick={(e) => {
-                  if (e.target === e.currentTarget) {
-                    setDrawerOpen((prev) => ({
-                      ...prev,
-                      reprint: !prev?.reprint,
-                    }));
-                  }
-                }}
-              >
-                <BSPrinterSetting
-                  IconComponent={RiPrinterFill}
-                  drawerOpen={drawerOpen}
-                  setDrawerOpen={setDrawerOpen}
-                />
-                <div
-                  onClick={(e) => {
-                    if (e.target === e.currentTarget) {
-                      setDrawerOpen((prev) => ({
-                        ...prev,
-                        reprint: !prev?.reprint,
-                      }));
-                    }
-                  }}
-                >
-                  Re-Print
-                </div>
+          )}
+
+          {!sportsAppPreference && quickAddOption && (
+            <div
+              className="standard-extra-charges"
+              style={{
+                pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
+              }}
+            >
+              <BSNavBarQuickAdd />
+            </div>
+          )}
+          {/* Desktop CustomerActions */}
+          <div className="CustomerActions desktop-only">
+             {dineInPreference && dineIn && dineInOption && (
+              <div className="mobile-action-item">
+                <BSNavBarTable />
               </div>
             )}
-            {verifyproduct && (
-              <div
-                className="mobile-action-item"
-                onClick={(e) => {
-                  if (e.target === e.currentTarget) {
-                    setDrawerOpen((prev) => ({
-                      ...prev,
-                      verifyProduct: !prev?.verifyProduct,
-                    }));
-                  }
-                }}
-              >
-                <TooltipWrapper title={'Verfied Products'} isMobile={isMobile}>
-                  <div>
-                    <VerfiedProducts
-                      drawerOpen={drawerOpen}
-                      setDrawerOpen={setDrawerOpen}
-                    />
+
+            {!OtherServicesglobal && (
+              <>
+                {FeatureAddonData?.FeatureDtls?.find(
+                  (item) =>
+                    item?.FeatureAddonName?.toLowerCase() !== 'weight scale'
+                ) && (
+                  <div
+                    style={{
+                      pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
+                    }}
+                  >
+                    <BSNavBarWeightScale />
                   </div>
-                </TooltipWrapper>
-
-                <div
-                  onClick={(e) => {
-                    if (e.target === e.currentTarget) {
-                      setDrawerOpen((prev) => ({
-                        ...prev,
-                        verifyProduct: !prev?.verifyProduct,
-                      }));
-                    }
-                  }}
-                >
-                  Verify Product
-                </div>
+                )}
+                {FeatureAddonData?.FeatureDtls?.find(
+                  (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
+                ) && (
+                  <div
+                    className="BSBillingNavBar2-AllIcons"
+                    style={{
+                      pointerEvents:
+                        tableData || orderType === 'Failed' ? 'none' : 'auto',
+                      opacity: tableData ? 0.5 : 1,
+                    }}
+                  >
+                    <TooltipWrapper title={'Pre Booking'} isMobile={isMobile}>
+                      <Badge
+                        count={preOrderPendingCount}
+                        offset={[-5, 10]}
+                        size="small"
+                      >
+                        <PozoPreOrderIcon
+                          className="BSBillingNav-icon"
+                          fill={preOrderOpen ? '#52C41A' : '#1292EE'}
+                          onClick={() => {
+                            openPreOrder();
+                          }}
+                          HandleClose={preOrderHandleclose}
+                        />
+                      </Badge>
+                    </TooltipWrapper>
+                  </div>
+                )}
+              </>
+            )}
+            {preOrderOpen && (
+              <div className="smallScreenclose">
+                <BSNavBarPreOrder HandleClose={preOrderHandleclose} />
               </div>
             )}
-
-            {sportsAppPreference && (
-              <div
-                className="mobile-action-item"
-                onClick={(e) => {
-                  if (e.target === e.currentTarget) {
-                    setDrawerOpen((prev) => ({
-                      ...prev,
-                      membership: !prev?.membership,
-                    }));
-                  }
-                }}
-              >
-                <BSMembership
-                  drawerOpen={drawerOpen}
-                  setDrawerOpen={setDrawerOpen}
-                />
-                <div
-                  onClick={(e) => {
-                    if (e.target === e.currentTarget) {
-                      setDrawerOpen((prev) => ({
-                        ...prev,
-                        membership: !prev?.membership,
-                      }));
-                    }
-                  }}
-                >
-                  Membership
-                </div>
-              </div>
-            )}
-
+            {sportsAppPreference && <BSMembership />}
             {!OtherServicesglobal && (
               <>
                 {Estimation?.SettingValue === 'Y' &&
@@ -1137,31 +780,410 @@ const BSNavbar3 = ({ optionNames }) => {
                         pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
                       }}
                     >
-                      <div className="mobile-action-item" onClick={() => {}}>
-                        <BSNavBarEstimate />
-                        <div>Estimate</div>
-                      </div>
+                      <BSNavBarEstimate />
                     </div>
                   )}
               </>
             )}
+
             {SalesMode?.SettingValue === 'Y' && !OtherServicesglobal && (
+              <BSNavBarWholeSale />
+            )}
+
+            {!sportsAppPreference && (
+              <div
+                className="FaTruckIconFavItem"
+                style={{ padding: '4px 6px' }}
+              >
+                {renderWithTooltip(
+                  <BSNavBarFavItems
+                    size={41}
+                    className="FaTruckIcon"
+                    fill={'#fff'}
+                  />,
+                  'Favourites'
+                )}
+              </div>
+            )}
+            {holdOption &&
+              ((bookingType !== 'Dine In' && OrderCardDetail?.length != 0) ||
+                (bookingType !== 'Dine In' &&
+                  Holddata?.length > 0 &&
+                  OrderCardDetail?.length == 0)) &&
+              isHoldEnable &&
+              renderWithTooltip(
+                <BSNavBarHand
+                  ComponentIcon={FaHandPaper}
+                  iconSize={50}
+                  iconClassName="FaTruckIconHold"
+                />,
+                'Hold'
+              )}
+            {ScanLayoutScreen?.SettingValue === 'Y' && <BSScanTemplate />}
+            <div
+              className="FaTruckIconDragItems"
+              style={{
+                pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
+              }}
+            >
+              <BSNavBarDragItems />
+            </div>
+            {FeatureAddonData?.FeatureDtls?.find(
+              (item) =>
+                item?.FeatureAddonName?.toLowerCase() === 'customer display'
+            ) && (
+              <TooltipWrapper title="Customer Display" isMobile={isMobile}>
+                <div
+                  onClick={openNewTab}
+                  className="BSBillingNavBar1-AllIcons"
+                  style={{ width: '1.3rem', margin: '10px', cursor: 'pointer' }}
+                >
+                  <CustomerDisplayicon />
+                </div>
+              </TooltipWrapper>
+            )}
+            <TooltipWrapper title="Reprint (Alt+R)" isMobile={isMobile}>
+              {reprintOption && (
+                <div
+                  style={{
+                    pointerEvents: orderType === 'Failed' ? 'none' : 'auto',
+                    color: '#6b7280',
+                  }}
+                >
+                  <div className="FaTruckIconreprint">
+                    <BSPrinterSetting IconComponent={RiPrinterFill} />
+                  </div>
+                </div>
+              )}
+            </TooltipWrapper>
+
+            {verifyproduct && (
+              <div style={{ color: 'green' }}>
+                <TooltipWrapper
+                  title={
+                    sportsAppPreference
+                      ? 'Booking Verification'
+                      : 'Verified Products'
+                  }
+                  isMobile={isMobile}
+                >
+                  <div>
+                    <VerfiedProducts />
+                  </div>
+                </TooltipWrapper>
+              </div>
+            )}
+          </div>
+          {isMobile && (
+            <div
+              style={{
+                color: '#6b7280',
+              }}
+            >
+              <BSMobilePrintSettings />
+            </div>
+          )}
+
+          <div className="userDates">
+            <div className="datesNewtimedate">
+              <CurrentDateDisplay />
+              <CurrentTimeDisplay />
+            </div>
+
+            <Tooltip title={isFullscreen ? 'Exit Full Screen' : 'Full Screen'}>
+              <div
+                className={
+                  isFullscreen
+                    ? 'BsNavbar3FullScreenExit'
+                    : 'BsNavbar3FullScreen'
+                }
+                onClick={handleFullscreen}
+              >
+                {isFullscreen ? <RiFullscreenExitFill /> : <RiFullscreenFill />}
+              </div>
+            </Tooltip>
+
+            <div className="BsNavbarUser">
+              <FaUserAlt size={18} onClick={handleUserAcc} />
+              <BSNavBarUserInfo
+                isOpen={isUserAccOpen}
+                divRef={userMenuRef}
+                CompBranchData={compBranchData}
+                BacktoLogin={handleBackToLogin}
+                userProfileData={userProfileData}
+                handleEditProfile={handleEditProfile}
+                UserRelieveManager={<UserRelieveManager />}
+                Logout={Logout}
+              />
+            </div>
+
+            {/* Mobile Toggle Button */}
+            <div className="mobile-toggle-btn" onClick={handleMobileMenuToggle}>
+              <CiMenuBurger size={20} color="#fff" />
+            </div>
+          </div>
+        </div>
+
+        {/* Mobile Menu */}
+        <div
+          className={`mobile-menu ${isMobileMenuOpen ? 'open' : ''}`}
+          ref={mobileMenuRef}
+        >
+          <div className="mobile-menu-content">
+            <div
+              className="mobile-toggle-btn"
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'flex-end',
+                width: '100%',
+                cursor: 'pointer',
+                padding: '2px 0',
+              }}
+              onClick={handleMobileMenuToggle}
+            >
+              {isMobileMenuOpen ? (
+                <IoCloseOutline size={25} strokeWidth={2} color="#fff" />
+              ) : (
+                <CiMenuBurger height={20} size={20} color="#fff" />
+              )}
+            </div>
+            <div className="mobile-customer-actions">
+              {takeAwayPreference && takeAwayOption && (
+                <div className="mobile-action-item" onClick={handleTakeAway}>
+                  <GiShoppingBag
+                    size={30}
+                    color={bookingType === 'TakeAway' ? '#52c41a' : '#6b7280'}
+                  />
+                  <div>Take Away</div>
+                </div>
+              )}
+              {dineInPreference && dineIn && dineInOption && (
+                <div className="mobile-action-item">
+                  <BSNavBarTable width="30" height="30" />
+                  <div>{bookingType}</div>
+                </div>
+              )}
+              {!sportsAppPreference && (
+                <div
+                  className="mobile-action-item"
+                  onClick={() =>
+                    setDrawerOpen((prev) => ({
+                      ...prev,
+                      favourite: !prev?.favourite,
+                    }))
+                  }
+                >
+                  <BSNavBarFavItems
+                    size={30}
+                    drawerOpen={drawerOpen?.favourite}
+                    fill={'#fff'}
+                  />
+                  <div>Favourite</div>
+                </div>
+              )}
+              {addCustomerOption && (
+                <div
+                  className="mobile-action-item"
+                  onClick={() =>
+                    setDrawerOpen((prev) => ({
+                      ...prev,
+                      customer: !prev?.customer,
+                    }))
+                  }
+                >
+                  <BSNavBarAddUser
+                    drawerOpen={drawerOpen?.customer}
+                    setDrawerOpen={setDrawerOpen}
+                  />
+                  <div>Add Customer</div>
+                </div>
+              )}
+              {quickAddOption && (
+                <div
+                  className="mobile-action-item"
+                  onClick={handleQuickAddOpen}
+                >
+                  {renderWithTooltip(<FaPlus size={30} />, 'Quick Add', 'top')}
+                  <div>Quick Add</div>
+                </div>
+              )}
+              {holdOption &&
+                ((bookingType !== 'Dine In' && OrderCardDetail?.length != 0) ||
+                  (bookingType !== 'Dine In' &&
+                    Holddata?.length > 0 &&
+                    isHoldEnable &&
+                    OrderCardDetail?.length == 0)) && (
+                  <div
+                    className="mobile-action-item"
+                    onClick={() =>
+                      setDrawerOpen((prev) => ({ ...prev, hold: !prev?.hold }))
+                    }
+                  >
+                    <BSNavBarHand
+                      ComponentIcon={FaHandPaper}
+                      iconSize={20}
+                      style={{ width: '15px' }}
+                      drawerOpen={drawerOpen}
+                      setDrawerOpen={setDrawerOpen}
+                    />
+                    <div>Hold</div>
+                  </div>
+                )}
+              {ScanLayoutScreen?.SettingValue === 'Y' && <BSScanTemplate />}
               <div
                 className="mobile-action-item"
                 onClick={(e) => {
                   if (e.target === e.currentTarget) {
                     setDrawerOpen((prev) => ({
                       ...prev,
-                      wholesale: !prev?.wholesale,
+                      dragItem: !prev?.dragItem,
                     }));
                   }
                 }}
               >
-                <BSNavBarWholeSale
+                <BSNavBarDragItems
                   drawerOpen={drawerOpen}
                   setDrawerOpen={setDrawerOpen}
                 />
                 <div
+                  onClick={(e) => {
+                    if (e.target === e.currentTarget) {
+                      setDrawerOpen((prev) => ({
+                        ...prev,
+                        dragItem: !prev?.dragItem,
+                      }));
+                    }
+                  }}
+                >
+                  Drag Item
+                </div>
+              </div>
+              {reprintOption && (
+                <div
+                  className="mobile-action-item"
+                  onClick={(e) => {
+                    if (e.target === e.currentTarget) {
+                      setDrawerOpen((prev) => ({
+                        ...prev,
+                        reprint: !prev?.reprint,
+                      }));
+                    }
+                  }}
+                >
+                  <BSPrinterSetting
+                    IconComponent={RiPrinterFill}
+                    drawerOpen={drawerOpen}
+                    setDrawerOpen={setDrawerOpen}
+                  />
+                  <div
+                    onClick={(e) => {
+                      if (e.target === e.currentTarget) {
+                        setDrawerOpen((prev) => ({
+                          ...prev,
+                          reprint: !prev?.reprint,
+                        }));
+                      }
+                    }}
+                  >
+                    Re-Print
+                  </div>
+                </div>
+              )}
+              {verifyproduct && (
+                <div
+                  className="mobile-action-item"
+                  onClick={(e) => {
+                    if (e.target === e.currentTarget) {
+                      setDrawerOpen((prev) => ({
+                        ...prev,
+                        verifyProduct: !prev?.verifyProduct,
+                      }));
+                    }
+                  }}
+                >
+                  <TooltipWrapper
+                    title={'Verfied Products'}
+                    isMobile={isMobile}
+                  >
+                    <div>
+                      <VerfiedProducts
+                        drawerOpen={drawerOpen}
+                        setDrawerOpen={setDrawerOpen}
+                      />
+                    </div>
+                  </TooltipWrapper>
+
+                  <div
+                    onClick={(e) => {
+                      if (e.target === e.currentTarget) {
+                        setDrawerOpen((prev) => ({
+                          ...prev,
+                          verifyProduct: !prev?.verifyProduct,
+                        }));
+                      }
+                    }}
+                  >
+                    Verify Product
+                  </div>
+                </div>
+              )}
+
+              {sportsAppPreference && (
+                <div
+                  className="mobile-action-item"
+                  onClick={(e) => {
+                    if (e.target === e.currentTarget) {
+                      setDrawerOpen((prev) => ({
+                        ...prev,
+                        membership: !prev?.membership,
+                      }));
+                    }
+                  }}
+                >
+                  <BSMembership
+                    drawerOpen={drawerOpen}
+                    setDrawerOpen={setDrawerOpen}
+                  />
+                  <div
+                    onClick={(e) => {
+                      if (e.target === e.currentTarget) {
+                        setDrawerOpen((prev) => ({
+                          ...prev,
+                          membership: !prev?.membership,
+                        }));
+                      }
+                    }}
+                  >
+                    Membership
+                  </div>
+                </div>
+              )}
+
+              {!OtherServicesglobal && (
+                <>
+                  {Estimation?.SettingValue === 'Y' &&
+                    bookingType !== 'Dine In' &&
+                    !BookingTypeBoth &&
+                    !OrderOfferStatus && (
+                      <div
+                        className="BSBillingNavBar2-AllIcons"
+                        style={{
+                          pointerEvents:
+                            orderType === 'Failed' ? 'none' : 'auto',
+                        }}
+                      >
+                        <div className="mobile-action-item" onClick={() => {}}>
+                          <BSNavBarEstimate />
+                          <div>Estimate</div>
+                        </div>
+                      </div>
+                    )}
+                </>
+              )}
+              {SalesMode?.SettingValue === 'Y' && !OtherServicesglobal && (
+                <div
+                  className="mobile-action-item"
                   onClick={(e) => {
                     if (e.target === e.currentTarget) {
                       setDrawerOpen((prev) => ({
@@ -1171,34 +1193,49 @@ const BSNavbar3 = ({ optionNames }) => {
                     }
                   }}
                 >
-                  WholeSale
+                  <BSNavBarWholeSale
+                    drawerOpen={drawerOpen}
+                    setDrawerOpen={setDrawerOpen}
+                  />
+                  <div
+                    onClick={(e) => {
+                      if (e.target === e.currentTarget) {
+                        setDrawerOpen((prev) => ({
+                          ...prev,
+                          wholesale: !prev?.wholesale,
+                        }));
+                      }
+                    }}
+                  >
+                    WholeSale
+                  </div>
                 </div>
-              </div>
-            )}
+              )}
+            </div>
           </div>
         </div>
-      </div>
 
-      <DefaultModal
-        open={multiple}
-        title="Multiple Search"
-        footer={false}
-        width={350}
-        handleCancel={() => setMultiple(false)}
-        destroyOnClose={true}
-        children={
-          <>
-            <MultipleSearch close={setMultiple} />
-          </>
-        }
-      />
-      {quickAdd && (
-        <FeaturesFunctionalities
-          handleQuickAddCancel={handleQuickAddClose}
-          QuickAdd={quickAdd}
+        <DefaultModal
+          open={multiple}
+          title="Multiple Search"
+          footer={false}
+          width={350}
+          handleCancel={() => setMultiple(false)}
+          destroyOnClose={true}
+          children={
+            <>
+              <MultipleSearch close={setMultiple} />
+            </>
+          }
         />
-      )}
-    </>
+        {quickAdd && (
+          <FeaturesFunctionalities
+            handleQuickAddCancel={handleQuickAddClose}
+            QuickAdd={quickAdd}
+          />
+        )}
+      </>
+    </Suspense>
   );
 };
 
diff --git a/src/Pages/BookingScreen/Components/BookingFunctionality/CreditCustSplitPayment.jsx b/src/Pages/BookingScreen/Components/BookingFunctionality/CreditCustSplitPayment.jsx
index 27aab6c..2244a10 100644
--- a/src/Pages/BookingScreen/Components/BookingFunctionality/CreditCustSplitPayment.jsx
+++ b/src/Pages/BookingScreen/Components/BookingFunctionality/CreditCustSplitPayment.jsx
@@ -1,4 +1,11 @@
-import { useEffect, useRef, useState, useCallback } from 'react';
+import {
+  useEffect,
+  useRef,
+  useState,
+  useCallback,
+  Suspense,
+  lazy,
+} from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import {
   getConfigType,
@@ -43,13 +50,17 @@ import {
   validateSafeInput,
 } from '../../../../Services/Others.js';
 import WpIcon from '../../../../Images/message.png';
-import QrinScreen from '../BookingFunctionality/DynamicScreenQr.jsx';
+const QrinScreen = lazy(
+  () => import('../BookingFunctionality/DynamicScreenQr.jsx')
+);
 import {
   getTemplateData,
   SelectedPrintTemplate,
 } from '../../../../Features/ThemeChange/ThemeChange.js';
 import '../../../../Styles/BookingScreen/Components/BookingFunctionality/SplitPayment.scss';
-import FeaturesFunctionalities from './FeaturesFunctionalities.jsx';
+const FeaturesFunctionalities = lazy(
+  () => import('./FeaturesFunctionalities.jsx')
+);
 import numberToWords from 'number-to-words';
 import { getCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
 import { getConfigTypeData } from '../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
@@ -93,7 +104,7 @@ const CreditCustSplitPayment = (props) => {
   const [UpiPayOption, setUpiPayOption] = useState([]);
   const [CardPayOption, setCardPayOption] = useState([]);
   const GlobaluseOptions = useSelector(GlobalCommonPaymentOptions);
-  const RetailWSSalesType= useSelector(GlobalRetailWSSalesType, shallowEqual);
+  const RetailWSSalesType = useSelector(GlobalRetailWSSalesType, shallowEqual);
   const [useOptions, setuseOptions] = useState([]);
   const BookingType = useSelector(GlobalBookingType);
   const BookingTypeBoth = useSelector(GlobalBookingTypeBoth);
@@ -730,7 +741,7 @@ const CreditCustSplitPayment = (props) => {
       (item) => item?.ConfigName?.toLowerCase() == 'DEP'.toLowerCase()
     );
     let postData = {
-      SalesMode:RetailWSSalesType || 'R',
+      SalesMode: RetailWSSalesType || 'R',
       CompId: CompId,
       BranchId: BranchId,
       Type: obId?.[0]?.ConfigId,
@@ -1241,139 +1252,141 @@ const CreditCustSplitPayment = (props) => {
     : 'Debit amount not available';
 
   return (
-    <>
-      <Messages messageType={messageType} messageData={messageData} />
-      <div className="splitmodal">
-        <DefaultModal
-          open={Splitpayment}
-          title="Split Payment"
-          handleCancel={() => {
-            SplitSelPayMode[`PaymentStatus-0`] !== 'S' && HandleModalClose();
-          }}
-          footer={false}
-          width={1000}
-          children={
-            <div>
-              <p>Total Amount:{TotalAmount}</p>
+    <Suspense fallback={<div>Loading features...</div>}>
+      <>
+        <Messages messageType={messageType} messageData={messageData} />
+        <div className="splitmodal">
+          <DefaultModal
+            open={Splitpayment}
+            title="Split Payment"
+            handleCancel={() => {
+              SplitSelPayMode[`PaymentStatus-0`] !== 'S' && HandleModalClose();
+            }}
+            footer={false}
+            width={1000}
+            children={
+              <div>
+                <p>Total Amount:{TotalAmount}</p>
 
-              <>{calculateField()}</>
-              {TotalAmount > TotalSplitAmount &&
-                SplitSelPayMode[`PaymentStatus-${count}`] === 'S' && (
-                  <Form.Item>
-                    <div
-                      style={{
-                        display: 'flex',
-                        justifyContent: 'flex-end',
-                      }}
-                    >
-                      <PlusOutlined
+                <>{calculateField()}</>
+                {TotalAmount > TotalSplitAmount &&
+                  SplitSelPayMode[`PaymentStatus-${count}`] === 'S' && (
+                    <Form.Item>
+                      <div
                         style={{
-                          backgroundColor: '#37943C',
-                          color: 'white',
-                          borderRadius: '50px',
-                          padding: '5px',
+                          display: 'flex',
+                          justifyContent: 'flex-end',
                         }}
-                        onClick={() => setCount(count + 1)}
-                      />
-                    </div>
-                  </Form.Item>
-                )}
-            </div>
-          }
-        />
-      </div>
-      {TotalAmount == 0 && Success && (
-        <div>
-          <QrComponent com={`WelcomeScreen**${branchName}`} />
+                      >
+                        <PlusOutlined
+                          style={{
+                            backgroundColor: '#37943C',
+                            color: 'white',
+                            borderRadius: '50px',
+                            padding: '5px',
+                          }}
+                          onClick={() => setCount(count + 1)}
+                        />
+                      </div>
+                    </Form.Item>
+                  )}
+              </div>
+            }
+          />
         </div>
-      )}
-      {TotalAmount > 0 &&
-        qrCode &&
-        PaymentUpiOptions?.length > 0 &&
-        SelUpiId && (
+        {TotalAmount == 0 && Success && (
           <div>
-            <QrComponent
-              com={`DisplayQRCodeScreen**upi://pay?pa=${SelUpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${SelUpiId}`}
-            />
+            <QrComponent com={`WelcomeScreen**${branchName}`} />
           </div>
         )}
-      {UpiOpen && (
-        <DefaultModal
-          open={UpiOpen}
-          title="UPI PAYMENT"
-          width={500}
-          handleCancel={() => {
-            Upimodel('Cancel');
-          }}
-          footer={false}
-          children={
-            <div style={{ overflow: 'scroll' }}>
-              <div
-                style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  justifyContent: 'space-evenly',
-                  alignItems: 'center',
-                }}
-              >
-                <div>
-                  <QrinScreen Amount={CurrentPayAmount} UpiId={SelUpiId} />
-                </div>
-
-                <div>
-                  <h1> RS :{CurrentPayAmount} </h1>
-                </div>
-              </div>
-
-              <div className="sentok">
-                {(selOption || SelCustId) && (
-                  <div className="sentLink" onClick={onFinalSubmit}>
-                    Sent Payment Link
-                    <img
-                      src={WpIcon}
-                      alt="Your Alt Text"
-                      style={{ width: '30px', height: '30px' }}
-                    />
-                  </div>
-                )}
-
+        {TotalAmount > 0 &&
+          qrCode &&
+          PaymentUpiOptions?.length > 0 &&
+          SelUpiId && (
+            <div>
+              <QrComponent
+                com={`DisplayQRCodeScreen**upi://pay?pa=${SelUpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${SelUpiId}`}
+              />
+            </div>
+          )}
+        {UpiOpen && (
+          <DefaultModal
+            open={UpiOpen}
+            title="UPI PAYMENT"
+            width={500}
+            handleCancel={() => {
+              Upimodel('Cancel');
+            }}
+            footer={false}
+            children={
+              <div style={{ overflow: 'scroll' }}>
                 <div
                   style={{
                     display: 'flex',
-                    flexDirection: 'row-reverse',
-                    width: '100px',
+                    flexDirection: 'column',
+                    justifyContent: 'space-evenly',
+                    alignItems: 'center',
                   }}
                 >
-                  <Buttons
-                    buttonText="OK"
-                    color="901D77"
-                    icon={<ArrowRightOutlined />}
-                    handleSubmit={() => {
-                      Upimodel('Submit');
+                  <div>
+                    <QrinScreen Amount={CurrentPayAmount} UpiId={SelUpiId} />
+                  </div>
+
+                  <div>
+                    <h1> RS :{CurrentPayAmount} </h1>
+                  </div>
+                </div>
+
+                <div className="sentok">
+                  {(selOption || SelCustId) && (
+                    <div className="sentLink" onClick={onFinalSubmit}>
+                      Sent Payment Link
+                      <img
+                        src={WpIcon}
+                        alt="Your Alt Text"
+                        style={{ width: '30px', height: '30px' }}
+                      />
+                    </div>
+                  )}
+
+                  <div
+                    style={{
+                      display: 'flex',
+                      flexDirection: 'row-reverse',
+                      width: '100px',
                     }}
-                  />
+                  >
+                    <Buttons
+                      buttonText="OK"
+                      color="901D77"
+                      icon={<ArrowRightOutlined />}
+                      handleSubmit={() => {
+                        Upimodel('Submit');
+                      }}
+                    />
+                  </div>
                 </div>
               </div>
-            </div>
-          }
-        />
-      )}
-      {addcustomer && (
-        <FeaturesFunctionalities
-          handleAddCustomerCancel={handleAddCustomerCancel}
-          addcustomer={addcustomer}
-        />
-      )}
-      {Object.keys(PrintDatas).length > 0 && (
-        <div id="Credit-customer1" style={{ display: 'none' }}>
-          <BSCreditCustomerPrint
-            words={words}
-            PrintDatas={PrintDatas}
-            url={qrData}
+            }
           />
-        </div>
-      )}
-    </>
+        )}
+        {addcustomer && (
+          <FeaturesFunctionalities
+            handleAddCustomerCancel={handleAddCustomerCancel}
+            addcustomer={addcustomer}
+          />
+        )}
+        {Object.keys(PrintDatas).length > 0 && (
+          <div id="Credit-customer1" style={{ display: 'none' }}>
+            <BSCreditCustomerPrint
+              words={words}
+              PrintDatas={PrintDatas}
+              url={qrData}
+            />
+          </div>
+        )}
+      </>
+    </Suspense>
   );
 };
 export default CreditCustSplitPayment;
diff --git a/src/Pages/BookingScreen/Components/BookingFunctionality/FeaturesFunctionalities.jsx b/src/Pages/BookingScreen/Components/BookingFunctionality/FeaturesFunctionalities.jsx
index 4a7f74b..4d17dfc 100644
--- a/src/Pages/BookingScreen/Components/BookingFunctionality/FeaturesFunctionalities.jsx
+++ b/src/Pages/BookingScreen/Components/BookingFunctionality/FeaturesFunctionalities.jsx
@@ -4,6 +4,7 @@ import React, {
   useEffect,
   useCallback,
   useContext,
+  lazy,
 } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import {
@@ -16,7 +17,6 @@ import {
   Checkbox,
   AutoComplete,
   Switch,
-  Tooltip,
   Popconfirm,
   Tabs,
 } from 'antd';
@@ -58,7 +58,6 @@ import {
   ChangeOverAllDiscSales,
   PreferenceData,
   ChangeComboCarddata,
-  getPreferenceData,
   getCustomerForHold,
   PostBlockSlots,
 } from '../../../../Features/BookingScreen/BookingData/BookingData';
@@ -68,7 +67,6 @@ import { ArrowRightOutlined, CloseSquareFilled } from '@ant-design/icons';
 import { InputField } from '../../../../Components/Forms/InputField';
 import { Messages } from '../../../../Components/Notifications/Messages';
 import Buttons from '../../../../Components/Forms/Buttons';
-import ProductForm from '../../../../Pages/BookingScreen/Forms/QuickAdd/QuickAdd.jsx';
 import {
   GlobalAddCustomerDetails,
   getAddCustomerDetails,
@@ -86,7 +84,6 @@ import {
   ChangeTotalAmount,
   globalExtraTotalAmount,
 } from '../../../../Features/ExteraCharges/ExtraCharges.js';
-import WeightScaleComp from '../../../../Components/WeightScale/weightScale.jsx';
 import {
   gettinghold,
   puttinghold,
@@ -98,7 +95,6 @@ import {
   getProductsearch,
 } from '../../../../Features/BookingScreen/BookingData/BookingData';
 import { AiOutlineDownCircle, AiOutlineUpCircle } from 'react-icons/ai';
-import '../../../../Styles/BookingScreen/Components/BookingFunctionality/FeaturesFunctionalities.scss';
 import {
   IoCloseSharp,
   IoPersonAddSharp,
@@ -111,7 +107,6 @@ import {
   GlobalPreOrderList,
   GlobalpreOrderOpen,
 } from '../../../../Features/BookingScreen/PreOrder/PreOrder.js';
-import Imageupload from '../../../../Components/Forms/Upload.jsx';
 import { useApplyOfferto_CardDetail } from '../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import { getCombolist } from '../../../../Features/ComboMaster/ComboMaster.js';
 import {
@@ -122,12 +117,24 @@ import {
 import { v4 as uuidv4 } from 'uuid';
 import { ApplicationPreferences } from '../../../../Features/BrachLogin/BranchLogin.js';
 import { useDateStore } from '../../../../Features/BookingScreen/BookingData/DateStore.js';
-import { FaEdit, FaMapMarkedAlt, FaTrash } from 'react-icons/fa';
+import { FaEdit, FaTrash } from 'react-icons/fa';
 import { MdHome, MdLocationOn } from 'react-icons/md';
 import { RadioGrpButton } from '../../../../Components/Forms/RadioGroup.jsx';
+// jsx Files
+const ProductForm = lazy(
+  () => import('../../../../Pages/BookingScreen/Forms/QuickAdd/QuickAdd.jsx')
+);
+const WeightScaleComp = lazy(
+  () => import('../../../../Components/WeightScale/weightScale.jsx')
+);
+const Imageupload = lazy(
+  () => import('../../../../Components/Forms/Upload.jsx')
+);
+// Scss
+import '../../../../Styles/BookingScreen/Components/BookingFunctionality/FeaturesFunctionalities.scss';
 
 const FeaturesFunctionalities = (props) => {
-  const { closeModal = () => { } } = props;
+  const { closeModal = () => {} } = props;
   const applyOffer = useApplyOfferto_CardDetail();
   const EditableContext = React.createContext(null);
   const EditableContext1 = React.createContext(null);
@@ -141,7 +148,6 @@ const FeaturesFunctionalities = (props) => {
   const formRefExtraCharges = useRef();
   const ExtraChargesType = useSelector(globalExtraChargesType);
   const GlobalExtraCharge = useSelector(globalExtraTotalAmount);
-  console.log(GlobalExtraCharge, "GlobalExtraCharge")
   const ReorderHoldDetails = useSelector(GlobalReorderHoldDetails);
   const BookingType = useSelector(GlobalBookingType);
   const BookingTypeBoth = useSelector(GlobalBookingTypeBoth);
@@ -370,30 +376,30 @@ const FeaturesFunctionalities = (props) => {
 
   const options = suggestions
     ? suggestions
-      ?.filter((item) =>
-        selectedSearchValue === 'CustName' ? item.CustName !== null : item
-      )
-      .map((item) => ({
-        value: item?.CustMobile,
-        label:
-          selectedSearchValue === 'CustMobile'
-            ? `${item?.CustMobile} - ${item?.CustName ? item?.CustName : ''} ${item?.CustName ? ' - ' : ''} ${'Id:' + item?.CustId?.match(/-(\d+)$/)?.[1]}`
-            : selectedSearchValue === 'CustId'
-              ? `${'Id:' + item?.CustId?.match(/-(\d+)$/)?.[1]}${item?.CustName ? ' - ' : ''} ${item?.CustName ? item?.CustName : ''} - ${item?.CustMobile}`
-              : selectedSearchValue === 'CustName' &&
-              item?.CustName !== null &&
-              `${item?.CustName ? item?.CustName : ''} ${item?.CustName ? ' - ' : ''} ${item?.CustMobile} - ${'Id:' + item?.CustId?.match(/-(\d+)$/)?.[1]}`,
-        CustMobile: item?.CustMobile,
-        CustId: item?.CustId?.match(/-(\d+)$/)?.[1],
-        CustName: item?.CustName,
-      }))
+        ?.filter((item) =>
+          selectedSearchValue === 'CustName' ? item.CustName !== null : item
+        )
+        .map((item) => ({
+          value: item?.CustMobile,
+          label:
+            selectedSearchValue === 'CustMobile'
+              ? `${item?.CustMobile} - ${item?.CustName ? item?.CustName : ''} ${item?.CustName ? ' - ' : ''} ${'Id:' + item?.CustId?.match(/-(\d+)$/)?.[1]}`
+              : selectedSearchValue === 'CustId'
+                ? `${'Id:' + item?.CustId?.match(/-(\d+)$/)?.[1]}${item?.CustName ? ' - ' : ''} ${item?.CustName ? item?.CustName : ''} - ${item?.CustMobile}`
+                : selectedSearchValue === 'CustName' &&
+                  item?.CustName !== null &&
+                  `${item?.CustName ? item?.CustName : ''} ${item?.CustName ? ' - ' : ''} ${item?.CustMobile} - ${'Id:' + item?.CustId?.match(/-(\d+)$/)?.[1]}`,
+          CustMobile: item?.CustMobile,
+          CustId: item?.CustId?.match(/-(\d+)$/)?.[1],
+          CustName: item?.CustName,
+        }))
     : GlobalAddCustomerDetails1?.map((item) => ({
-      value: item.CustMobile,
-      label: `${item?.CustName} ${item?.CustMobile}`,
-      CustMobile: item?.CustMobile,
-      CustId: item?.CustId,
-      CustName: item?.CustName,
-    }));
+        value: item.CustMobile,
+        label: `${item?.CustName} ${item?.CustMobile}`,
+        CustMobile: item?.CustMobile,
+        CustId: item?.CustId,
+        CustName: item?.CustName,
+      }));
   const handleYesOrNoChange = (value) => {
     setSelectedValue(value);
     formRef.current?.setFieldsValue({ OfferActiveStatus: value });
@@ -456,34 +462,34 @@ const FeaturesFunctionalities = (props) => {
     },
     ...(sportsAppPreference
       ? [
-        {
-          title: 'Subcategory',
-          key: 'productDetails',
-          dataIndex: 'productDetails',
-          align: 'center',
-          width: '150px',
-          onCell: (record) => {
-            const productDetails = record?.productDetails;
-            const Combodtl =
-              record?.productDetails?.[0]?.comboDtl?.[0]
-                ?.ComboInwardDetails?.[0]?.ComboDetails;
+          {
+            title: 'Subcategory',
+            key: 'productDetails',
+            dataIndex: 'productDetails',
+            align: 'center',
+            width: '150px',
+            onCell: (record) => {
+              const productDetails = record?.productDetails;
+              const Combodtl =
+                record?.productDetails?.[0]?.comboDtl?.[0]
+                  ?.ComboInwardDetails?.[0]?.ComboDetails;
 
-            return {
-              onClick: () => {
-                HoldPutfun(productDetails, record, Combodtl);
-              },
-            };
+              return {
+                onClick: () => {
+                  HoldPutfun(productDetails, record, Combodtl);
+                },
+              };
+            },
+            render: (productDetails, record) => (
+              <a
+                style={{ color: 'black' }}
+                onClick={() => HoldPutfun(productDetails, record)}
+              >
+                {record?.productDetails?.[0]?.ProdSubCatName}
+              </a>
+            ),
           },
-          render: (productDetails, record) => (
-            <a
-              style={{ color: 'black' }}
-              onClick={() => HoldPutfun(productDetails, record)}
-            >
-              {record?.productDetails?.[0]?.ProdSubCatName}
-            </a>
-          ),
-        },
-      ]
+        ]
       : []),
     {
       title: 'Orders',
@@ -581,13 +587,7 @@ const FeaturesFunctionalities = (props) => {
   ];
   useEffect(() => {
     setWeightScale(props.WeightScale);
-  }, [props.WeightScale]);
-  // useEffect(() => {
-  //   if (!props.addcustomer) {
-  //     formRef.current?.resetFields();
-  //     setZipCodeData(false);
-  //   }
-  // }, [props.addcustomer]);
+  }, [props.WeightScale]); 
   const ExtTabledata = async () => {
     const data = {
       CompId: CompId,
@@ -761,7 +761,7 @@ const FeaturesFunctionalities = (props) => {
         TaxAmt: formatAmount(
           ((record.Price * record.TaxPercentage) /
             (100 + record.TaxPercentage)) *
-          record.QTY
+            record.QTY
         ),
         TaxId: record.TaxId,
         TaxPercentage: record.TaxPercentage,
@@ -788,11 +788,11 @@ const FeaturesFunctionalities = (props) => {
       const isDuplicate = TableName?.some(
         (item) =>
           item.InwardDtlId +
-          ' ' +
-          item.BookingTypeName +
-          ' ' +
-          item.SinglePc ===
-          selectedProduct && item.UniqueId === record.UniqueId
+            ' ' +
+            item.BookingTypeName +
+            ' ' +
+            item.SinglePc ===
+            selectedProduct && item.UniqueId === record.UniqueId
       );
 
       if (!isDuplicate) {
@@ -810,7 +810,7 @@ const FeaturesFunctionalities = (props) => {
           TaxAmt: formatAmount(
             ((record.Price * record.TaxPercentage) /
               (100 + record.TaxPercentage)) *
-            record.QTY
+              record.QTY
           ),
           TaxId: record?.TaxId,
           TaxPercentage: record.TaxPercentage,
@@ -1057,7 +1057,7 @@ const FeaturesFunctionalities = (props) => {
           ...record,
           ...values,
         });
-      } catch (errInfo) { }
+      } catch (errInfo) {}
     };
 
     let childNode = children;
@@ -1109,7 +1109,7 @@ const FeaturesFunctionalities = (props) => {
     return (
       record.Price * record.QTY -
       ((record.Price * record.TaxPercentage) / (100 + record.TaxPercentage)) *
-      record.QTY
+        record.QTY
     );
   };
   const WithTaxAmountTaxAmount = (record) => {
@@ -1182,10 +1182,10 @@ const FeaturesFunctionalities = (props) => {
             onClick={() => addeddata(record)}
             disabled={
               Object.keys(ReorderHoldDetails).length !== 0 &&
-                BookingType === 'Dine In' &&
-                GlobalExtraCharge.some(
-                  (item) => item.ExtraChargeId === record.UniqueId
-                )
+              BookingType === 'Dine In' &&
+              GlobalExtraCharge.some(
+                (item) => item.ExtraChargeId === record.UniqueId
+              )
                 ? true
                 : false
             }
@@ -1194,11 +1194,6 @@ const FeaturesFunctionalities = (props) => {
       ),
     },
   ];
-
-  console.log(ReorderHoldDetails,
-    BookingType,
-    GlobalExtraCharge, "GlobalExtraCharge");
-
   const defaultColumns1 = [
     {
       title: 'ExtraCharge Type',
@@ -1286,7 +1281,7 @@ const FeaturesFunctionalities = (props) => {
         QTY: parseInt(row.QTY),
         TaxAmt: formatAmount(
           ((row.Price * row.TaxPercentage) / (100 + row.TaxPercentage)) *
-          row.QTY
+            row.QTY
         ),
         TotalAmt: row.Price * row.QTY,
         // ((row.Price * row.TaxPercentage) / (100 + row.TaxPercentage) *row.QTY ).toFixed(2),
@@ -1435,12 +1430,12 @@ const FeaturesFunctionalities = (props) => {
         <Space size="middle">
           <a>
             {Object.keys(ReorderHoldDetails).length !== 0 &&
-              BookingType === 'Dine In' &&
-              GlobalExtraCharge?.some(
-                (item) =>
-                  item.ExtraChargeId === record.UniqueId &&
-                  item.InwardDtlId === record.InwardDtlId
-              ) ? (
+            BookingType === 'Dine In' &&
+            GlobalExtraCharge?.some(
+              (item) =>
+                item.ExtraChargeId === record.UniqueId &&
+                item.InwardDtlId === record.InwardDtlId
+            ) ? (
               <DeleteFilled
                 style={{
                   color: '#FF4D4F',
@@ -1710,7 +1705,7 @@ const FeaturesFunctionalities = (props) => {
       dispatch(
         changeCustomerID(
           response?.data?.CustomerDetails?.[
-          response?.data?.CustomerDetails.length - 1
+            response?.data?.CustomerDetails.length - 1
           ]
         )
       );
@@ -2194,9 +2189,9 @@ const FeaturesFunctionalities = (props) => {
       AppId: AppId,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
     await dispatch(getSelectedFavItems(data)).unwrap();
@@ -2208,9 +2203,9 @@ const FeaturesFunctionalities = (props) => {
       ProdSubCat: ProdSubCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -2221,9 +2216,9 @@ const FeaturesFunctionalities = (props) => {
       prodCat: prodCat,
       ...(AvailableDate && selectedDate
         ? {
-          fromDate: selectedDate?.[0],
-          toDate: selectedDate?.[1],
-        }
+            fromDate: selectedDate?.[0],
+            toDate: selectedDate?.[1],
+          }
         : {}),
     };
 
@@ -2596,7 +2591,7 @@ const FeaturesFunctionalities = (props) => {
                   e?.stopPropagation();
                   removeAll();
                 }}
-              // onClick={() => statusFormatter(record,index)}
+                // onClick={() => statusFormatter(record,index)}
               >
                 Clear All
               </Button>
@@ -2723,7 +2718,7 @@ const FeaturesFunctionalities = (props) => {
                               : selectedSearchValue == 'CustName'
                                 ? 'Please Enter Valid Name'
                                 : selectedSearchValue == 'CustId' &&
-                                'Please EnterCustomer Id',
+                                  'Please EnterCustomer Id',
                         },
                       ]}
                     >
@@ -2812,7 +2807,7 @@ const FeaturesFunctionalities = (props) => {
                                   : selectedSearchValue == 'CustName'
                                     ? 'Enter Name'
                                     : selectedSearchValue == 'CustId' &&
-                                    'Enter Customer Id'
+                                      'Enter Customer Id'
                                 : ' Mobile Number'}
                             </label>
                           }
@@ -2994,7 +2989,7 @@ const FeaturesFunctionalities = (props) => {
                           autocomplete="off"
                           isOnChange={
                             formRef.current?.getFieldsValue()?.CustName ||
-                              inputValue
+                            inputValue
                               ? true
                               : false
                           }
@@ -3060,9 +3055,9 @@ const FeaturesFunctionalities = (props) => {
                         <p>Upload Profile</p>
                         <Form.Item
                           name="CustomerProfile"
-                        // getValueFromEvent={(e) =>
-                        //   formType === 'edit' ? editstate?.EmpPhotoLink : e
-                        // }
+                          // getValueFromEvent={(e) =>
+                          //   formType === 'edit' ? editstate?.EmpPhotoLink : e
+                          // }
                         >
                           <Imageupload
                             singleImage={true}
@@ -3316,7 +3311,9 @@ const FeaturesFunctionalities = (props) => {
                                       <Popconfirm
                                         title="Remove Address"
                                         description="Are you sure you want to remove this address?"
-                                        onConfirm={() => handleRemoveAddress(idx)}
+                                        onConfirm={() =>
+                                          handleRemoveAddress(idx)
+                                        }
                                         okText="Yes, Remove"
                                         cancelText="Cancel"
                                         okType="danger"
@@ -3492,7 +3489,7 @@ const FeaturesFunctionalities = (props) => {
 
                                   <Form.Item
                                     name="State"
-                                  // rules={[{ required: true }]}
+                                    // rules={[{ required: true }]}
                                   >
                                     <InputField
                                       field="State"
@@ -3535,13 +3532,13 @@ const FeaturesFunctionalities = (props) => {
                           style={
                             offerType == 'P'
                               ? {
-                                opacity: '1',
-                                boxShadow:
-                                  'rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px',
-                                margin: '3px',
-                                padding: '5px',
-                                backgroundColor: '#fff',
-                              }
+                                  opacity: '1',
+                                  boxShadow:
+                                    'rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px',
+                                  margin: '3px',
+                                  padding: '5px',
+                                  backgroundColor: '#fff',
+                                }
                               : { opacity: '0.6', boxShadow: 'none' }
                           }
                           onClick={() => {
@@ -3557,13 +3554,13 @@ const FeaturesFunctionalities = (props) => {
                           style={
                             offerType == 'F'
                               ? {
-                                opacity: '1',
-                                boxShadow:
-                                  'rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px',
-                                margin: '3px',
-                                padding: '5px',
-                                backgroundColor: '#fff',
-                              }
+                                  opacity: '1',
+                                  boxShadow:
+                                    'rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px',
+                                  margin: '3px',
+                                  padding: '5px',
+                                  backgroundColor: '#fff',
+                                }
                               : { opacity: '0.6', boxShadow: 'none' }
                           }
                           onClick={() => {
@@ -3660,7 +3657,7 @@ const FeaturesFunctionalities = (props) => {
                           }
                           isOnChange={
                             formRef.current?.getFieldsValue()?.CustEmail ||
-                              inputValue
+                            inputValue
                               ? true
                               : false
                           }
@@ -3688,7 +3685,7 @@ const FeaturesFunctionalities = (props) => {
                           autocomplete="off"
                           isOnChange={
                             formRef.current?.getFieldsValue()?.CreditLimit ||
-                              inputValue
+                            inputValue
                               ? true
                               : false
                           }
@@ -3921,7 +3918,7 @@ const FeaturesFunctionalities = (props) => {
                 onChange={setActiveTab}
                 items={[
                   { key: 'quickAdd', label: 'Quick Add' },
-                  { key: 'directSale', label: 'Direct Sale' }
+                  { key: 'directSale', label: 'Direct Sale' },
                 ]}
               />
               <ProductForm
@@ -4045,7 +4042,7 @@ const FeaturesFunctionalities = (props) => {
                           buttonText="SAVE"
                           color="901D77"
                           icon={<ArrowRightOutlined />}
-                        //  handleSubmit={() => { globalamount1() }}
+                          //  handleSubmit={() => { globalamount1() }}
                         />
                       </div>
                     </div>
@@ -4059,7 +4056,7 @@ const FeaturesFunctionalities = (props) => {
                         bordered
                         dataSource={TableName}
                         width={'120px'}
-                      //pagination={column2?.length < "11" ? false : true}
+                        //pagination={column2?.length < "11" ? false : true}
                       ></Table>
                     </div>
                   )}
diff --git a/src/Pages/BookingScreen/Components/BookingFunctionality/SplitPayment.jsx b/src/Pages/BookingScreen/Components/BookingFunctionality/SplitPayment.jsx
index a99cd9a..7ce5902 100644
--- a/src/Pages/BookingScreen/Components/BookingFunctionality/SplitPayment.jsx
+++ b/src/Pages/BookingScreen/Components/BookingFunctionality/SplitPayment.jsx
@@ -1,6 +1,28 @@
-import { useEffect, useRef, useState, useCallback } from 'react';
+import {
+  useEffect,
+  useRef,
+  useState,
+  useCallback,
+  lazy,
+  Suspense,
+} from 'react';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import moment from 'moment';
+import { Form, Radio } from 'antd';
+import {
+  ArrowRightOutlined,
+  CheckCircleOutlined,
+  CloseCircleOutlined,
+  PlusOutlined,
+} from '@ant-design/icons';
+import { InputField } from '../../../../Components/Forms/InputField';
+import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
+import { DropDowns } from '../../../../Components/Forms/DropDown.jsx';
+import Buttons from '../../../../Components/Forms/Buttons';
+import { Messages } from '../../../../Components/Notifications/Messages';
+import { isMobile } from 'react-device-detect';
+
+// Js files
 import {
   getConfigType,
   GlobalCommonPaymentOptions,
@@ -58,54 +80,61 @@ import {
   putSalesBillEdit,
   changeBillEditingMode,
   changePreviousOrderPayment,
-  changePreviousOrderOfferDetail
+  changePreviousOrderOfferDetail,
+  GlobalAllBookingType,
 } from '../../../../Features/BookingScreen/BookingData/BookingData';
-import { Form, Radio } from 'antd';
-import {
-  ArrowRightOutlined,
-  CheckCircleOutlined,
-  CloseCircleOutlined,
-  PlusOutlined,
-} from '@ant-design/icons';
-import { InputField } from '../../../../Components/Forms/InputField';
-import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
-import { DropDowns } from '../../../../Components/Forms/DropDown.jsx';
-import Buttons from '../../../../Components/Forms/Buttons';
-import QrComponent from '../BookingFunctionality/DynamicQr.jsx';
-import { Messages } from '../../../../Components/Notifications/Messages';
 import {
   extractLastNumberOrderId,
   getSession,
   printDiv,
   validateSafeInput,
 } from '../../../../Services/Others.js';
-import WpIcon from '../../../../Images/message.png';
 import {
   ChangeTotalAmount,
   globalExtraTotalAmount,
 } from '../../../../Features/ExteraCharges/ExtraCharges.js';
-import QrinScreen from '../BookingFunctionality/DynamicScreenQr.jsx';
-import PaymentPdfBooking from '../../../paymentpdfPage/PaymentPdfBooking.jsx';
-import { isMobile } from 'react-device-detect';
 import { PrintStyleFunction } from '../../../paymentpdfPage/PrintStyleFunction.js';
 import {
   getTemplateData,
   GlobalprintDatas,
   SelectedPrintTemplate,
 } from '../../../../Features/ThemeChange/ThemeChange.js';
-import '../../../../Styles/BookingScreen/Components/BookingFunctionality/SplitPayment.scss';
-import BsBillingCreditCustomer from '../BookingFunctionality/BSBillingCreditCustomer.jsx';
-import MobilePrint from '../BookingFunctionality/MobilePrint.jsx';
-import FeaturesFunctionalities from './FeaturesFunctionalities.jsx';
-import TokensinglePrint from '../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx';
-import TokenOnlyMobilePrint from './TokenOnlyMobilePrint.jsx';
-import AllProductTokenMobilePrint from './AllProductTokenMobilePrint.jsx';
 import { getCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
 import { gettinghold } from '../../../../Features/BookingScreen/HoldOption/HoldOption.js';
 import { Global_OrderOfferDetail } from '../../../../Features/Offer/Offer.js';
-import { useApplyOfferto_CardDetail } from '../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
 import { ApplicationPreferences } from '../../../../Features/BrachLogin/BranchLogin.js';
-import { ChangeFullFreeProductList, changeFullOfferAppliedProducts, GlobalOfferAppliedProducts } from '../../../../Features/Offer/Offernew/BookingOffernew.js';
+import {
+  ChangeFullFreeProductList,
+  changeFullOfferAppliedProducts,
+  GlobalOfferAppliedProducts,
+} from '../../../../Features/Offer/Offernew/BookingOffernew.js';
+
+// jsx
+const QrinScreen = lazy(
+  () => import('../BookingFunctionality/DynamicScreenQr.jsx')
+);
+const MobilePrint = lazy(
+  () => import('../BookingFunctionality/MobilePrint.jsx')
+);
+const FeaturesFunctionalities = lazy(
+  () => import('./FeaturesFunctionalities.jsx')
+);
+const PaymentPdfBooking = lazy(
+  () => import('../../../paymentpdfPage/PaymentPdfBooking.jsx')
+);
+const BsBillingCreditCustomer = lazy(
+  () => import('../BookingFunctionality/BSBillingCreditCustomer.jsx')
+);
+const TokensinglePrint = lazy(
+  () => import('../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx')
+);
+const QrComponent = lazy(() => import('../BookingFunctionality/DynamicQr.jsx'));
+
+import { useApplyOfferto_CardDetail } from '../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
+
+//  Style and Icon
+import '../../../../Styles/BookingScreen/Components/BookingFunctionality/SplitPayment.scss';
+import WpIcon from '../../../../Images/message.png';
 
 const subDirectory = import.meta.env.BASE_URL;
 const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
@@ -119,12 +148,13 @@ const SplitPayment = (props) => {
   const AppId = getSession('AppId');
   const UserId = getSession('UserId');
   const appPreferences = useSelector(ApplicationPreferences);
+  const AllBookingType = useSelector(GlobalAllBookingType);
 
   const applyOffer = useApplyOfferto_CardDetail();
   const globalTipAmount = useSelector(GlobaltipAmount);
-  const TotalNetAmount = (props.hasOwnProperty('TotalNetAmount')
+  const TotalNetAmount = props.hasOwnProperty('TotalNetAmount')
     ? props['TotalNetAmount']
-    : null);
+    : null;
   const TableOrderId = props.hasOwnProperty('TableBookingOrderId')
     ? props['TableBookingOrderId']
     : null;
@@ -138,10 +168,16 @@ const SplitPayment = (props) => {
   const SelCustId = useSelector(GlobalSelCustId);
   const salesBillEdit = useSelector(GlobalSalesBillEdit);
   const previousOrderPayment = useSelector(GlobalPreviousOrderPayment);
-  const previousOrderOfferDetails = useSelector(GlobalPreviousOrderOfferDetails);
+  const previousOrderOfferDetails = useSelector(
+    GlobalPreviousOrderOfferDetails
+  );
   const filteredPayments =
     previousOrderPayment?.filter(
-      p => p?.LastOrderTran === 'Y' && p?.AfterAdjustment != null && p?.AfterAdjustment !== '' && p?.AfterAdjustment
+      (p) =>
+        p?.LastOrderTran === 'Y' &&
+        p?.AfterAdjustment != null &&
+        p?.AfterAdjustment !== '' &&
+        p?.AfterAdjustment
     ) || [];
   const paymentsToUse =
     filteredPayments.length > 0 ? filteredPayments : previousOrderPayment || [];
@@ -150,7 +186,8 @@ const SplitPayment = (props) => {
     0
   );
   const totalPreviouspayment = paymentsToUse?.reduce(
-    (acc, payment) => acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
+    (acc, payment) =>
+      acc + parseFloat(payment.AfterAdjustment || payment.Amount || 0),
     0
   );
   const [paybtns, setpaybtns] = useState([]);
@@ -193,7 +230,11 @@ const SplitPayment = (props) => {
   const OverAllSales = useSelector(GlobalOverAllDiscSales);
   const OverAllEstimate = useSelector(GlobalOverAllDiscEstimate);
   const printDatas = useSelector(GlobalprintDatas);
-  const allowDecimal = SettingDataSelector?.[0]?.SettingDtlDetails?.find((setting) => setting?.SettingIdName?.toLowerCase() === "decimal" && setting?.SettingValue === 'Y');
+  const allowDecimal = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
+    (setting) =>
+      setting?.SettingIdName?.toLowerCase() === 'decimal' &&
+      setting?.SettingValue === 'Y'
+  );
   const UomPrint = SettingDataSelector?.[0]?.SettingDtlDetails.filter(
     (i) => i.SettingIdName === 'PrintUom'
   )?.[0];
@@ -223,7 +264,7 @@ const SplitPayment = (props) => {
     (item) => item?.OptionName == 'Offer'
   );
   const [TotalAmount, setTotalAmount] = useState(0);
-  console.log(TotalAmount, "TotalSplitAmount", TotalSplitAmount)
+  console.log(TotalAmount, 'TotalSplitAmount', TotalSplitAmount);
   const preferenceOffer =
     SettingDataSelector?.[0]?.['SettingDtlDetails']?.find(
       (item) => item.SettingIdName === 'Offer'
@@ -237,9 +278,8 @@ const SplitPayment = (props) => {
   }, []);
 
   useEffect(() => {
-
     if (salesBillEdit) {
-      const previousNetAmount = (totalPreviouspayment || 0);
+      const previousNetAmount = totalPreviouspayment || 0;
       if (TotalNetAmount > previousNetAmount) {
         setTotalAmount(TotalNetAmount - previousNetAmount);
       } else {
@@ -248,8 +288,7 @@ const SplitPayment = (props) => {
     } else {
       setTotalAmount(TotalNetAmount);
     }
-
-  }, [totalPreviousOfferAmount, totalPreviouspayment, TotalNetAmount])
+  }, [totalPreviousOfferAmount, totalPreviouspayment, TotalNetAmount]);
 
   useEffect(() => {
     if (SelCustId) {
@@ -272,7 +311,7 @@ const SplitPayment = (props) => {
   }, [Splitpayment]);
   useEffect(() => {
     const totalPayAmount = Object.keys(SplitSelPayMode)
-      .filter(key => key.startsWith('PayAmount-'))
+      .filter((key) => key.startsWith('PayAmount-'))
       .reduce((sum, key) => {
         const value = parseInt(SplitSelPayMode[key], 10);
         return sum + (isNaN(value) ? 0 : value);
@@ -360,20 +399,12 @@ const SplitPayment = (props) => {
     setUpiPayOption(options);
   };
   const getBookingTypeId = async () => {
-    let tempconfigdata = await dispatch(
-      getConfigType({ TypeName: 'Booking Type' })
-    ).unwrap();
+    setConfigDataList(AllBookingType);
+    let configdata = AllBookingType;
+    let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
 
-    if (tempconfigdata?.data?.statusCode == 1) {
-      setConfigDataList(tempconfigdata?.data?.data);
-      let configdata = tempconfigdata?.data?.data;
-      let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
-
-      let filterconfigdata = configdata?.find(
-        (a) => a?.ConfigName === checkName
-      );
-      setSelectedBookingType(filterconfigdata?.ConfigId);
-    }
+    let filterconfigdata = configdata?.find((a) => a?.ConfigName === checkName);
+    setSelectedBookingType(filterconfigdata?.ConfigId);
   };
   const gettodaydate = () => {
     const currentDate = new Date();
@@ -547,7 +578,8 @@ const SplitPayment = (props) => {
             SingleTokenMobilePrint(PrintOrderDetails, SelUpiId, 'Booking');
           }
         } else {
-          MobilePrint(appPreferences,
+          MobilePrint(
+            appPreferences,
             PrintOrderDetails,
             SelUpiId,
             'Booking',
@@ -570,8 +602,9 @@ const SplitPayment = (props) => {
       await Promise.all(
         PrintOrderDetails?.[0]?.OrderDetails?.map(
           async (orderDetail, index) => {
-            const groupedTokens = orderDetail?.productDetails?.filter(data => data?.EditTokenAvailable !== 'N')?.reduce(
-              (acc, item, idx) => {
+            const groupedTokens = orderDetail?.productDetails
+              ?.filter((data) => data?.EditTokenAvailable !== 'N')
+              ?.reduce((acc, item, idx) => {
                 if (item.TokenAvailable === 'Y') {
                   if (!item.CounterName) {
                     // If CounterName is null or empty
@@ -584,9 +617,7 @@ const SplitPayment = (props) => {
                   }
                 }
                 return acc;
-              },
-              {}
-            );
+              }, {});
 
             // Iterate over grouped tokens and print them
             const tokensToPrint = Object.entries(groupedTokens).map(
@@ -605,11 +636,11 @@ const SplitPayment = (props) => {
       );
     } else {
       await Promise.all(
-        PrintOrderDetails?.[0]?.OrderDetails?.filter(data => data?.EditTokenAvailable !== 'N')?.map(
-          async (orderDetail, index) => {
-            await TokenPrint(`${index}-${orderDetail?.OrderId}`);
-          }
-        )
+        PrintOrderDetails?.[0]?.OrderDetails?.filter(
+          (data) => data?.EditTokenAvailable !== 'N'
+        )?.map(async (orderDetail, index) => {
+          await TokenPrint(`${index}-${orderDetail?.OrderId}`);
+        })
       );
       setPrintOrderDetails([]);
     }
@@ -641,7 +672,7 @@ const SplitPayment = (props) => {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
 
     if (selectedStyle) {
@@ -650,8 +681,9 @@ const SplitPayment = (props) => {
           async (orderDetail, index) => {
             await printDiv(`${selectedStyle}-${index}`, style); // Use unique IDs for each print
             if (orderDetail?.BookingTypeName !== 'Dine In') {
-              const groupedTokens = orderDetail?.productDetails?.filter(data => data?.EditTokenAvailable !== 'N')?.reduce(
-                (acc, item, idx) => {
+              const groupedTokens = orderDetail?.productDetails
+                ?.filter((data) => data?.EditTokenAvailable !== 'N')
+                ?.reduce((acc, item, idx) => {
                   if (item.TokenAvailable === 'Y') {
                     if (!item.CounterName) {
                       // If CounterName is null or empty
@@ -664,9 +696,7 @@ const SplitPayment = (props) => {
                     }
                   }
                   return acc;
-                },
-                {}
-              );
+                }, {});
 
               // Iterate over grouped tokens and print them
               const tokensToPrint = Object.entries(groupedTokens).map(
@@ -1033,11 +1063,11 @@ const SplitPayment = (props) => {
                 <button
                   className={
                     SplitSelPayMode[`PaymentStatus-${i}`] === 'S' ||
-                      SplitSelPayMode[`FirstPaymentclick-${i}`] === 'Y'
+                    SplitSelPayMode[`FirstPaymentclick-${i}`] === 'Y'
                       ? 'Splitbutton-diabled'
                       : 'Splitbutton'
                   }
-                // onClick={(e) => (SplitSelPayMode[`PaymentStatus-${i}`] === "S" || SplitSelPayMode[`FirstPaymentclick-${i}`] === "Y") ? e.stopPropagation() : onFinish(i)}
+                  // onClick={(e) => (SplitSelPayMode[`PaymentStatus-${i}`] === "S" || SplitSelPayMode[`FirstPaymentclick-${i}`] === "Y") ? e.stopPropagation() : onFinish(i)}
                 >
                   Pay
                 </button>
@@ -1365,8 +1395,8 @@ const SplitPayment = (props) => {
           ? 'E'
           : GlobEstBooking === 'ParEst'
             ? GlobProdwisedata?.includes(
-              a.InwardDtlId + ' ' + a?.BookingTypeName
-            )
+                a.InwardDtlId + ' ' + a?.BookingTypeName
+              )
               ? 'E'
               : 'S'
             : 'S',
@@ -1448,7 +1478,14 @@ const SplitPayment = (props) => {
       // SalesTableLinkDetails:
       //   SelectedTableDetails?.length > 0 ? SelectedTableDetails : null,
       SalesTableLinkDetails:
-        SelectedTableDetails?.length > 0 ? globalTipAmount === 0 ? SelectedTableDetails : SelectedTableDetails?.map(item => ({ ...item, "TipsAmount": globalTipAmount })) : null,
+        SelectedTableDetails?.length > 0
+          ? globalTipAmount === 0
+            ? SelectedTableDetails
+            : SelectedTableDetails?.map((item) => ({
+                ...item,
+                TipsAmount: globalTipAmount,
+              }))
+          : null,
 
       // "Credit": TotalAmount,
       // "Debit": 0,
@@ -1472,37 +1509,37 @@ const SplitPayment = (props) => {
                 : SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'card'
                   ? SplitSelPayMode[`CardSelection-${i}`]
                   : SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
-                    'default'
+                      'default'
                     ? 'PC'
                     : SplitSelPayMode[`UPISelection-${i}`],
           ModeOfPayment:
             SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'default'
               ? PaymentUpiOptions?.find(
-                (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
-              )?.UPIDetailId
+                  (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
+                )?.UPIDetailId
               : null,
           AccountDtl:
             SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'upi' &&
-              SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'default'
+            SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'default'
               ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
-              )
+                  (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
+                )
               : (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'upi' &&
-                SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
-                'pd') ||
-                (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
-                  'card' &&
-                  SplitSelPayMode[`CardSelection-${i}`]?.toLowerCase() ===
-                  'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
-                  'upi' &&
-                  SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
-                  'pg') ||
+                    SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
+                      'pd') ||
                   (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
                     'card' &&
                     SplitSelPayMode[`CardSelection-${i}`]?.toLowerCase() ===
-                    'pg')
+                      'pd')
+                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
+                : (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
+                      'upi' &&
+                      SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
+                        'pg') ||
+                    (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
+                      'card' &&
+                      SplitSelPayMode[`CardSelection-${i}`]?.toLowerCase() ===
+                        'pg')
                   ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
                   : [],
           PaymentStatus:
@@ -1511,9 +1548,9 @@ const SplitPayment = (props) => {
               : SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'credit'
                 ? 'S'
                 : SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
-                  'upi' &&
-                  SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
-                  'default'
+                      'upi' &&
+                    SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
+                      'default'
                   ? 'S'
                   : 'P',
           Debit: 0,
@@ -1527,7 +1564,7 @@ const SplitPayment = (props) => {
     };
     let PostData = temppostdata;
     (i === 0 && SplitSelPayMode[`PaymentStatus-${i}`] === 'F') ||
-      (i === 0 && props.hasOwnProperty('TableBookingOrderId'))
+    (i === 0 && props.hasOwnProperty('TableBookingOrderId'))
       ? PutSplitPayment(i)
       : i === 0
         ? Object.keys(ReportholdData)?.length > 0
@@ -1576,14 +1613,14 @@ const SplitPayment = (props) => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -1635,10 +1672,16 @@ const SplitPayment = (props) => {
 
     if (response?.data?.statusCode == 1) {
       setSalesOrderId(response?.data?.OrderId);
-      const salesEditAmount = response?.data?.PaymentOrderDtl?.find(payment =>
-        payment?.LastOrderTran === 'Y' && payment?.AdjustmentType &&
-        payment?.AdjustmentType != null && payment?.AfterAdjustment && payment?.BeforeAdjustment && payment?.AfterAdjustment != null && payment?.BeforeAdjustment != null
-      )
+      const salesEditAmount = response?.data?.PaymentOrderDtl?.find(
+        (payment) =>
+          payment?.LastOrderTran === 'Y' &&
+          payment?.AdjustmentType &&
+          payment?.AdjustmentType != null &&
+          payment?.AfterAdjustment &&
+          payment?.BeforeAdjustment &&
+          payment?.AfterAdjustment != null &&
+          payment?.BeforeAdjustment != null
+      );
       setBeforeAdjAmount(salesEditAmount?.BeforeAdjustment || null);
       setAfterAdjAmount(salesEditAmount?.AfterAdjustment || null);
       setAdjustmentType(salesEditAmount?.AdjustmentType || null);
@@ -1677,14 +1720,14 @@ const SplitPayment = (props) => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -1722,7 +1765,13 @@ const SplitPayment = (props) => {
       OrderId: props.hasOwnProperty('TableBookingOrderId')
         ? TableOrderId
         : SalesOrderId,
-      ...(i === 0 ? { SalesId: props.hasOwnProperty('TableBookingSalesId') ? TableSalesId : SalesOrderId } : {}),
+      ...(i === 0
+        ? {
+            SalesId: props.hasOwnProperty('TableBookingSalesId')
+              ? TableSalesId
+              : SalesOrderId,
+          }
+        : {}),
       PaymentType:
         SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'upi'
           ? SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'pd'
@@ -1743,32 +1792,32 @@ const SplitPayment = (props) => {
             : SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'card'
               ? SplitSelPayMode[`CardSelection-${i}`]
               : SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
-                'default'
+                  'default'
                 ? 'PC'
                 : SplitSelPayMode[`UPISelection-${i}`],
       ModeOfPayment:
         SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'default'
           ? PaymentUpiOptions?.find(
-            (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
-          )?.UPIDetailId
+              (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
+            )?.UPIDetailId
           : null,
       AccountDtl:
         SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'upi' &&
-          SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'default'
+        SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'default'
           ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-            (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
-          )
+              (upipay) => upipay?.Mode === SplitSelPayMode[`UPIMode-${i}`]
+            )
           : (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'upi' &&
-            SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'pd') ||
-            (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'card' &&
-              SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'pd')
+                SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'pd') ||
+              (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'card' &&
+                SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'pd')
             ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
             : (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'upi' &&
-              SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
-              'pg') ||
-              (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
-                'card' &&
-                SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'pg')
+                  SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
+                    'pg') ||
+                (SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() ===
+                  'card' &&
+                  SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() === 'pg')
               ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
               : [],
       PaymentStatus:
@@ -1777,8 +1826,8 @@ const SplitPayment = (props) => {
           : SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'credit'
             ? 'S'
             : SplitSelPayMode[`PaymentMode-${i}`]?.toLowerCase() === 'upi' &&
-              SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
-              'default'
+                SplitSelPayMode[`UPISelection-${i}`]?.toLowerCase() ===
+                  'default'
               ? 'S'
               : 'P',
       Debit: 0,
@@ -1789,7 +1838,6 @@ const SplitPayment = (props) => {
       BeforeAdjAmount: beforeAdjAmount || null,
       AfterAdjAmount: afterAdjAmount || null,
       AdjustmentType: adjustmentType || null,
-
     };
 
     let response = await dispatch(
@@ -1836,14 +1884,14 @@ const SplitPayment = (props) => {
         }
         setMessageData(
           response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+            ' ' +
+            (response?.data?.OrderDetails?.length > 0
+              ? response?.data?.OrderId &&
+                extractLastNumberOrderId(
+                  response?.data?.OrderId,
+                  response?.data?.OrderDetails?.[0]?.FYStatus
+                )
+              : '')
         );
         if (response?.data?.OrderDetails?.length > 0) {
           setPrintOrderDetails([response?.data]);
@@ -1945,14 +1993,14 @@ const SplitPayment = (props) => {
             });
             setMessageData(
               bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  bookingpaymentupdate?.data?.OrderDetails?.[0]?.FYStatus
-                )
-                : '')
+                ' ' +
+                (bookingpaymentupdate?.data?.OrderDetails?.length > 0
+                  ? bookingpaymentupdate?.data?.OrderId &&
+                    extractLastNumberOrderId(
+                      bookingpaymentupdate?.data?.OrderId,
+                      bookingpaymentupdate?.data?.OrderDetails?.[0]?.FYStatus
+                    )
+                  : '')
             );
             if (bookingpaymentupdate?.data?.OrderDetails?.length > 0) {
               setPrintOrderDetails([bookingpaymentupdate?.data]);
@@ -1970,7 +2018,7 @@ const SplitPayment = (props) => {
         if (
           Date.now() - startTime >
           useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
+            60000
         ) {
           // 60,000 ms = 1 minute
 
@@ -2125,195 +2173,200 @@ const SplitPayment = (props) => {
   }
 
   return (
-    <>
-      <Messages messageType={messageType} messageData={messageData} />
-      <div className="splitmodal">
-        <DefaultModal
-          open={Splitpayment}
-          title="Split Payment"
-          handleCancel={() => {
-            SplitSelPayMode[`PaymentStatus-0`] !== 'S' && HandleModalClose();
-          }}
-          footer={false}
-          width={1000}
-          className={'splitpaymentModal'}
-          children={
-            <div className="splitpaymentModal-content">
-              <p>Total Amount : {safeRound(TotalAmount)}</p>
-              <p>
-                Remaining Balance : {TotalAmount - (isNaN(TotalSplitAmount) ? 0 : TotalSplitAmount)}              </p>
+    <Suspense fallback={<div>Loading...</div>}>
+      <>
+        <Messages messageType={messageType} messageData={messageData} />
+        <div className="splitmodal">
+          <DefaultModal
+            open={Splitpayment}
+            title="Split Payment"
+            handleCancel={() => {
+              SplitSelPayMode[`PaymentStatus-0`] !== 'S' && HandleModalClose();
+            }}
+            footer={false}
+            width={1000}
+            className={'splitpaymentModal'}
+            children={
+              <div className="splitpaymentModal-content">
+                <p>Total Amount : {safeRound(TotalAmount)}</p>
+                <p>
+                  Remaining Balance :{' '}
+                  {TotalAmount -
+                    (isNaN(TotalSplitAmount) ? 0 : TotalSplitAmount)}{' '}
+                </p>
 
-              <>{calculateField()}</>
-              {TotalAmount > TotalSplitAmount &&
-                SplitSelPayMode[`PaymentStatus-${count}`] === 'S' && (
-                  <Form.Item>
-                    <div
-                      style={{
-                        display: 'flex',
-                        justifyContent: 'flex-end',
-                      }}
-                    >
-                      <PlusOutlined
+                <>{calculateField()}</>
+                {TotalAmount > TotalSplitAmount &&
+                  SplitSelPayMode[`PaymentStatus-${count}`] === 'S' && (
+                    <Form.Item>
+                      <div
                         style={{
-                          backgroundColor: '#37943C',
-                          color: 'white',
-                          borderRadius: '50px',
-                          padding: '5px',
+                          display: 'flex',
+                          justifyContent: 'flex-end',
                         }}
-                        onClick={() => setCount(count + 1)}
-                      />
-                    </div>
-                  </Form.Item>
-                )}
-            </div>
-          }
-        />
-      </div>
-      {TotalAmount == 0 && Success && (
-        <div>
-          <QrComponent com={`WelcomeScreen**${branchName}`} />
+                      >
+                        <PlusOutlined
+                          style={{
+                            backgroundColor: '#37943C',
+                            color: 'white',
+                            borderRadius: '50px',
+                            padding: '5px',
+                          }}
+                          onClick={() => setCount(count + 1)}
+                        />
+                      </div>
+                    </Form.Item>
+                  )}
+              </div>
+            }
+          />
         </div>
-      )}
-      {TotalAmount > 0 &&
-        qrCode &&
-        PaymentUpiOptions?.length > 0 &&
-        SelUpiId && (
+        {TotalAmount == 0 && Success && (
+          <div>
+            <QrComponent com={`WelcomeScreen**${branchName}`} />
+          </div>
+        )}
+        {TotalAmount > 0 &&
+          qrCode &&
+          PaymentUpiOptions?.length > 0 &&
+          SelUpiId && (
+            <div>
+              <QrComponent
+                com={`DisplayQRCodeScreen**upi://pay?pa=${SelUpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${SelUpiId}`}
+              />
+            </div>
+          )}
+
+        {PaymentUpiOptions?.length > 0 && OrderId && (
           <div>
             <QrComponent
-              com={`DisplayQRCodeScreen**upi://pay?pa=${SelUpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${SelUpiId}`}
+              com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
             />
           </div>
         )}
-
-      {PaymentUpiOptions?.length > 0 && OrderId && (
-        <div>
-          <QrComponent
-            com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
-          />
-        </div>
-      )}
-      {PrintOrderDetails?.length > 0 &&
-        PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+        {PrintOrderDetails?.length > 0 &&
+          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+            <div style={{ display: 'none' }}>
+              <PaymentPdfBooking
+                index={index}
+                table2Data={orderDetail}
+                singleData2={orderDetail?.productDetails}
+                orderId={
+                  orderDetail?.OrderId &&
+                  extractLastNumberOrderId(
+                    orderDetail?.OrderId,
+                    orderDetail?.FYStatus
+                  )
+                }
+                CreatedDate={orderDetail?.CreatedDate}
+                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+                Preference={SettingDataSelector}
+                printDatas={printDatas}
+              />
+            </div>
+          ))}
+        {CreditCustomer && (
           <div style={{ display: 'none' }}>
-            <PaymentPdfBooking
-              index={index}
-              table2Data={orderDetail}
-              singleData2={orderDetail?.productDetails}
-              orderId={
-                orderDetail?.OrderId &&
-                extractLastNumberOrderId(
-                  orderDetail?.OrderId,
-                  orderDetail?.FYStatus
-                )
-              }
-              CreatedDate={orderDetail?.CreatedDate}
-              PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-              Preference={SettingDataSelector}
-              printDatas={printDatas}
+            <BsBillingCreditCustomer
+              ModalCreditCustomer={CreditCustomer}
+              handlemodalclose={() => {
+                handleCreditCustomer('Cancel');
+              }}
+              handleOk={() => {
+                handleCreditCustomer('Submit');
+              }}
+              SplitPayAmount={SplitSelPayMode[`PayAmount-${count}`]}
             />
           </div>
-        ))}
-      {CreditCustomer && (
-        <div style={{ display: 'none' }}>
-          <BsBillingCreditCustomer
-            ModalCreditCustomer={CreditCustomer}
-            handlemodalclose={() => {
-              handleCreditCustomer('Cancel');
+        )}
+        {PrintOrderDetails?.length > 0 &&
+          (TokenOnly?.SettingValue === 'Y' ||
+            IndividualToken?.SettingValue === 'Y') &&
+          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
+            <div style={{ display: 'none' }}>
+              <TokensinglePrint
+                index={index}
+                table2Data={orderDetail}
+                singleData2={orderDetail?.productDetails}
+                orderId={
+                  orderDetail?.OrderId &&
+                  extractLastNumberOrderId(
+                    orderDetail?.OrderId,
+                    orderDetail?.FYStatus
+                  )
+                }
+                CreatedDate={orderDetail?.CreatedDate}
+                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
+              />
+            </div>
+          ))}
+        {UpiOpen && (
+          <DefaultModal
+            open={UpiOpen}
+            title="UPI PAYMENT"
+            width={500}
+            handleCancel={() => {
+              Upimodel('Cancel');
             }}
-            handleOk={() => {
-              handleCreditCustomer('Submit');
-            }}
-            SplitPayAmount={SplitSelPayMode[`PayAmount-${count}`]}
-          />
-        </div>
-      )}
-      {PrintOrderDetails?.length > 0 &&
-        (TokenOnly?.SettingValue === 'Y' ||
-          IndividualToken?.SettingValue === 'Y') &&
-        PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-          <div style={{ display: 'none' }}>
-            <TokensinglePrint
-              index={index}
-              table2Data={orderDetail}
-              singleData2={orderDetail?.productDetails}
-              orderId={
-                orderDetail?.OrderId &&
-                extractLastNumberOrderId(
-                  orderDetail?.OrderId,
-                  orderDetail?.FYStatus
-                )
-              }
-              CreatedDate={orderDetail?.CreatedDate}
-              PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-            />
-          </div>
-        ))}
-      {UpiOpen && (
-        <DefaultModal
-          open={UpiOpen}
-          title="UPI PAYMENT"
-          width={500}
-          handleCancel={() => {
-            Upimodel('Cancel');
-          }}
-          footer={false}
-          children={
-            <div style={{ overflow: 'scroll' }}>
-              <div
-                style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  justifyContent: 'space-evenly',
-                  alignItems: 'center',
-                }}
-              >
-                <div>
-                  <QrinScreen Amount={CurrentPayAmount} UpiId={SelUpiId} />
-                </div>
-
-                <div>
-                  <h1> RS :{CurrentPayAmount} </h1>
-                </div>
-              </div>
-              <div className="sentok">
-                {(selOption || SelCustId) && (
-                  <div className="sentLink" onClick={onFinalSubmit}>
-                    Sent Payment Link
-                    <img
-                      src={WpIcon}
-                      alt="Your Alt Text"
-                      style={{ width: '30px', height: '30px' }}
-                    />
-                  </div>
-                )}
+            footer={false}
+            children={
+              <div style={{ overflow: 'scroll' }}>
                 <div
                   style={{
                     display: 'flex',
-                    flexDirection: 'row-reverse',
-                    width: '100px',
+                    flexDirection: 'column',
+                    justifyContent: 'space-evenly',
+                    alignItems: 'center',
                   }}
                 >
-                  <Buttons
-                    buttonText="OK"
-                    color="901D77"
-                    icon={<ArrowRightOutlined />}
-                    handleSubmit={() => {
-                      Upimodel('Submit');
+                  <div>
+                    <QrinScreen Amount={CurrentPayAmount} UpiId={SelUpiId} />
+                  </div>
+
+                  <div>
+                    <h1> RS :{CurrentPayAmount} </h1>
+                  </div>
+                </div>
+                <div className="sentok">
+                  {(selOption || SelCustId) && (
+                    <div className="sentLink" onClick={onFinalSubmit}>
+                      Sent Payment Link
+                      <img
+                        src={WpIcon}
+                        alt="Your Alt Text"
+                        style={{ width: '30px', height: '30px' }}
+                      />
+                    </div>
+                  )}
+                  <div
+                    style={{
+                      display: 'flex',
+                      flexDirection: 'row-reverse',
+                      width: '100px',
                     }}
-                  />
+                  >
+                    <Buttons
+                      buttonText="OK"
+                      color="901D77"
+                      icon={<ArrowRightOutlined />}
+                      handleSubmit={() => {
+                        Upimodel('Submit');
+                      }}
+                    />
+                  </div>
                 </div>
               </div>
-            </div>
-          }
-        />
-      )}
-      {addcustomer && (
-        <FeaturesFunctionalities
-          handleAddCustomerCancel={handleAddCustomerCancel}
-          addcustomer={addcustomer}
-        />
-      )}
-    </>
+            }
+          />
+        )}
+        {addcustomer && (
+          <FeaturesFunctionalities
+            handleAddCustomerCancel={handleAddCustomerCancel}
+            addcustomer={addcustomer}
+          />
+        )}
+      </>
+    </Suspense>
   );
 };
 export default SplitPayment;
diff --git a/src/Pages/BookingScreen/Components/MainPage/SelectionComponent.jsx b/src/Pages/BookingScreen/Components/MainPage/SelectionComponent.jsx
index 29dc690..376df17 100644
--- a/src/Pages/BookingScreen/Components/MainPage/SelectionComponent.jsx
+++ b/src/Pages/BookingScreen/Components/MainPage/SelectionComponent.jsx
@@ -1,14 +1,17 @@
-import React, { useEffect, useRef, useState, useCallback, forwardRef, useImperativeHandle } from 'react';
+import React, {
+  useEffect,
+  useRef,
+  useState,
+  useCallback,
+  forwardRef,
+  useImperativeHandle,
+} from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import WebFont from 'webfontloader';
 import { SwatchesPicker } from 'react-color';
 import { DefaultModal } from '../../../../Components/Modal/DefaultModal';
 import { RadioGrpButton } from '../../../../Components/Forms/RadioGroup.jsx';
-import {
-
-  CloseOutlined,
-  ArrowRightOutlined,
-} from '@ant-design/icons';
+import { CloseOutlined, ArrowRightOutlined } from '@ant-design/icons';
 import { BiSkipPrevious } from 'react-icons/bi';
 import { BiSkipNext } from 'react-icons/bi';
 import { Modal, Form } from 'antd';
@@ -113,12 +116,15 @@ import {
 import { getPreferenceData } from '../../../../Features/BookingScreen/BookingData/BookingData.js';
 import { useAuth } from '../../../../AuthContext.jsx';
 import { HiOutlineSquares2X2, HiSquaresPlus } from 'react-icons/hi2';
-import { ApplicationPreferences, getCommonAppPreference } from '../../../../Features/BrachLogin/BranchLogin.js';
+import {
+  ApplicationPreferences,
+  getCommonAppPreference,
+} from '../../../../Features/BrachLogin/BranchLogin.js';
 import { TbLayoutNavbar } from 'react-icons/tb';
 import { HiMenuAlt1 } from 'react-icons/hi';
-import { IoMdAdd } from "react-icons/io";
-import { LuCreditCard } from "react-icons/lu";
-import { IoReceiptOutline } from "react-icons/io5";
+import { IoMdAdd } from 'react-icons/io';
+import { LuCreditCard } from 'react-icons/lu';
+import { IoReceiptOutline } from 'react-icons/io5';
 
 const subDirectory = import.meta.env.BASE_URL;
 const SelectionComponent = forwardRef((props, ref) => {
@@ -175,12 +181,22 @@ const SelectionComponent = forwardRef((props, ref) => {
     SelectedGlobalSubCatgColorDetail
   );
   const DefaultThemes = useSelector(GlobalDefaultTheme);
-  const SelectedTheme = useSelector(GlobalSelectedTheme)
+  const SelectedTheme = useSelector(GlobalSelectedTheme);
   const activeTheme = useSelector(GlobalActiveTheme);
   const appPreferences = useSelector(ApplicationPreferences);
-  const bookingTypePreference = appPreferences?.find((preference) => preference?.PreferredCatName === 'Booking Type')?.PreferenceCatDetails
-  const dinePreference = bookingTypePreference?.find((type) => type?.PreferredSubCatName?.toLowerCase() === "dine in" && type?.PreferredStatus === 'Y')
-  const takeAwayPreference = bookingTypePreference?.find((type) => type?.PreferredSubCatName?.toLowerCase() === "take away" && type?.PreferredStatus === 'Y')
+  const bookingTypePreference = appPreferences?.find(
+    (preference) => preference?.PreferredCatName === 'Booking Type'
+  )?.PreferenceCatDetails;
+  const dinePreference = bookingTypePreference?.find(
+    (type) =>
+      type?.PreferredSubCatName?.toLowerCase() === 'dine in' &&
+      type?.PreferredStatus === 'Y'
+  );
+  const takeAwayPreference = bookingTypePreference?.find(
+    (type) =>
+      type?.PreferredSubCatName?.toLowerCase() === 'take away' &&
+      type?.PreferredStatus === 'Y'
+  );
   const AppId = getSession('AppId');
   const UserId = getSession('UserId');
   const CompId = getSession('CompId');
@@ -230,7 +246,6 @@ const SelectionComponent = forwardRef((props, ref) => {
   const [SelectedBillingTableId, setSelectedBillingTableId] = useState(null);
   const [ShowDropDownData, SetShowDropDownData] = useState([]);
 
-
   //navbarcheck boxes
   const [NavBarCheckList, setNavBarCheckList] = useState([]);
   const [SelectedNavCheckValues, setSelectedNavCheckValues] = useState([]);
@@ -399,9 +414,19 @@ const SelectionComponent = forwardRef((props, ref) => {
   useEffect(() => {
     if (activeTheme == 'default') {
       if (Object.keys(DefaultThemes)?.length > 0) {
-        dispatch(changeSelectedTheme({ ThemeId: DefaultThemes?.[0]?.TemplatePreferenceId, ThemeName: DefaultThemes?.[0]?.ThemeName }));
+        dispatch(
+          changeSelectedTheme({
+            ThemeId: DefaultThemes?.[0]?.TemplatePreferenceId,
+            ThemeName: DefaultThemes?.[0]?.ThemeName,
+          })
+        );
         settemplateData(DefaultThemes?.[0]);
-        dispatch(changeThemeCreation({ formtype: 'edit', editdata: DefaultThemes?.[0] }));
+        dispatch(
+          changeThemeCreation({
+            formtype: 'edit',
+            editdata: DefaultThemes?.[0],
+          })
+        );
       } else {
         dispatch(changeSelectedTheme({}));
         settemplateData({});
@@ -438,7 +463,7 @@ const SelectionComponent = forwardRef((props, ref) => {
     ).unwrap();
 
     if (tempdetail?.data?.statusCode == 1) {
-      dispatch(changeActiveTheme("customised"));
+      dispatch(changeActiveTheme('customised'));
     } else {
       setTemptemplatedata(true);
     }
@@ -459,7 +484,7 @@ const SelectionComponent = forwardRef((props, ref) => {
   };
 
   const getThemesData = async () => {
-    // let themeresponse = 
+    // let themeresponse =
     await dispatch(getThemes()).unwrap();
     // if (themeresponse.data?.statusCode === 1) {
     //   let themedatalist = themeresponse.data?.data?.filter(
@@ -496,7 +521,6 @@ const SelectionComponent = forwardRef((props, ref) => {
   }, [templateData1, selthemeData, activeTheme]);
   useEffect(() => {
     if (Object.keys(templateData)?.length > 0) {
-
       setEditTemplateData();
     } else {
       ClearAllComponentStates();
@@ -764,7 +788,7 @@ const SelectionComponent = forwardRef((props, ref) => {
 
   useEffect(() => {
     if (templateData && BillingTableData?.length > 0) {
-      console.log(BillingTableData?.length, "BillingTableData?.length")
+      console.log(BillingTableData?.length, 'BillingTableData?.length');
       const editCardVal = BillingTableData?.filter(
         (item) => item.ComponentName == templateData?.['BookingBilling']?.[0]
       );
@@ -1062,16 +1086,22 @@ const SelectionComponent = forwardRef((props, ref) => {
   const GetNavbarFun = async () => {
     const gettingNavbarData = await dispatch(getNavbar()).unwrap();
     if (gettingNavbarData?.data?.statusCode === 1) {
-      setNavbarData(gettingNavbarData.data?.data?.map((navbar) => {
-        return {
-          ...navbar,
-          ComponentOptionsDetails: navbar?.ComponentOptionsDetails
-            ?.filter((component) =>
-              !((component?.OptionName === 'DineIn' && dinePreference === undefined) ||
-                (component?.OptionName === 'TakeAway' && takeAwayPreference === undefined))
-            )
-        }
-      }));
+      setNavbarData(
+        gettingNavbarData.data?.data?.map((navbar) => {
+          return {
+            ...navbar,
+            ComponentOptionsDetails: navbar?.ComponentOptionsDetails?.filter(
+              (component) =>
+                !(
+                  (component?.OptionName === 'DineIn' &&
+                    dinePreference === undefined) ||
+                  (component?.OptionName === 'TakeAway' &&
+                    takeAwayPreference === undefined)
+                )
+            ),
+          };
+        })
+      );
     }
   };
   const GetCategoryFun = async () => {
@@ -1122,31 +1152,43 @@ const SelectionComponent = forwardRef((props, ref) => {
   const GetCombo1Navbar = async () => {
     const gettingCombo1NavbarData = await dispatch(getCombo1Navbar()).unwrap();
     if (gettingCombo1NavbarData?.data?.statusCode === 1) {
-      setNavbarData(gettingCombo1NavbarData?.data?.data?.map((navbar) => {
-        return {
-          ...navbar,
-          ComponentOptionsDetails: navbar?.ComponentOptionsDetails
-            ?.filter((component) =>
-              !((component?.OptionName === 'DineIn' && dinePreference === undefined) ||
-                (component?.OptionName === 'TakeAway' && takeAwayPreference === undefined))
-            )
-        }
-      }));
+      setNavbarData(
+        gettingCombo1NavbarData?.data?.data?.map((navbar) => {
+          return {
+            ...navbar,
+            ComponentOptionsDetails: navbar?.ComponentOptionsDetails?.filter(
+              (component) =>
+                !(
+                  (component?.OptionName === 'DineIn' &&
+                    dinePreference === undefined) ||
+                  (component?.OptionName === 'TakeAway' &&
+                    takeAwayPreference === undefined)
+                )
+            ),
+          };
+        })
+      );
     }
   };
   const GetCombo2Navbar = async () => {
     const gettingCombo2NavbarData = await dispatch(getCombo2Navbar()).unwrap();
     if (gettingCombo2NavbarData?.data?.statusCode === 1) {
-      setNavbarData(gettingCombo2NavbarData?.data?.data?.map((navbar) => {
-        return {
-          ...navbar,
-          ComponentOptionsDetails: navbar?.ComponentOptionsDetails
-            ?.filter((component) =>
-              !((component?.OptionName === 'DineIn' && dinePreference === undefined) ||
-                (component?.OptionName === 'TakeAway' && takeAwayPreference === undefined))
-            )
-        }
-      }));
+      setNavbarData(
+        gettingCombo2NavbarData?.data?.data?.map((navbar) => {
+          return {
+            ...navbar,
+            ComponentOptionsDetails: navbar?.ComponentOptionsDetails?.filter(
+              (component) =>
+                !(
+                  (component?.OptionName === 'DineIn' &&
+                    dinePreference === undefined) ||
+                  (component?.OptionName === 'TakeAway' &&
+                    takeAwayPreference === undefined)
+                )
+            ),
+          };
+        })
+      );
     }
   };
 
@@ -1318,15 +1360,20 @@ const SelectionComponent = forwardRef((props, ref) => {
         ],
       })
     );
-    setBillTableCheckList(BillTableItems?.map((billItem) => {
-      return {
-        ...billItem,
-        ComponentOptionsDetails: billItem?.ComponentOptionsDetails
-          ?.filter((component) =>
-            !(component?.OptionName === 'UnpaidBill' && dinePreference === undefined)
-          )
-      }
-    }));
+    setBillTableCheckList(
+      BillTableItems?.map((billItem) => {
+        return {
+          ...billItem,
+          ComponentOptionsDetails: billItem?.ComponentOptionsDetails?.filter(
+            (component) =>
+              !(
+                component?.OptionName === 'UnpaidBill' &&
+                dinePreference === undefined
+              )
+          ),
+        };
+      })
+    );
 
     const itemOption = BillTableItems[0]?.ComponentOptionsDetails?.find(
       (option) => option.OptionName === 'Item'
@@ -2278,7 +2325,7 @@ const SelectionComponent = forwardRef((props, ref) => {
       });
   };
   const validateFontsTable = async (values) => {
-    console.log(values,"table font")
+    console.log(values, 'table font');
     const apiUrl = `https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyDP1HqNkLI53iIAH-SB9_mt_24QdkUZ_24`;
     fetch(apiUrl)
       .then((response) => response.json())
@@ -2674,7 +2721,7 @@ const SelectionComponent = forwardRef((props, ref) => {
 
   // onfinish function
   const onfinish = async (values) => {
-    console.log(values, "valuesvalues")
+    console.log(values, 'valuesvalues');
     setFirstOnClick(true);
     let colorOriginalArray = [
       values.CatColor,
@@ -2734,12 +2781,12 @@ const SelectionComponent = forwardRef((props, ref) => {
 
     ShowDropDownData?.find((a) => a.OptionName === 'SubCategory')
       ? tempData.push({
-        ComponentId: SelectedSubCategoryId,
-        ComponentDetails:
-          SelectedSubCategoryCheckList != undefined
-            ? SelectedSubCategoryCheckList
-            : [],
-      })
+          ComponentId: SelectedSubCategoryId,
+          ComponentDetails:
+            SelectedSubCategoryCheckList != undefined
+              ? SelectedSubCategoryCheckList
+              : [],
+        })
       : ''; // Shifayath Date:27/12/2023
 
     tempData.push({
@@ -2793,8 +2840,10 @@ const SelectionComponent = forwardRef((props, ref) => {
           setMessageData('Template Details Added Successfully');
           setFirstOnClick(false);
         }
-        dispatch(changeScanTemplate({}))
-
+        dispatch(changeScanTemplate({}));
+        await dispatch(
+          getTemplate({ CompId: CompId, BranchId: BranchId, AppId: AppId })
+        );
       } else {
         setMessageType('error');
         setMessageData(response?.data?.response);
@@ -2963,7 +3012,12 @@ const SelectionComponent = forwardRef((props, ref) => {
         onComplete={onComplete}
       />
       <div className="Selection-Component-OverallDiv">
-        <Form form={form} ref={formRef} onFinish={onfinish} onValuesChange={onValuesChange}>
+        <Form
+          form={form}
+          ref={formRef}
+          onFinish={onfinish}
+          onValuesChange={onValuesChange}
+        >
           {/* <div className="defaultandCustomisedTheme">
             <div
               className={activeTheme === 'default' ? 'selected' : ''}
@@ -3067,36 +3121,33 @@ const SelectionComponent = forwardRef((props, ref) => {
               Layout and Feature Settings
             </div>
             <div className="Selection-Component-InputDiv">
-              {!(
-                Object.keys(templateData)?.length == 0
-              ) && (
-                  <div>
-                    <p className="Selection-Component-SubHeading">Layout</p>
+              {!(Object.keys(templateData)?.length == 0) && (
+                <div>
+                  <p className="Selection-Component-SubHeading">Layout</p>
 
-
-                    <Form.Item
-                      name="LayoutId"
-                      rules={[
-                        {
-                          required: true,
-                          message: 'Please Select Layout',
-                        },
-                      ]}
-                    >
-                      <DropDowns
-                        options={LayoutData?.map((option) => ({
-                          value: option.ComponentId,
-                          label: option.ComponentName,
-                        }))}
-                        label="Layout"
-                        onChangeFunction={selectLayout}
-                        className="field-DropDown-Selection"
-                        isOnchanges={SelectedLayoutId ? true : false}
-                        valueData={SelectedLayoutId}
-                      />
-                    </Form.Item>
-                  </div>
-                )}
+                  <Form.Item
+                    name="LayoutId"
+                    rules={[
+                      {
+                        required: true,
+                        message: 'Please Select Layout',
+                      },
+                    ]}
+                  >
+                    <DropDowns
+                      options={LayoutData?.map((option) => ({
+                        value: option.ComponentId,
+                        label: option.ComponentName,
+                      }))}
+                      label="Layout"
+                      onChangeFunction={selectLayout}
+                      className="field-DropDown-Selection"
+                      isOnchanges={SelectedLayoutId ? true : false}
+                      valueData={SelectedLayoutId}
+                    />
+                  </Form.Item>
+                </div>
+              )}
 
               <Modal
                 open={UploadColor}
@@ -3192,7 +3243,6 @@ const SelectionComponent = forwardRef((props, ref) => {
                   </div>
                 </div>
 
-
                 <SwatchesPicker onChange={handleColorChange} />
                 <div>
                   <button className="colorBtn" onClick={handleColorSubmit1}>
@@ -3259,32 +3309,32 @@ const SelectionComponent = forwardRef((props, ref) => {
               {ShowDropDownData?.find(
                 (a) => a.OptionName === 'SubCategory'
               ) && (
-                  <div>
-                    <p className="Selection-Component-SubHeading">Sub Category</p>
+                <div>
+                  <p className="Selection-Component-SubHeading">Sub Category</p>
 
-                    <Form.Item
-                      name="SubCategoryId"
-                      rules={[
-                        {
-                          required: true,
-                          message: 'Please Select SubCategory',
-                        },
-                      ]}
-                    >
-                      <DropDowns
-                        options={SubCategoryData?.map((option) => ({
-                          value: option.ComponentId,
-                          label: option.ComponentName,
-                        }))}
-                        label="Sub Category"
-                        onChangeFunction={selectSubCategory}
-                        className="field-DropDown-Selection"
-                        isOnchanges={SelectedSubCategoryId ? true : false}
-                        valueData={SelectedSubCategoryId}
-                      />
-                    </Form.Item>
-                  </div>
-                )}
+                  <Form.Item
+                    name="SubCategoryId"
+                    rules={[
+                      {
+                        required: true,
+                        message: 'Please Select SubCategory',
+                      },
+                    ]}
+                  >
+                    <DropDowns
+                      options={SubCategoryData?.map((option) => ({
+                        value: option.ComponentId,
+                        label: option.ComponentName,
+                      }))}
+                      label="Sub Category"
+                      onChangeFunction={selectSubCategory}
+                      className="field-DropDown-Selection"
+                      isOnchanges={SelectedSubCategoryId ? true : false}
+                      valueData={SelectedSubCategoryId}
+                    />
+                  </Form.Item>
+                </div>
+              )}
               {ShowDropDownData?.find((a) => a.OptionName === 'Card') && (
                 <div>
                   <p className="Selection-Component-SubHeading">Card</p>
@@ -3316,7 +3366,6 @@ const SelectionComponent = forwardRef((props, ref) => {
                 <div>
                   <p className="Selection-Component-SubHeading">Bill Table</p>
 
-
                   {/* <Form.Item
                     name="BillingTableId"
                     rules={[
@@ -3339,8 +3388,16 @@ const SelectionComponent = forwardRef((props, ref) => {
                     />
                   </Form.Item> */}
                   {(() => {
-                    const selectedLayoutName = LayoutData?.find(l => l.ComponentId === SelectedLayoutId)?.ComponentName;
-                    const filteredBillingTableData = (selectedLayoutName === 'Combo1' || selectedLayoutName === 'Combo2') ? BillingTableData : BillingTableData?.filter(b => b.ComponentName !== 'Billing8');
+                    const selectedLayoutName = LayoutData?.find(
+                      (l) => l.ComponentId === SelectedLayoutId
+                    )?.ComponentName;
+                    const filteredBillingTableData =
+                      selectedLayoutName === 'Combo1' ||
+                      selectedLayoutName === 'Combo2'
+                        ? BillingTableData
+                        : BillingTableData?.filter(
+                            (b) => b.ComponentName !== 'Billing8'
+                          );
                     return (
                       <Form.Item
                         name="BillingTableId"
@@ -3371,153 +3428,153 @@ const SelectionComponent = forwardRef((props, ref) => {
               {ShowDropDownData?.find(
                 (a) => a.OptionName === 'OverallBackground'
               ) && (
+                <div>
                   <div>
-                    <div>
-                      <p className="Selection-Component-SubHeading">
-                        <Checkbox onChange={handleOverallCheck} defaultChecked>
-                          Overall Background
-                        </Checkbox>
-                      </p>
-                    </div>
+                    <p className="Selection-Component-SubHeading">
+                      <Checkbox onChange={handleOverallCheck} defaultChecked>
+                        Overall Background
+                      </Checkbox>
+                    </p>
+                  </div>
 
-                    <div>
-                      <Modal
-                        open={UploadLayoutOverallBackground}
-                        title="Overall Background"
-                        closeIcon={
-                          <CloseOutlined
-                            onClick={() => {
-                              setUploadLayoutOverallBackground(false);
+                  <div>
+                    <Modal
+                      open={UploadLayoutOverallBackground}
+                      title="Overall Background"
+                      closeIcon={
+                        <CloseOutlined
+                          onClick={() => {
+                            setUploadLayoutOverallBackground(false);
+                          }}
+                        />
+                      }
+                      width={400}
+                      footer={null}
+                    >
+                      <div>
+                        <div style={{ display: 'flex' }}>
+                          <div
+                            style={{
+                              display: 'flex',
+                              align: 'center',
+                              width: '60%',
+                              gap: '0.5rem',
+                              border: '1px solid black',
+                              borderRadius: '10px',
+                              padding: '10px',
                             }}
-                          />
-                        }
-                        width={400}
-                        footer={null}
-                      >
-                        <div>
-                          <div style={{ display: 'flex' }}>
+                          >
+                            <p style={{ fontSize: '14px', fontWeight: 700 }}>
+                              Selected Color:{' '}
+                            </p>
                             <div
                               style={{
-                                display: 'flex',
-                                align: 'center',
-                                width: '60%',
-                                gap: '0.5rem',
-                                border: '1px solid black',
-                                borderRadius: '10px',
-                                padding: '10px',
+                                width: '35px',
+                                height: '23px',
+                                borderRadius: '5px',
+                                backgroundColor: LayoutOverallColor
+                                  ? LayoutOverallColor
+                                  : null,
                               }}
-                            >
-                              <p style={{ fontSize: '14px', fontWeight: 700 }}>
-                                Selected Color:{' '}
-                              </p>
-                              <div
-                                style={{
-                                  width: '35px',
-                                  height: '23px',
-                                  borderRadius: '5px',
-                                  backgroundColor: LayoutOverallColor
-                                    ? LayoutOverallColor
-                                    : null,
-                                }}
-                              />
-                            </div>
-                            <div className="hex-input">
-                              <InputField
-                                prefix="#"
-                                value={layoutOverallHexCode}
-                                inputMode="numeric"
-                                maxLength={8}
-                                onChange={handleLayoutOverallHexCode}
-                              />
-                            </div>
+                            />
                           </div>
-                        </div>
-
-
-                        <SwatchesPicker
-                          onChange={handleLayoutOverallColorChange}
-                        />
-
-                        <div>
-                          <button
-                            className="colorBtn"
-                            onClick={handleLayoutOverallColorSubmit}
-                          >
-                            SAVE
-                          </button>
-                        </div>
-                      </Modal>
-                      {selectOverallSelected == true && (
-                        <div
-                          style={{
-                            display: 'flex',
-                            gap: '1rem',
-                            flexWrap: 'nowrap',
-                            alignItems: "center"
-                          }}
-                        >
-                          <div className="colorDropdown">
-                            <Form.Item name="LayoutOverallBackground">
-                              <DropDowns
-                                options={LayoutOverallbackgroundlist?.map(
-                                  (option) => ({
-                                    value: option.ColorId,
-                                    label: (
-                                      <div
-                                        style={{ display: 'flex', gap: '0.5rem' }}
-                                      >
-                                        <div
-                                          style={{
-                                            width: '27px',
-                                            height: '27px',
-                                            borderRadius: '25.774192810058594px',
-                                            backgroundColor:
-                                              option.BackgroundColor,
-                                          }}
-                                        >
-                                          <span
-                                            style={{
-                                              width: '27px',
-                                              height: '27px',
-                                              borderRadius: '50px',
-                                              marginLeft: '15px',
-                                              backgroundColor: option.FontColor,
-                                            }}
-                                          >
-                                            &nbsp;&nbsp;&nbsp;
-                                          </span>
-                                        </div>
-                                        <div>{option.ThemeName}</div>
-                                      </div>
-                                    ),
-                                  })
-                                )}
-                                labelChange={true}
-                                label={
-                                  <p style={{ fontSize: '11px' }}>
-                                    Overall Background
-                                  </p>
-                                }
-                                className="field-DropDown-Selection"
-                                onChangeFunction={selectLayoutOverallColor}
-                                isOnchanges={
-                                  dropdownLayoutOverallColor ? true : false
-                                }
-                                valueData={dropdownLayoutOverallColor}
-                              />
-                            </Form.Item>
-                          </div>
-                          <div className='addNewSalesFiledBTN' onClick={handleUploadLayoutOverallBackground}>
-                            Add
-                            <IoMdAdd
-                              className="plusOutlinedIcon"
+                          <div className="hex-input">
+                            <InputField
+                              prefix="#"
+                              value={layoutOverallHexCode}
+                              inputMode="numeric"
+                              maxLength={8}
+                              onChange={handleLayoutOverallHexCode}
                             />
                           </div>
                         </div>
-                      )}
-                    </div>
+                      </div>
+
+                      <SwatchesPicker
+                        onChange={handleLayoutOverallColorChange}
+                      />
+
+                      <div>
+                        <button
+                          className="colorBtn"
+                          onClick={handleLayoutOverallColorSubmit}
+                        >
+                          SAVE
+                        </button>
+                      </div>
+                    </Modal>
+                    {selectOverallSelected == true && (
+                      <div
+                        style={{
+                          display: 'flex',
+                          gap: '1rem',
+                          flexWrap: 'nowrap',
+                          alignItems: 'center',
+                        }}
+                      >
+                        <div className="colorDropdown">
+                          <Form.Item name="LayoutOverallBackground">
+                            <DropDowns
+                              options={LayoutOverallbackgroundlist?.map(
+                                (option) => ({
+                                  value: option.ColorId,
+                                  label: (
+                                    <div
+                                      style={{ display: 'flex', gap: '0.5rem' }}
+                                    >
+                                      <div
+                                        style={{
+                                          width: '27px',
+                                          height: '27px',
+                                          borderRadius: '25.774192810058594px',
+                                          backgroundColor:
+                                            option.BackgroundColor,
+                                        }}
+                                      >
+                                        <span
+                                          style={{
+                                            width: '27px',
+                                            height: '27px',
+                                            borderRadius: '50px',
+                                            marginLeft: '15px',
+                                            backgroundColor: option.FontColor,
+                                          }}
+                                        >
+                                          &nbsp;&nbsp;&nbsp;
+                                        </span>
+                                      </div>
+                                      <div>{option.ThemeName}</div>
+                                    </div>
+                                  ),
+                                })
+                              )}
+                              labelChange={true}
+                              label={
+                                <p style={{ fontSize: '11px' }}>
+                                  Overall Background
+                                </p>
+                              }
+                              className="field-DropDown-Selection"
+                              onChangeFunction={selectLayoutOverallColor}
+                              isOnchanges={
+                                dropdownLayoutOverallColor ? true : false
+                              }
+                              valueData={dropdownLayoutOverallColor}
+                            />
+                          </Form.Item>
+                        </div>
+                        <div
+                          className="addNewSalesFiledBTN"
+                          onClick={handleUploadLayoutOverallBackground}
+                        >
+                          Add
+                          <IoMdAdd className="plusOutlinedIcon" />
+                        </div>
+                      </div>
+                    )}
                   </div>
-                )}
+                </div>
+              )}
             </div>
             <div className="Selection-Component-selectContainerDiv">
               {NavBarCheckList?.length > 0 &&
@@ -3527,7 +3584,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                       <span className="Selection-Component-selectheading">
                         Selected NavBar :
                         <span style={{ color: '#009b00' }}>
-                          <TbLayoutNavbar />  {NavBarCheckList[0]?.ComponentName}
+                          <TbLayoutNavbar /> {NavBarCheckList[0]?.ComponentName}
                         </span>
                       </span>
                     </div>
@@ -3550,18 +3607,18 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 value.OptionName === 'Hold' && NavHoldButton
                                   ? true
                                   : value.OptionName === 'AddCustomer' &&
-                                    NavAddCustomerButton
+                                      NavAddCustomerButton
                                     ? true
                                     : value.OptionName === 'DineIn' &&
-                                      (GlobalPreferenceData?.SettingValue !==
-                                        'Y' ||
-                                        GlobalPreferenceData?.length === 0)
+                                        (GlobalPreferenceData?.SettingValue !==
+                                          'Y' ||
+                                          GlobalPreferenceData?.length === 0)
                                       ? true
                                       : value.OptionName === 'Search'
                                         ? true
                                         : false
                               }
-                            // onClick={() => holdoption(value.OptionName)}
+                              // onClick={() => holdoption(value.OptionName)}
                             >
                               {value.OptionName}
                             </Checkbox>
@@ -3578,7 +3635,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                       <span className="Selection-Component-selectheading">
                         Selected Category:
                         <span style={{ color: '#009b00' }}>
-                          <HiMenuAlt1 />  {CategoryCheckList[0]?.ComponentName}
+                          <HiMenuAlt1 /> {CategoryCheckList[0]?.ComponentName}
                         </span>
                       </span>
                     </div>
@@ -3599,7 +3656,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               key={value?.OptionId}
                               disabled={
                                 value.OptionName === 'ImageRight' &&
-                                  !CatImageSelection
+                                !CatImageSelection
                                   ? true
                                   : false
                               }
@@ -3616,14 +3673,14 @@ const SelectionComponent = forwardRef((props, ref) => {
                         )}
                       </Row>
                     </Checkbox.Group>
-                    <div className='SlecteCatDiv'>
+                    <div className="SlecteCatDiv">
                       <div
                         style={{
                           display: 'flex',
                           flexWrap: 'wrap',
                           flexDirection: 'row',
-                          alignItems: "center",
-                          gap: "1rem"
+                          alignItems: 'center',
+                          gap: '1rem',
                         }}
                       >
                         <div>
@@ -3636,7 +3693,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               },
                             ]}
                           >
-                            <p className='Selection-Component-SubHeading'>
+                            <p className="Selection-Component-SubHeading">
                               Category Font
                             </p>
                             <DropDowns
@@ -3652,12 +3709,12 @@ const SelectionComponent = forwardRef((props, ref) => {
                             />
                           </Form.Item>
                         </div>
-                        <div className='addNewSalesFiledBTN' onClick={CathandleUploadFonts}>
+                        <div
+                          className="addNewSalesFiledBTN"
+                          onClick={CathandleUploadFonts}
+                        >
                           Add
-                          <IoMdAdd
-                            className="plusOutlinedIcon"
-
-                          />
+                          <IoMdAdd className="plusOutlinedIcon" />
                           <DefaultModal
                             open={catModelOpen}
                             title="Fonts"
@@ -3717,7 +3774,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               display: 'flex',
                               gap: '1rem',
                               flexWrap: 'nowrap',
-                              alignItems: "center"
+                              alignItems: 'center',
                             }}
                           >
                             <div className="colorDropdown">
@@ -3730,7 +3787,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                                   },
                                 ]}
                               >
-                                <p className='Selection-Component-SubHeading'>
+                                <p className="Selection-Component-SubHeading">
                                   Category Background Color
                                 </p>
                                 <DropDowns
@@ -3778,12 +3835,12 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={handleUploadColor}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={handleUploadColor}
+                            >
                               Add
-                              <IoMdAdd
-                                className="plusOutlinedIcon"
-
-                              />
+                              <IoMdAdd className="plusOutlinedIcon" />
                             </div>
                           </div>
                         </div>
@@ -3878,7 +3935,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                                   },
                                 ]}
                               >
-                                <p className='Selection-Component-SubHeading'>
+                                <p className="Selection-Component-SubHeading">
                                   Category Overall-Background
                                 </p>
 
@@ -3936,12 +3993,12 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={handlecategoryUploadOverallColor}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={handlecategoryUploadOverallColor}
+                            >
                               Add
-                              <IoMdAdd
-                                className="plusOutlinedIcon"
-
-                              />
+                              <IoMdAdd className="plusOutlinedIcon" />
                             </div>
                           </div>
                         </div>
@@ -3956,7 +4013,8 @@ const SelectionComponent = forwardRef((props, ref) => {
                       <span className="Selection-Component-selectheading">
                         Selected SubCategory:
                         <span style={{ color: '#009b00' }}>
-                          <HiMenuAlt1 />  {SubCategoryCheckList[0]?.ComponentName}
+                          <HiMenuAlt1 />{' '}
+                          {SubCategoryCheckList[0]?.ComponentName}
                         </span>
                       </span>
                     </div>
@@ -3982,12 +4040,8 @@ const SelectionComponent = forwardRef((props, ref) => {
                         )}
                       </Row>
                     </Checkbox.Group>
-                    <div
-                      className='SlecteCatDiv'
-                    >
-                      <div
-                        className='SlecteCatDivSub2'
-                      >
+                    <div className="SlecteCatDiv">
+                      <div className="SlecteCatDivSub2">
                         <div>
                           <Form.Item
                             name="FontSubcat"
@@ -4011,7 +4065,10 @@ const SelectionComponent = forwardRef((props, ref) => {
                             />
                           </Form.Item>
                         </div>
-                        <div className='addNewSalesFiledBTN' onClick={SubcathandleUploadFonts}>
+                        <div
+                          className="addNewSalesFiledBTN"
+                          onClick={SubcathandleUploadFonts}
+                        >
                           Add
                           <IoMdAdd
                             className="plusOutlinedIcon"
@@ -4135,7 +4192,10 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={SubhandleUploadColor}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={SubhandleUploadColor}
+                            >
                               Add
                               <IoMdAdd
                                 className="plusOutlinedIcon"
@@ -4293,7 +4353,10 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={handleSubcategoryUploadOverallColor}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={handleSubcategoryUploadOverallColor}
+                            >
                               Add
                               <IoMdAdd
                                 className="plusOutlinedIcon"
@@ -4420,7 +4483,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                       <span className="Selection-Component-selectheading">
                         Selected Card:
                         <span style={{ color: '#009b00' }}>
-                          <LuCreditCard />  {CardCheckList[0]?.ComponentName}
+                          <LuCreditCard /> {CardCheckList[0]?.ComponentName}
                         </span>
                       </span>
                     </div>
@@ -4445,14 +4508,14 @@ const SelectionComponent = forwardRef((props, ref) => {
                               disabled={
                                 !SmallImage
                                   ? SelectAllPositionImage?.includes(
-                                    value?.OptionId
-                                  )
+                                      value?.OptionId
+                                    )
                                     ? true
                                     : false
                                   : SelectfliterPositionImage?.length < 4
                                     ? SelectfliterPositionImage.includes(
-                                      value?.OptionId
-                                    )
+                                        value?.OptionId
+                                      )
                                       ? true
                                       : false
                                     : ''
@@ -4464,12 +4527,8 @@ const SelectionComponent = forwardRef((props, ref) => {
                         )}
                       </Row>
                     </Checkbox.Group>
-                    <div
-                      className='SlecteCatDiv'
-                    >
-                      <div
-                        className='SlecteCatDivSub2'
-                      >
+                    <div className="SlecteCatDiv">
+                      <div className="SlecteCatDivSub2">
                         <div>
                           <Form.Item
                             name="FontCard"
@@ -4480,7 +4539,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               },
                             ]}
                           >
-                            <p className='Selection-Component-SubHeading'>
+                            <p className="Selection-Component-SubHeading">
                               Card Font
                             </p>
                             <DropDowns
@@ -4496,7 +4555,10 @@ const SelectionComponent = forwardRef((props, ref) => {
                             />
                           </Form.Item>
                         </div>
-                        <div className='addNewSalesFiledBTN' onClick={CardhandleUploadFonts}>
+                        <div
+                          className="addNewSalesFiledBTN"
+                          onClick={CardhandleUploadFonts}
+                        >
                           Add
                           <IoMdAdd
                             className="plusOutlinedIcon"
@@ -4562,7 +4624,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               display: 'flex',
                               gap: '1rem',
                               flexWrap: 'nowrap',
-                              alignItems: "center"
+                              alignItems: 'center',
                             }}
                           >
                             <div className="colorDropdown">
@@ -4575,7 +4637,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                                   },
                                 ]}
                               >
-                                <p className='Selection-Component-SubHeading'>
+                                <p className="Selection-Component-SubHeading">
                                   Card Background Color
                                 </p>
                                 <DropDowns
@@ -4623,12 +4685,12 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={handleUploadColorselectCard}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={handleUploadColorselectCard}
+                            >
                               Add
-                              <IoMdAdd
-                                className="plusOutlinedIcon"
-
-                              />
+                              <IoMdAdd className="plusOutlinedIcon" />
                             </div>
                           </div>
                         </div>
@@ -4724,7 +4786,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                                   },
                                 ]}
                               >
-                                <p className='Selection-Component-SubHeading'>
+                                <p className="Selection-Component-SubHeading">
                                   Card Overall-Background
                                 </p>
                                 <DropDowns
@@ -4781,12 +4843,12 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={handlecardUploadOverallColor}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={handlecardUploadOverallColor}
+                            >
                               Add
-                              <IoMdAdd
-                                className="plusOutlinedIcon"
-
-                              />
+                              <IoMdAdd className="plusOutlinedIcon" />
                             </div>
                           </div>
                         </div>
@@ -4905,7 +4967,8 @@ const SelectionComponent = forwardRef((props, ref) => {
                       <span className="Selection-Component-selectheading">
                         Selected BillTable:{' '}
                         <span style={{ color: '#009b00' }}>
-                          <IoReceiptOutline />  {BillTableCheckList[0]?.ComponentName}
+                          <IoReceiptOutline />{' '}
+                          {BillTableCheckList[0]?.ComponentName}
                         </span>
                       </span>
                     </div>
@@ -4929,12 +4992,12 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 value.OptionName === 'Hold' && HoldButton
                                   ? true
                                   : value.OptionName === 'AddCustomer' &&
-                                    AddCustomerButton
+                                      AddCustomerButton
                                     ? true
                                     : value.OptionName === 'Item'
                                       ? true
                                       : value.OptionName === 'UnpaidBill' &&
-                                        !DineInChecked
+                                          !DineInChecked
                                         ? true
                                         : false
                               }
@@ -4945,12 +5008,8 @@ const SelectionComponent = forwardRef((props, ref) => {
                         )}
                       </Row>
                     </Checkbox.Group>
-                    <div
-                      className='SlecteCatDiv'
-                    >
-                      <div
-                        className='SlecteCatDivSub2'
-                      >
+                    <div className="SlecteCatDiv">
+                      <div className="SlecteCatDivSub2">
                         <div>
                           <Form.Item
                             name="FontTable"
@@ -4961,7 +5020,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               },
                             ]}
                           >
-                            <p className='Selection-Component-SubHeading'>
+                            <p className="Selection-Component-SubHeading">
                               BillTable Font
                             </p>
                             <DropDowns
@@ -4977,58 +5036,57 @@ const SelectionComponent = forwardRef((props, ref) => {
                             />
                           </Form.Item>
                         </div>
-                        <div className='addNewSalesFiledBTN' onClick={TablehandleUploadFonts}>
+                        <div
+                          className="addNewSalesFiledBTN"
+                          onClick={TablehandleUploadFonts}
+                        >
                           Add
-                          <IoMdAdd
-                            className="plusOutlinedIcon"
-
-                          />
-                          
+                          <IoMdAdd className="plusOutlinedIcon" />
                         </div>
                         <DefaultModal
-                            open={TableModelopen}
-                            title="Fonts"
-                            footer={true}
-                            children={
-                              <Form form={Tableform}>
-                                <div className="fontInputs">
-                                  <div>
-                                    <Form.Item
-                                      name="TableFont"
-                                      rules={[
-                                        {
-                                          required: true,
-                                          pattern: /^(?!\s*$).+/,
-                                          message: 'Please Enter Font',
+                          open={TableModelopen}
+                          title="Fonts"
+                          footer={true}
+                          children={
+                            <Form form={Tableform}>
+                              <div className="fontInputs">
+                                <div>
+                                  <Form.Item
+                                    name="TableFont"
+                                    rules={[
+                                      {
+                                        required: true,
+                                        pattern: /^(?!\s*$).+/,
+                                        message: 'Please Enter Font',
+                                      },
+                                      {
+                                        validator: async (_, value) => {
+                                          await validateSafeInput(value); // To block HTML tags & SQL keywords
+                                          return Promise.resolve();
                                         },
-                                        {
-                                          validator: async (_, value) => {
-                                            await validateSafeInput(value); // To block HTML tags & SQL keywords
-                                            return Promise.resolve();
-                                          },
-                                        },
-                                      ]}
-                                    >
-                                      <InputField
-                                        field="TableFont"
-                                        label="Font"
-                                        className="Input"
-                                        fieldState={true}
-                                        fieldApi={true}
-                                        autoComplete="off"
-                                      />
-                                    </Form.Item>
-                                  </div>
+                                      },
+                                    ]}
+                                  >
+                                    <InputField
+                                      field="TableFont"
+                                      label="Font"
+                                      className="Input"
+                                      fieldState={true}
+                                      fieldApi={true}
+                                      autoComplete="off"
+                                    />
+                                  </Form.Item>
                                 </div>
-                                <p style={{ color: 'red' }}>
-                                  * Google Fonts Only
-                                </p>
-                              </Form>
-                            }
-                            handleCancel={TablehandleCancel}
-                            handleSubmit={TablehandleSubmit}
-                            buttonText="SAVE"
-                          />
+                              </div>
+                              <p style={{ color: 'red' }}>
+                                * Google Fonts Only
+                              </p>
+                            </Form>
+                          }
+                          handleCancel={TablehandleCancel}
+                          handleSubmit={TablehandleSubmit}
+                          buttonText="SAVE"
+                        />
                       </div>
                       {SelectedBillTableCheckValues?.filter(
                         (item) =>
@@ -5043,7 +5101,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               display: 'flex',
                               gap: '1rem',
                               flexWrap: 'nowrap',
-                              alignItems: "center"
+                              alignItems: 'center',
                             }}
                           >
                             <div className="colorDropdown">
@@ -5056,7 +5114,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                                   },
                                 ]}
                               >
-                                <p className='Selection-Component-SubHeading'>
+                                <p className="Selection-Component-SubHeading">
                                   BillTable Background Color
                                 </p>
                                 <DropDowns
@@ -5106,12 +5164,12 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={BillhandleUploadColor}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={BillhandleUploadColor}
+                            >
                               Add
-                              <IoMdAdd
-                                className="plusOutlinedIcon"
-
-                              />
+                              <IoMdAdd className="plusOutlinedIcon" />
                             </div>
                           </div>
                         </div>
@@ -5194,7 +5252,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                               display: 'flex',
                               gap: '1rem',
                               flexWrap: 'nowrap',
-                              alignItems: "center"
+                              alignItems: 'center',
                             }}
                           >
                             <div className="colorDropdown">
@@ -5207,7 +5265,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                                   },
                                 ]}
                               >
-                                <p className='Selection-Component-SubHeading'>
+                                <p className="Selection-Component-SubHeading">
                                   BillTable Overall-Background
                                 </p>
                                 <DropDowns
@@ -5264,7 +5322,10 @@ const SelectionComponent = forwardRef((props, ref) => {
                                 />
                               </Form.Item>
                             </div>
-                            <div className='addNewSalesFiledBTN' onClick={handleBillingUploadOverallColor}>
+                            <div
+                              className="addNewSalesFiledBTN"
+                              onClick={handleBillingUploadOverallColor}
+                            >
                               Add
                               <IoMdAdd
                                 className="plusOutlinedIcon"
@@ -5405,7 +5466,7 @@ const SelectionComponent = forwardRef((props, ref) => {
                   //       (empData?.UpdateAccess === "Y" || SAAccessCommonMaster?.UpdateAccess === "Y") &&
                   //       Object.keys(templateData)?.length > 0
                   //     ))}
-                  icon={<ArrowRightOutlined color='#fff' />}
+                  icon={<ArrowRightOutlined color="#fff" />}
                   htmlType={true}
                 />
               </div>
diff --git a/src/Pages/BookingScreen/Components/OtherConponents/Reprint/BSReprint.jsx b/src/Pages/BookingScreen/Components/OtherConponents/Reprint/BSReprint.jsx
index 0c73699..9bb884b 100644
--- a/src/Pages/BookingScreen/Components/OtherConponents/Reprint/BSReprint.jsx
+++ b/src/Pages/BookingScreen/Components/OtherConponents/Reprint/BSReprint.jsx
@@ -30,7 +30,7 @@ import {
   SelectedPrintTemplate,
   GlobalPrinterMappingDtls,
   getPrinterMappingDetails,
-  getPrintSelectionComponentData,
+  // getPrintSelectionComponentData,
 } from '../../../../../Features/ThemeChange/ThemeChange';
 import FormHeader from '../../../../../Pages/PageComponents/FormHeader';
 import { ArrowRightOutlined } from '@ant-design/icons';
@@ -82,10 +82,14 @@ import {
 import { TbSettingsCog } from 'react-icons/tb';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { axiosRetailInstanceData } from '../../../../../Features/AuthenicationToken/AuthenticationToken.js';
-import { MdEdit } from "react-icons/md";
+import { MdEdit } from 'react-icons/md';
 import { v4 as uuidv4 } from 'uuid';
 import { changeOrderOfferDetail } from '../../../../../Features/Offer/Offer.js';
-import { ChangeFullFreeProductList, changeFullOfferAppliedProducts, changeLoyaltyConsumedQuantities } from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
+import {
+  ChangeFullFreeProductList,
+  changeFullOfferAppliedProducts,
+  changeLoyaltyConsumedQuantities,
+} from '../../../../../Features/Offer/Offernew/BookingOffernew.js';
 import { ChangeTotalAmount } from '../../../../../Features/ExteraCharges/ExtraCharges.js';
 import { Radio } from 'antd';
 import ReprintPDFDataShare from './ReprintPDFDataShare.jsx';
@@ -93,7 +97,7 @@ import { ImShare } from 'react-icons/im';
 
 const RetailApiurl = import.meta.env.ENV_API_URL;
 
-function BSReprint({ setOpenModel = () => { } }) {
+function BSReprint({ setOpenModel = () => {} }) {
   const dispatch = useDispatch();
   const queryClient = useQueryClient();
   const appPreferences = useSelector(ApplicationPreferences);
@@ -167,7 +171,7 @@ function BSReprint({ setOpenModel = () => { } }) {
   const AuthToken = sessionStorage.getItem('auth');
   const SessionMobileNo = getSession('MobileNo');
   const [dateStrings, setDateStrings] = useState([]);
-  const [type, setType] = useState("Sales");
+  const [type, setType] = useState('Sales');
   const [showShareModal, setShowShareModal] = useState(false);
   // ---- 1. Fetch Function ----
   const fetchData = async ({ queryKey }) => {
@@ -180,7 +184,7 @@ function BSReprint({ setOpenModel = () => { } }) {
         OrderFromDate: dates?.[0] ?? '',
         OrderToDate: dates?.[1] ?? '',
         PageNumber: page,
-        Type: type
+        Type: type,
       })
     ).unwrap();
     if (Response?.data?.statusCode === 1) {
@@ -263,9 +267,8 @@ function BSReprint({ setOpenModel = () => { } }) {
       // UserId: UserId,
     };
     dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
-
+    // const Data1 = { AppId, CompId, BranchId };
+    // dispatch(getPrintSelectionComponentData(Data1)).unwrap();
   }, []);
 
   const handleDateChange = (dates, dateStrings) => {
@@ -604,7 +607,7 @@ function BSReprint({ setOpenModel = () => { } }) {
 
     const selectedStyle =
       stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
+        printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
       ];
     if (selectedStyle) {
       if (data === 'without') {
@@ -950,9 +953,8 @@ function BSReprint({ setOpenModel = () => { } }) {
           onClick={async (e) => await handleEditBill(e, row)}
         />
       ),
-    }
+    },
     // ] : [])
-    ,
     {
       title: () => (
         <div
@@ -1252,15 +1254,16 @@ function BSReprint({ setOpenModel = () => { } }) {
     const isWeightScale = item?.ScaleType === 'weight';
 
     if (isWeightScale) {
-      return acc + (
-        Weightasquantity
+      return (
+        acc +
+        (Weightasquantity
           ? Math.round(Number(item?.SalesQty || item?.OrderQty || 0))
-          : 1
+          : 1)
       );
     }
 
     return acc + Math.round(Number(item?.SalesQty || item?.OrderQty || 0));
-  }, 0)
+  }, 0);
 
   const widthOutTexAmt = table2Data?.[0]?.TaxDetails?.reduce(
     (sum, item) => sum + (item?.WithOutTaxAmount || 0),
@@ -1292,7 +1295,7 @@ function BSReprint({ setOpenModel = () => { } }) {
       OrderQty: item?.SalesQty,
       OrderRate: item?.Rate,
       SellingPrice: item?.Rate,
-      TaxPercentage: (item?.ProdTaxPercentage || 0)
+      TaxPercentage: item?.ProdTaxPercentage || 0,
       // TotalAmt: formatAmount((item.TotalAmt - item.OfferValue)),
     }));
 
@@ -1302,14 +1305,10 @@ function BSReprint({ setOpenModel = () => { } }) {
 
     if (RefDetails?.[0]?.OfferAppliedProductList) {
       dispatch(
-        changeFullOfferAppliedProducts(
-          RefDetails[0]?.OfferAppliedProductList
-        )
+        changeFullOfferAppliedProducts(RefDetails[0]?.OfferAppliedProductList)
       );
     }
 
-
-
     if (CustSuppId) {
       let res = await dispatch(
         getCustomerForHold({
@@ -1331,8 +1330,9 @@ function BSReprint({ setOpenModel = () => { } }) {
       }
 
       if (res?.data?.statusCode === 1) {
-
-        const loyaltyFreeProductOfferApplied = (RefDetails?.[0]?.OfferAppliedProductList || [])?.filter(
+        const loyaltyFreeProductOfferApplied = (
+          RefDetails?.[0]?.OfferAppliedProductList || []
+        )?.filter(
           (off) =>
             off?.FreeProductsList?.OfferMode === 'L' &&
             off?.TableUniqueName === 'FreeProduct'
@@ -1343,14 +1343,20 @@ function BSReprint({ setOpenModel = () => { } }) {
         );
 
         if (customerDetails) {
-          const { CustId, CustName, CustMobile, LoyaltyPointsDetail, TotalLoyaltyPoints } = customerDetails;
+          const {
+            CustId,
+            CustName,
+            CustMobile,
+            LoyaltyPointsDetail,
+            TotalLoyaltyPoints,
+          } = customerDetails;
           const data = {
             CustId: CustId,
             CustName: CustName,
             label: CustName ? CustName : CustMobile,
             value: CustMobile,
             LoyaltyPointsDetail: LoyaltyPointsDetail,
-            TotalLoyaltyPoints: TotalLoyaltyPoints
+            TotalLoyaltyPoints: TotalLoyaltyPoints,
           };
 
           dispatch(changeOrderOfferDetail([...OrderOfferDetails]));
@@ -1383,7 +1389,6 @@ function BSReprint({ setOpenModel = () => { } }) {
             console.log(loyaltyProdQuantities, 'loyaltyProdQuantities');
           }
         }
-
       }
     }
     await dispatch(changeOrderType('Hold'));
@@ -1395,7 +1400,8 @@ function BSReprint({ setOpenModel = () => { } }) {
     await dispatch(changePreviousOrderPayment(OrderPaymentDtl));
     await dispatch(changePreviousOrderOfferDetail(OrderOfferDetails));
     dispatch(changeOrderCardDetails(updated));
-    let temp = updated?.filter((item) => item.OrderType === 'E')
+    let temp = updated
+      ?.filter((item) => item.OrderType === 'E')
       .map((item) => item.InwardDtlId + ' ' + item.BookingTypeName);
     await dispatch(changeSelProdWiseEst(temp));
 
@@ -1406,11 +1412,11 @@ function BSReprint({ setOpenModel = () => { } }) {
       await dispatch(changeEstimateBooking('Sales'));
       await dispatch(ChangeOverAllDiscSales(parseFloat(OverallDisc)));
     }
-  }
+  };
 
   const typeOptions = [
-    { label: "Sales", value: "Sales" },
-    { label: "Estimate", value: "Est" },
+    { label: 'Sales', value: 'Sales' },
+    { label: 'Estimate', value: 'Est' },
   ];
 
   const typeChange = (e) => {
@@ -1455,15 +1461,17 @@ function BSReprint({ setOpenModel = () => { } }) {
       />
       <div style={{ width: '100%' }}>
         <div className="bsreprintmodaltable-flex">
-          {preferenceEstimate && <div>
-            <Radio.Group
-              options={typeOptions}
-              onChange={typeChange}
-              value={type}
-              optionType="button"
-              buttonStyle="solid"   // optional
-            />
-          </div>}
+          {preferenceEstimate && (
+            <div>
+              <Radio.Group
+                options={typeOptions}
+                onChange={typeChange}
+                value={type}
+                optionType="button"
+                buttonStyle="solid" // optional
+              />
+            </div>
+          )}
           <div>
             <RangePicker
               placeholder={['Start Date', 'End Date']}
@@ -1493,7 +1501,11 @@ function BSReprint({ setOpenModel = () => { } }) {
             }}
           />
           <div>
-            <ImShare fontSize={22} onClick={() => setShowShareModal(true)} style={{ cursor: 'pointer' }} />
+            <ImShare
+              fontSize={22}
+              onClick={() => setShowShareModal(true)}
+              style={{ cursor: 'pointer' }}
+            />
           </div>
           <div>
             {selectedRows.length > 0 && (
@@ -1507,9 +1519,6 @@ function BSReprint({ setOpenModel = () => { } }) {
                   onClick={() => mutiplePrint('whatsapp')}
                   className="icon-whatsapp"
                 />
-                {/* <ReprintPDFDataShare
-                  printData={selectedRows}
-                /> */}
               </div>
             )}
           </div>
@@ -1519,7 +1528,7 @@ function BSReprint({ setOpenModel = () => { } }) {
           <Tables
             columns={columns}
             data={filteredData}
-          // pagination={handlePageChange}
+            // pagination={handlePageChange}
           />
           {countOfProduct > 10 && (
             <Pagination
@@ -1856,13 +1865,15 @@ function BSReprint({ setOpenModel = () => { } }) {
           </div>
         ))}
 
-      {showShareModal && <ReprintPDFDataShare
-        printerTemplateStyle={printerTemplateStyle}
-        printDatas={printDatas}
-        SettingDataSelector={SettingDataSelector}
-        open={showShareModal}
-        onClose={() => setShowShareModal(false)}
-      />}
+      {showShareModal && (
+        <ReprintPDFDataShare
+          printerTemplateStyle={printerTemplateStyle}
+          printDatas={printDatas}
+          SettingDataSelector={SettingDataSelector}
+          open={showShareModal}
+          onClose={() => setShowShareModal(false)}
+        />
+      )}
     </>
   );
 }
diff --git a/src/Pages/Product/ProductForm.jsx b/src/Pages/Product/ProductForm.jsx
index 2e979ab..1ee090d 100644
--- a/src/Pages/Product/ProductForm.jsx
+++ b/src/Pages/Product/ProductForm.jsx
@@ -85,6 +85,7 @@ import {
 } from '../../Features/BrachLogin/BranchLogin.js';
 import RackForm from '../Rack/RackForm.jsx';
 import { isMobile } from 'react-device-detect';
+import BarCodeScan from '../../Services/BarCodeScan.jsx';
 const subDirectory = import.meta.env.ENV_BASE_URL;
 
 const ProductForm = ({ formType }) => {
@@ -818,12 +819,19 @@ const ProductForm = ({ formType }) => {
     // dispatch(changeSetup_OfferValue(e?.target?.value))
   };
   const handleInput = async (val) => {
-    if (val?.target?.value?.length >= 5) {
+    // normalize whether we receive an event (e.target.value) or a raw string
+    const inputVal = val && val.target && typeof val.target.value === 'string' ? val.target.value : val;
+    if (!inputVal) return;
+
+    if (inputVal.length >= 5) {
       let QRCodeData = await dispatch(
-        getQrcodeData({ QRCode: val?.target?.value })
+        getQrcodeData({ QRCode: inputVal })
       ).unwrap();
+
       if (QRCodeData?.data?.statusCode == 0) {
-        await setQrcodeFinalVal(val?.target?.value);
+        // valid & unique - update component state and the form field
+        setQrcodeFinalVal(inputVal);
+        formRef.current?.setFieldsValue({ QRCode: inputVal });
       } else {
         let existsQrcodeData = QRCodeData?.data?.data?.filter(
           (item) =>
@@ -831,17 +839,18 @@ const ProductForm = ({ formType }) => {
             item.CompId === CompId &&
             item.BranchId === BranchId
         );
+
         if (existsQrcodeData?.length > 0) {
           setQrcodeFinalVal(null);
           formRef.current?.setFieldsValue({ QRCode: null });
           setQrcodeExistsVal(existsQrcodeData?.[0]?.QRCode);
-
           setMessageType('error');
           setMessageData('Qrcode Already Exists');
         } else {
           setQrcodeExistsData(QRCodeData.data?.data);
           setQrcodeExistsDataOpen(true);
-          await setQrcodeFinalVal(val?.target?.value);
+          setQrcodeFinalVal(inputVal);
+          formRef.current?.setFieldsValue({ QRCode: inputVal });
           setQrcodeAuto('N');
         }
       }
@@ -2685,11 +2694,19 @@ const ProductForm = ({ formType }) => {
                                     autoComplete="off"
                                     label="Scanner / AddQrcode"
                                     onKeyPress={handleKeyPress}
+                                    value={QrcodeFinalVal}
                                     valueData={QrcodeFinalVal}
                                     isOnChange={QrcodeFinalVal ? true : false}
                                     onChange={handleInput}
                                     disabled={editstate?.QRCode ? true : false}
                                   />
+                                  {isMobile &&
+                                  <BarCodeScan
+                                      onScan={(value) => {
+                                      handleInput(value);
+                                       }}
+                                      />
+                                  }
                                   {QrcodeExistsVal && QrcodeExistsVal}
                                 </Form.Item>
                               </div>
@@ -2904,6 +2921,7 @@ const ProductForm = ({ formType }) => {
                                           autoComplete="off"
                                           label="Scanner / AddOnePcQrcode"
                                           onKeyPress={handleKeyPressSingle}
+                                          value={QrcodeSingleFinalVal}
                                           valueData={QrcodeSingleFinalVal}
                                           isOnChange={
                                             QrcodeSingleFinalVal ? true : false
diff --git a/src/check.jsx b/src/check.jsx
index 941f1c0..dca963e 100644
--- a/src/check.jsx
+++ b/src/check.jsx
@@ -1,4608 +1,7758 @@
-import React, { useEffect, useState, useRef } from 'react';
-import { FaWhatsapp, FaPrint, FaParking, FaCartPlus } from 'react-icons/fa';
-import { useDispatch, useSelector } from 'react-redux';
-import { useNavigate } from 'react-router-dom';
+import React, {
+  lazy,
+  Suspense,
+  useCallback,
+  useEffect,
+  useRef,
+  useState,
+} from 'react';
+import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import moment from 'moment';
-import { Badge, Popover, Modal, Tooltip } from 'antd';
-import { AiOutlineClose, AiOutlineArrowRight } from 'react-icons/ai';
-import { GiBasket } from 'react-icons/gi';
+import { Badge, Tooltip } from 'antd';
+import defaultimage from '../../../../Images/defaultItemImg.png';
+import FormHeader from '../../../PageComponents/FormHeader';
 import {
-  UpCircleOutlined,
-  UpOutlined,
-  TransactionOutlined,
-} from '@ant-design/icons';
-import {
-  printDiv,
-  extractLastNumberOrderId,
-  encryptObject,
-} from '../../../../Services/Others';
-import PaymentPdfBooking from '../../../paymentpdfPage/PaymentPdfBooking';
-import { Messages } from '../../../../Components/Notifications/Messages';
-import { MdMoneyOff } from 'react-icons/md';
-import paygate from '../../../../Images/paygate.png';
-import defaultupi from '../../../../Images/defaultupi.png';
-import paydevice from '../../../../Images/paydevice.png';
-import paymentFailure from '../../../../Images/payment-failure2.png';
-import BSSummery1 from '../BSBillingTables/BSBillingTableSummery/BSSummery';
-import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
+  SelectedGlobalCardColorDetail,
+  SelectedGlobalCardFont,
+  StoredSessionData,
+  getTemplateData,
+} from '../../../../Features/ThemeChange/ThemeChange';
 import { Tables } from '../../../../Components/Tables/Table';
-import QrComponent from '../BookingFunctionality/DynamicQr.jsx';
-import QrinScreen from '../BookingFunctionality/DynamicScreenQr.jsx';
-import { ArrowRightOutlined } from '@ant-design/icons';
-import Buttons from '../../../../Components/Forms/Buttons';
-import WpIcon from '../../../../Images/message.png';
-import '../../../../Styles/BookingScreen/Template/BSLayout7/BSC1Payment.scss';
-import '../../../../Styles/BookingScreen/Template/BSLayout7/CustomFloatMenu.scss';
-import PozoPreOrderIcon from '../UtillComponents/Pozo retail icons/PozoPreOrderIcon.jsx';
 import {
+  GlobalProductSubCategorie,
+  GlobalItemCard,
+  getLayoutproductCard,
   GlobalOrderCardDetails,
   changeOrderCardDetails,
-  GlobalCustId,
-  PostBookingData,
-  GlobalSelectedTableDetails,
+  changeSearchedData,
+  ChangeAllItemData,
+  GlobalAllItemData,
+  GlobalCardAccess,
+  getSelectedFavItems,
+  GlobalSelectedDatas,
+  GlobalEditfavItems,
+  GlobalAccessForOthers,
+  GlobalAlldat,
+  Globalothersdata,
+  GlobalProductCategorie,
+  getCardDataWithoutSub,
+  changeothersdata,
+  ChangeNewQrProduct,
+  GlobalWSProduct,
+  GlobalNewQrProduct,
   GlobalBookingType,
-  changeBookingType,
-  getConfigType,
-  PutBookingData,
+  GlobalSearchData,
+  getCardDataWithoutSubmodule,
+  changePreviousOrderLength,
+  changeHoldOrderDtl,
   GlobalReorderHoldDetails,
-  getUnpaidData,
-  changeReorderHoldDetails,
-  ChangeNavHoldData,
-  GlobalReprintModal,
-  changeSelectedTableDetails,
-  GlobalNavHoldData,
-  getPreferenceData,
-  changeSelectedCustId,
-  GlobalSelCustId,
-  changeSelectedOption,
-  GlobalSelOption,
-  changeCustomerID,
-  changeCompoPaymentIconStatus,
-  getSalesDetailData,
-  SendPaymentLink,
-  changeSummeryTotalAmount,
-  changeCreditFocus,
-  changeUpiIDprint,
-  GlobalSelectedCustDisable,
-  changeSummeryTotalItems,
-  changeSummeryQty,
-  changeSummeryTotalWithoutTaxAmount,
-  changeSummeryTotalTaxAmount,
-  GlobalEstimateBooking,
-  GlobalSelProdWiseEst,
-  changeSelProdWiseEst,
-  changeEstimateBooking,
-  GlobalUpiIDprint,
-  GlobalUpiIDName,
-  GlobalUpiIDoptionId,
-  GlobalBookingTypeBoth,
-  changeSelectTable,
-  changeSelectChair,
+  GlobalWeightScalePort,
+  GlobalWeightScaleWeight,
+  GlobalExpDateforHeight,
   GlobalOrderType,
-  changeReorderProductDetails,
-  FeatureAddon,
-  GlobalCommonPaymentOptions,
-  PostPaymentdevice,
-  changeUpiIDName,
-  changeUpiIDoptionId,
-  GetPaymentdeviceResponse,
-  PutBookingPaymentStatusChange,
-  changeCombosearch,
-  GlobalCombosearch,
-  Comboget,
+  GlobalReorderProductDetails,
+  getConfigType,
   GlobalPayementloader,
-  changePaymentloader,
-  PaymentGatewayGetdetail,
-  changePaymentTransactionNumber,
-  Globalunpaidflow,
-  changeunpaidflow,
-  PutPendingPaymentList,
-  changealldata,
+  GlobalPaymentTransactionNumber,
   PreferenceData,
-  changeOrderType,
-  putSplitpaymentStatus,
-  GlobalFailedTotalAmt,
-  GlobalOverAllDiscEstimate,
-  GlobalOverAllDiscSales,
-  ChangeOverAllDiscSales,
-  ChangeOverAllDiscEstimate,
-  GlobalUnpaidListData,
-  changeUnpaidData,
-  getAllCustomer,
-  GlobalBranchFinancialStatus,
-  changeSummeryComboOfferAmount,
-  changeTipAmount,
-  GlobaltipAmount,
-  GlobalFeatAddOnData,
-  GlobalOtherServiceTicketClaim,
-  changeOtherServiceTicketClaim,
-  GlobalOtherSevices,
-  changeOtherServices,
-  changeComboRedirectionToDefaultLayoutForParking,
+  changeCardData,
+  GlobaldraggingComponent,
+  GlobalisAlphabeticFormat,
+  GlobalBtoBQuickProductTransfer,
+  changeBtoBQuickProductTransfer,
   GlobalRetailWSSalesType,
-  GlobalCurrentOrderId,
-  changeCurrentOrderId,
-  getCreditCustomer,
-  ChangeSelectedCustDisable,
+  GlobalisFavClicked,
+  GlobalCategorieData,
+  GlobalSubcategorieData,
+  GlobalProductCardTrigger,
+  GlobalGetmultipleSearchDatas,
+  getmultipleSearch,
+  GlobalAllBookingType,
 } from '../../../../Features/BookingScreen/BookingData/BookingData';
-import { PrintStyleFunction } from '../../../paymentpdfPage/PrintStyleFunction.js';
 import {
-  gettinghold,
-  globalholddata,
-  changeholddata,
-} from '../../../../Features/BookingScreen/HoldOption/HoldOption';
-
-import {
-  changetemplateData,
-  SelectedPrintTemplate,
-  StoredSessionData,
-  GlobalprintDatas,
-  GlobalPrinterMappingDtls,
-  getPrinterMappingDetails,
-  getPrintSelectionComponentData,
-} from '../../../../Features/ThemeChange/ThemeChange';
-import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities';
-import {
-  globalExtraTotalAmount,
-  ChangeTotalAmount,
-} from '../../../../Features/ExteraCharges/ExtraCharges';
-import {
-  getAddCustomerDetails,
-  GlobalAddCustomerDetails,
-} from '../../../../Features/BookingScreen/Customer/addCustomer';
-import BSCustomerSelect from '../UtillComponents/BSSelectCustomer.jsx';
-import PozoHoldIcon from '../UtillComponents/Pozo retail icons/PozoHoldIcon';
-import PozoDineInIcon from '../UtillComponents/Pozo retail icons/PozoDineIn.jsx';
-import PozoUnpaidIcon from '../UtillComponents/Pozo retail icons/PozoUnpaidIcon.jsx';
-import PozoBillIcon from '../UtillComponents/Pozo retail icons/PozoBIllIcon.jsx';
-import PozoTakeAway from '../UtillComponents/Pozo retail icons/PozoTakeAwayIcon';
-import PozoQuickAddIcon from '../UtillComponents/Pozo retail icons/PozoQuickAddIcon.jsx';
-import PozoReprintIcon from '../UtillComponents/Pozo retail icons/PozoReprintIcon';
-import PozoExtraChargesIcon from '../UtillComponents/Pozo retail icons/PozoExtraChargesIcon.jsx';
-import PozoAddCustomerIcon from '../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
-import BsBillingCreditCustomer from '../BookingFunctionality/BSBillingCreditCustomer.jsx';
-import { TfiMoreAlt } from 'react-icons/tfi';
-import BSCreditCustomer from '../UtillComponents/BSCreditCustomer.jsx';
-import PozoAdvanceIcon from '../UtillComponents/Pozo retail icons/PozoAdvanceIcon.jsx';
-import { isMobile } from 'react-device-detect';
-import MobilePrint from '../BookingFunctionality/MobilePrint.jsx';
-import SplitPayment from '../BookingFunctionality/SplitPayment.jsx';
-import BSNavBarEstimate from '../UtillComponents/BSNavBarEst.jsx';
-import CountUp from 'react-countup';
-import BSNavBarPreOrder from '../UtillComponents/BSComboNavBarPreOrder.jsx';
-import { GlobalpreOrderOpen } from '../../../../Features/BookingScreen/PreOrder/PreOrder.js';
-import TokensinglePrint from '../../../paymentpdfPage/TokenOnlyPrints/TokeninsinglePrint.jsx';
-import SingleTokenMobilePrint from '../BookingFunctionality/SingleTokenMobilePrint.jsx';
-import IndividualTokenMobilePrint from '../BookingFunctionality/IndividualTokenMobilePrint.jsx';
-import { getCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
-import {
-  GlobalPreOrderPendingCount,
-  PreOrderGet,
-  changePreOrderPendingCount,
-  changepreOrder,
-  changePreOrderAdditem,
+  GlobalPreOrderAdditem,
+  GlobalPreOrderList,
+  GlobalpreOrderOpen,
   changepreOrderList,
-  changePreOrderCusName,
-  changePreOrderCusMob,
-  changePreOrderDate,
-  changePreOrderTime,
-  changePreOrderAdd1,
-  changePreOrderAdd2,
-  changePreOrderAdvance,
-  changePreOrderzip,
-  changePreOrderCity,
-  changePreOrderDistrict,
-  changePreOrderState,
-} from '../../../../Features/BookingScreen/PreOrder/PreOrder.js';
-import PaymentFailedSales from '../../../Payment/PaymentFailedDetails/PaymentFailedSales.jsx';
-import PozoSplitPaymentIcon from '../UtillComponents/Pozo retail icons/PozoSplitPaymentIcon.jsx';
-import PozoFailedPaymentsIcon from '../UtillComponents/Pozo retail icons/PozoFailedPaymentsIcon.jsx';
+} from '../../../../Features/BookingScreen/PreOrder/PreOrder';
+import { DefaultModal } from '../../../../Components/Modal/DefaultModal';
+import { Messages } from '../../../../Components/Notifications/Messages';
+import '../../../../Styles/BookingScreen/Components/BSItemCards/BSItemCard.scss';
+import WebFont from 'webfontloader';
+import FeaturesFunctionalities from '../BookingFunctionality/FeaturesFunctionalities';
+import { isMobile } from 'react-device-detect';
 import {
-  Global_CoupenCodeAmount,
-  Global_loyaltyPointsDiscountAmount,
   Global_OrderOfferDetail,
-  Global_OverallOfferAmount,
-  Global_SalesWiseOfferAmount,
-} from '../../../../Features/Offer/Offer.js';
-import { useApplyOfferto_CardDetail } from '../UtillComponents/BSNavBarOffer/BSNavBarOffer_CustomHooks.jsx';
-import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
-import BSNavBarOffer from '../UtillComponents/BSNavBarOffer/BSNavBarOffer.jsx';
-import { getEmpAccess } from '../../../../Features/AppPage/CenterPage.js';
-import { useAuth } from '../../../../AuthContext.jsx';
-import { GlobalBookingStatus } from '../../../../Features/Payment/PaymentReceivedRetail/PaymentReceivedRetail.js';
-import WhatsAppShare from '../../../WhatsAppShare/whatsAppShare.jsx';
-import CryptoJS from 'crypto-js';
-import SMSShare from '../../../WhatsAppShare/SmsShare.jsx';
-import { MdSms } from 'react-icons/md';
+  Global_PromoCodeOffers,
+} from '../../../../Features/Offer/Offer';
 import {
-  changeSalesPaymentoption,
-  GlobalSalesPaymentoption,
-} from '../../../../Features/Payment/Paymentoptions/Paymentoptions.js';
-import Paymentoption from '../../../Payment/PaymentOptions/PaymentOptions.jsx';
-import BSTipAmount from '../UtillComponents/BSTipAmount.jsx';
+  DndContext,
+  useSensor,
+  useSensors,
+  PointerSensor,
+  TouchSensor,
+  closestCenter,
+} from '@dnd-kit/core';
+import {
+  SortableContext,
+  arrayMove,
+  rectSortingStrategy,
+} from '@dnd-kit/sortable';
+import { v4 as uuidv4 } from 'uuid';
+
+import { useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import { MdOutlineAddShoppingCart } from 'react-icons/md';
+// Js Files
+import {
+  changeFreeProductForLoyalty,
+  ChangeFreeProductList,
+  ChangeFullFreeProductList,
+  changeFullOfferAppliedProducts,
+  ChangeOfferAppliedProducts,
+  changeOfferAppliedProductsForLoyalty,
+  changeTriggerOfferFree,
+  getOfferinBooking,
+  GlobalFreeProdList,
+  GlobalOfferAppliedProducts,
+  GlobalTriggerOfferFree,
+  RemoveOfferAppliedProduct,
+} from '../../../../Features/Offer/Offernew/BookingOffernew.js';
+import { ExtractDateFormate } from '../../../../Services/Others.js';
 import { ApplicationPreferences } from '../../../../Features/BrachLogin/BranchLogin.js';
-import BSOtherServiceClaim from '../UtillComponents/BSOtherServiceClaim.jsx';
-import { OtherServicesCardlistdata } from '../../../../Features/OtherServices/OtherServices.js';
-import { MobilePdfPrint } from '../BookingFunctionality/MobilePdfPrint.js';
-import { PublicQrCodepost } from '../../../../Features/ConfigMasterPage/ConfigMasterPage.js';
-import BSMembership from '../UtillComponents/BSMembership.jsx';
-import CardPopover from '../BSBillingTables/StandardTable/Utils/CardPopover.jsx';
-import UpiPopover from '../BSBillingTables/StandardTable/Utils/UpiPopOver.jsx';
 import { useDateStore } from '../../../../Features/BookingScreen/BookingData/DateStore.js';
-import { getPaymentOptionsData } from '../../../../Features/BookingScreen/BookingData/KioskBookingData.js';
-import CustomerOrders from '../BookingFunctionality/CustomerOrders.jsx';
+import { bulkpostdata } from '../../../../Features/ProductPage/ProductPage.js';
+// Jsx Files
+const VoiceToTextItemCard = lazy(
+  () => import('../../../VoiceToText/VoiceToTextItemCard.jsx')
+);
+const validateOffers = lazy(() => import('./ValidateOffer.jsx'));
+const AddProduct = lazy(
+  () => import('../../../../Components/AddProduct/AddProduct.jsx')
+);
+const ProductPriceChange = lazy(
+  () => import('../UtillComponents/ProductPriceChange.jsx')
+);
+const ExpireConfirmModal = lazy(
+  () => import('../BookingFunctionality/ExpireConfirmModal.jsx')
+);
+import { useSaleswiseOfferWatcher } from './SalesWiseOffer.jsx';
 
-const subDirectory = import.meta.env.ENV_BASE_URL;
-const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
-const RetailApiurl = import.meta.env.ENV_API_URL;
-
-const currentDateValue = moment().format('YYYY-MM-DD HH:mm:ss');
-
-const BSC1Payment = (props) => {
-  const isF4Pressed = useRef(false);
-  const applyOffer = useApplyOfferto_CardDetail();
-  const { SadminuserAccess } = useAuth();
-  let SAAccessCommonMaster = SadminuserAccess?.find(
-    (e) => e?.MenuName === 'Sales'
+export function SortableCard({ id, children, item }) {
+  const {
+    attributes,
+    listeners,
+    setNodeRef,
+    transform,
+    transition,
+    isDragging,
+  } = useSortable({ id });
+  const style = {
+    transform: CSS.Transform.toString(transform),
+    transition,
+    opacity: isDragging ? 0.5 : 1,
+    userSelect: 'none', // Prevents text selection during drag
+    // Add mobile-specific cursor and visual feedback
+    cursor: isMobile ? 'grab' : 'default',
+    // Add a subtle shadow for mobile to indicate draggability
+    boxShadow: isMobile && !isDragging ? '0 2px 4px rgba(0,0,0,0.1)' : 'none',
+  };
+  const draggingComponent = useSelector(GlobaldraggingComponent);
+  const allowDrag = draggingComponent === 'card';
+  return (
+    <div
+      ref={setNodeRef}
+      style={style}
+      {...(allowDrag ? attributes : {})}
+      {...(allowDrag ? listeners : {})}
+    >
+      {children}
+    </div>
   );
+}
 
-  const dispatch = useDispatch();
-  const navigate = useNavigate();
-  const SessionData = useSelector(StoredSessionData);
-  const BranchFinancialStatus = useSelector(GlobalBranchFinancialStatus);
-  const globalTipAmount = useSelector(GlobaltipAmount);
-  const OtherServiceTicketClaim = useSelector(GlobalOtherServiceTicketClaim);
-  const RetailWSSalesType = useSelector(GlobalRetailWSSalesType);
-  const BranchId = SessionData?.BranchId;
-  const AppName = SessionData?.AppName;
-  const AppId = SessionData?.AppId;
-  const CompId = SessionData?.CompId;
-  const UserId = SessionData?.UserId;
-  const UserType = SessionData?.UserType;
-  const AuthToken = SessionData?.AuthToken;
-  const SessionMobileNo = SessionData?.SessionMobileNo;
-  const [open, setOpen] = useState(false);
-  const printerTemplateStyle = useSelector(SelectedPrintTemplate);
-  const SelectedTableDetails = useSelector(GlobalSelectedTableDetails);
-  const Custdisable = useSelector(GlobalSelectedCustDisable);
-  const OrderCardDetail = useSelector(GlobalOrderCardDetails);
-  const GlobalExtraCharge = useSelector(globalExtraTotalAmount);
-  const ReportholdData = useSelector(GlobalReorderHoldDetails);
-  const ReprintModal = useSelector(GlobalReprintModal);
-  const GetCustId = useSelector(GlobalCustId);
-  const GlobalUpiID = useSelector(GlobalUpiIDprint);
-  const SelCustId = useSelector(GlobalSelCustId);
-  const selOption = useSelector(GlobalSelOption);
-  const Holddata = useSelector(globalholddata);
-  const BookingType = useSelector(GlobalBookingType);
-  const BookingTypeBoth = useSelector(GlobalBookingTypeBoth);
-  const OrderType = useSelector(GlobalOrderType);
-  const GlobalAddCustomerDetails1 = useSelector(GlobalAddCustomerDetails);
-  const SettingDataSelector = useSelector(PreferenceData);
-  const GlobalSalesPaymentoptions = useSelector(GlobalSalesPaymentoption);
-  const FeatureAddonData = useSelector(GlobalFeatAddOnData);
-
-  const allowedNames = ['whatsapp', 'Print', 'SMS'];
-
-  const filteredSettingNames = SettingDataSelector?.[0]?.['SettingDtlDetails']
-    ?.filter(
-      (item) =>
-        allowedNames.includes(item?.SettingIdName) && item?.SettingValue === 'Y'
-    )
-    ?.map((item) => item?.SettingIdName);
-
+const BSItemCard = (props) => {
+  const cardFunction = props?.cardFunctionality;
+  // const applyOffer = useApplyOfferto_CardDetail();
+  const preferenceDatas = useSelector(PreferenceData, shallowEqual);
+  const { selectedDate } = useDateStore();
   const preferenceOffer =
-    SettingDataSelector?.[0]?.['SettingDtlDetails']?.find(
+    preferenceDatas?.[0]?.['SettingDtlDetails']?.find(
       (item) => item.SettingIdName === 'Offer'
     )?.SettingValue === 'Y';
-  const GlobalUpName = useSelector(GlobalUpiIDName);
-  const GlobalUpiIDoptionIdd = useSelector(GlobalUpiIDoptionId);
-  const NavHoldData = useSelector(GlobalNavHoldData);
-  const GlobEstBooking = useSelector(GlobalEstimateBooking);
-  const GlobProdwisedata = useSelector(GlobalSelProdWiseEst);
-  const preOrder = useSelector(GlobalpreOrderOpen);
-  const Comboglobal = useSelector(GlobalCombosearch);
-  const FailedTotalAmt = useSelector(GlobalFailedTotalAmt);
-  const OrderOfferDetail = useSelector(Global_OrderOfferDetail);
-  const [SelectedUpiOption, setSelectedUpiOption] = useState();
-  const [credit, setCredit] = useState(false);
-  const [overAllBal, setOverAllBal] = useState(0);
-  const [SelectedBookingType, setSelectedBookingType] = useState(null);
-  const [TotalItems, setTotalItems] = useState('');
-  const [showWhatsAppShare, setShowWhatsAppShare] = useState(false);
-  const [showSMSShare, setSMSShare] = useState(false);
-  const [TotalWithoutTaxAmount, setTotalWithoutTaxAmount] = useState('');
-  const [TotalTaxAmount, setTotalTaxAmount] = useState('');
-  const [Qty, setQty] = useState(null);
-  const [formattedDate, setFormattedDate] = useState('');
-  const [UpiOptionOpen, setUpiOptionOpen] = useState(false);
-  const [customerPreviesOrders, setCustomerPreviesOrders] = useState(false);
-  const [UpiOption, setUpiOption] = useState('');
-  const [UpiId, setUpiId] = useState();
-  const [hold, setHold] = useState(false);
-  const appPreferences = useSelector(ApplicationPreferences);
-  const commonModulePreference = appPreferences?.find(
-    (preference) => preference?.PreferredCatName === 'Common Module'
-  )?.PreferenceCatDetails;
-  const sportsAppPreference = commonModulePreference?.find(
-    (preference) => preference?.PreferredSubCatName === 'SportsApp'
-  );
-  const bookingTypePreference = appPreferences?.find(
-    (preference) => preference?.PreferredCatName === 'Booking Type'
-  )?.PreferenceCatDetails;
-  const dinePreference = bookingTypePreference?.find(
-    (type) =>
-      type?.PreferredSubCatName?.toLowerCase() === 'dine in' &&
-      type?.PreferredStatus === 'Y'
-  );
-  const takeAwayPreference = bookingTypePreference?.find(
-    (type) =>
-      type?.PreferredSubCatName?.toLowerCase() === 'take away' &&
-      type?.PreferredStatus === 'Y'
-  );
+  const preferenceSingleSales =
+    preferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+      (item) => item.SettingIdName === 'Single Booking Only'
+    )?.SettingValue === 'Y';
+  const AddProductCard =
+    preferenceDatas?.[0]?.['SettingDtlDetails']?.find(
+      (item) => item.SettingIdName === 'AddProductCard'
+    )?.SettingValue === 'N';
+  // const AddCustomerDetails = useSelector(
+  //   GlobalAddCustomerDetails,
+  //   shallowEqual
+  // );
 
-  const preferenceshortcutkey = SettingDataSelector?.[0]?.[
-    'SettingDtlDetails'
-  ]?.some(
-    (item) =>
-      item.SettingIdName.toLowerCase() === 'shortcutkeys' &&
-      item.SettingValue === 'Y'
+  const offerAppliedProducts = useSelector(
+    GlobalOfferAppliedProducts,
+    shallowEqual
   );
-
-  const [addcustomer, setAddCustomer] = useState(false);
-  const [PrintOrderDetails, setPrintOrderDetails] = useState([]);
-  const tabledata = useSelector(GlobalUnpaidListData);
-  const [FirstPaymentclick, setFirstPaymentclick] = useState(false);
-  const [unpaidopen, setUnpaidOpen] = useState(false);
-  const unpaidFlow = useSelector(Globalunpaidflow);
-  const [messageType, setMessageType] = useState(null);
-  const [messageData, setMessageData] = useState(null);
-  const [reprint1, setReprint1] = useState(false);
-  const [extraCharges, setExtraCharges] = useState(false);
-  const [QuickAdd, setQuickAdd] = useState(false);
-  const [DineInPreference, setDineInPreference] = useState({});
-  const [UpinotSelected, setUpinotSelected] = useState(false);
-  const [qrCode, setQrCode] = useState(false);
-  const [paybtns, setpaybtns] = useState([]);
-  const [CreditCustomer, setCreditCustomer] = useState(false);
-  const [creditCustomerOpen, setcreditCustomerOpen] = useState(false);
-  const [Success, SetSuccess] = useState();
-  const [brachName, setbrachName] = useState('');
-  const [UpiOpen, setUpiOpen] = useState(false);
-  const [ConfigDataList, setConfigDataList] = useState([]);
-  const BSComboData = props?.hasOwnProperty('optionNames')
-    ? props['optionNames']
-    : null;
-  const BSComboNavbar =
-    BSComboData?.BookingLayout?.[0] === 'Combo1'
-      ? BSComboData?.BookingCombo1
-      : BSComboData?.BookingCombo2;
-  const OfferCheckedInSetup = BSComboNavbar?.[1]?.some(
-    (some) => some.OptionName === 'Offer'
+  // const SelectedCust = useSelector(GlobalSelOption, shallowEqual);
+  const AllCategoryDatas = useSelector(GlobalCategorieData, shallowEqual);
+  const AllsubcatgoryDatas = useSelector(GlobalSubcategorieData, shallowEqual);
+  const RetailWSSalesType = useSelector(GlobalRetailWSSalesType, shallowEqual);
+  const ConfigDataList = useSelector(GlobalAllBookingType, shallowEqual);
+  const GPreOrderList = useSelector(GlobalPreOrderList, shallowEqual);
+  const [modelQty, setModelQty] = useState(false);
+  const [modelstock, setModelstock] = useState(false);
+  const [ModalVarient, setModalVarient] = useState(false);
+  const [QtyIndex, setQtyIndex] = useState(0);
+  const [VarientIndex, setVarientIndex] = useState(0);
+  const [prodexpir, setProdexpir] = useState(false);
+  const [initialRun, setInitialRun] = useState(false);
+  const [Item, setItem] = useState();
+  const [VarItem, setVarItem] = useState(0);
+  const [StockItem, setStockItem] = useState();
+  const [noSubcatCardData, setNoSubcatCardData] = useState();
+  const [qtydata, setQtydata] = useState();
+  const [products, setProducts] = useState([
+    { id: 1, name: '', price: '', code: '', size: '1', category: '' },
+  ]);
+  const PreOrderAdditem = useSelector(GlobalPreOrderAdditem, shallowEqual);
+  const OrderType = useSelector(GlobalOrderType, shallowEqual);
+  const ProdSubCat = useSelector(GlobalProductSubCategorie);
+  const ItemCard = useSelector(GlobalItemCard, shallowEqual);
+  const globaldata = useSelector(GlobalAlldat, shallowEqual);
+  const { action: quickBranchtoBranchTransfer, selectedProducts } = useSelector(
+    GlobalBtoBQuickProductTransfer
   );
-  const UomPrint = SettingDataSelector?.[0]?.SettingDtlDetails.filter(
-    (i) => i.SettingIdName === 'PrintUom'
-  )?.[0];
-  const Estimation = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
-    (item) => item.SettingIdName == 'Estimation'
+  const preOrder = useSelector(GlobalpreOrderOpen, shallowEqual);
+  const templateData = useSelector(getTemplateData, shallowEqual);
+  const temp5 = templateData?.BookingLayout?.[0] === 'Layout5';
+  const OfferCheckedInSetup = templateData?.BookingNavbar?.[1].some(
+    (item) => item?.OptionName == 'Offer'
   );
-  const ParkingDisplay = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
-    (setting) =>
-      setting?.SettingIdName?.toLowerCase() === 'parking' &&
-      setting?.SettingValue === 'Y'
+  const globalAllItemdata = useSelector(GlobalAllItemData);
+  const EditfavItems = useSelector(GlobalEditfavItems);
+  const BookingType = useSelector(GlobalBookingType);
+  const ProductSearch = useSelector(GlobalSearchData);
+  const [SelectedProdNames, setSelectedProdNames] = useState(EditfavItems);
+  const [PreOrderSelectedProdNames, setPreOrderSelectedProdNames] = useState(
+    []
   );
-  const MobileA4Print = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
-    (setting) =>
-      setting?.SettingIdName?.toLowerCase() === 'mobilea4' &&
-      setting?.SettingValue === 'Y'
+  const [newMoreProductModel, setNewMoreProductModel] = useState(false);
+  const CardAccess = useSelector(GlobalCardAccess, shallowEqual);
+  const globalAccessForOthers = useSelector(
+    GlobalAccessForOthers,
+    shallowEqual
   );
-  const Weightasquantity = SettingDataSelector?.[0]?.SettingDtlDetails?.some(
-    (setting) =>
-      setting?.SettingIdName?.toLowerCase() === 'weightasquantity' &&
-      setting?.SettingValue === 'Y'
+  const SelectedCardColor = useSelector(
+    SelectedGlobalCardColorDetail,
+    shallowEqual
   );
-  const [OrderStatus, setOrderStatus] = useState(true);
-  // const [FeatureAddonData, setFeatureAddonData] = useState([]);
-  const [Splitpayment, setSplitpayment] = useState(false);
-  const [urlData, setUrlData] = useState();
-  const [PaymentOptions, setPaymentOptions] = useState([]);
-  const [paybtnselected, setPaybtnselected] = useState();
-  const [Paybtnnameselected, setPaybtnnameselected] = useState();
-  const [OtherServiceStatus, setOtherServiceStatus] = useState(false);
-  const allowDecimal = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
+  const GetmultipleSearchDatas = useSelector(
+    GlobalGetmultipleSearchDatas,
+    shallowEqual
+  );
+  const SelectedCardFont = useSelector(SelectedGlobalCardFont, shallowEqual);
+  const CartOrderDetails = useSelector(GlobalOrderCardDetails, shallowEqual);
+  const SelectedDatas = useSelector(GlobalSelectedDatas, shallowEqual);
+  const otherscarddata = useSelector(Globalothersdata, shallowEqual);
+  const WSProductdata = useSelector(GlobalWSProduct, shallowEqual);
+  const NewQrProductData = useSelector(GlobalNewQrProduct, shallowEqual);
+  const ReportholdData = useSelector(GlobalReorderHoldDetails, shallowEqual);
+  const ReorderProductData = useSelector(
+    GlobalReorderProductDetails,
+    shallowEqual
+  );
+  const WeightScalePort = useSelector(GlobalWeightScalePort, shallowEqual);
+  const WeightScaleWeight = useSelector(GlobalWeightScaleWeight, shallowEqual);
+  const PaymentTransactionNumber = useSelector(
+    GlobalPaymentTransactionNumber,
+    shallowEqual
+  );
+  const OverAllproductBasedOfferDatas = useSelector(
+    (state) => state?.BookingOFferNew?.OverAllProductBasedProducts,
+    shallowEqual
+  );
+  const PromoCodeOffersDatas = useSelector(
+    Global_PromoCodeOffers,
+    shallowEqual
+  );
+  const allowDecimal = preferenceDatas?.[0]?.SettingDtlDetails?.find(
     (setting) =>
       setting?.SettingIdName?.toLowerCase() === 'decimal' &&
       setting?.SettingValue === 'Y'
   );
-  const Custombill = SettingDataSelector?.[0]?.SettingDtlDetails?.some(
-    (setting) =>
-      setting?.SettingIdName?.toLowerCase() === 'customisedbillnumber' &&
-      setting?.SettingValue === 'Y'
+  const [messageType, setMessageType] = useState(null);
+  const [messageData, setMessageData] = useState(null);
+  const [repeatedModel, setRepeatedModel] = useState(false);
+  const [StockPreferenceDetail, setStockPreferenceDetail] = useState();
+  const [QuickAdd, setQuickAdd] = useState(true);
+  const [onePeiceFlow, setOnePeiceFlow] = useState(false);
+  const [BillOrderPre, setBillOrderPre] = useState();
+  const [qtyExpData, setQtyExpData] = useState();
+  const OrderOfferDetail = useSelector(Global_OrderOfferDetail);
+  // const [freeProductsOffers, setfreeProductsOffers] = useState([]);
+  const [screenWidth, setScreenWidth] = useState(window.innerWidth);
+  // const [screenHeight, setScreenHeight] = useState(window.innerHeight);
+  const ProdCat = useSelector(GlobalProductCategorie, shallowEqual);
+  const paymentloader = useSelector(GlobalPayementloader, shallowEqual);
+  const SessionData = useSelector(StoredSessionData, shallowEqual);
+  const AppId = SessionData?.AppId;
+  const CompId = SessionData?.CompId;
+  const BranchId = SessionData?.BranchId;
+  const UserId = SessionData?.UserId;
+  const dispatch = useDispatch();
+
+  const voiceTriggerRef = useRef(null);
+  const scrollContainerRef = useRef(null);
+  const isDragging = useRef(false);
+  const startX = useRef(0);
+  const scrollLeft = useRef(0);
+  const itemListScrollRef = useRef(null);
+  const [selectedBrand, setSelectedBrand] = useState('Others');
+  const [showLeftButton, setShowLeftButton] = useState(false);
+  const [showRightButton, setShowRightButton] = useState(false);
+  const [ExpiredProduct, setExpiredProduct] = useState();
+
+  const alphabeticFormat = useSelector(GlobalisAlphabeticFormat);
+  // const PricingAppPricingName = useSelector(GlobalPricingAppPricingName);
+  const favouriteCat = useSelector(GlobalisFavClicked, shallowEqual);
+  const FreeProdList = useSelector(GlobalFreeProdList);
+  const triggerOfferFree = useSelector(GlobalTriggerOfferFree);
+  const productCardTrigger = useSelector(GlobalProductCardTrigger);
+  const appPreferences = useSelector(ApplicationPreferences);
+  const [expireModal, setExpireModal] = useState({
+    open: false,
+    title: '',
+    onOk: null,
+    onCancel: null,
+  });
+
+  const salespagefields = appPreferences?.find(
+    (pref) => pref?.PreferredCatName === 'Sales Page Fields'
+  )?.PreferenceCatDetails;
+  const AvailableDate = salespagefields?.find(
+    (type) =>
+      type?.PreferredSubCatName?.toLowerCase() === 'available date' &&
+      type?.PreferredStatus === 'Y'
   );
-  const [SelectedCardOption, setSelectedCardOption] = useState(null);
-  const [SelectedUPIPayOption, setSelectedUPIPayOption] = useState('Default');
-  const [CardOptionOpen, setCardOptionOpen] = useState(false);
-  const [CardoptionnotSelected, setCardoptionnotSelected] = useState(false);
-  const [PaymentgatewayCard, setPaymentgatewayCard] = useState([]);
-  const [PaymentDeviceCard, setPaymentDeviceCard] = useState([]);
-  const [PaymentgatewayUPI, setPaymentgatewayUPI] = useState([]);
-  const [PaymentDeviceUPI, setPaymentDeviceUPI] = useState([]);
-  const [UpiPayOption, setUpiPayOption] = useState([]);
-  const [CardPayOption, setCardPayOption] = useState([]);
-  const [PaymentUpiOptions, setPaymentUpiOptions] = useState([]);
-  const GlobaluseOptions = useSelector(GlobalCommonPaymentOptions);
-  const [useOptions, setuseOptions] = useState([]);
-  const CheckOrderType = OrderCardDetail?.filter(
-    (a) => a?.BookingTypeName !== BookingType
+
+  const SingleMember = salespagefields?.find(
+    (type) =>
+      type?.PreferredSubCatName?.toLowerCase() === 'single member' &&
+      type?.PreferredStatus === 'Y'
   );
-  // const [ComboDropDown, setComboDropDown] = useState();
-  const paymentloader = useSelector(GlobalPayementloader);
-  const TokenOnly = SettingDataSelector?.[0]?.SettingDtlDetails?.filter(
-    (i) => i.SettingIdName === 'TokenOnly'
-  )?.[0];
-  const IndividualToken = SettingDataSelector?.[0]?.SettingDtlDetails?.filter(
-    (i) => i.SettingIdName === 'AllProductindividualToken'
-  )?.[0];
-  const [UnpaidConfirmation, setUnpaidConfirmation] = useState(false);
-  const [unpaidselectedindex, setunpaidselectedindex] = useState();
-  const [preOrderOpen, setPreOrderOpen] = useState(false);
-  const preOrderPendingCount = useSelector(GlobalPreOrderPendingCount);
-  const [failedOrderData, setFailedOrderData] = useState();
-  const [OpenFailData, SetOpenFailData] = useState(false);
-  const [paymentfeataddon, setpaymentfeataddon] = useState(false);
-  const [isFloatMenuOpen, setIsFloatMenuOpen] = useState(false);
-  const OverAllSales = useSelector(GlobalOverAllDiscSales);
-  const OverAllEstimate = useSelector(GlobalOverAllDiscEstimate);
-  const [blink, setBlink] = useState(false);
-  const [empData, setEmpData] = useState();
-  const [MobileNoWhatsApp, setMobileNoWhatsApp] = useState();
-  const printDatas = useSelector(GlobalprintDatas);
-  const PrinterDetails = useSelector(GlobalPrinterMappingDtls);
-  const [addnewAccess, setaddnewAccess] = useState(true);
-  const BookingStatus = useSelector(GlobalBookingStatus);
 
-  const PaymentOptionsModeName =
-    PaymentOptions?.find((e) => e.ModeDefault?.toUpperCase() === 'Y')
-      ?.ModeName || PaymentOptions?.[0]?.ModeName;
-  const PaymentOptionsModeId =
-    PaymentOptions?.find((e) => e.ModeDefault?.toUpperCase() === 'Y')?.ModeId ||
-    PaymentOptions?.[0]?.ModeId;
+  useSaleswiseOfferWatcher();
 
-  const CheckBookingStatus =
-    BookingStatus?.find((item) => item.ScreenType === 'Booking')
-      ?.ScreenStatus ?? 'Open';
-  const OverallOfferAmount = useSelector(Global_OverallOfferAmount);
+  const TakAwayId = ConfigDataList?.find(
+    (a) => a?.ConfigName === 'TakeAway'
+  )?.ConfigId;
 
-  const [TotalAmount, setTotalAmount] = useState(0);
-  // for customised invoice number
-  const { invoiceDate, clearInvoiceDate } = useDateStore();
-  const CurrentOrderId = useSelector(GlobalCurrentOrderId);
+  const DineinId = ConfigDataList?.find(
+    (a) => a?.ConfigName === 'Dine In'
+  )?.ConfigId;
 
-  console.log(BSComboData, 'BSComboData');
-  const canHold =
-    unpaidFlow === false &&
-    BookingType !== 'Dine In' &&
-    !BookingTypeBoth &&
-    OrderCardDetail?.length !== 0 &&
-    CheckOrderType?.length === 0 &&
-    OrderType !== 'Failed' &&
-    CheckBookingStatus !== 'Close' &&
-    !addnewAccess &&
-    BSComboData?.BookingBilling?.[1]?.some(
-      (e) => e?.OptionName?.toLowerCase() == 'hold'
-    );
-  const canRecall =
-    unpaidFlow === false &&
-    BookingType !== 'Dine In' &&
-    !BookingTypeBoth &&
-    OrderCardDetail?.length == 0 &&
-    OrderType !== 'Failed' &&
-    Holddata?.length > 0 &&
-    CheckBookingStatus !== 'Close' &&
-    !addnewAccess &&
-    BSComboData?.BookingBilling?.[1]?.some(
-      (e) => e?.OptionName?.toLowerCase() == 'hold'
-    );
-
-  const canExtracharge =
-    BSComboNavbar?.[1]?.some(
-      (e) => e?.OptionName?.toLowerCase() == 'extracharge'
-    ) && OrderCardDetail?.length !== 0;
-  const canSplitPayment =
-    paybtns?.length > 1 &&
-    OrderCardDetail?.length > 0 &&
-    CheckBookingStatus !== 'Close' &&
-    !addnewAccess;
-
-  console.log(canSplitPayment, 'canSplitPayment');
-  const canReprint = BSComboNavbar?.[1]?.some(
-    (e) => e?.OptionName?.toLowerCase() == 'reprint'
-  );
-  console.log(
-    BSComboData?.BookingBilling?.[1]?.some(
-      (e) => e?.OptionName?.toLowerCase() == 'hold'
-    ),
-    '11111111111111'
-  );
-  // Usage
   useEffect(() => {
-    const fetchCreditCustomer = async () => {
-      const selectedMode = paybtns?.find(
-        (pay) => paybtnselected === pay?.ModeId
-      )?.ModeName;
+    itemListScrollRef.current?.scrollTo(0, 0);
+  }, [ProdCat, ProdSubCat, favouriteCat]);
 
-      if (
-        selectedMode?.toLowerCase() === 'credit' &&
-        (!UpinotSelected || !CardoptionnotSelected)
-      ) {
-        setCredit(true);
-        try {
-          const res = await dispatch(
-            getCreditCustomer({
-              CompId,
-              AppId,
-              BranchId,
-              CustId: selOption?.CustId,
-            })
-          ).unwrap();
+  useEffect(() => {
+    if (
+      triggerOfferFree &&
+      CartOrderDetails?.length > 0 &&
+      FreeProdList?.length > 0
+    ) {
+      console.log('Before call');
+      let { ModifiedData, UpdatedFreeProdList, AppliedOffers } =
+        handleLoyaltyFreeProducts(CartOrderDetails, FreeProdList);
+      console.log(
+        'After call',
+        ModifiedData,
+        UpdatedFreeProdList,
+        AppliedOffers
+      );
+      console.log(AppliedOffers, 'AppliedOffers');
+      dispatch(changeOrderCardDetails(ModifiedData));
+      dispatch(ChangeFullFreeProductList(UpdatedFreeProdList));
+      dispatch(changeFullOfferAppliedProducts(AppliedOffers));
+      dispatch(changeTriggerOfferFree(false));
+    }
+  }, [triggerOfferFree]);
 
-          if (res?.data?.statusCode === 1 && res?.data?.data?.length > 0) {
-            setOverAllBal(res.data.data[0]?.OverAllBal ?? 0);
-          } else {
-            setOverAllBal(0);
+  function handleLoyaltyFreeProducts(orderCardDtls, freeProdDtls) {
+    if (!freeProdDtls || freeProdDtls.length === 0) {
+      return {
+        ModifiedData: orderCardDtls,
+        UpdatedFreeProdList: freeProdDtls,
+        AppliedOffers: [],
+      };
+    }
+
+    const updatedFreeProdList = JSON.parse(JSON.stringify(freeProdDtls)); // deep copy
+    const AppliedOffers = [];
+    let ModifiedData = [];
+    let processedItems = new Set(); // Track processed items
+
+    // Helper function to create applied offer object
+    function createAppliedOffer(
+      freeProduct,
+      usedQty,
+      inwardDtlId,
+      orderRate,
+      bookingType
+    ) {
+      const stockDetail =
+        freeProduct.ProdVariantDetails?.[0]?.StockDetails?.[0];
+
+      return {
+        OfferId: freeProduct.OfferId,
+        OfferAmount: usedQty * orderRate,
+        OfferMode: freeProduct.OfferMode,
+        ActualOfferAmount: usedQty * orderRate,
+        OfferValue: usedQty * orderRate,
+        TableName: freeProduct.TableName || 'LoyaltyPointsNew',
+        TableUniqueName: freeProduct.TableUniqueName || 'FreeProduct',
+        TableUniqueId: '',
+        ActualFreeQty: usedQty,
+        Detail: [],
+        OfferCode: '',
+        CustId: freeProduct.CustId || '',
+        UsedCount: (stockDetail?.ProdLoyaltyPoint || 0) * usedQty,
+        AppliesTo: '',
+        BookingType: bookingType === 'Dine In' ? 'DineinId' : 'TakAwayId',
+        FreeProductsList: {
+          FreeProdId: freeProduct.FreeProdId,
+          FreeQty: usedQty,
+          FreeProdName: freeProduct.FreeProdName,
+          ProdVariantDetails: [
+            {
+              FreeProdVariantName: freeProduct.FreeProdVariantName,
+              StockDetails: [
+                {
+                  ProdOfferId: stockDetail?.ProdOfferId || '',
+                  FreeInwardDtlId: inwardDtlId,
+                  ActiveStatus: 'A',
+                  ProdLoyaltyPoint: stockDetail?.ProdLoyaltyPoint || '',
+                },
+              ],
+            },
+          ],
+        },
+        ProdId: '',
+        SinglePc: 'N',
+        StockAvailable: 'N',
+        ProdVariantName: '',
+        Type: '',
+        InwardDtlId: '',
+        ProdCat: '',
+        HalfPrice: 'N',
+        MinQty: '',
+      };
+    }
+
+    // First, handle existing paid products that can be converted to free
+    updatedFreeProdList.forEach((freeProduct) => {
+      if (freeProduct.RemainingQty > 0) {
+        // Find matching paid products by InwardDtlId
+        const matchingPaidItems = orderCardDtls.filter(
+          (item) =>
+            freeProduct.ProdVariantDetails?.some((variant) =>
+              variant.StockDetails?.some(
+                (stock) => stock.FreeInwardDtlId === item.InwardDtlId
+              )
+            ) &&
+            (!item.Offer || item.Offer === 0) &&
+            !item.OfferType &&
+            !item.OfferMode &&
+            !processedItems.has(item.localId) &&
+            item?.SinglePc !== 'Y'
+        );
+
+        matchingPaidItems.forEach((paidItem) => {
+          const remainingFreeQty = freeProduct.RemainingQty;
+
+          if (remainingFreeQty <= 0) return;
+
+          if (paidItem.OrderQty === remainingFreeQty) {
+            // Remove paid item and convert entire quantity to free
+            const freeItem = {
+              ...paidItem,
+              Offer: paidItem.OrderQty * paidItem.OrderRate,
+              OfferType: freeProduct.OfferMode,
+              OfferMode: freeProduct.OfferMode,
+              OfferMessage: [
+                {
+                  OfferId: freeProduct.OfferId,
+                  FreeQty: paidItem.OrderQty,
+                  FreeProdId: freeProduct.FreeProdId,
+                  FreeProdName: freeProduct.FreeProdName,
+                },
+              ],
+              localId: paidItem.localId + '_converted_free',
+            };
+
+            ModifiedData.push(freeItem);
+
+            // Update free product usage
+            freeProduct.FreeQty =
+              (freeProduct.FreeQty || 0) + paidItem.OrderQty;
+            freeProduct.RemainingQty -= paidItem.OrderQty;
+
+            // Create applied offer
+            AppliedOffers.push(
+              createAppliedOffer(
+                freeProduct,
+                paidItem.OrderQty,
+                paidItem.InwardDtlId,
+                paidItem.OrderRate,
+                paidItem.BookingTypeName
+              )
+            );
+
+            processedItems.add(paidItem.localId);
+          } else if (paidItem.OrderQty > remainingFreeQty) {
+            // Split: convert available free qty to free, keep excess as paid
+            const freeQty = remainingFreeQty;
+            const paidQty = paidItem.OrderQty - remainingFreeQty;
+
+            // Create free item
+            const freeItem = {
+              ...paidItem,
+              OrderQty: freeQty,
+              TotalAmt: freeQty * paidItem.OrderRate,
+              TaxAmt: (
+                (freeQty * paidItem.OrderRate * paidItem.TaxPercentage) /
+                100
+              ).toFixed(2),
+              WithoutTaxRate:
+                freeQty * paidItem.OrderRate -
+                (freeQty * paidItem.OrderRate * paidItem.TaxPercentage) / 100,
+              Offer: freeQty * paidItem.OrderRate,
+              OfferType: freeProduct.OfferMode,
+              OfferMode: freeProduct.OfferMode,
+              OfferMessage: [
+                {
+                  OfferId: freeProduct.OfferId,
+                  FreeQty: freeQty,
+                  FreeProdId: freeProduct.FreeProdId,
+                  FreeProdName: freeProduct.FreeProdName,
+                },
+              ],
+              localId: paidItem.localId + '_free_part',
+            };
+
+            // Create updated paid item with reduced quantity
+            const updatedPaidItem = {
+              ...paidItem,
+              OrderQty: paidQty,
+              TotalAmt: paidQty * paidItem.OrderRate,
+              TaxAmt: (
+                (paidQty * paidItem.OrderRate * paidItem.TaxPercentage) /
+                100
+              ).toFixed(2),
+              WithoutTaxRate:
+                paidQty * paidItem.OrderRate -
+                (paidQty * paidItem.OrderRate * paidItem.TaxPercentage) / 100,
+              localId: paidItem.localId + '_paid_part',
+            };
+
+            ModifiedData.push(freeItem);
+            ModifiedData.push(updatedPaidItem);
+
+            // Update free product usage
+            freeProduct.FreeQty = (freeProduct.FreeQty || 0) + freeQty;
+            freeProduct.RemainingQty -= freeQty;
+
+            // Create applied offer
+            AppliedOffers.push(
+              createAppliedOffer(
+                freeProduct,
+                freeQty,
+                paidItem.InwardDtlId,
+                paidItem.OrderRate,
+                paidItem.BookingTypeName
+              )
+            );
+
+            processedItems.add(paidItem.localId);
           }
-        } catch (error) {
-          console.error('Credit fetch failed', error);
-          setOverAllBal(0);
-        }
-      } else {
-        setCredit(false);
-        setOverAllBal(0);
+        });
       }
-    };
+    });
 
-    fetchCreditCustomer();
-  }, [paybtnselected, selOption, paybtns]);
-  useEffect(() => {
-    if (!preOrder) {
-      const totalSum = OrderCardDetail?.reduce(
-        (acc, card) => acc + parseFloat(card.OrderRate * card.OrderQty || 0),
-        0
-      );
+    // Process remaining cart items
+    orderCardDtls.forEach((item) => {
+      // Skip if already processed
+      if (processedItems.has(item.localId)) {
+        return;
+      }
 
-      const extra = GlobalExtraCharge?.reduce(
-        (acc, obj) => acc + (obj.TotalAmt || 0),
-        0
-      );
+      // Check if item is currently marked as free (has OfferType/OfferMode and Offer > 0)
+      const isCurrentlyFree =
+        item.Offer > 0 && (item.OfferType || item.OfferMode);
 
-      let withComboSum = 0;
-      const withComboOffer_CardDetail = OrderCardDetail?.filter(
-        (item) => item.Type === 'C'
-      );
-      if (withComboOffer_CardDetail?.length > 0) {
-        withComboSum = formatAmount(
-          withComboOffer_CardDetail.reduce(
-            (acc, card) =>
-              acc +
-              parseFloat(card.OrderRate * card.OrderQty - card.TotalAmt || 0),
-            0
+      if (isCurrentlyFree) {
+        // Find matching free product by InwardDtlId
+        const matchingFreeProduct = updatedFreeProdList.find((freeProd) =>
+          freeProd.ProdVariantDetails?.some((variant) =>
+            variant.StockDetails?.some(
+              (stock) => stock.FreeInwardDtlId === item.InwardDtlId
+            )
           )
         );
-      }
 
-      let Total =
-        extra === undefined
-          ? totalSum - OverallOfferAmount - withComboSum
-          : totalSum + extra - OverallOfferAmount - withComboSum;
+        if (matchingFreeProduct) {
+          const availableFreeQty = matchingFreeProduct.OverAllFreeQty || 0;
 
-      // Subtract OtherServiceTicketClaim?.totalTicketamount if present and > 0
-      if (OtherServiceTicketClaim?.TotalAmt > 0) {
-        if (Total - OtherServiceTicketClaim.TotalAmt > 0) {
-          Total -= OtherServiceTicketClaim.TotalAmt;
-        } else {
-          dispatch(
-            changeOtherServiceTicketClaim({
-              TicketId: null,
-              TotalAmt: 0,
-              ParkingClaimed: false,
-              ServiceCategory: null,
-            })
-          );
-        }
-      } else if (OtherServiceTicketClaim?.OtherType == 'Remove') {
-        dispatch(
-          changeOtherServiceTicketClaim({
-            TicketId: null,
-            TotalAmt: 0,
-            ParkingClaimed: false,
-            ServiceCategory: null,
-          })
-        );
-      }
+          if (item.OrderQty > availableFreeQty) {
+            // Split: Keep available free qty as free, convert excess to paid
+            const excessQty = item.OrderQty - availableFreeQty;
 
-      let withdiscTotal =
-        Total - ((OverAllSales || 0) + (OverAllEstimate || 0));
+            // Create free portion (if any free qty available)
+            if (availableFreeQty > 0) {
+              const freeItem = {
+                ...item,
+                OrderQty: availableFreeQty,
+                TotalAmt: availableFreeQty * item.OrderRate,
+                TaxAmt: (
+                  (availableFreeQty * item.OrderRate * item.TaxPercentage) /
+                  100
+                ).toFixed(2),
+                WithoutTaxRate:
+                  availableFreeQty * item.OrderRate -
+                  (availableFreeQty * item.OrderRate * item.TaxPercentage) /
+                    100,
+                Offer: availableFreeQty * item.OrderRate,
+              };
 
-      setTotalAmount(
-        withdiscTotal >= 0
-          ? (Number(withdiscTotal) + Number(globalTipAmount)).toFixed(2)
-          : (Number(Total) + Number(globalTipAmount)).toFixed(2)
-      );
+              ModifiedData.push(freeItem);
 
-      dispatch(
-        changeSummeryTotalAmount(
-          withdiscTotal > 0 ? withdiscTotal : Number(Total)
-        )
-      );
-
-      dispatch(changeSummeryComboOfferAmount(withComboSum));
-
-      // if (withdiscTotal <= 0) {
-      //   dispatch(ChangeOverAllDiscSales(0));
-      //   dispatch(ChangeOverAllDiscEstimate(0));
-      // }
-    } else {
-      setTotalAmount(0);
-      dispatch(changeSummeryTotalAmount(0));
-      dispatch(changeSummeryComboOfferAmount(0));
-    }
-  }, [
-    OrderCardDetail,
-    GlobalExtraCharge,
-    OverAllSales,
-    OverAllEstimate,
-    globalTipAmount,
-    OtherServiceTicketClaim,
-  ]);
-  useEffect(() => {
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      UserId: UserId,
-    };
-    dispatch(getPrinterMappingDetails(data)).unwrap();
-    const Data1 = { AppId, CompId, BranchId };
-    dispatch(getPrintSelectionComponentData(Data1)).unwrap();
-    handleOtherData();
-  }, []);
-  useEffect(() => {
-    if (!preferenceshortcutkey) return;
-
-    const handleKeyPress = (event) => {
-      if (!event.altKey) return;
-
-      const key = event.key.toLowerCase();
-
-      switch (key) {
-        case 'n':
-          event.preventDefault();
-          setQuickOpen();
-          break;
-
-        case 'w':
-          event.preventDefault();
-          if (canHold) {
-            AddBookingDetails('Hold');
-          } else if (canRecall) {
-            HandleholdModelOpen();
-          }
-          break;
-
-        case 'a':
-          if (canExtracharge) {
-            event.preventDefault();
-            handleextraCharges();
-          }
-          break;
-
-        case 'r':
-          if (canReprint) {
-            event.preventDefault();
-            handleReprint();
-          }
-          break;
-
-        case 's':
-          if (canSplitPayment) {
-            event.preventDefault();
-            SplitPaymentOpen();
-          }
-          break;
-
-        default:
-          break;
-      }
-    };
-
-    window.addEventListener('keydown', handleKeyPress);
-    return () => {
-      window.removeEventListener('keydown', handleKeyPress);
-    };
-  }, [
-    preferenceshortcutkey,
-    canHold,
-    canRecall,
-    canExtracharge,
-    canSplitPayment,
-  ]);
-
-  useEffect(() => {
-    if (NavHoldData) {
-      AddBookingDetails('Hold');
-    }
-  }, [NavHoldData]); //change by karthiga
-  //mohan stoped data
-  useEffect(() => {
-    if (
-      (BookingType === 'Dine In' ||
-        BookingTypeBoth ||
-        CheckOrderType?.length > 0) &&
-      !unpaidFlow
-    ) {
-      setOrderStatus(true);
-    } else {
-      setOrderStatus(false);
-    }
-  }, [BookingTypeBoth, BookingType, unpaidFlow]);
-  //mohan end
-  const paymentFailedStatusFun = async () => {
-    SetOpenFailData(!OpenFailData);
-  };
-  // useEffect(() => {
-  //   const handleKeyPress = (event) => {
-  //     if (event.shiftKey && event.code === 'KeyM') {
-  //       if (
-  //         document.activeElement.tagName !== 'INPUT' &&
-  //         document.activeElement.tagName !== 'TEXTAREA'
-  //       ) {
-  //         event.preventDefault();
-  //         setBlink(true);
-  //       }
-  //     }
-  //   };
-  //   const handleClickOutside = (event) => {
-  //     setBlink(false);
-  //   };
-  //   window.addEventListener('keydown', handleKeyPress);
-  //   window.addEventListener('mousedown', handleClickOutside);
-  //   return () => {
-  //     window.removeEventListener('keydown', handleKeyPress);
-  //     window.addEventListener('mousedown', handleClickOutside);
-  //   };
-  // }, []);
-
-  const handleOtherData = async () => {
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-    };
-    let response = await dispatch(OtherServicesCardlistdata(data)).unwrap();
-    if (response?.data?.statusCode == 1) {
-      setOtherServiceStatus(true);
-    } else {
-      setOtherServiceStatus(false);
-    }
-  };
-
-  useEffect(() => {
-    if (SelCustId) {
-      setpaybtns(PaymentOptions);
-    } else {
-      const withoutCustomer = PaymentOptions?.filter?.(
-        (item) => item?.ModeName?.toLowerCase() !== 'credit'
-      );
-      setpaybtns(withoutCustomer);
-    }
-  }, [PaymentUpiOptions, PaymentOptions, SelCustId]);
-
-  useEffect(() => {
-    if (CompId && BranchId && AppId) {
-      getHolddata();
-      getUnpaiddatas();
-      getCustomerData();
-    }
-  }, [CompId, BranchId, AppId]);
-
-  useEffect(() => {
-    gettodaydate();
-    getBookingTypeId();
-    getPaymentOptionFeature();
-    getPreferenceDinein();
-
-    // Combodata();
-    BadgePendingApi();
-    // if (UserType === "Employee") {
-    //   fetchApi()
-    // }
-  }, []);
-  useEffect(() => {
-    if (UserType !== 'Super Admin' && UserType !== 'Super Admin User') {
-      getFeatureAddonData();
-    }
-  }, [FeatureAddonData]);
-  useEffect(() => {
-    if (UserType === 'Employee') {
-      fetchApi();
-    }
-  }, [UserType]);
-  useEffect(() => {
-    let hasAccess = false;
-
-    if (UserType === 'Admin' || UserType === 'Super Admin') {
-      hasAccess = true;
-    } else if (UserType === 'Employee') {
-      hasAccess = empData?.AddAccess === 'Y';
-    } else if (UserType === 'Super Admin User') {
-      hasAccess = SAAccessCommonMaster?.AddAccess === 'Y';
-    }
-
-    setaddnewAccess(!hasAccess);
-  }, [empData, SAAccessCommonMaster, UserType]);
-  useEffect(() => {
-    getBookingTypeId();
-  }, [BookingType, BookingTypeBoth]);
-
-  useEffect(() => {
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedData = {
-        ExtraCharges: GlobalExtraCharge,
-      };
-      customerDisplayWindow.postMessage(updatedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
-      );
-    }
-  }, [GlobalExtraCharge]);
-  useEffect(() => {
-    if (
-      OrderCardDetail?.length === 1 &&
-      OrderCardDetail?.[0]?.OrderQty === 1 &&
-      !SelCustId
-    ) {
-      console.log(OrderCardDetail, 'OrderCardDetail');
-      closePrintOption();
-      setPrintOrderDetails([]);
-    }
-  }, [OrderCardDetail]);
-  useEffect(() => {
-    TotalItemsCalculation();
-    TotalWithoutTaxRate();
-    TotalTaxAmt();
-    OrderCardDetail?.length == 0 ? dispatch(changeunpaidflow(false)) : '';
-  }, [OrderCardDetail]);
-  useEffect(() => {
-    let data = selOption != null ? selOption : GetCustId;
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedData = {
-        customer: data,
-      };
-      customerDisplayWindow.postMessage(updatedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
-      );
-    }
-  }, [selOption, GetCustId]);
-  useEffect(() => {
-    let data = GlobalUpiID;
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedData = {
-        upi: data,
-      };
-      customerDisplayWindow.postMessage(updatedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
-      );
-    }
-    setUpiOption(GlobalUpName);
-    setSelectedUpiOption(GlobalUpiIDoptionIdd);
-    setUpiId(GlobalUpiID);
-  }, [GlobalUpiID]);
-  useEffect(() => {
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedData = {
-        paymentMethod: Paybtnnameselected,
-        Paymentgateway: false,
-      };
-      customerDisplayWindow.postMessage(updatedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
-      );
-    }
-  }, [Paybtnnameselected]);
-  useEffect(() => {
-    setPaybtnnameselected(PaymentOptionsModeName);
-    setPaybtnselected(PaymentOptionsModeId);
-  }, [PaymentOptions]);
-  // useEffect(() => {
-  //   if (
-  //     PrintOrderDetails?.length > 0 &&
-  //     (!filteredSettingNames ||
-  //       filteredSettingNames?.includes('Print') ||
-  //       filteredSettingNames?.length === 0) &&
-  //     ((!filteredSettingNames?.includes('whatsapp') &&
-  //       (!isMobile || !filteredSettingNames?.includes('SMS'))) ||
-  //       ((filteredSettingNames?.includes('whatsapp') ||
-  //         (isMobile && filteredSettingNames?.includes('SMS'))) &&
-  //         (!MobileNoWhatsApp || Object.keys(MobileNoWhatsApp).length === 0)))
-  //   ) {
-  //     handlePrintOrToken();
-  //   }
-  // }, [PrintOrderDetails]);
-
-  useEffect(() => {
-    if (!PrintOrderDetails?.length) return;
-
-    const selectedOptions = filteredSettingNames || [];
-    const count = selectedOptions.length;
-
-    if (count === 0) {
-      handlePrintOrToken();
-      return;
-    }
-    if (count === 1) {
-      const option = selectedOptions[0];
-
-      switch (option) {
-        case 'whatsapp':
-          if (!selOption && MobileNoWhatsApp?.value) {
-            handleWhatsAppClick();
-          } else {
-            handlePrintOrToken();
-          }
-          return;
-
-        case 'SMS':
-          if (isMobile) handleSMSClick();
-          else handlePrintOrToken();
-          return;
-
-        case 'Print':
-          handlePrintOrToken();
-          return;
-
-        // case "Email":
-        //   handleEmailClick();
-        //   return;
-
-        default:
-          return;
-      }
-    }
-    return;
-  }, [PrintOrderDetails]);
-
-  useEffect(() => {
-    getPaymentOptionFeature();
-  }, [GlobaluseOptions]);
-  const formatAmount = (value) => {
-    return allowDecimal
-      ? parseFloat(value || 0).toFixed(2)
-      : parseInt(value || 0);
-  };
-  const handlePrintOrToken = async () => {
-    const dinein =
-      PrintOrderDetails?.[0]?.OrderDetails?.[0]?.productDetails?.some(
-        (product) => product.BookingTypeName === 'Dine In'
-      );
-    const Tokenthere =
-      PrintOrderDetails?.[0]?.OrderDetails?.[0]?.productDetails?.some(
-        (product) => product.TokenAvailable === 'Y'
-      );
-    const PrintLogo = SettingDataSelector?.[0]?.SettingDtlDetails?.filter(
-      (i) => i.SettingIdName === 'PrintLogo'
-    )?.[0];
-    const PrintGreeting = SettingDataSelector?.[0]?.SettingDtlDetails?.filter(
-      (i) => i.SettingIdName === 'PrintGreetings'
-    )?.[0];
-    const preferenceDetails = SettingDataSelector?.[0]?.SettingDtlDetails;
-    if (isMobile) {
-      if (MobileA4Print) {
-        await MobileMultiPdfPrintTrigger({
-          preferenceDetails,
-          printerTemplateStyle,
-          printDatas,
-          PrinterDetails,
-          PrintOrderDetails,
-          SessionData,
-          bookingTypePreference,
-        });
-      } else {
-        if (Tokenthere && TokenOnly?.SettingValue === 'Y' && !dinein) {
-          if (IndividualToken?.SettingValue === 'Y' && !dinein) {
-            IndividualTokenMobilePrint(PrintOrderDetails, UpiId, 'Booking');
-            closePrintOption();
-          } else {
-            SingleTokenMobilePrint(PrintOrderDetails, UpiId, 'Booking');
-            closePrintOption();
-          }
-        } else {
-          MobilePrint(
-            appPreferences,
-            PrintOrderDetails,
-            UpiId,
-            'Booking',
-            SettingDataSelector
-          );
-          closePrintOption();
-        }
-      }
-    } else {
-      if (Tokenthere && TokenOnly?.SettingValue === 'Y' && !dinein) {
-        AllProductTokenFunction();
-      } else {
-        Print();
-      }
-    }
-  };
-
-  const handleWhatsAppClick = () => {
-    setShowWhatsAppShare(true);
-  };
-  const handleSMSClick = () => {
-    setSMSShare(true);
-  };
-
-  //dhana
-  // Function to check if the button is active
-  const isButtonActive = () => {
-    const baseCondition =
-      FirstPaymentclick === false &&
-      OrderCardDetail?.length > 0 &&
-      paybtnselected &&
-      CheckBookingStatus !== 'Close';
-    let accessCondition = true;
-    if (UserType === 'Employee') {
-      accessCondition = empData?.AddAccess === 'Y';
-    } else if (UserType === 'Super Admin User') {
-      accessCondition = SAAccessCommonMaster?.AddAccess === 'Y';
-    }
-    return baseCondition && accessCondition;
-  };
-
-  // Function to handle the button click
-  const handleButtonClick = () => {
-    if (qrCode && SelectedUPIPayOption === 'Default') {
-      UpiPayment();
-    } else {
-      OrderStatus
-        ? AddBookingDetails('Dine-In', false)
-        : AddBookingDetails(BookingType, true);
-    }
-  };
-
-  useEffect(() => {
-    const handleKeyPress = (event) => {
-      if (event.key === 'F4' && isButtonActive() && !isF4Pressed.current) {
-        isF4Pressed.current = true;
-        // BranchFinancialStatus==='N'? financialYearError():
-        handleButtonClick();
-        setTimeout(() => {
-          isF4Pressed.current = false; // Reset after a short delay
-        }, 1000);
-      }
-    };
-
-    window.addEventListener('keydown', handleKeyPress);
-    return () => {
-      window.removeEventListener('keydown', handleKeyPress);
-    };
-  }, [
-    FirstPaymentclick,
-    OrderCardDetail,
-    paybtnselected,
-    OrderStatus,
-    qrCode,
-    SelectedUPIPayOption,
-    TotalAmount,
-    SelectedUpiOption,
-    SelectedCardOption,
-  ]);
-
-  //dhana
-  const fetchApi = async () => {
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      EmpId: UserId,
-    };
-    let response = await dispatch(getEmpAccess(data)).unwrap();
-    let datas = response?.data?.data?.[0]?.EmpAccessDetails?.filter(
-      (item) => item.ConfigName === 'Sales'
-    );
-    setEmpData(datas?.[0]);
-  };
-  const getCustomerData = async () => {
-    await dispatch(
-      getAllCustomer({ CompId: CompId, AppId: AppId, branchId: BranchId })
-    );
-    await dispatch(
-      getAddCustomerDetails({
-        CompId: CompId,
-        AppId: AppId,
-        branchId: BranchId,
-      })
-    );
-  };
-  const getPaymentOptionFeature = async () => {
-    const FiltersalesPayment = GlobaluseOptions?.filter(
-      (item) => item.FlowName?.toLowerCase() === 'sales'
-    );
-    setuseOptions(FiltersalesPayment);
-    const filterpaycounter = FiltersalesPayment?.[0]?.OptionDetails?.filter(
-      (item) => item?.OptionName?.toLowerCase() === 'pay at the counter'
-    );
-    const filterpaymentgateway = FiltersalesPayment?.[0]?.OptionDetails?.filter(
-      (item) => item?.OptionName?.toLowerCase() === 'payment gateway'
-    );
-    const filterpaymentdevice = FiltersalesPayment?.[0]?.OptionDetails?.filter(
-      (item) => item?.OptionName?.toLowerCase() === 'payment device'
-    );
-    const cardinpaymentgateway =
-      filterpaymentgateway?.[0]?.ModeDetails?.filter((item) =>
-        item?.ModeName?.toLowerCase()?.includes('card')
-      ) || [];
-    const cardinpaymentdevice =
-      filterpaymentdevice?.[0]?.ModeDetails?.filter((item) =>
-        item?.ModeName?.toLowerCase()?.includes('card')
-      ) || [];
-    const upiinpaymentgateway =
-      filterpaymentgateway?.[0]?.ModeDetails?.filter((item) =>
-        item?.ModeName?.toLowerCase()?.includes('upi')
-      ) || [];
-    const upiinpaymentdevice =
-      filterpaymentdevice?.[0]?.ModeDetails?.filter((item) =>
-        item?.ModeName?.toLowerCase()?.includes('upi')
-      ) || [];
-
-    setPaymentOptions(filterpaycounter?.[0]?.ModeDetails);
-    setPaymentUpiOptions(
-      FiltersalesPayment?.[0]?.PaymentDetails?.Payatthecounter
-    );
-    setPaymentDeviceCard(cardinpaymentdevice);
-    setPaymentgatewayCard(cardinpaymentgateway);
-    setPaymentgatewayUPI(upiinpaymentgateway);
-    setPaymentDeviceUPI(upiinpaymentdevice);
-    const cardoptions = [];
-    if (cardinpaymentgateway?.length > 0) {
-      cardoptions.push({
-        label: 'Payment Gateway',
-        value: 'PG',
-        imgSrc: paygate,
-      });
-    }
-    if (cardinpaymentdevice?.length > 0) {
-      cardoptions.push({
-        label: 'Payment Device',
-        value: 'PD',
-        imgSrc: paydevice,
-      });
-    }
-    setCardPayOption(cardoptions);
-    const options = [];
-
-    if (FiltersalesPayment?.[0]?.PaymentDetails?.Payatthecounter?.length > 0) {
-      options.push({
-        label: 'Personal UPI',
-        value: 'Default',
-        imgSrc: defaultupi,
-      });
-    }
-
-    if (upiinpaymentgateway?.length > 0) {
-      options.push({ label: 'Payment Gateway', value: 'PG', imgSrc: paygate });
-    }
-
-    if (upiinpaymentdevice?.length > 0) {
-      options.push({ label: 'Payment Device', value: 'PD', imgSrc: paydevice });
-    }
-    setUpiPayOption(options);
-    // }
-  };
-
-  const getFeatureAddonData = async () => {
-    // let featureAddon = await dispatch(
-    //   FeatureAddon({ AppId: AppId, UserId: UserId })
-    // ).unwrap();
-    // if (featureAddon?.data?.statusCode === 1) {
-    //   setFeatureAddonData(featureAddon?.data?.data?.[0]?.FeatAddonHdr?.[0]);
-    const hasPaymentFeatures = FeatureAddonData?.FeatureDtls?.some(
-      (item) =>
-        item.FeatureAddonName === 'Payment Gateway' ||
-        item.FeatureAddonName === 'Payment Device'
-    );
-    setpaymentfeataddon(hasPaymentFeatures);
-    // } else {
-    //   setFeatureAddonData([]);
-    //   setpaymentfeataddon([]);
-    // }
-  };
-  const handlePaymentMode = (id, name) => {
-    if (name?.toLowerCase() !== 'credit') {
-      setOverAllBal(0);
-      setCredit(false);
-    }
-    if (paymentloader === false) {
-      setPaybtnselected(id);
-      setPaybtnnameselected(name);
-      if (CardPayOption?.length === 1) {
-        setSelectedCardOption(CardPayOption?.[0]?.value);
-      }
-      setUpiOptionOpen(false);
-      setQrCode(false);
-      setUpinotSelected(false);
-      setCardoptionnotSelected(false);
-    }
-  };
-
-  const AddCardOption = (data) => {
-    setSelectedCardOption(data);
-    setCardOptionOpen(false);
-    setCardoptionnotSelected(false);
-  };
-  const AddUPIPaymentOption = async (data) => {
-    setSelectedUpiOption('');
-    setUpiOption('');
-    setUpiId('');
-    await dispatch(changeUpiIDprint(null));
-    await dispatch(changeUpiIDName(''));
-    await dispatch(changeUpiIDoptionId(null));
-    setSelectedUPIPayOption(data);
-    setUpinotSelected(false);
-    setCardoptionnotSelected(false);
-    if (data !== 'Default') {
-      setUpiOptionOpen(false);
-    }
-  };
-  const addUpiOption = async (id, name, UPIId) => {
-    await dispatch(changeUpiIDprint(UPIId));
-    await dispatch(changeUpiIDName(name));
-    await dispatch(changeUpiIDoptionId(id));
-    setSelectedUpiOption(id);
-    setUpiOption(name);
-    setUpiId(UPIId);
-    setUpinotSelected(false);
-    setCardoptionnotSelected(false);
-    // setQrCode(true)
-  };
-  const handleUPIButtonClick = (id, name) => {
-    if (paymentloader === false) {
-      setPaybtnnameselected(name);
-      setPaybtnselected(id);
-      let brachName1 = PaymentUpiOptions?.[0]?.BrName;
-      setbrachName(brachName1);
-      if (UpiPayOption?.length === 1) {
-        setSelectedUPIPayOption(UpiPayOption?.[0]?.value);
-        if (UpiPayOption?.[0]?.value?.toLowerCase() === 'default') {
-          if (PaymentUpiOptions?.length === 1) {
-            addUpiOption(
-              PaymentUpiOptions?.[0]?.Mode,
-              PaymentUpiOptions?.[0]?.ModeName,
-              PaymentUpiOptions?.[0]?.UPIId
-            );
-          }
-        }
-      }
-
-      setQrCode(true);
-      SetSuccess(true);
-    }
-  };
-  const EnableUpiOptions = () => {
-    setUpiOptionOpen(!UpiOptionOpen);
-  };
-  const EnableCardOptions = () => {
-    setCardOptionOpen(!CardOptionOpen);
-  };
-  const gettodaydate = () => {
-    const currentDate = new Date();
-    const day = String(currentDate.getDate()).padStart(2, '0');
-    const month = String(currentDate.getMonth() + 1).padStart(2, '0'); // Month is 0-based, so we add 1.
-    const year = currentDate.getFullYear();
-
-    const tempformattedDate = `${year}-${month}-${day}`;
-    setFormattedDate(tempformattedDate);
-  };
-  const getPreferenceDinein = async () => {
-    // const response = await dispatch(
-    //   getPreferenceData({ CompId: CompId, BranchId: BranchId, AppId: AppId })
-    // ).unwrap();
-    // if (response?.data?.statusCode === 1) { //comment by karthiga
-    const PreferenceDineDtl = SettingDataSelector?.[0]?.SettingDtlDetails;
-    const DineinPreference = PreferenceDineDtl.find(
-      (item) => item.SettingIdName === 'DineIn'
-    );
-    setDineInPreference(DineinPreference || {});
-    // } else {
-    //   setDineInPreference();
-    // }
-  };
-  const ChangeTakeAway = async () => {
-    await dispatch(changeBookingType('TakeAway'));
-  };
-  const getBookingTypeId = async () => {
-    let tempconfigdata = await dispatch(
-      getConfigType({ TypeName: 'Booking Type' })
-    ).unwrap();
-
-    if (tempconfigdata?.data?.statusCode == 1) {
-      setConfigDataList(tempconfigdata?.data?.data);
-      let configdata = tempconfigdata?.data?.data;
-      let checkName = BookingTypeBoth ? 'DineIn,TakeAway' : BookingType;
-
-      let filterconfigdata = configdata?.find(
-        (a) => a?.ConfigName === checkName
-      );
-      setSelectedBookingType(filterconfigdata?.ConfigId);
-    }
-  };
-
-  const TokenPrint = async (index) => {
-    try {
-      console.log(`Starting token print for index ${index}`);
-
-      const stylePrint = `<style> 
-      *{
-        font-family:Poppins;
-      }
-    
-      .Reprint-body{  
-        height: 100%;
-        margin: 0vw 0vh;
-        padding: 1vw 2vh;
-      }
-    
-      .Re-print-body-Tr {
-        text-align: center;
-        font-family: Poppins;
-      }
-      .Re-print-body-Product{
-        text-align:left;
-        font-size:12px;
-        border: 1px solid black;
-        border-collapse: collapse;
-        font-family: Poppins;
-        padding-left:5px;
-      }
-      .Re-print-body-Rate{
-        text-align:right;
-          font-size:12px;
-          padding-right:5px;
-          border: 1px solid black;
-          border-collapse: collapse;
-          font-family: Poppins;
-      }
-      .Re-print-Logo{
-        width: 50px ;
-        height: 50px;
-        margin-bottom: -20px;
-       }
-    
-      .Re-print-title {
-        font-size: 19px;
-        font-weight: 600;
-        font-family: Gilroy;
-        margin-bottom: -10px;
-        text-align:center;
-      }
-      
-      .Re-print-Add {
-        font-size: 12px;
-        font-family: Poppins;
-        margin-bottom: -5px;
-      }
-      
-      .Re-print-GST {
-        font-size: 12px;
-        font-family: Poppins;
-      }
-    
-      .Re-print-top {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        width: 100%;
-      }
-    
-      .Re-print-top2 {
-        display: flex;
-        width: 90%;
-        margin:0px 10px;
-        font-family: Gilroy;
-        justify-content: space-between;
-      }
-      .Re-print-top3 {
-        display: flex;
-        width: 75%;
-        margin:0px 30px;
-        font-family: Gilroy;
-        justify-content: space-between;
-        margin-bottom: 5px;
-      }
-      .Re-print-bold{
-        font-size: 8px;
-        font-weight: 400;
-        font-family: Poppins;
-        letter-spacing: 1px;
-      }
-    
-      .Re-print-bold1{
-        font-size: 12px;
-        font-weight: 600;
-        font-family: Poppins;
-        letter-spacing: 1px;
-      }
-      .Re-print-bold2{
-        width:100%;
-        font-size: 12px;
-        font-family: Poppins;
-        text-align:center;
-      }
-    
-      .Re-print-Table {
-          width: 90%;
-          margin:0px 10px;
-        }
-    
-      .Re-print-Table ,.Re-print-th ,.Re-print-td {
-          border: 1px solid black;
-          border-collapse: collapse;
-          font-family: Poppins;
-        }
-        .Re-print-td
-        {
-          font-size:12px;
-        }
-    
-      </style>`;
-      if (TokenOnly?.SettingValue === 'Y') {
-        if (IndividualToken?.SettingValue === 'Y') {
-          await printDiv(`TokenOnlySingle${index}`, stylePrint);
-        } else {
-          await printDiv(`TokenOnlyMultiple${index}`, stylePrint);
-        }
-      } else {
-        await printDiv(`TakeawayToken${index}`, stylePrint);
-      }
-    } catch (error) {
-      console.error(`Error printing token for index ${index}:`, error);
-    }
-  };
-  const AllProductTokenFunction = async () => {
-    if (IndividualToken?.SettingValue === 'Y') {
-      await Promise.all(
-        PrintOrderDetails?.[0]?.OrderDetails?.map(
-          async (orderDetail, index) => {
-            const groupedTokens = orderDetail?.productDetails?.reduce(
-              (acc, item, idx) => {
-                if (item.TokenAvailable === 'Y') {
-                  if (!item.CounterName) {
-                    // If CounterName is null or empty
-                    acc[`single-${idx}-${item.ProdId}`] = [item]; // Unique entry for each null/empty CounterName item
-                  } else {
-                    if (!acc[item.CounterName]) {
-                      acc[item.CounterName] = [];
-                    }
-                    acc[item.CounterName].push(item); // Group by CounterName
-                  }
-                }
-                return acc;
-              },
-              {}
-            );
-
-            // Iterate over grouped tokens and print them
-            const tokensToPrint = Object.entries(groupedTokens).map(
-              async ([counterName, items], idx) => {
-                // Use the counterName (or unique identifier for individual items) as part of the tokenId
-                const tokenId = `${idx}-${items?.[0]?.ProdId}-${counterName}`;
-                await TokenPrint(tokenId, items); // Pass all grouped items to the print function
-              }
-            );
-            if (tokensToPrint?.length > 0) {
-              await Promise.all(tokensToPrint);
+              // Create applied offer
+              AppliedOffers.push(
+                createAppliedOffer(
+                  matchingFreeProduct,
+                  availableFreeQty,
+                  item.InwardDtlId,
+                  item.OrderRate,
+                  item.BookingTypeName
+                )
+              );
             }
-            setPrintOrderDetails([]);
-            closePrintOption();
-          }
-        )
-      );
-    } else {
-      await Promise.all(
-        PrintOrderDetails?.[0]?.OrderDetails?.map(
-          async (orderDetail, index) => {
-            await TokenPrint(`${index}-${orderDetail?.OrderId}`);
-          }
-        )
-      );
-      setPrintOrderDetails([]);
-      closePrintOption();
-    }
-  };
 
-  const getHolddata = async () => {
-    const data = { CompId: CompId, BranchId: BranchId, AppId: AppId };
-    let response = await dispatch(gettinghold(data)).unwrap();
-    if (response?.data?.statusCode == 1) {
-      dispatch(changeholddata(response?.data?.data));
-    } else {
-      dispatch(changeholddata([]));
-    }
-  };
-  const getUnpaiddatas = async () => {
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-    };
-    await dispatch(getUnpaidData(data)).unwrap();
-  };
+            // Handle excess quantity - look for existing paid item in original cart
+            const existingPaidItem = orderCardDtls.find(
+              (cartItem) =>
+                cartItem.InwardDtlId === item.InwardDtlId &&
+                cartItem.localId !== item.localId &&
+                (!cartItem.Offer || cartItem.Offer === 0) &&
+                !cartItem.OfferType &&
+                !cartItem.OfferMode
+            );
 
-  const TotalItemsCalculation = async () => {
-    let tempTotalitems = OrderCardDetail?.length;
-    let OverAllQty = OrderCardDetail?.reduce((acc, item) => {
-      const isWeightScale = item?.ScaleType === 'weight';
+            if (
+              existingPaidItem &&
+              !processedItems.has(existingPaidItem.localId)
+            ) {
+              // Merge excess with existing paid item
+              const mergedPaidItem = {
+                ...existingPaidItem,
+                OrderQty: existingPaidItem.OrderQty + excessQty,
+                TotalAmt:
+                  (existingPaidItem.OrderQty + excessQty) * item.OrderRate,
+                TaxAmt: (
+                  ((existingPaidItem.OrderQty + excessQty) *
+                    item.OrderRate *
+                    item.TaxPercentage) /
+                  100
+                ).toFixed(2),
+                WithoutTaxRate:
+                  (existingPaidItem.OrderQty + excessQty) * item.OrderRate -
+                  ((existingPaidItem.OrderQty + excessQty) *
+                    item.OrderRate *
+                    item.TaxPercentage) /
+                    100,
+              };
 
-      if (isWeightScale) {
-        return (
-          acc + (Weightasquantity ? Math.round(Number(item?.OrderQty || 0)) : 1)
-        );
-      }
+              ModifiedData.push(mergedPaidItem);
+              processedItems.add(existingPaidItem.localId); // Mark as processed
+            } else {
+              // Create new paid item for excess quantity
+              const paidItem = {
+                ...item,
+                OrderQty: excessQty,
+                TotalAmt: excessQty * item.OrderRate,
+                TaxAmt: (
+                  (excessQty * item.OrderRate * item.TaxPercentage) /
+                  100
+                ).toFixed(2),
+                WithoutTaxRate:
+                  excessQty * item.OrderRate -
+                  (excessQty * item.OrderRate * item.TaxPercentage) / 100,
+                Offer: 0,
+                OfferType: undefined,
+                OfferMode: undefined,
+                OfferMessage: undefined,
+                localId: item.localId + '_paid',
+              };
 
-      return acc + Math.round(Number(item?.OrderQty || 0));
-    }, 0);
-    setTotalItems(tempTotalitems);
-    setQty(OverAllQty);
-  };
-  const Print = async () => {
-    const style = await PrintStyleFunction(
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle,
-      'Sales'
-    );
+              ModifiedData.push(paidItem);
+            }
+          } else if (availableFreeQty > 0) {
+            // All quantity can remain free
+            const isAlreadyExists = ModifiedData?.findIndex(
+              (data) =>
+                data?.OfferMode === item?.OfferMode &&
+                data?.InwardDtlId === item?.InwardDtlId &&
+                data?.ProdId === item?.ProdId &&
+                data?.OfferMessage?.[0]?.OfferId ===
+                  item?.OfferMessage?.[0]?.OfferId
+            );
 
-    const stylesMap = {
-      'Style 1': 'PrintStyle1',
-      'Style 2': 'PrintStyle2',
-      'Style 3': 'PrintStyle3',
-      'Style 4': 'PrintStyle4',
-      'Style 5': 'PrintStyle5',
-      'Style 6': 'PrintStyle6',
-      'Style 7': 'PrintStyle7',
-      'Style 8': 'PrintStyle8',
-      'Style 9': 'PrintStyle9',
-      'Style 10': 'PrintStyle10',
-      'Style 11': 'PrintStyle11',
-      'Style 12': 'PrintStyle12',
-      'Style 13': 'RePrint',
-      A4: 'PrintStyleA4',
-      A5: 'PrintStyleA5',
-      A4Standard: 'A4Standard',
-      TaxInvoice: 'TaxInvoice',
-    };
+            if (isAlreadyExists !== -1) {
+              // Merge with existing free item
+              ModifiedData[isAlreadyExists] = {
+                ...ModifiedData[isAlreadyExists],
+                OrderQty:
+                  ModifiedData[isAlreadyExists].OrderQty + item.OrderQty,
+                TotalAmt:
+                  (ModifiedData[isAlreadyExists].OrderQty + item.OrderQty) *
+                  item.OrderRate,
+                TaxAmt: (
+                  ((ModifiedData[isAlreadyExists].OrderQty + item.OrderQty) *
+                    item.OrderRate *
+                    item.TaxPercentage) /
+                  100
+                ).toFixed(2),
+                WithoutTaxRate:
+                  (ModifiedData[isAlreadyExists].OrderQty + item.OrderQty) *
+                    item.OrderRate -
+                  ((ModifiedData[isAlreadyExists].OrderQty + item.OrderQty) *
+                    item.OrderRate *
+                    item.TaxPercentage) /
+                    100,
+                Offer:
+                  (ModifiedData[isAlreadyExists].OrderQty + item.OrderQty) *
+                  item.OrderRate,
+              };
+            } else {
+              // Create new free item
+              const newFreeItem = {
+                ...item,
+                TotalAmt: item.OrderQty * item.OrderRate,
+                TaxAmt: (
+                  (item.OrderQty * item.OrderRate * item.TaxPercentage) /
+                  100
+                ).toFixed(2),
+                WithoutTaxRate:
+                  item.OrderQty * item.OrderRate -
+                  (item.OrderQty * item.OrderRate * item.TaxPercentage) / 100,
+                Offer: item.OrderQty * item.OrderRate,
+              };
 
-    const selectedStyle =
-      stylesMap[
-      printerTemplateStyle == undefined ? 'Style 13' : printerTemplateStyle
-      ];
+              ModifiedData.push(newFreeItem);
+            }
 
-    if (selectedStyle) {
-      await Promise.all(
-        PrintOrderDetails?.[0]?.OrderDetails?.map(
-          async (orderDetail, index) => {
-            await printDiv(`${selectedStyle}-${index}`, style); // Use unique IDs for each print
-            if (orderDetail?.BookingTypeName !== 'Dine In') {
-              const groupedTokens = orderDetail?.productDetails?.reduce(
-                (acc, item, idx) => {
-                  if (item.TokenAvailable === 'Y') {
-                    if (!item.CounterName) {
-                      // If CounterName is null or empty
-                      acc[`individual-${idx}-${item.ProdId}`] = [item]; // Unique entry for each null/empty CounterName item
-                    } else {
-                      if (!acc[item.CounterName]) {
-                        acc[item.CounterName] = [];
-                      }
-                      acc[item.CounterName].push(item); // Group by CounterName
-                    }
-                  }
-                  return acc;
+            const appliedOfferAlreadyExists = AppliedOffers.findIndex(
+              (offer) =>
+                offer?.FreeProductsList?.FreeProdId ===
+                  matchingFreeProduct?.FreeProdId &&
+                offer?.TableName === matchingFreeProduct?.TableName &&
+                offer?.TableUniqueName ===
+                  matchingFreeProduct?.TableUniqueName &&
+                offer?.OfferId === matchingFreeProduct?.OfferId &&
+                offer?.OfferMode === matchingFreeProduct?.OfferMode &&
+                offer?.FreeProductsList?.ProdVariantDetails?.[0]
+                  ?.StockDetails?.[0]?.FreeInwardDtlId === item?.InwardDtlId
+            );
+
+            if (appliedOfferAlreadyExists !== -1) {
+              AppliedOffers[appliedOfferAlreadyExists] = {
+                ...AppliedOffers[appliedOfferAlreadyExists],
+                ActualOfferAmount:
+                  AppliedOffers[appliedOfferAlreadyExists].ActualOfferAmount +
+                  item.OrderQty * item.OrderRate,
+                ActualFreeQty:
+                  AppliedOffers[appliedOfferAlreadyExists].ActualFreeQty +
+                  item.OrderQty,
+                OfferAmount:
+                  (AppliedOffers[appliedOfferAlreadyExists].ActualFreeQty +
+                    item.OrderQty) *
+                  item.OrderRate,
+                OfferValue:
+                  (AppliedOffers[appliedOfferAlreadyExists].ActualFreeQty +
+                    item.OrderQty) *
+                  item.OrderRate,
+                UsedCount:
+                  (matchingFreeProduct?.ProdVariantDetails?.[0]
+                    ?.StockDetails?.[0]?.ProdLoyaltyPoint || 0) *
+                  (AppliedOffers[appliedOfferAlreadyExists].ActualFreeQty +
+                    item.OrderQty),
+                FreeProductsList: {
+                  ...AppliedOffers[appliedOfferAlreadyExists].FreeProductsList,
+                  FreeQty:
+                    AppliedOffers[appliedOfferAlreadyExists].FreeProductsList
+                      .FreeQty + item.OrderQty,
                 },
-                {}
+              };
+            } else {
+              // Create applied offer
+              AppliedOffers.push(
+                createAppliedOffer(
+                  matchingFreeProduct,
+                  item.OrderQty,
+                  item.InwardDtlId,
+                  item.OrderRate,
+                  item.BookingTypeName
+                )
               );
-
-              // Iterate over grouped tokens and print them
-              const tokensToPrint = Object.entries(groupedTokens).map(
-                async ([counterName, items], idx) => {
-                  // Use the counterName (or unique identifier for individual items) as part of the tokenId
-                  const tokenId = `${idx}-${items?.[0]?.ProdId}-${counterName}`;
-                  await TokenPrint(tokenId, items); // Pass all grouped items to the print function
-                }
-              );
-              if (tokensToPrint?.length > 0) {
-                await Promise.all(tokensToPrint);
-              }
             }
-          }
-        )
-      );
+          } else {
+            // No free quantity available, convert to paid
+            const paidItem = {
+              ...item,
+              Offer: 0,
+              OfferType: undefined,
+              OfferMode: undefined,
+              OfferMessage: undefined,
+              TotalAmt: item.OrderQty * item.OrderRate,
+              TaxAmt: (
+                (item.OrderQty * item.OrderRate * item.TaxPercentage) /
+                100
+              ).toFixed(2),
+              WithoutTaxRate:
+                item.OrderQty * item.OrderRate -
+                (item.OrderQty * item.OrderRate * item.TaxPercentage) / 100,
+            };
 
-      setPrintOrderDetails([]);
-      closePrintOption();
-    }
+            ModifiedData.push(paidItem);
+          }
+        } else {
+          // No matching free product found, convert to paid
+          const paidItem = {
+            ...item,
+            Offer: 0,
+            OfferType: undefined,
+            OfferMode: undefined,
+            OfferMessage: undefined,
+          };
+
+          ModifiedData.push(paidItem);
+        }
+      } else {
+        // Item is not currently free, check if it can become free
+        const matchingFreeProduct = updatedFreeProdList.find(
+          (freeProd) =>
+            freeProd.ProdVariantDetails?.some((variant) =>
+              variant.StockDetails?.some(
+                (stock) => stock.FreeInwardDtlId === item.InwardDtlId
+              )
+            ) && freeProd.RemainingQty > 0
+        );
+
+        if (matchingFreeProduct) {
+          const availableFreeQty = Math.min(
+            item.OrderQty,
+            matchingFreeProduct.RemainingQty
+          );
+
+          if (availableFreeQty > 0) {
+            // Create free item for available free quantity
+            const freeItem = {
+              ...item,
+              OrderQty: availableFreeQty,
+              TotalAmt: availableFreeQty * item.OrderRate,
+              TaxAmt: (
+                (availableFreeQty * item.OrderRate * item.TaxPercentage) /
+                100
+              ).toFixed(2),
+              WithoutTaxRate:
+                availableFreeQty * item.OrderRate -
+                (availableFreeQty * item.OrderRate * item.TaxPercentage) / 100,
+              Offer: availableFreeQty * item.OrderRate,
+              OfferType: matchingFreeProduct.OfferMode,
+              OfferMode: matchingFreeProduct.OfferMode,
+              OfferMessage: [
+                {
+                  OfferId: matchingFreeProduct.OfferId,
+                  FreeQty: availableFreeQty,
+                  FreeProdId: matchingFreeProduct.FreeProdId,
+                  FreeProdName: matchingFreeProduct.FreeProdName,
+                },
+              ],
+              localId: item.localId + '_free',
+            };
+
+            ModifiedData.push(freeItem);
+
+            // Update free product usage
+            matchingFreeProduct.FreeQty =
+              (matchingFreeProduct.FreeQty || 0) + availableFreeQty;
+            matchingFreeProduct.RemainingQty -= availableFreeQty;
+
+            // Create applied offer
+            AppliedOffers.push(
+              createAppliedOffer(
+                matchingFreeProduct,
+                availableFreeQty,
+                item.InwardDtlId,
+                item.OrderRate,
+                item.BookingTypeName
+              )
+            );
+
+            // If there's remaining paid quantity
+            if (item.OrderQty > availableFreeQty) {
+              const paidQty = item.OrderQty - availableFreeQty;
+              const paidItem = {
+                ...item,
+                OrderQty: paidQty,
+                TotalAmt: paidQty * item.OrderRate,
+                TaxAmt: (
+                  (paidQty * item.OrderRate * item.TaxPercentage) /
+                  100
+                ).toFixed(2),
+                WithoutTaxRate:
+                  paidQty * item.OrderRate -
+                  (paidQty * item.OrderRate * item.TaxPercentage) / 100,
+              };
+
+              ModifiedData.push(paidItem);
+            }
+          } else {
+            // No free quantity available, keep as paid
+            ModifiedData.push(item);
+          }
+        } else {
+          // No matching free product or no remaining free quantity
+          ModifiedData.push(item);
+        }
+      }
+
+      processedItems.add(item.localId);
+    });
+
+    return {
+      ModifiedData,
+      UpdatedFreeProdList: updatedFreeProdList,
+      AppliedOffers,
+    };
+  }
+
+  const openExpireModal = ({ title, onOk, onCancel }) => {
+    setExpireModal({
+      open: true,
+      title,
+      onOk,
+      onCancel,
+    });
   };
 
+  const closeExpireModal = () => {
+    setExpireModal((prev) => ({ ...prev, open: false }));
+  };
+
+  async function getOffers() {
+    await dispatch(
+      getOfferinBooking({ AppId: AppId, CompId: CompId, BranchId: BranchId })
+    ).unwrap();
+  }
+
+  useEffect(() => {
+    const filteredOffers = OrderOfferDetail?.filter(
+      ({ TableName, TableUniqueName, OfferCode, Type, FreeProductsList }) => {
+        if (
+          (TableName === 'LoyaltyPoints' &&
+            TableUniqueName === 'UniqueId' &&
+            Type === 'A') ||
+          ((TableName === 'CustomerPromo' ||
+            TableName === 'CustomerCoupon' ||
+            TableName === 'OfferCode') &&
+            OfferCode != null &&
+            TableUniqueName === 'UniqueId')
+        ) {
+          return FreeProductsList?.ExistingList?.length > 0;
+        }
+        if (TableName === 'BuyXGetXOffers') return true;
+      }
+    );
+    // setfreeProductsOffers(filteredOffers);
+
+    getOffers();
+  }, [OrderOfferDetail]);
+
+  useEffect(() => {
+    if (SelectedCardFont) {
+      WebFont.load({
+        google: {
+          families: [SelectedCardFont], // Load the selected font
+        },
+      });
+    }
+  }, [SelectedCardFont]);
+
+  const cardData = !globalAccessForOthers
+    ? CardAccess
+      ? SelectedDatas?.length > 1
+        ? SelectedDatas
+        : SelectedDatas?.[0]?.AppId === 0 && SelectedDatas?.[0]?.CompId === 0
+          ? []
+          : SelectedDatas
+      : ItemCard?.length == 0 ||
+          (ItemCard?.[0]?.AppId === 0 && ItemCard?.[0]?.CompId === 0)
+        ? noSubcatCardData
+        : ItemCard
+    : '';
+
+  const cardDataForNewPrd = !globalAccessForOthers
+    ? CardAccess
+      ? SelectedDatas
+      : ItemCard?.length == 0
+        ? noSubcatCardData
+        : ItemCard
+    : '';
+  //
+
   function safeRound(amountStr) {
-    if (amountStr == null) return '0.00';
+    if (amountStr == null) return allowDecimal ? '0.00' : '0';
 
     const cleaned = String(amountStr).replace(/[^0-9.-]+/g, '');
     const num = Number(cleaned);
 
-    return isNaN(num) ? '0.00' : num.toFixed(2); // return as string with 2 decimals
+    if (isNaN(num)) return allowDecimal ? '0.00' : '0';
+
+    return allowDecimal ? num.toFixed(2) : Math.round(num).toString();
   }
-  const TotalWithoutTaxRate = async () => {
-    const totalwithouttax = OrderCardDetail?.reduce((accumulator, card) => {
-      return accumulator + parseFloat(card.WithoutTaxRate || 0);
-    }, 0);
-    setTotalWithoutTaxAmount(totalwithouttax.toFixed(2));
-    await dispatch(
-      changeSummeryTotalWithoutTaxAmount(totalwithouttax.toFixed(2))
-    );
-  };
-  const TotalTaxAmt = async () => {
-    const totaltax = OrderCardDetail?.reduce((accumulator, card) => {
-      return accumulator + parseFloat(card.TaxAmt || 0);
-    }, 0);
-    setTotalTaxAmount(totaltax.toFixed(2));
-    await dispatch(changeSummeryTotalTaxAmount(totaltax.toFixed(2)));
-  };
 
-  const HandleholdModelOpen = () => {
-    setHold(true);
-  };
-
-  const handleHoldCancel = () => {
-    setHold(false);
-  };
-  const handleAddCustomer = () => {
-    if (Custdisable === false) {
-      setAddCustomer(true);
+  useEffect(() => {
+    // fetchedit();
+    getPreferenceStock();
+    // dispatch(changepreOrder(false)); Commented to Add Normal Produts After Adding the Combo Pack !!!!!! Dont Touch Without Shifayath Permission
+  }, [preferenceDatas]);
+  useEffect(() => {
+    if (AppId && CompId && BranchId) {
+      // fetchedit();
+      GetmultipleSearchData();
     }
-  };
-  const handleAddCustomerCancel = () => {
-    setAddCustomer(false);
-  };
 
-  const handleOpenChange = (newOpen) => {
-    setOpen(newOpen);
-  };
-  const hide = () => {
-    setOpen(false);
-  };
-  const hideDefault = () => {
-    setUpiOptionOpen(false);
-  };
-  const handlePopoverVisibleChange = (visible) => {
-    setUpiOptionOpen(visible);
-  };
+    // dispatch(changepreOrder(false)); Commented to Add Normal Produts After Adding the Combo Pack !!!!!! Dont Touch Without Shifayath Permission
+  }, [AppId, CompId, BranchId]);
 
-  const handleextraCharges = () => {
-    setExtraCharges(true);
-  };
-  const handleextraChargesCancel = () => {
-    setExtraCharges(false);
-  };
-
-  const handleQuickCancel = async () => {
-    await dispatch(changeCompoPaymentIconStatus(false));
-    //
-    setQuickAdd(false);
-  };
-  const setQuickOpen = async () => {
-    await dispatch(changeCompoPaymentIconStatus(true));
-    setQuickAdd(true);
-  };
-
-  const ProductSummary = (salesData) => {
-    // Create a map to store the aggregated values for each unique product
-    const productMap = new Map();
-    // Iterate over the sales data to aggregate values
-    salesData.forEach((item) => {
-      const key = `${item.ProdId}-${item.InwardDtlId}-${item.BookingType}-${item.SinglePc}-${item.OrderRate}`;
-      if (productMap.has(key)) {
-        const existingItem = productMap.get(key);
-        existingItem.OrderQty += item.OrderQty || 0;
-        existingItem.TotalAmt += item.TotalAmt || 0;
-        existingItem.TaxAmt =
-          parseFloat(existingItem.TaxAmt) + parseFloat(item.TaxAmt) || 0;
-        // existingItem.WithoutTaxRate += parseFloat(item.WithoutTaxRate) || 0;
-      } else {
-        // If the key doesn't exist, add a new entry
-        productMap.set(key, { ...item });
-      }
-    });
-
-    // Convert the map values back to an array
-    const aggregatedProducts = Array.from(productMap.values());
-
-    return aggregatedProducts;
-  };
-  const handleCreditCustomer = (type) => {
-    setCreditCustomer(false);
-    if (type == 'Submit') {
-      Booking(BookingType, true);
-    }
-    if (type == 'Cancel') {
-      setPaybtnnameselected(PaymentOptionsModeName);
-      setPaybtnselected(PaymentOptionsModeId);
-    }
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedRemovedData = {
-        type: 'remove',
-        keyValue: 'OrderTotalAmount',
-      };
-      customerDisplayWindow.postMessage(updatedRemovedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
-      );
-    }
-  };
-  const BadgePendingApi = async () => {
-    let Data = {
-      compId: CompId,
-      branchId: BranchId,
-      appId: AppId,
-      deliveryStatus: 'P',
+  const GetmultipleSearchData = async () => {
+    const data = {
+      AppId,
+      CompId,
+      BranchId,
     };
-    let PendingResponse = await dispatch(PreOrderGet(Data)).unwrap();
-    if (PendingResponse?.data?.statusCode === 1) {
-      await dispatch(
-        changePreOrderPendingCount(PendingResponse?.data?.data?.length)
-      );
+
+    try {
+      const response = await dispatch(getmultipleSearch(data));
+    } catch (error) {
+      console.error('Get Search Terms Error:', error);
     }
   };
 
   useEffect(() => {
-    if (OrderCardDetail?.length <= 0) {
-      dispatch(changeCustomerID(null));
-      dispatch(changeSelectedCustId(null));
-      dispatch(changeSelectedOption(null));
-      dispatch(ChangeSelectedCustDisable(false));
-    }
-  }, [OrderCardDetail]);
-
-  const ClearAllGlobalStateDatas = async (value) => {
-    if (OfferCheckedInSetup && preferenceOffer) {
-      await applyOffer([]);
-    } else {
-      dispatch(changeOrderCardDetails([]));
-    }
-    dispatch(changeTipAmount(0));
-    await dispatch(ChangeTotalAmount([]));
-    await dispatch(changeReorderHoldDetails({}));
-    await dispatch(changeReorderProductDetails([]));
-    setFirstPaymentclick(false);
-    await dispatch(ChangeNavHoldData(false));
-    await dispatch(changeCustomerID(null));
-    await dispatch(changeSelectedCustId(null));
-    await dispatch(changeSelectedOption(null));
-    setPaybtnnameselected(PaymentOptionsModeName);
-    setPaybtnselected(PaymentOptionsModeId);
-    setQrCode(false);
-    setUpinotSelected(false);
-    getHolddata();
-    getUnpaiddatas();
-    await dispatch(changeBookingType('TakeAway'));
-    await dispatch(changeSelProdWiseEst([]));
-    await dispatch(ChangeOverAllDiscSales(0));
-    await dispatch(ChangeOverAllDiscEstimate(0));
-    // await dispatch(changeEstimateBooking(null))
-    // clearInvoiceDate
-    clearInvoiceDate();
-    dispatch(changeCurrentOrderId(null));
-    await dispatch(changeSelectTable([]));
-    await dispatch(changeSelectChair([]));
-    await dispatch(changeSelectedTableDetails([]));
-    await dispatch(changeOrderType());
-    if (value === 'Dine-In') {
-      navigate(`${subDirectory}sales/dine-in`);
-    }
-    let data = {
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      UserId: UserId,
-      FromDate: currentDateValue,
-      ToDate: currentDateValue,
-    };
-    await dispatch(getSalesDetailData(data));
-  };
-
-  const AddBookingDetails = async (value, pay) => {
-    const customerDisplayWindow = getCustomerDisplayWindow();
-
-    const OnUpiSelected = PaymentOptions?.find(
-      (item) => item.ModeId === paybtnselected
-    );
+    setPreOrderSelectedProdNames([]);
+    // dispatch(changePreOrderAdditem(null));
+  }, [preOrder]);
+  useEffect(() => {
     if (
-      OnUpiSelected?.ModeName?.toLowerCase() === 'upi' &&
-      SelectedUPIPayOption?.toLowerCase() === 'default'
+      ProdCat &&
+      ProdSubCat !== NaN &&
+      initialRun &&
+      'BookingSubCategory' in templateData
     ) {
-      SetSuccess(false);
-      setTimeout(function () {
-        SetSuccess(true);
-        // Add your state change code here
-        // For example:
-        // setNewState(newValue);
-      }, 3000);
-      if (SelectedUpiOption) {
-        Booking(value, pay);
-      } else {
-        setUpinotSelected(true);
-        setMessageType('error');
-        setMessageData('Please Select Upi Option');
+      productCardList();
+    }
+  }, [ProdSubCat, productCardTrigger]);
+  useEffect(() => {
+    if (
+      !initialRun &&
+      (!ProdSubCat || ProdSubCat != NaN || ProdSubCat === 'NaN') &&
+      ProdCat
+    ) {
+      setInitialRun(true);
+      productCardList();
+    }
+    if (
+      initialRun &&
+      !('BookingSubCategory' in templateData) &&
+      (!ProdSubCat || ProdSubCat != NaN || ProdSubCat === 'NaN') &&
+      ProdCat
+    ) {
+      productCardList();
+    }
+  }, [ProdCat, initialRun]);
+  useEffect(() => {
+    if (noSubcatCardData) {
+      setNoSubcatCardData();
+    }
+
+    if (
+      ProductSearch?.length > 5 &&
+      GetmultipleSearchDatas.some((e) => e.toLowerCase() === 'qrcode')
+    ) {
+      setQuickAdd(true);
+    }
+  }, [ProductSearch, GetmultipleSearchDatas]);
+
+  const productCardList = async () => {
+    //condition
+    if (
+      (templateData?.BookingLayout?.[1]?.some(
+        (item) => item?.OptionName === 'SubCategory'
+      ) ||
+        templateData?.BookingCategory?.[0] == 'Category5') &&
+      ProdSubCat &&
+      ProdCat
+    ) {
+      let data = {
+        CompId: CompId,
+        BranchId: BranchId,
+        AppId: AppId,
+        ProdSubCat: ProdSubCat,
+        ...(AvailableDate && selectedDate
+          ? {
+              date: Array.isArray(selectedDate)
+                ? selectedDate
+                    .map((d) => (d?.format ? d.format('YYYY-MM-DD') : d))
+                    .join(',')
+                : selectedDate?.format
+                  ? selectedDate.format('YYYY-MM-DD')
+                  : selectedDate,
+            }
+          : {}),
+      };
+      //mohan
+      let response = await dispatch(getLayoutproductCard(data)).unwrap();
+      if (response?.data?.statusCode == 1) {
+        setNoSubcatCardData(response?.data?.data);
       }
     } else if (
-      OnUpiSelected?.ModeName?.toLowerCase() === 'card' &&
-      PaymentgatewayCard?.length > 0 &&
-      PaymentDeviceCard?.length > 0
+      !templateData?.BookingLayout?.[1]?.some(
+        (item) => item?.OptionName === 'SubCategory'
+      ) &&
+      templateData?.BookingCategory?.[0] != 'Category5' &&
+      ProdCat
     ) {
-      if (SelectedCardOption) {
-        if (SelectedCardOption?.toLowerCase() === 'pg') {
-          if (customerDisplayWindow && !customerDisplayWindow.closed) {
-            if (SelCustId) {
-              Booking(value, pay);
+      let data = {
+        compId: CompId,
+        branchId: BranchId,
+        appId: AppId,
+        prodCat: ProdCat,
+      };
+
+      // 👇 only add date if AvailableDate is true
+      if (AvailableDate && selectedDate) {
+        data.date = selectedDate;
+      }
+
+      let response = await dispatch(getCardDataWithoutSubmodule(data)).unwrap();
+
+      if (response?.data?.statusCode == 1) {
+        setNoSubcatCardData(response?.data?.data);
+      }
+    } else if (
+      (templateData?.BookingLayout?.[1]?.some(
+        (item) => item?.OptionName === 'SubCategory'
+      ) ||
+        templateData?.BookingCategory?.[0] == 'Category5') &&
+      !ProdSubCat &&
+      ProdCat &&
+      ProdSubCat != 'NaN'
+    ) {
+      let data = {
+        compId: CompId,
+        branchId: BranchId,
+        appId: AppId,
+        prodCat: ProdCat,
+        ...(AvailableDate && selectedDate
+          ? {
+              date: Array.isArray(selectedDate)
+                ? selectedDate
+                    .map((d) => (d?.format ? d.format('YYYY-MM-DD') : d))
+                    .join(',')
+                : selectedDate?.format
+                  ? selectedDate.format('YYYY-MM-DD')
+                  : selectedDate,
+            }
+          : {}),
+      };
+
+      let response = await dispatch(getCardDataWithoutSub(data)).unwrap();
+
+      if (response?.data?.statusCode == 1) {
+        setNoSubcatCardData(response?.data?.data);
+      }
+    }
+  };
+
+  useEffect(() => {
+    DispatchData();
+  }, [SelectedProdNames]);
+  const DispatchData = async () => {
+    await dispatch(ChangeAllItemData(SelectedProdNames));
+  };
+
+  useEffect(() => {
+    if (Object.keys(WSProductdata)?.length > 0) {
+      AddOrderDetails(WSProductdata);
+    }
+  }, [WSProductdata]);
+
+  useEffect(() => {
+    if (ItemCard?.[0]?.QrBasedSearch === 'Y') {
+      if (ItemCard?.[0]?.OverAllExpStatus == 'Y' && ExpiredProduct) {
+        openExpireModal({
+          title: 'Product Expires',
+          onOk: () => expFun(Item),
+        });
+        setItem(ItemCard?.[0]);
+      } else {
+        setQtydata(ItemCard?.[0]);
+        SingleQuantity(ItemCard?.[0], false);
+      }
+    } else if (ItemCard?.[0]?.OnePcQRBased === 'Y') {
+      if (ItemCard?.[0]?.OverAllExpStatus == 'Y' && ExpiredProduct) {
+        openExpireModal({
+          title: 'Product Expires',
+          onOk: () => expFun(Item),
+        });
+        setItem(ItemCard?.[0]);
+        setOnePeiceFlow(true);
+      } else {
+        setQtydata(ItemCard?.[0]);
+        SingleQuantity(ItemCard?.[0], true);
+      }
+    }
+  }, [ItemCard]);
+
+  useEffect(() => {
+    // let data = otherscarddata
+    if (Object.keys(otherscarddata)?.length > 0) {
+      let data = {
+        Type: otherscarddata?.Type ? otherscarddata?.Type : 'P',
+        OverallQuantity: otherscarddata?.OverAllQty,
+        ActiveStatus: otherscarddata?.ActiveStatus,
+        AvailableFrom: otherscarddata?.AvailableFrom,
+        AvailableTo: otherscarddata?.AvailableTo,
+        Cess: otherscarddata?.Cess,
+        ExpDate: otherscarddata?.ExpDate,
+        HSNCode: otherscarddata?.HSNCode,
+        ManufDate: otherscarddata?.ManufDate,
+        OpeningQty: otherscarddata?.OpeningQty,
+        ProdType: otherscarddata?.ProdType,
+        PartNumber: otherscarddata?.PartNumber,
+        ProdId: otherscarddata?.ProdId,
+        ProdLogo: otherscarddata?.ProdLogo,
+        ProdName: otherscarddata?.ProdName,
+        QRCode: otherscarddata?.QRCode,
+        QtyBasedPrice: otherscarddata?.QtyBasedPrice,
+        Rack: otherscarddata?.Rack,
+        Size: otherscarddata?.Size,
+        StockAvailable: otherscarddata?.StockAvailable,
+        TaxId: otherscarddata?.TaxId,
+        TaxPercentage: otherscarddata?.TaxPercentage,
+        TaxName: otherscarddata?.TaxIdName,
+        UniqueId: otherscarddata?.UniqueId,
+        UomName: otherscarddata?.UomName,
+        ProdVariantName: otherscarddata?.ProdVariantName, //sri
+        BalanceQty: otherscarddata?.BalanceQty,
+        BatchRef: otherscarddata?.BatchRef,
+        ModelNumber: otherscarddata?.ModelNumber, //sri
+        FullProductIdentifierDtls: otherscarddata?.FullProductIdentifierDtls, //sri
+        InwardDate: otherscarddata?.InwardDate,
+        InwardDtlId: otherscarddata?.InwardDtlId,
+        InwardId: otherscarddata?.InwardId,
+        MRP: otherscarddata?.MRP,
+        Offer: otherscarddata?.OfferPrice,
+        OrderRate: otherscarddata?.SellPrice,
+        SellingPrice: otherscarddata?.SellPrice, // edit srii
+        SuppId: otherscarddata?.SuppId,
+        SuppName: otherscarddata?.SuppName,
+        OrderQty: otherscarddata?.Quantity,
+        OtherProduct: otherscarddata?.OtherProduct,
+        // 'ProdVariantName': otherscarddata?.ProdVariantName,
+        BookingTypeName: BookingType,
+        CounterName: '', //sri
+      };
+      AddOrderDetails(data);
+    }
+    // data["OrderRate"] = otherscarddata?.SellPrice
+  }, [otherscarddata]);
+
+  useEffect(() => {
+    if (Object.keys(NewQrProductData)?.length > 0) {
+      let addQrProductData = { ...NewQrProductData };
+      addQrProductData['OrderRate'] = addQrProductData['SellPrice'];
+      addQrProductData['OrderQty'] = addQrProductData['Quantity'];
+      addQrProductData['SellingPrice'] = addQrProductData['SellPrice'];
+      addQrProductData['BookingTypeName'] = BookingType;
+      AddOrderDetails(addQrProductData);
+    }
+  }, [NewQrProductData]);
+
+  const getPreferenceStock = async () => {
+    const PreferenceStckDtl = preferenceDatas?.[0]?.SettingDtlDetails;
+    const StockPreference = PreferenceStckDtl?.find(
+      (item) => item.SettingIdName === 'StockSelection'
+    );
+    setStockPreferenceDetail(StockPreference);
+    const BillOrder = PreferenceStckDtl?.find(
+      (item) => item.SettingIdName === 'BillItemsOrder'
+    );
+    setBillOrderPre(BillOrder?.SettingValue);
+
+    const expiredDate =
+      PreferenceStckDtl?.find(
+        (item) => item.SettingIdName === 'ExpiredSelection'
+      )?.SettingValue === 'Y';
+    setExpiredProduct(expiredDate);
+  };
+
+  const CloseModal = () => {
+    setModelQty(false);
+    setRepeatedModel(false);
+    setProdexpir(false);
+    setOnePeiceFlow(false);
+    setSelectedBrand('Others');
+  };
+  const CloseModal1 = () => {
+    setModelstock(false);
+    setRepeatedModel(false);
+    setProdexpir(false);
+    setOnePeiceFlow(false);
+  };
+  const CloseVarientModal = () => {
+    setModalVarient(false);
+    setRepeatedModel(false);
+    setProdexpir(false);
+    setOnePeiceFlow(false);
+  };
+
+  const Quantity = () => {
+    setModelQty(true);
+  };
+  const SingleQuantity = (item, onePcs) => {
+    let count = item?.ProductDetail?.[0]?.ProdVariantDetails?.length;
+    if (count > 1) {
+      setModalVarient(true);
+    } else {
+      setVarientIndex(0);
+      SingleStockfun(item, onePcs);
+    }
+  };
+  const SingleStockfun = (item, onePcs) => {
+    let count =
+      item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
+        ?.StockDetails?.length;
+    if (
+      StockPreferenceDetail?.SettingValue === 'Y' &&
+      item?.ProductDetail?.[QtyIndex]?.StockAvailable == 'Y'
+    ) {
+      if (count > 1) {
+        setModelstock(true);
+      } else {
+        let Isincart = CartOrderDetails?.find(
+          (cartItem) =>
+            cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
+            cartItem?.InwardDtlId ===
+              item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
+            cartItem?.OrderRate ===
+              item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                VarientIndex
+              ]?.StockDetails?.[0]?.SellPrice &&
+            !cartItem?.SalesId
+        );
+
+        if (onePcs) {
+          let Isincartonepc = CartOrderDetails?.filter(
+            (cartItem) =>
+              cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
+              cartItem?.InwardDtlId ===
+                item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  VarientIndex
+                ]?.StockDetails?.[0]?.InwardDtlId &&
+              // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
+              !cartItem?.SalesId
+          );
+          let totalOrderQty = Isincartonepc?.reduce((accumulator, card) => {
+            return (
+              accumulator +
+              parseInt(
+                card?.StockAvailable === 'Y'
+                  ? card.SinglePc !== 'Y'
+                    ? card.OrderQty * card.NoOfPcs
+                    : card.OrderQty
+                  : 0
+              )
+            );
+          }, 0);
+          if (Isincartonepc && Isincartonepc?.[0]?.StockAvailable === 'Y') {
+            if (Isincartonepc?.[0]?.OverAllPcs > totalOrderQty) {
+              dataTransfer(item, 0, 0, 0, onePcs);
             } else {
-              setMessageType('error');
-              setMessageData('Please Select Customer');
+              dataTransfer(item, 0, 0, 1, onePcs);
             }
           } else {
-            setMessageType('error');
-            setMessageData('Please Set the customer display');
+            dataTransfer(item, 0, 0, 0, onePcs);
           }
         } else {
-          Booking(value, pay);
+          if (Isincart && Isincart?.StockAvailable === 'Y') {
+            if (Isincart?.BalanceQty > Isincart?.OrderQty) {
+              dataTransfer(item, 0, 0, 0, onePcs);
+            } else {
+              dataTransfer(item, 0, 0, 1, onePcs);
+            }
+          } else {
+            dataTransfer(item, 0, 0, 0, onePcs);
+          }
+        }
+      }
+    } else {
+      let Isincart = CartOrderDetails?.find(
+        (cartItem) =>
+          cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
+          cartItem?.InwardDtlId ===
+            item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
+              ?.StockDetails?.[0]?.InwardDtlId &&
+          cartItem?.OrderRate ===
+            item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
+              ?.StockDetails?.[0]?.SellPrice &&
+          !cartItem?.SalesId
+      );
+
+      if (onePcs) {
+        let Isincartonepc = CartOrderDetails?.filter(
+          (cartItem) =>
+            cartItem?.ProdId === item?.ProductDetail?.[QtyIndex]?.ProdId &&
+            cartItem?.InwardDtlId ===
+              item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
+            // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
+            !cartItem?.SalesId
+        );
+        let totalOrderQty = Isincartonepc?.reduce((accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty * (card.NoOfPcs ? card.NoOfPcs : 1)
+                  : card.OrderQty
+                : 0
+            )
+          );
+        }, 0);
+        if (Isincartonepc && Isincartonepc?.[0]?.StockAvailable === 'Y') {
+          if (Isincartonepc?.[0]?.OverAllPcs > totalOrderQty) {
+            dataTransfer(item, 0, 0, 0, onePcs);
+          } else {
+            dataTransfer(item, 0, 0, 1, onePcs);
+          }
+        } else {
+          dataTransfer(item, 0, 0, 0, onePcs);
         }
       } else {
-        setCardoptionnotSelected(true);
-        setMessageType('error');
-        setMessageData('Please Select Card Option');
-      }
-    } else if (OnUpiSelected?.ModeName?.toLowerCase() === 'credit') {
-      if (!SelCustId) {
-        setMessageType('error');
-        setMessageData('Please Select Customer');
-      } else {
-        setCreditCustomer(true);
-        const customerDisplayWindow = getCustomerDisplayWindow();
-        if (customerDisplayWindow && !customerDisplayWindow.closed) {
-          const updatedData = {
-            OrderTotalAmount: TotalAmount,
-          };
-          customerDisplayWindow.postMessage(updatedData, '*');
+        if (Isincart && Isincart?.StockAvailable === 'Y') {
+          if (Isincart?.BalanceQty > Isincart?.OrderQty) {
+            dataTransfer(item, 0, 0, 0, onePcs);
+          } else {
+            dataTransfer(item, 0, 0, 1, onePcs);
+          }
         } else {
-          console.error(
-            'Customer display window is not available or has been closed.'
+          dataTransfer(item, 0, 0, 0, onePcs);
+        }
+      }
+    }
+  };
+
+  const Stockfun = (index) => {
+    setVarientIndex(index.key);
+    const variantDetails =
+      qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[index.key] || {};
+    const overallExpStatus = variantDetails.OverAllExpStatus;
+    const count = variantDetails.StockDetails?.length || 0;
+
+    if (
+      StockPreferenceDetail?.SettingValue === 'Y' &&
+      qtydata?.ProductDetail?.[QtyIndex]?.StockAvailable == 'Y'
+    ) {
+      if (count > 1) {
+        if (
+          overallExpStatus === 'N' ||
+          (overallExpStatus === 'Y' && prodexpir)
+        ) {
+          setModalVarient(false);
+          setModelstock(true);
+          setVarItem(index.key);
+          if (overallExpStatus === 'Y' && prodexpir) {
+            setRepeatedModel(true);
+          }
+        } else if (overallExpStatus === 'Y' && ExpiredProduct) {
+          setVarItem(index.key);
+          openExpireModal({
+            title: 'Variant Expires',
+            onOk: () => expVerFun(VarItem),
+            onCancel: () => {
+              setRepeatedModel(false);
+              setProdexpir(false);
+            },
+          });
+        }
+      } else {
+        if (
+          overallExpStatus === 'N' ||
+          (overallExpStatus === 'Y' && prodexpir)
+        ) {
+          let Isincart = CartOrderDetails?.find(
+            (cartItem) =>
+              cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
+              cartItem?.InwardDtlId ===
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.InwardDtlId &&
+              cartItem?.OrderRate ===
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.SellPrice &&
+              !cartItem?.SalesId
+          );
+
+          if (onePeiceFlow) {
+            let Isincartonepc = CartOrderDetails?.filter(
+              (cartItem) =>
+                cartItem?.ProdId ===
+                  qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
+                cartItem?.InwardDtlId ===
+                  qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                    index.key
+                  ]?.StockDetails?.[0]?.InwardDtlId &&
+                // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
+                !cartItem?.SalesId
+            );
+            let totalOrderQty = Isincartonepc?.reduce((accumulator, card) => {
+              return (
+                accumulator +
+                parseInt(
+                  card?.StockAvailable === 'Y'
+                    ? card.SinglePc !== 'Y'
+                      ? card.OrderQty * (card.NoOfPcs ? card.NoOfPcs : 1)
+                      : card.OrderQty
+                    : 0
+                )
+              );
+            }, 0);
+            if (Isincartonepc && Isincartonepc?.[0]?.StockAvailable === 'Y') {
+              if (Isincartonepc?.[0]?.OverAllPcs > totalOrderQty) {
+                dataTransfer(qtydata, QtyIndex, index.key, 0, onePeiceFlow);
+              } else {
+                dataTransfer(qtydata, QtyIndex, index.key, 1, onePeiceFlow);
+              }
+            } else {
+              dataTransfer(qtydata, QtyIndex, index.key, 0, onePeiceFlow);
+            }
+          } else {
+            if (Isincart && Isincart?.StockAvailable === 'Y') {
+              if (Isincart?.BalanceQty > Isincart?.OrderQty) {
+                dataTransfer(qtydata, QtyIndex, index.key, 0, onePeiceFlow);
+              } else {
+                dataTransfer(qtydata, QtyIndex, index.key, 1, onePeiceFlow);
+              }
+            } else {
+              dataTransfer(qtydata, QtyIndex, index.key, 0, onePeiceFlow);
+            }
+          }
+
+          setModelQty(false);
+          setSelectedBrand('Others');
+          setVarItem(index.key);
+          if (overallExpStatus === 'Y' && prodexpir) {
+            setProdexpir(false);
+            setRepeatedModel(true);
+            return;
+          }
+        } else if (overallExpStatus === 'Y' && ExpiredProduct) {
+          setVarItem(index.key);
+          openExpireModal({
+            title: 'Variant Expires',
+            onOk: () => expVerFun(VarItem),
+            onCancel: () => {
+              setRepeatedModel(false);
+              setProdexpir(false);
+            },
+          });
+          return;
+        }
+      }
+    } else {
+      if (overallExpStatus === 'N' || (overallExpStatus === 'Y' && prodexpir)) {
+        const stockDetails =
+          qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[index.key]
+            ?.StockDetails;
+        console.log(stockDetails, CartOrderDetails, 'currIndex');
+        let Isincart = CartOrderDetails?.find(
+          (cartItem) =>
+            cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
+            cartItem?.InwardDtlId ===
+              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                index.key
+              ]?.StockDetails?.[0]?.InwardDtlId &&
+            cartItem?.OrderRate ===
+              qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                index.key
+              ]?.StockDetails?.[0]?.SellPrice &&
+            !cartItem?.SalesId
+        );
+
+        if (onePeiceFlow) {
+          let Isincartonepc = CartOrderDetails?.filter(
+            (cartItem) =>
+              cartItem?.ProdId === qtydata?.ProductDetail?.[QtyIndex]?.ProdId &&
+              cartItem?.InwardDtlId ===
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+                  index.key
+                ]?.StockDetails?.[0]?.InwardDtlId &&
+              // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
+              !cartItem?.SalesId
+          );
+          let totalOrderQty = Isincartonepc?.reduce((accumulator, card) => {
+            return (
+              accumulator +
+              parseInt(
+                card?.StockAvailable === 'Y'
+                  ? card.SinglePc !== 'Y'
+                    ? card.OrderQty * (card.NoOfPcs ? card.NoOfPcs : 1)
+                    : card.OrderQty
+                  : 0
+              )
+            );
+          }, 0);
+          if (Isincartonepc && Isincartonepc?.[0]?.StockAvailable === 'Y') {
+            if (Isincartonepc?.[0]?.OverAllPcs > totalOrderQty) {
+              dataTransfer(qtydata, QtyIndex, index.key, 0, onePeiceFlow);
+            } else {
+              dataTransfer(qtydata, QtyIndex, index.key, 1, onePeiceFlow);
+            }
+          } else {
+            dataTransfer(qtydata, QtyIndex, index.key, 0, onePeiceFlow);
+          }
+        } else {
+          const findNextAvailableStockIndex = (
+            stockDetails,
+            CartOrderDetails,
+            prodId
+          ) => {
+            if (!stockDetails || stockDetails.length === 0) return 0;
+
+            for (let i = 0; i < stockDetails.length; i++) {
+              const stock = stockDetails[i];
+
+              // Find if this specific stock is already in cart
+              const cartItem = CartOrderDetails?.find(
+                (item) =>
+                  item?.ProdId === prodId &&
+                  item?.InwardDtlId === stock?.InwardDtlId &&
+                  item?.OrderRate === stock?.SellPrice &&
+                  !item?.SalesId
+              );
+
+              // If not in cart, this stock has full balance available - use this
+              if (!cartItem) {
+                return i;
+              }
+
+              // If in cart and NOT fully utilized, continue using this stock
+              if (cartItem && cartItem?.OrderQty < cartItem?.BalanceQty) {
+                return i;
+              }
+
+              // If OrderQty === BalanceQty (fully utilized), move to next stock
+              // Continue the loop...
+            }
+
+            // If all stocks are exhausted, return the last index
+            return stockDetails.length - 1;
+          };
+
+          const currentProdId = qtydata?.ProductDetail?.[QtyIndex]?.ProdId;
+
+          // Find the next available stock index dynamically
+          const nextAvailableIndex = findNextAvailableStockIndex(
+            stockDetails,
+            CartOrderDetails,
+            currentProdId
+          );
+
+          dataTransfer(
+            qtydata,
+            QtyIndex,
+            index.key,
+            nextAvailableIndex,
+            onePeiceFlow
+          );
+        }
+
+        setModelQty(false);
+        setSelectedBrand('Others');
+        setVarItem(index.key);
+        if (overallExpStatus === 'Y' && prodexpir) {
+          setProdexpir(false);
+          setRepeatedModel(true);
+          return;
+        }
+      } else if (overallExpStatus === 'Y' && ExpiredProduct) {
+        setVarItem(index.key);
+        openExpireModal({
+          title: 'Variant Expires',
+          onOk: () => expVerFun(VarItem),
+          onCancel: () => {
+            setRepeatedModel(false);
+            setProdexpir(false);
+          },
+        });
+        return;
+      }
+      setModelQty(false);
+      setSelectedBrand('Others');
+    }
+  };
+  const VarientFun = (index) => {
+    const QtyExpire = index?.ProdVariantDetails.every(
+      (item) => item.OverAllExpStatus === 'Y'
+    );
+    if (QtyExpire && ExpiredProduct) {
+      openExpireModal({
+        title: 'Quantity Expires',
+        onOk: () => expQtyFun(qtyExpData),
+        onCancel: () => {
+          setRepeatedModel(false);
+          (setProdexpir(false), closeExpireModal());
+        },
+      });
+      setQtyExpData(index);
+    } else {
+      const selectedProIndex = qtydata?.ProductDetail?.findIndex(
+        (item) =>
+          item?.ProdId === index?.ProdId &&
+          item?.Size === index?.Size &&
+          item?.UomName === index?.UomName &&
+          item?.Brand === index?.Brand
+      );
+
+      if (selectedProIndex !== -1) {
+        const count =
+          qtydata?.ProductDetail[selectedProIndex]?.ProdVariantDetails
+            ?.length || 0;
+
+        if (count > 1) {
+          setModelQty(false);
+          setSelectedBrand('Others');
+          setModalVarient(true);
+        } else {
+          const item = { QtyIndex: selectedProIndex, VarientIndex: 0 };
+          singleVarient(item);
+          setModelQty(false);
+          setSelectedBrand('Others');
+        }
+      }
+
+      setQtyIndex(selectedProIndex);
+      setVarientIndex(0);
+      setRepeatedModel(false);
+    }
+  };
+  const singleVarient = (item) => {
+    let count =
+      qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+        item?.VarientIndex
+      ]?.StockDetails?.length;
+
+    if (
+      StockPreferenceDetail?.SettingValue === 'Y' &&
+      qtydata?.ProductDetail?.[item?.QtyIndex]?.StockAvailable == 'Y'
+    ) {
+      if (count > 1) {
+        setModalVarient(false);
+        setModelstock(true);
+        // setVarientIndex(index.key)
+      } else {
+        let Isincart = CartOrderDetails?.find(
+          (cartItem) =>
+            cartItem?.ProdId ===
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+            cartItem?.InwardDtlId ===
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
+            cartItem?.OrderRate ===
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.SellPrice &&
+            !cartItem?.SalesId
+        );
+
+        if (onePeiceFlow) {
+          let Isincartonepc = CartOrderDetails?.filter(
+            (cartItem) =>
+              cartItem?.ProdId ===
+                qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+              cartItem?.InwardDtlId ===
+                qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                  item?.VarientIndex
+                ]?.StockDetails?.[0]?.InwardDtlId &&
+              // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
+              !cartItem?.SalesId
+          );
+          let totalOrderQty = Isincartonepc?.reduce((accumulator, card) => {
+            return (
+              accumulator +
+              parseInt(
+                card?.StockAvailable === 'Y'
+                  ? card.SinglePc !== 'Y'
+                    ? card.OrderQty * card.NoOfPcs
+                    : card.OrderQty
+                  : 0
+              )
+            );
+          }, 0);
+          if (Isincartonepc && Isincartonepc?.[0]?.StockAvailable === 'Y') {
+            if (Isincartonepc?.[0]?.OverAllPcs > totalOrderQty) {
+              dataTransfer(
+                qtydata,
+                item?.QtyIndex,
+                item?.VarientIndex,
+                0,
+                onePeiceFlow
+              );
+            } else {
+              dataTransfer(
+                qtydata,
+                item?.QtyIndex,
+                item?.VarientIndex,
+                1,
+                onePeiceFlow
+              );
+            }
+          } else {
+            dataTransfer(
+              qtydata,
+              item?.QtyIndex,
+              item?.VarientIndex,
+              0,
+              onePeiceFlow
+            );
+          }
+        } else {
+          if (Isincart && Isincart?.StockAvailable === 'Y') {
+            if (Isincart?.BalanceQty > Isincart?.OrderQty) {
+              dataTransfer(
+                qtydata,
+                item?.QtyIndex,
+                item?.VarientIndex,
+                0,
+                onePeiceFlow
+              );
+            } else {
+              dataTransfer(
+                qtydata,
+                item?.QtyIndex,
+                item?.VarientIndex,
+                1,
+                onePeiceFlow
+              );
+            }
+          } else {
+            dataTransfer(
+              qtydata,
+              item?.QtyIndex,
+              item?.VarientIndex,
+              0,
+              onePeiceFlow
+            );
+          }
+        }
+        setModelQty(false);
+        setSelectedBrand('Others');
+      }
+    } else {
+      let Isincart = CartOrderDetails?.find(
+        (cartItem) =>
+          cartItem?.ProdId ===
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+          cartItem?.InwardDtlId ===
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+              item?.VarientIndex
+            ]?.StockDetails?.[0]?.InwardDtlId &&
+          cartItem?.OrderRate ===
+            qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+              item?.VarientIndex
+            ]?.StockDetails?.[0]?.SellPrice &&
+          !cartItem?.SalesId
+      );
+
+      if (onePeiceFlow) {
+        let Isincartonepc = CartOrderDetails?.filter(
+          (cartItem) =>
+            cartItem?.ProdId ===
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdId &&
+            cartItem?.InwardDtlId ===
+              qtydata?.ProductDetail?.[item?.QtyIndex]?.ProdVariantDetails?.[
+                item?.VarientIndex
+              ]?.StockDetails?.[0]?.InwardDtlId &&
+            // (cartItem?.OrderRate === item?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]?.StockDetails?.[0]?.SellPrice)
+            !cartItem?.SalesId
+        );
+        let totalOrderQty = Isincartonepc?.reduce((accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty * card.NoOfPcs
+                  : card.OrderQty
+                : 0
+            )
+          );
+        }, 0);
+        if (Isincartonepc && Isincartonepc?.[0]?.StockAvailable === 'Y') {
+          if (Isincartonepc?.[0]?.OverAllPcs > totalOrderQty) {
+            dataTransfer(
+              qtydata,
+              item?.QtyIndex,
+              item?.VarientIndex,
+              0,
+              onePeiceFlow
+            );
+          } else {
+            dataTransfer(
+              qtydata,
+              item?.QtyIndex,
+              item?.VarientIndex,
+              1,
+              onePeiceFlow
+            );
+          }
+        } else {
+          dataTransfer(
+            qtydata,
+            item?.QtyIndex,
+            item?.VarientIndex,
+            0,
+            onePeiceFlow
+          );
+        }
+      } else {
+        if (Isincart && Isincart?.StockAvailable === 'Y') {
+          if (Isincart?.BalanceQty > Isincart?.OrderQty) {
+            dataTransfer(
+              qtydata,
+              item?.QtyIndex,
+              item?.VarientIndex,
+              0,
+              onePeiceFlow
+            );
+          } else {
+            dataTransfer(
+              qtydata,
+              item?.QtyIndex,
+              item?.VarientIndex,
+              1,
+              onePeiceFlow
+            );
+          }
+        } else {
+          dataTransfer(
+            qtydata,
+            item?.QtyIndex,
+            item?.VarientIndex,
+            0,
+            onePeiceFlow
           );
         }
       }
-    } else if (
-      OnUpiSelected?.ModeName?.toLowerCase() === 'upi' &&
-      SelectedUPIPayOption?.toLowerCase() === 'pg'
-    ) {
-      if (customerDisplayWindow && !customerDisplayWindow.closed) {
-        if (SelCustId) {
-          Booking(value, pay);
-        } else {
-          setMessageType('error');
-          setMessageData('Please Select Customer');
-        }
+      setModelQty(false);
+      setSelectedBrand('Others');
+    }
+  };
+  const StockSelected = (item) => {
+    const stockDetails =
+      qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[VarientIndex]
+        ?.StockDetails?.[item.key] || {};
+    const overallExpStatus = stockDetails?.OverAllExpStatus;
+
+    if (overallExpStatus === 'N' || overallExpStatus === 'Y') {
+      const firstStockDetails =
+        qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[0]
+          ?.StockDetails?.[item.key] || {};
+      const firstOverallExpStatus = firstStockDetails.OverAllExpStatus;
+
+      if (
+        overallExpStatus === 'N' ||
+        (firstOverallExpStatus === 'Y' && prodexpir)
+      ) {
+        dataTransfer(qtydata, QtyIndex, VarientIndex, item.key, onePeiceFlow);
+      } else if (overallExpStatus === 'Y' && repeatedModel) {
+        dataTransfer(qtydata, QtyIndex, VarientIndex, item.key, onePeiceFlow);
       } else {
-        setMessageType('error');
-        setMessageData('Please Set the customer display');
+        openExpireModal({
+          title: 'Stock Expires',
+          onOk: () => expStockFun(StockItem),
+          onCancel: () => {
+            setRepeatedModel(false);
+            setProdexpir(false);
+          },
+        });
+        setStockItem(item.key);
       }
-    } else if (
-      OnUpiSelected?.ModeName?.toLowerCase() === 'card' &&
-      SelectedCardOption?.toLowerCase() === 'pg'
-    ) {
-      if (customerDisplayWindow && !customerDisplayWindow.closed) {
-        if (SelCustId) {
-          Booking(value, pay);
-        } else {
-          setMessageType('error');
-          setMessageData('Please Select Customer');
-        }
+    }
+
+    setProdexpir(false);
+    setRepeatedModel(false);
+  };
+
+  const [priceChangeProduct, setPriceChangeProduct] = useState([]);
+  const [productPriceChange, setProductPriceChange] = useState(false);
+
+  const CardOnclick = async (item, Parameter) => {
+    setOnePeiceFlow(Parameter === 'OnePeiceProduct');
+
+    const transformedItem = {
+      ...item,
+      ProductDetail: item.ProductDetail
+        // .filter((detail) => detail.OnePcsAvailable === "Y")
+        .map(({ ProdId, ProdName, ProdVariantDetails, ...rest }) => ({
+          ProdId,
+          ProdName,
+          ProdVariantDetails,
+          ...rest,
+        })),
+    };
+
+    const modiffiedData =
+      Parameter === 'OnePeiceProduct' ? transformedItem : item;
+    setQtydata(modiffiedData);
+    if (modiffiedData.OverAllExpStatus === 'Y' && ExpiredProduct) {
+      openExpireModal({
+        title: 'Product Expires',
+        onOk: () => expFun(modiffiedData),
+      });
+      setItem(modiffiedData);
+    } else if (modiffiedData) {
+      setQtydata(modiffiedData);
+      let count = modiffiedData?.ProductDetail?.length;
+      if (count > 1) {
+        Quantity(modiffiedData);
       } else {
-        setMessageType('error');
-        setMessageData('Please Set the customer display');
+        setQtyIndex(0);
+        SingleQuantity(modiffiedData, Parameter === 'OnePeiceProduct');
       }
+    }
+  };
+  const StockDate = (date) => {
+    let dateVal = moment(date, ['YYYY-MM-DDTHH:mm:ss']).format('DD-MM-YYYY');
+    return dateVal;
+  };
+
+  const AddOrderDetails = async (item) => {
+    if (preOrder) {
+      await handlePreOrder(item);
     } else {
-      Booking(value, pay);
+      await handleRegularOrder(item);
     }
   };
 
-  const extrachargesbookingtype = (extradata) => {
-    const TakAwayId = ConfigDataList?.find(
-      (a) => a?.ConfigName === 'TakeAway'
-    )?.ConfigId;
-    const DineinId = ConfigDataList?.find(
-      (a) => a?.ConfigName === 'Dine In'
-    )?.ConfigId;
-    let tempdata = extradata?.map((data) => ({
-      ...data,
-      BookingType: data?.BookingTypeName === 'Dine In' ? DineinId : TakAwayId,
-    }));
-    return tempdata;
+  const handlePreOrder = async (item) => {
+    let Response = await dispatch(
+      getConfigType({ TypeName: 'Booking Type' })
+    ).unwrap();
+
+    let BookingTypeID;
+    if (Response?.data?.statusCode == 1) {
+      BookingTypeID = Response?.data?.data?.find(
+        (item) => item?.ConfigName === 'Dine In'
+      )?.ConfigId;
+    }
+
+    let Condition = PreOrderSelectedProdNames?.some(
+      (obj) =>
+        obj?.InwardDtlId === item?.InwardDtlId &&
+        obj?.SinglePc === item?.SinglePc
+    );
+
+    if (PreOrderAdditem !== 'AddItems') {
+      setMessageData('Have To choose Add Item Before select Any Item ');
+      setMessageType('error');
+      return;
+    }
+
+    if (Condition) {
+      setMessageData('Duplicate Data');
+      setMessageType('error');
+      return;
+    }
+
+    const calculateWithoutTaxRate = (qty, rate, taxPercentage) => {
+      const totalAmount = qty * rate;
+      const taxAmount = (
+        (totalAmount * taxPercentage) /
+        (100 + taxPercentage)
+      ).toFixed(2);
+      const withoutTaxRate = (totalAmount - taxAmount).toFixed(2);
+
+      return parseFloat(withoutTaxRate);
+    };
+
+    const SelectedProduct = {
+      ProdId: item?.ProdId,
+      InwardDtlId: item?.InwardDtlId,
+      ProdNameQty: item?.ProdName + ' ' + item?.Size + ' ' + item?.UomName,
+      ProdName: item?.ProdName,
+      Size: item?.Size,
+      UomName: item?.UomName,
+      OrderQty: 1,
+      OrderRate: item?.OrderRate,
+      TotalAmt: item?.OrderRate,
+      Image: null,
+      Description: null,
+      Type: item?.Type,
+      TaxAmt: 0,
+      RefundQty: 0,
+      TaxId: item?.TaxId,
+      OrderStatus: 'O',
+      OrderType: 'PRE',
+      SinglePc: item?.SinglePc,
+      BookingType: BookingTypeID,
+      WithoutTaxRate: calculateWithoutTaxRate(
+        1,
+        item?.OrderRate,
+        item?.TaxPercentage
+      ),
+      StockAvailable: item?.StockAvailable,
+    };
+
+    const Data =
+      PreOrderSelectedProdNames?.length > 0
+        ? [SelectedProduct, ...PreOrderSelectedProdNames]
+        : [SelectedProduct];
+
+    await setPreOrderSelectedProdNames(Data);
+    await dispatch(changepreOrderList(Data));
   };
 
-  const Booking = async (value, pay) => {
-    const TakAwayId = ConfigDataList?.find(
-      (a) => a?.ConfigName === 'TakeAway'
-    )?.ConfigId;
-    const DineinId = ConfigDataList?.find(
-      (a) => a?.ConfigName === 'Dine In'
-    )?.ConfigId;
+  const handleRegularOrder = async (item) => {
+    const isHoldOrder = OrderType === 'Hold';
+    const addFirst = BillOrderPre === 'Y';
+    const hasOffer = OfferCheckedInSetup && preferenceOffer;
 
-    setFirstPaymentclick(true);
-    let temporderdetail = OrderCardDetail?.map((a) => ({
-      ProdId: a.ProdId,
-      Type: a.Type,
-      OrderQty: a.OrderQty,
-      OrderRate: a.OrderRate,
-      TotalAmt: a.OrderQty * a.OrderRate,
-      TaxAmt: a.TaxAmt,
-      RefundQty: 0,
-      InwardDtlId: a.InwardDtlId,
-      TaxId: a.TaxId,
-      ProdNameQty:
-        UomPrint?.SettingValue === 'N'
-          ? `${a.ProdName} ${a.UomName?.toLowerCase() === 'half' ? '(Half)' : ''}`
-          : `${a.ProdName} ${a.Size} ${a.UomName}`,
-      OrderStatus: 'O',
-      OrderType:
-        BookingType === 'Dine In' ||
-          BookingTypeBoth ||
-          Estimation?.SettingValue == 'N'
-          ? 'S'
-          : GlobEstBooking === 'OvrAllEst'
-            ? 'E'
-            : GlobEstBooking === 'ParEst'
-              ? GlobProdwisedata?.includes(
-                a.InwardDtlId + ' ' + a?.BookingTypeName
+    const isExistsInFreeProdList = hasOffer
+      ? FreeProdList?.filter(
+          (f) =>
+            f?.FreeProdId === item?.ProdId &&
+            f?.ProdVariantDetails?.some((variant) =>
+              variant?.StockDetails?.some(
+                (stock) => stock?.FreeInwardDtlId === item?.InwardDtlId
               )
-                ? 'E'
-                : 'S'
-              : 'S',
-      SinglePc: a.SinglePc,
-      BookingType: a.BookingTypeName === 'Dine In' ? DineinId : TakAwayId,
-      OfferValue: a?.Type === 'C' ? a?.OfferPrice : a.Offer,
-      OfferAmt: a?.Type === 'C' ? a?.TotalAmt : a.Offer,
-      OfferType: a?.Type === 'C' ? a?.OfferType : '',
-      CounterName: a?.TokenAvailable === 'Y' ? a?.CounterName : null,
-      ProductIdentifierDtls: a.ProductIdentifierDtls,
-      ModelNumber: a.ModelNumber,
-      BatchRef: a.BatchRef,
-      PackageDtl: a.PackageDtl,
-    }));
-    const NotSlectedTypeFind = temporderdetail?.find(
-      (a) => a?.BookingType != SelectedBookingType
+            ) &&
+            f?.RemainingQty > 0
+        )
+      : [];
+
+    const calculateTaxAmounts = (qty, rate, taxPercentage) => {
+      const totalAmount = qty * rate;
+      const taxAmount = (
+        (totalAmount * taxPercentage) /
+        (100 + taxPercentage)
+      ).toFixed(2);
+      const withoutTaxRate = (totalAmount - taxAmount).toFixed(2);
+
+      return {
+        TotalAmt: totalAmount,
+        TaxAmt: parseFloat(taxAmount),
+        WithoutTaxRate: parseFloat(withoutTaxRate),
+      };
+    };
+
+    // Helper function to create updated cart item
+    const createUpdatedCartItem = (cartItem, newQty = null) => {
+      const quantity = newQty || cartItem.OrderQty + 1;
+      const taxAmounts = calculateTaxAmounts(
+        quantity,
+        cartItem.OrderRate,
+        cartItem.TaxPercentage
+      );
+
+      return {
+        ...cartItem,
+        OrderQty: quantity,
+        ...taxAmounts,
+      };
+    };
+
+    // Helper function to create new item for cart
+    const createNewCartItem = (item, quantity = 1) => {
+      const taxAmounts = calculateTaxAmounts(
+        quantity,
+        item.OrderRate,
+        item.TaxPercentage
+      );
+
+      return {
+        ...item,
+        localId: uuidv4(),
+        OrderQty: quantity,
+        ...taxAmounts,
+      };
+    };
+
+    dispatch(changeHoldOrderDtl(false));
+    dispatch(changePreviousOrderLength(CartOrderDetails?.length));
+
+    const itemMatchCondition = (cartItem) =>
+      cartItem.ProdId === item.ProdId &&
+      cartItem.InwardDtlId === item.InwardDtlId &&
+      cartItem.OrderRate === item.OrderRate &&
+      cartItem.BookingTypeName === item.BookingTypeName &&
+      cartItem.ScaleType === item.ScaleType;
+    // item.WeightscaleProd !== 'Y';
+    const isItemInCart = CartOrderDetails?.find(
+      (cartItem) =>
+        itemMatchCondition(cartItem) &&
+        !cartItem.SalesId &&
+        ((cartItem?.OfferModeType && cartItem?.OfferMode === 'B'
+          ? true
+          : cartItem?.OfferMode !== 'B') &&
+        cartItem?.OfferMode !== 'P' &&
+        cartItem?.OfferMode !== 'C' &&
+        cartItem?.OfferMode !== 'O' &&
+        cartItem?.OfferMode !== 'L'
+          ? true
+          : cartItem?.Offer === 0)
     );
-    let updatedOfferDetails = OrderOfferDetail;
-    if (GlobEstBooking !== 'Sales') {
-      updatedOfferDetails = OrderOfferDetail?.filter(
-        (item) =>
-          !(
-            item.TableName === 'LoyaltyPoints' &&
-            item.TableUniqueName === 'UniqueId' &&
-            item.Type === 'A'
+
+    const isItemInCartHold = CartOrderDetails?.find(
+      (cartItem) =>
+        itemMatchCondition(cartItem) &&
+        ((cartItem?.OfferModeType && cartItem?.OfferMode === 'B'
+          ? true
+          : cartItem?.OfferMode !== 'B') &&
+        cartItem?.OfferMode !== 'P' &&
+        cartItem?.OfferMode !== 'C' &&
+        cartItem?.OfferMode !== 'O' &&
+        cartItem?.OfferMode !== 'L'
+          ? true
+          : cartItem?.Offer === 0)
+    );
+
+    // Filter cart items
+    const otherOrderDataForNormal = CartOrderDetails?.filter(
+      (cartItem) =>
+        !(
+          itemMatchCondition(cartItem) &&
+          !cartItem.SalesId &&
+          ((cartItem?.OfferModeType && cartItem?.OfferMode === 'B'
+            ? true
+            : cartItem?.OfferMode !== 'B') &&
+          cartItem?.OfferMode !== 'P' &&
+          cartItem?.OfferMode !== 'C' &&
+          cartItem?.OfferMode !== 'O' &&
+          cartItem?.OfferMode !== 'L'
+            ? true
+            : cartItem?.Offer === 0)
+        )
+    );
+
+    const otherOrderDataForNormalWithoutSalesId = CartOrderDetails?.filter(
+      (cartItem) =>
+        !(
+          itemMatchCondition(cartItem) &&
+          ((cartItem?.OfferModeType && cartItem?.OfferMode === 'B'
+            ? true
+            : cartItem?.OfferMode !== 'B') &&
+          cartItem?.OfferMode !== 'P' &&
+          cartItem?.OfferMode !== 'C' &&
+          cartItem?.OfferMode !== 'O' &&
+          cartItem?.OfferMode !== 'L'
+            ? true
+            : cartItem?.Offer === 0)
+        )
+    );
+
+    try {
+      // CASE 1: Item exists in cart, not Dine In, not Hold order
+
+      if (isItemInCart && !isHoldOrder) {
+        if (
+          isExistsInFreeProdList?.length > 0 &&
+          hasOffer &&
+          item?.SinglePc !== 'Y'
+        ) {
+          handleFreeProduct(item, isExistsInFreeProdList, addFirst);
+        } else {
+          const updatedCartItem = createUpdatedCartItem(
+            isItemInCart,
+            item?.OtherProduct === 'Others' || item?.ScaleType === 'weight'
+              ? (
+                  (item?.OrderQty || 0) + parseFloat(isItemInCart?.OrderQty)
+                )?.toFixed(3)
+              : null
+          );
+          const updatedData = addFirst
+            ? [updatedCartItem, ...otherOrderDataForNormal]
+            : [...otherOrderDataForNormal, updatedCartItem];
+          if (OverAllproductBasedOfferDatas?.ProdDtl?.length > 0 && hasOffer) {
+            handleFreeProductAvailable(updatedCartItem, updatedData, addFirst);
+          } else {
+            dispatch(changeOrderCardDetails(updatedData));
+          }
+        }
+      }
+      // CASE 2: Item exists in cart (hold), is Hold order
+      else if (isItemInCartHold && isHoldOrder) {
+        if (
+          isExistsInFreeProdList?.length > 0 &&
+          hasOffer &&
+          item?.SinglePc !== 'Y'
+        ) {
+          handleFreeProduct(item, isExistsInFreeProdList, addFirst);
+        } else {
+          const updatedCartItem = createUpdatedCartItem(
+            isItemInCartHold,
+            item?.OtherProduct === 'Others' || item?.ScaleType === 'weight'
+              ? (
+                  (item?.OrderQty || 0) + parseFloat(isItemInCartHold?.OrderQty)
+                )?.toFixed(3)
+              : null
+          );
+          const updatedData = addFirst
+            ? [updatedCartItem, ...otherOrderDataForNormalWithoutSalesId]
+            : [...otherOrderDataForNormalWithoutSalesId, updatedCartItem];
+          if (OverAllproductBasedOfferDatas?.ProdDtl?.length > 0 && hasOffer) {
+            handleFreeProductAvailable(updatedCartItem, updatedData, addFirst);
+          } else {
+            dispatch(changeOrderCardDetails(updatedData));
+          }
+        }
+      }
+      // CASE 3: New item - not in cart
+      else {
+        if (item.OtherProduct === 'Others' || item.ScaleType == 'weight') {
+          const newCartItem = createNewCartItem(item, item.OrderQty);
+          const updatedData = addFirst
+            ? [newCartItem, ...CartOrderDetails]
+            : [...CartOrderDetails, newCartItem];
+
+          dispatch(changeOrderCardDetails(updatedData));
+        } else {
+          if (
+            isExistsInFreeProdList?.length > 0 &&
+            hasOffer &&
+            item?.SinglePc !== 'Y'
+          ) {
+            handleFreeProduct(item, isExistsInFreeProdList, addFirst);
+          } else {
+            const newCartItem = createNewCartItem(item, 1);
+            const updatedData = addFirst
+              ? [newCartItem, ...CartOrderDetails]
+              : [...CartOrderDetails, newCartItem];
+            if (
+              OverAllproductBasedOfferDatas?.ProdDtl?.length > 0 &&
+              hasOffer
+            ) {
+              handleFreeProductAvailable(newCartItem, updatedData, addFirst);
+            } else {
+              dispatch(changeOrderCardDetails(updatedData));
+            }
+          }
+        }
+      }
+    } catch (error) {
+      console.error('Error updating order details:', error);
+    } finally {
+      // Clean up dispatch calls
+      dispatch(changeothersdata({}));
+      dispatch(ChangeNewQrProduct({}));
+    }
+  };
+
+  const handleFreeProduct = (item, filteredFreeProdList, addFirst) => {
+    if (!filteredFreeProdList?.length) return;
+
+    const offerMode = filteredFreeProdList[0]?.OfferMode;
+
+    // --- helper functions ---
+    const calcTax = (qty, rate, taxPerc) =>
+      ((qty * rate * taxPerc) / 100).toFixed(2);
+
+    const calcWithoutTax = (qty, rate, taxPerc) =>
+      qty * rate - ((qty * rate * taxPerc) / 100).toFixed(2);
+
+    const updateFreeProductMeta = (base, qty, rate) => ({
+      ...base,
+      FreeQty: qty,
+      discount: qty * rate,
+      RemainingQty: base.OverAllFreeQty - qty,
+      ProdVariantDetails: base.ProdVariantDetails.map((variant) => ({
+        ...variant,
+        StockDetails: variant.StockDetails.map((stock) => ({
+          ...stock,
+          UsedFree: qty,
+          RemainingFree: stock.RemainingFree - qty,
+        })),
+      })),
+    });
+
+    const applyOffer = (offerList, updatedItem) => {
+      if (offerMode === 'L') {
+        const updated = loyaltyOfferApply(
+          offerList,
+          updatedItem,
+          DineinId,
+          TakAwayId
+        );
+        dispatch(changeOfferAppliedProductsForLoyalty(updated));
+        dispatch(changeFreeProductForLoyalty(offerList[0]));
+      } else if (offerMode === 'P' || offerMode === 'C' || offerMode === 'O') {
+        const updated = buildOfferFromChangesForPromoCodes(
+          PromoCodeOffersDatas?.[0],
+          offerList,
+          updatedItem,
+          DineinId,
+          TakAwayId
+        );
+        dispatch(changeOfferAppliedProductsForLoyalty(updated));
+        dispatch(changeFreeProductForLoyalty(offerList[0]));
+      } else {
+        const updated = buildOfferFromChanges(
+          OverAllproductBasedOfferDatas,
+          offerList,
+          updatedItem,
+          DineinId,
+          TakAwayId
+        );
+        dispatch(ChangeOfferAppliedProducts(updated));
+        dispatch(ChangeFreeProductList(offerList[0]));
+      }
+    };
+
+    // --- main logic ---
+    let UpdatedData = [];
+    const existing = CartOrderDetails?.find(
+      (c) =>
+        c.ProdId === item.ProdId &&
+        c.InwardDtlId === item.InwardDtlId &&
+        c.OrderRate === item.OrderRate &&
+        c.BookingTypeName === item.BookingTypeName &&
+        c.OfferMode === offerMode &&
+        c.Offer > 0
+    );
+
+    const existsInOther = CartOrderDetails?.find(
+      (c) =>
+        c.ProdId === item.ProdId &&
+        c.InwardDtlId === item.InwardDtlId &&
+        c.OrderRate === item.OrderRate &&
+        c.BookingTypeName !== item.BookingTypeName &&
+        c.OfferMode === offerMode &&
+        c.Offer > 0
+    );
+
+    if (existing) {
+      let newQty = existing.OrderQty + 1;
+      const UpdatedCartItem = {
+        ...existing,
+        OrderQty: newQty,
+        TotalAmt: existing.TotalAmt + existing.OrderRate,
+        Offer: existing.Offer + existing.OrderRate,
+        TaxAmt: calcTax(newQty, existing.OrderRate, existing.TaxPercentage),
+        WithoutTaxRate: calcWithoutTax(
+          newQty,
+          existing.OrderRate,
+          existing.TaxPercentage
+        ),
+        OfferMessage: [
+          {
+            OfferId: filteredFreeProdList[0].OfferId,
+            FreeQty: newQty,
+            FreeProdId: filteredFreeProdList[0].FreeProdId,
+            FreeProdName: filteredFreeProdList[0].FreeProdName,
+          },
+        ],
+      };
+      if (existsInOther) {
+        newQty = newQty + existsInOther?.OrderQty;
+      }
+      const updatedOfferList = [
+        updateFreeProductMeta(filteredFreeProdList[0], newQty, item.OrderRate),
+      ];
+
+      UpdatedData = CartOrderDetails.map((c) =>
+        c === existing ? UpdatedCartItem : c
+      );
+
+      applyOffer(updatedOfferList, UpdatedCartItem);
+    } else {
+      let newQty = 1;
+      const UpdatedCartItem = {
+        ...item,
+        localId: uuidv4(),
+        OrderQty: newQty,
+        TotalAmt: item.OrderRate,
+        Offer: item.OrderRate,
+        OfferType: offerMode,
+        OfferMode: offerMode,
+        TaxAmt: calcTax(1, item.OrderRate, item.TaxPercentage),
+        WithoutTaxRate: calcWithoutTax(1, item.OrderRate, item.TaxPercentage),
+        OfferMessage: [
+          {
+            OfferId: filteredFreeProdList[0].OfferId,
+            FreeQty: 1,
+            FreeProdId: filteredFreeProdList[0].FreeProdId,
+            FreeProdName: filteredFreeProdList[0].FreeProdName,
+          },
+        ],
+      };
+
+      if (existsInOther) {
+        newQty = newQty + existsInOther?.OrderQty;
+      }
+
+      const updatedOfferList = [
+        updateFreeProductMeta(filteredFreeProdList[0], newQty, item.OrderRate),
+      ];
+
+      UpdatedData = addFirst
+        ? [UpdatedCartItem, ...CartOrderDetails]
+        : [...CartOrderDetails, UpdatedCartItem];
+      applyOffer(updatedOfferList, UpdatedCartItem);
+    }
+
+    dispatch(changeOrderCardDetails(UpdatedData));
+  };
+
+  const handleFreeProductAvailable = async (item, cartData, addFirst) => {
+    const offers = chooseOfferFun(item, cartData);
+
+    if (!offers?.length) {
+      const indexToCheck = addFirst ? 0 : cartData.length - 1;
+      const productToCheck = cartData?.[addFirst ? 0 : cartData?.length - 1];
+      let updatedCartData = cartData;
+      if (productToCheck?.OfferMode && productToCheck?.Offer > 0) {
+        dispatch(
+          RemoveOfferAppliedProduct({
+            ProdId: productToCheck?.ProdId,
+            InwardDtlId: productToCheck?.InwardDtlId,
+            OfferType: productToCheck?.OfferMode,
+          })
+        );
+        updatedCartData = cartData.map((item, idx) =>
+          idx === indexToCheck
+            ? {
+                ...item,
+                Offer: null,
+                OfferMessage: undefined,
+                OfferMode: undefined,
+                OfferModeType: false,
+                OfferType: undefined,
+                OfferValue: null,
+              }
+            : item
+        );
+      }
+
+      const {
+        updatedOrderCardDetails,
+        updatedFreeProdList,
+        updatedOfferAppliedProducts,
+        hasChanges,
+      } = processFreeProducts(updatedCartData, FreeProdList);
+
+      if (hasChanges) {
+        dispatch(changeOrderCardDetails(updatedOrderCardDetails));
+        dispatch(ChangeFreeProductList(updatedFreeProdList));
+        dispatch(ChangeOfferAppliedProducts(updatedOfferAppliedProducts));
+      } else {
+        dispatch(changeOrderCardDetails(updatedOrderCardDetails));
+      }
+      return;
+    }
+
+    let bestOffer = null;
+    let OfferNeedToApply = true;
+    let updatedFreeProductList = [];
+    let sameProduct = false;
+    for (const offer of offers) {
+      if (offer.OfferMode === 'B') {
+        const {
+          OfferAmount,
+          OfferMessage,
+          OfferApply,
+          updatedFreeProdList,
+          ProductOfferType,
+        } = applyBuyNGetFreeOffer(cartData, offer, item);
+
+        offer.OfferAmount = OfferAmount;
+        offer.OfferMessage = OfferMessage;
+        OfferNeedToApply = OfferApply;
+        updatedFreeProductList = updatedFreeProdList;
+        sameProduct = ProductOfferType;
+      }
+      if (!bestOffer || offer.OfferAmount > bestOffer.OfferAmount) {
+        bestOffer = offer;
+      }
+    }
+
+    const UpdatedCartItemWithOffer = {
+      ...item,
+      Offer:
+        sameProduct ||
+        bestOffer?.OfferMode === 'I' ||
+        bestOffer?.OfferMode === 'Q'
+          ? bestOffer?.OfferAmount || item.Offer
+          : item.Offer || bestOffer?.OfferAmount,
+      OfferType: item?.OfferType || bestOffer?.OfferType,
+      OfferMessage: item?.OfferMessage || bestOffer?.OfferMessage,
+      OfferMode: item?.OfferMode || bestOffer?.OfferMode,
+      OfferModeType: sameProduct,
+    };
+
+    const shouldRemove = (c) =>
+      c.ProdId === item.ProdId &&
+      c.InwardDtlId === item.InwardDtlId &&
+      c.OrderRate === item.OrderRate &&
+      c.BookingTypeName === item.BookingTypeName &&
+      ((c?.OfferModeType && c?.OfferMode === 'B'
+        ? true
+        : c?.OfferMode !== 'B') &&
+      c?.OfferMode !== 'P' &&
+      c?.OfferMode !== 'C' &&
+      c?.OfferMode !== 'O' &&
+      c?.OfferMode !== 'L'
+        ? true
+        : c?.Offer === 0);
+
+    const filteredCart = CartOrderDetails.filter((c) => !shouldRemove(c));
+
+    const UpdatedDataAfterOffer = addFirst
+      ? [UpdatedCartItemWithOffer, ...filteredCart]
+      : [...filteredCart, UpdatedCartItemWithOffer];
+
+    if (bestOffer && OfferNeedToApply) {
+      dispatch(ChangeOfferAppliedProducts(bestOffer));
+    }
+
+    const {
+      updatedOrderCardDetails,
+      updatedFreeProdList,
+      updatedOfferAppliedProducts,
+      hasChanges,
+    } = processFreeProducts(UpdatedDataAfterOffer, updatedFreeProductList);
+
+    // Update the states
+    dispatch(changeOrderCardDetails(updatedOrderCardDetails));
+
+    if (hasChanges) {
+      dispatch(ChangeFullFreeProductList(updatedFreeProdList));
+      dispatch(ChangeOfferAppliedProducts(updatedOfferAppliedProducts));
+    } else {
+      dispatch(ChangeFullFreeProductList(updatedFreeProductList));
+    }
+  };
+
+  function buildOfferFromChangesForPromoCodes(
+    PromoCodeOffersDatas,
+    ChangesHappenList,
+    item,
+    DineinId,
+    TakAwayId
+  ) {
+    const results = [];
+    ChangesHappenList.forEach((change) => {
+      const offer = PromoCodeOffersDatas.ProdOfferDetails.find(
+        (o) => o.OfferId === change.OfferId
+      );
+      if (offer) {
+        // 🛠️ Build normalized object
+        const formatted = {
+          OfferId: offer?.OfferId || '',
+          OfferAmount: change?.discount || 0,
+          OfferType: offer?.OfferType || '', // I / Q / B
+          ActualOfferAmount: offer?.OfferAmt || 0,
+          OfferValue: offer?.OfferAmt || 0,
+          TableName: change?.TableName || '',
+          TableUniqueName: change?.TableUniqueName || '',
+          TableUniqueId: change?.TableUniqueId || '',
+          // OfferType: offer?.ValueType || "", // F / P
+          Detail: offer?.Detail || [],
+          OfferCode: offer?.OfferCode || PromoCodeOffersDatas?.OfferCode || '',
+          CustId: offer?.CustId || '',
+          UsedCount: offer?.UsedCount || 0,
+          AppliesTo: offer?.AppliesTo || '',
+          BookingType:
+            item?.BookingTypeName === 'Dine In' ? DineinId : TakAwayId,
+          ActualFreeQty: change?.FreeQty,
+
+          // ✅ Merge FreeProducts from offer + update with ChangesHappenList
+          FreeProductsList: {
+            FreeProdId: change?.FreeProdId,
+            FreeQty: change?.FreeQty,
+            FreeProdName: change?.FreeProdName,
+            OfferId: offer?.OfferId,
+            OverAllFreeQty: change?.OverAllFreeQty,
+            ProdVariantDetails: change?.ProdVariantDetails?.map((e) => {
+              return {
+                FreeProdVariantName: e?.FreeProdVariantName,
+                StockDetails: e?.StockDetails?.map((exp) => {
+                  return {
+                    ProdOfferId: exp?.ProdOfferId,
+                    FreeInwardDtlId: exp?.FreeInwardDtlId,
+                    ActiveStatus: exp?.ActiveStatus,
+                  };
+                }),
+              };
+            }),
+          },
+          // ✅ Always include product-level fields
+          ProdId: '',
+          SinglePc: '',
+          StockAvailable: '',
+          ProdVariantName: '',
+          Type: '',
+          InwardDtlId: '',
+          ProdCat: '',
+          HalfPrice: 'N',
+          MinQty: 0,
+        };
+
+        results.push(formatted);
+      }
+    });
+
+    return results;
+  }
+
+  function buildOfferFromChanges(
+    OverAllproductBasedOfferDatas,
+    ChangesHappenList,
+    item,
+    DineinId,
+    TakeAwayId
+  ) {
+    const offersById = new Map(
+      OverAllproductBasedOfferDatas.ProdDtl.map((o) => [o.OfferId, o])
+    );
+
+    return ChangesHappenList.flatMap((change) => {
+      const offer = offersById.get(change.OfferId);
+      if (!offer) return [];
+
+      const getFreeProductsList = () => {
+        const freeProducts = offer.FreeProducts || offer.FreeProductsList || [];
+        const normalizedList = Array.isArray(freeProducts)
+          ? freeProducts
+          : [freeProducts];
+
+        return normalizedList.map((fp) => {
+          if (!change?.ProdVariantDetails) {
+            return {
+              FreeProdId: fp?.FreeProdId || '',
+              FreeQty: fp?.FreeQty || 0,
+              FreeProdName: fp?.FreeProdName || '',
+              ProdVariantDetails: fp?.ProdVariantDetails || [],
+            };
+          }
+
+          // Merge variant + stock details with change
+          const updatedVariants = fp.ProdVariantDetails?.map((variant) => {
+            const changedVariant = change.ProdVariantDetails.find(
+              (v) => v.FreeProdVariantName === variant.ProdVariantName
+            );
+
+            if (!changedVariant) return variant;
+
+            const updatedStock = variant.StockDetails.map((stock) => {
+              const changedStock = changedVariant.StockDetails.find(
+                (s) => s.InwardDtlId === stock.InwardDtlId
+              );
+
+              if (changedStock) {
+                const { InwardDtlId, ...rest } = { ...stock, ...changedStock };
+                return { ...rest, FreeInwardDtlId: stock.InwardDtlId };
+              }
+
+              const { InwardDtlId, ...rest } = stock;
+              return { ...rest, FreeInwardDtlId: stock.InwardDtlId };
+            });
+
+            return { ...variant, StockDetails: updatedStock };
+          });
+
+          return {
+            FreeProdId: fp?.FreeProdId || '',
+            FreeQty: change?.FreeQty ?? (fp?.FreeQty || 0),
+            FreeProdName: fp?.FreeProdName || '',
+            ProdVariantDetails: updatedVariants || [],
+          };
+        });
+      };
+
+      return {
+        OfferId: offer.OfferId || '',
+        OfferAmount: change?.discount || 0,
+        OfferMode: offer.OfferType || '', // I / Q / B
+        ActualOfferAmount: offer.OfferAmt || 0,
+        OfferValue: offer.OfferAmt || 0,
+        TableName: offer.TableName || '',
+        TableUniqueName: offer.TableUniqueName || '',
+        TableUniqueId: offer.TableUniqueId || '',
+        ActualFreeQty: change?.FreeQty || 0,
+        Detail: offer.Detail || [],
+        OfferCode: offer.OfferCode || '',
+        CustId: offer.CustId || '',
+        UsedCount: offer.UsedCount || 0,
+        AppliesTo: offer.AppliesTo || '',
+        BookingType:
+          item?.BookingTypeName === 'Dine In' ? DineinId : TakeAwayId,
+        FreeProductsList: getFreeProductsList(),
+
+        // Product-level fields
+        ProdId: change?.ProdId || '',
+        SinglePc: change?.SinglePc || '',
+        StockAvailable: change?.StockAvailable || '',
+        ProdVariantName: change?.ProdVariantName || '',
+        Type: item?.Type || '',
+        InwardDtlId: change?.InwardDtlId || '',
+        ProdCat: change?.ProdCat || '',
+        HalfPrice: offer.HalfPrice || 'N',
+        MinQty: offer.MinQty || 0,
+      };
+    });
+  }
+
+  const loyaltyOfferApply = (ChangesHappenList, item, DineinId, TakAwayId) => {
+    const result = [];
+    const change = ChangesHappenList?.[0];
+    const formatted = {
+      OfferId: change?.OfferId,
+      OfferAmount: change?.discount || 0,
+      OfferValue: change?.OfferAmt || 0,
+      TableName: change?.TableName || '',
+      TableUniqueName: change?.TableUniqueName || '',
+      TableUniqueId: change?.TableUniqueId || '',
+      ProdId: change?.ProdId || '',
+      SinglePc: change?.SinglePc || '',
+      StockAvailable: change?.StockAvailable || '',
+      ProdVariantName: change?.ProdVariantName || '',
+      ActualFreeQty: change?.FreeQty || 0,
+      Type: '',
+      BookingType: item?.BookingTypeName === 'Dine In' ? DineinId : TakAwayId,
+      InwardDtlId: change?.InwardDtlId || '',
+      OfferType: change?.OfferMode || '',
+      Detail: [{}],
+      ProdCat: change?.ProdCat || '',
+      CustId: change?.CustId || '',
+      UsedCount:
+        change?.ProdVariantDetails?.reduce(
+          (sum, variant) =>
+            sum +
+            (variant?.StockDetails?.reduce(
+              (variantSum, stock) =>
+                variantSum + (stock?.ProdLoyaltyPoint * stock?.UsedFree || 0),
+              0
+            ) || 0),
+          0
+        ) || 0,
+      FreeProductsList: change,
+    };
+    result?.push(formatted);
+    return result;
+  };
+
+  function chooseOfferFun(item, CartData) {
+    return validateOffers(
+      item,
+      OverAllproductBasedOfferDatas,
+      CartData,
+      TakAwayId,
+      DineinId
+    );
+  }
+
+  const handleBulkUpload = async () => {
+    console.log(
+      AllCategoryDatas,
+      AllsubcatgoryDatas,
+      'AllsubcatgoryDatas',
+      ProdSubCat
+    );
+
+    let ProdcatName =
+      AllCategoryDatas?.find((cat) => cat?.ProdCat == ProdCat)?.ProdCatName ||
+      'General';
+    let ProdsubcatName =
+      AllsubcatgoryDatas?.find((subcat) => subcat?.ProdSubCat == ProdSubCat)
+        ?.ProdSubCatName || 'General';
+    const Postdata = products?.map((e, index) => {
+      if (e?.name == null || e?.name === '') {
+        setMessageData(`Product Name  is missing  at Row ${index + 1} `);
+        setMessageType('error');
+        throw new Error(`Product Name  is missing  at Row ${index + 1} `);
+      }
+      if (e?.price == null || e?.price === '') {
+        setMessageData(
+          `Price is missing for product at Row ${index + 1} (${e?.name || 'Unknown'})`
+        );
+        setMessageType('error');
+        throw new Error(
+          `Price is missing for product at index ${index} (${e?.name || 'Unknown'})`
+        );
+      }
+
+      return {
+        AppId,
+        CompId,
+        BranchId,
+        CreatedBy: UserId,
+        ProdName: e?.name,
+        ProdVariantName: '',
+        ProdCat: ProdcatName,
+        ProdSubCat: ProdsubcatName,
+        Brand: '',
+        PartNumber: '',
+        HSNCode: '',
+        ProdNameCode: e?.code,
+        UOM: e?.UOMName,
+        Size: e?.size || 1,
+        MRP: e.price,
+        SellPrice: e.price,
+        WhSalePrice: '',
+        TaxId: 'NIL - 0%',
+        StockAvailable: 'No',
+        OnePcsAvailable: 'No',
+        TokenAvailable: 'No',
+        AutoGenerateQr: 'No',
+        AutoGenerateSingleQr: 'No',
+        OnePcQR: '',
+        QRCode: '',
+        Rack: '',
+        AvailableFrom: null,
+        AvailableTo: null,
+        ManufDate: null,
+        ExpDate: null,
+      };
+    });
+
+    const response = await dispatch(
+      bulkpostdata({ ProdDetails: Postdata })
+    ).unwrap();
+    if (response?.data?.statusCode === 1) {
+      productCardList();
+      setMessageData(response?.data?.message);
+      setMessageType('success');
+      setNewMoreProductModel(false);
+      setProducts([
+        { id: 1, name: '', price: '', code: '', size: '1', category: '' },
+      ]);
+    } else {
+      setMessageData(response?.data?.message);
+      setMessageType('error');
+    }
+  };
+  function changeFreeProductList(FreeProdList, newFreeProd) {
+    if (!newFreeProd || !newFreeProd.ProdId || !newFreeProd.InwardDtlId) {
+      return FreeProdList; // 🚫 Skip invalid payload
+    }
+
+    const index = FreeProdList.findIndex(
+      (f) =>
+        f.ProdId === newFreeProd.ProdId &&
+        f.InwardDtlId === newFreeProd.InwardDtlId
+    );
+
+    if (index !== -1) {
+      let existing = JSON.parse(JSON.stringify(FreeProdList[index])); // deep clone
+
+      if (newFreeProd.ProdVariantDetails) {
+        newFreeProd.ProdVariantDetails.forEach((newVariant) => {
+          const existingVariant = existing.ProdVariantDetails?.find(
+            (v) => v.VariantName === newVariant.VariantName
+          );
+
+          if (existingVariant) {
+            newVariant.StockDetails.forEach((newStock) => {
+              const existingStock = existingVariant.StockDetails?.find(
+                (s) => s.InwardDtlId === newStock.InwardDtlId
+              );
+
+              if (existingStock) {
+                // ✅ Create a new object instead of mutating
+                existingStock.EligibleFree =
+                  (existingStock.EligibleFree || 0) +
+                  (newStock.EligibleFree || 0);
+                existingStock.UsedFree =
+                  (existingStock.UsedFree || 0) + (newStock.UsedFree || 0);
+                existingStock.RemainingFree =
+                  (existingStock.RemainingFree || 0) +
+                  (newStock.RemainingFree || 0);
+              } else {
+                existingVariant.StockDetails = [
+                  ...existingVariant.StockDetails,
+                  { ...newStock },
+                ];
+              }
+            });
+          } else {
+            if (!existing.ProdVariantDetails) existing.ProdVariantDetails = [];
+            existing.ProdVariantDetails = [
+              ...existing.ProdVariantDetails,
+              { ...newVariant },
+            ];
+          }
+        });
+      }
+
+      return FreeProdList.map((f, i) =>
+        i === index
+          ? {
+              ...existing,
+              ...newFreeProd,
+              ProdVariantDetails: existing.ProdVariantDetails,
+            }
+          : f
+      );
+    } else {
+      return [...FreeProdList, { ...newFreeProd }];
+    }
+  }
+
+  function applyBuyNGetFreeOffer(cartItem, offer, item) {
+    const freeList = offer.FreeProductsList || [];
+    let totalDiscount = 0;
+    let offerMessage = '';
+    let OfferApply = true;
+    let sameProductOffer = false;
+    let updatedFreeProdList = [...FreeProdList];
+    freeList.forEach((freeProd) => {
+      let data = updatedFreeProdList?.find(
+        (e) =>
+          e.FreeProdId === freeProd.FreeProdId &&
+          e.InwardDtlId === item?.InwardDtlId
+      );
+      // find matching item in cart
+      const freeCartItem = cartItem.filter(
+        (c) =>
+          c.ProdId === freeProd.FreeProdId &&
+          freeProd?.ProdVariantDetails?.some((pv) =>
+            pv?.StockDetails?.some((s) => s.InwardDtlId === c.InwardDtlId)
           )
       );
-    }
-
-    let temppostdata = {
-      SalesMode: RetailWSSalesType || 'R',
-      CompId: CompId,
-      BranchId: BranchId,
-      AppId: AppId,
-      OrderDate: Custombill ? invoiceDate : null,
-      CustomOrderNo: Custombill ? CurrentOrderId : null,
-      OrderType:
-        Object.keys(ReportholdData)?.length > 0
-          ? ReportholdData?.OrderType
-          : 'S',
-      CustSuppId: SelCustId ? SelCustId : null,
-      Reference: 'test',
-      BookingType:
-        NotSlectedTypeFind && !BookingTypeBoth
-          ? NotSlectedTypeFind?.BookingType
-          : SelectedBookingType,
-      // (NotSlectedTypeFind?.length>0 && !BookingTypeBoth)?NotSlectedTypeFind?.[0]?.BookingTypeName:
-
-      ServiceProvider: 0,
-      ActiveStatus: 'A',
-      CreatedBy: UserId,
-      AddlInfo: 'test',
-      BillAmount: TotalWithoutTaxAmount,
-      OverallDiscSales: OverAllSales > 0 ? OverAllSales : 0,
-      OverallDiscEst: OverAllEstimate > 0 ? OverAllEstimate : 0,
-      TaxAmount: TotalTaxAmount,
-      VatAmount: 0,
-      NetAmount: Math.round(TotalAmount),
-      PaymentType:
-        Paybtnnameselected?.toLowerCase() === 'upi'
-          ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-            ? PaymentDeviceUPI?.[0]?.ModeId
-            : SelectedUPIPayOption?.toLowerCase() === 'pg'
-              ? PaymentgatewayUPI?.[0]?.ModeId
-              : paybtnselected
-          : paybtnselected
-            ? paybtnselected
-            : null,
-      GivenAmt: 0,
-      BalGiven: 0,
-      BookingMedia: 'DW',
-      RefundAmount: 0,
-      ServiceCategory: OtherServiceTicketClaim?.ServiceCategory || null,
-      OtherServiceTicketId: OtherServiceTicketClaim?.TicketId || null,
-      OtherServiceTicketAmount: OtherServiceTicketClaim?.TotalAmt || null,
-      PaymentStatus:
-        Paybtnnameselected?.toLowerCase() === 'cash'
-          ? 'S'
-          : Paybtnnameselected?.toLowerCase() === 'credit'
-            ? 'S'
-            : Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? 'S'
-              : 'P',
-      OrderDtlDetails:
-        Object.keys(ReportholdData)?.length > 0
-          ? ProductSummary(temporderdetail)
-          : temporderdetail,
-      // (BookingType === "Dine In" || BookingTypeBoth)
-      ExtraChargeDetails:
-        GlobalExtraCharge?.length > 0
-          ? extrachargesbookingtype(GlobalExtraCharge)
-          : null,
-      SalesTableLinkDetails:
-        SelectedTableDetails?.length > 0
-          ? globalTipAmount === 0
-            ? SelectedTableDetails
-            : SelectedTableDetails?.map((item) => ({
-              ...item,
-              TipsAmount: globalTipAmount,
-            }))
-          : null,
-      // "Credit": TotalAmount,
-      // "Debit": 0,
-      SalesPaymentType: 'normal',
-      PaymentDetail: [
-        {
-          PaymentType:
-            Paybtnnameselected?.toLowerCase() === 'upi'
-              ? SelectedUPIPayOption?.toLowerCase() === 'pd'
-                ? PaymentDeviceUPI?.[0]?.ModeId
-                : SelectedUPIPayOption?.toLowerCase() === 'pg'
-                  ? PaymentgatewayUPI?.[0]?.ModeId
-                  : paybtnselected
-              : paybtnselected
-                ? paybtnselected
-                : null,
-          // SelectedUPIPayOption?.toLowerCase() === "pg" ?
-          Amount: Math.round(TotalAmount),
-          PaymentOptionType:
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'PC'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'PC'
-                : Paybtnnameselected?.toLowerCase() === 'card'
-                  ? SelectedCardOption
-                  : Paybtnnameselected?.toLowerCase() === 'upi'
-                    ? SelectedUPIPayOption?.toLowerCase() === 'default'
-                      ? 'PC'
-                      : SelectedUPIPayOption
-                    : null,
-          ModeOfPayment:
-            SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? PaymentUpiOptions?.find((upipay) => upipay?.UPIId === UpiId)
-                ?.UPIDetailId
-              : null,
-          AccountDtl:
-            Paybtnnameselected?.toLowerCase() === 'upi' &&
-              SelectedUPIPayOption?.toLowerCase() === 'default'
-              ? useOptions?.[0]?.PaymentDetails?.Payatthecounter?.find(
-                (upipay) => upipay?.UPIId === UpiId
-              )
-              : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                SelectedUPIPayOption?.toLowerCase() === 'pd') ||
-                (Paybtnnameselected?.toLowerCase() === 'card' &&
-                  SelectedCardOption?.toLowerCase() === 'pd')
-                ? useOptions?.[0]?.PaymentDetails?.PaymentDevice
-                : (Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'pg') ||
-                  (Paybtnnameselected?.toLowerCase() === 'card' &&
-                    SelectedCardOption?.toLowerCase() === 'pg')
-                  ? useOptions?.[0]?.PaymentDetails?.PaymentGateway
-                  : [],
-          PaymentStatus:
-            Paybtnnameselected?.toLowerCase() === 'cash'
-              ? 'S'
-              : Paybtnnameselected?.toLowerCase() === 'credit'
-                ? 'S'
-                : Paybtnnameselected?.toLowerCase() === 'upi' &&
-                  SelectedUPIPayOption?.toLowerCase() === 'default'
-                  ? 'S'
-                  : 'P',
-          Debit: 0,
-          Credit:
-            Paybtnnameselected?.toLowerCase() === 'credit'
-              ? Math.round(TotalAmount)
-              : 0,
-        },
-      ],
-      OrderOfferDetail: updatedOfferDetails,
-    };
-    let PostData = temppostdata;
-
-    if (value === 'Dine-In') {
-      PostData['PaymentStatus'] = pay ? 'S' : 'P';
-      PostData['PaymentDetail'] = !pay && [];
-      PostData['PaymentType'] = !pay && '';
-    } else if (value === 'Hold') {
-      ((PostData['PaymentStatus'] = pay ? 'S' : 'P'),
-        (PostData['PaymentDetail'] = !pay && []));
-      PostData['PaymentType'] = !pay && '';
-      PostData['ActiveStatus'] = pay ? 'A' : 'D';
-    } else if (value === 'Unpaid') {
-      PostData['PaymentStatus'] = pay ? 'S' : 'P';
-      PostData['PaymentDetail'] = !pay && [];
-      PostData['PaymentType'] = !pay && '';
-      PostData['PrintType'] = 'Y';
-    }
-
-    Object.keys(ReportholdData)?.length > 0
-      ? OrderType === 'Failed'
-        ? PutFailedPayment(PostData, value, pay)
-        : PutBooking(PostData, value, pay)
-      : PostBooking(PostData, value);
-  };
-  const PostBooking = async (PostData, value) => {
-    let response = await dispatch(PostBookingData(PostData)).unwrap();
-    if (response?.data?.statusCode == 1) {
-      let Paymentdevicefilter = response?.data?.PaymentOrderDtl?.filter(
-        (item) =>
-          item?.PaymentOptionType?.toLowerCase() === 'pd' &&
-          item?.PaymentStatus === 'P'
-      );
-      let PaymentGatewayfilter = response?.data?.PaymentOrderDtl?.filter(
-        (item) =>
-          item?.PaymentOptionType?.toLowerCase() === 'pg' &&
-          item?.PaymentStatus === 'P'
-      );
-      let PayatCounterfilter = response?.data?.PaymentOrderDtl?.filter(
-        (item) => item?.PaymentOptionType?.toLowerCase() === 'pc'
-      );
-      if (
-        PayatCounterfilter?.length === 1 ||
-        response?.data?.PaymentOrderDtl?.length === 0
-      ) {
-        setMessageType('success');
-        setMessageData(
-          response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
+      // check if it's same product + inward
+      const isSameProduct =
+        offer.ProdId === freeProd.FreeProdId &&
+        freeProd?.ProdVariantDetails?.some((fpv) =>
+          fpv?.StockDetails?.some(
+            (fs) => fs.InwardDtlId === freeCartItem?.[0]?.InwardDtlId
+          )
         );
-        response?.data?.OrderDetails?.length > 0 &&
-          setPrintOrderDetails([response?.data]);
-        CustomerDisplay(value);
-        filteredSettingNames?.includes('whatsapp') &&
-          MobileNoWhatsApp?.value &&
-          handleURL([response?.data]);
-        ClearAllGlobalStateDatas(value);
+
+      if (!isSameProduct) {
+        const buyQty = offer.BuyQty || 1;
+        const getQty = freeProd.FreeQty || 0;
+
+        // 🔥 Find how many buy-product are in cart
+        const buyCartItem = cartItem.find((c) => c.ProdId === offer.ProdId);
+
+        if (buyCartItem) {
+          const eligibleCycles = Math.floor(buyCartItem.OrderQty / buyQty);
+          const totalFreeEligible = eligibleCycles * getQty;
+
+          if (totalFreeEligible > 0) {
+            offerMessage = `Add ${totalFreeEligible} ${freeProd.FreeProdName} free`;
+          }
+        }
       }
 
-      if (Paymentdevicefilter?.length === 1) {
-        if (
-          Paymentdevicefilter?.[0]?.PaymentOptionType?.toLowerCase() === 'pd'
-        ) {
-          PaymentDeviceFlow(Paymentdevicefilter, value);
-        }
+      if (offer.HalfPrice === 'Y' && isSameProduct) {
+        // 🔥 Half price for same product
+        totalDiscount +=
+          freeCartItem?.reduce((acc, fc) => acc + (fc?.OrderQty || 0), 0) *
+          freeCartItem?.[0]?.OrderRate *
+          0.5;
+        sameProductOffer = true;
+      } else if (isSameProduct) {
+        // 🔥 Buy N Get M (same product)
+        const buyQty = offer.BuyQty || 1;
+        const getQty = freeProd.FreeQty || 0;
+
+        const cycleSize = buyQty + getQty;
+        const fullCycles = Math.floor(
+          freeCartItem?.reduce((acc, fc) => acc + (fc?.OrderQty || 0), 0) /
+            cycleSize
+        );
+        const totalFreeQty = fullCycles * getQty;
+
+        totalDiscount += totalFreeQty * freeCartItem?.[0].OrderRate;
+        sameProductOffer = true;
+        // offerMessage = `${freeProd.FreeProdName} -> ${Math.ceil(totalFreeQty / 2)} qty  Free Eligible`;
       } else {
-        console.log('more pd data');
+        // 🔥 Different product free
+        const buyQty = offer.BuyQty || 1;
+        const getQty = freeProd.FreeQty;
+
+        // find buy product qty in cart
+        const buyCartItem = cartItem.filter(
+          (c) =>
+            c?.ProdId === offer?.ProdId &&
+            (offer?.InwardDtlId ? c?.InwardDtlId === offer?.InwardDtlId : true)
+        );
+
+        const buyOrderQty = buyCartItem?.reduce(
+          (acc, fc) => acc + (fc?.OrderQty || 0),
+          0
+        );
+
+        // ✅ total eligible free qty (cycles of Buy X Get Y)
+        const eligibleCycles = Math.floor(buyOrderQty / buyQty);
+        const totalFreeQty = eligibleCycles * getQty;
+
+        totalDiscount += 0;
+
+        // 🟢 Offer message handling
+        if (buyOrderQty === 0) {
+          offerMessage = `No free eligible right now`;
+        } else if (buyOrderQty % buyQty !== 0) {
+          const remainingToNext = buyQty - (buyOrderQty % buyQty);
+          offerMessage = `Buy ${remainingToNext} more ${offer.ProdName} to get ${getQty} ${freeProd.FreeProdName} free`;
+        } else if (totalFreeQty > 0) {
+          offerMessage = `${freeProd.FreeProdName} -> ${totalFreeQty} qty  Free Eligible`;
+        } else {
+          offerMessage = `No free eligible right now`;
+        }
+
+        const usedFree = data?.FreeQty || 0;
+        const remainingFree = Math.max(totalFreeQty - usedFree, 0);
+
+        const FreeProdList = {
+          OfferId: offer.OfferId,
+          ProdId: item?.ProdId,
+          ProdVariantName: item?.ProdVariantName,
+          StockAvailable: item?.StockAvailable,
+          OfferMode: offer.OfferMode,
+          TableName: offer.TableName,
+          TableUniqueName: offer.TableUniqueName,
+          InwardDtlId: item?.InwardDtlId || null,
+          FreeProdId: freeProd.FreeProdId,
+          FreeProdName: freeProd.FreeProdName,
+          ProdCat: item?.ProdCat,
+          SinglePc: item?.SinglePc,
+          BatchRef: item?.BatchRef,
+          OverAllFreeQty: totalFreeQty,
+          FreeQty: usedFree,
+          RemainingQty: remainingFree,
+
+          ProdVariantDetails: freeProd.ProdVariantDetails.map((variant) => ({
+            FreeProdVariantName: variant.ProdVariantName,
+            StockDetails: variant.StockDetails.map((stock) => {
+              // 🔎 inward-based usage
+              const matchedCartItem = cartItem.find(
+                (c) =>
+                  c.ProdId === freeProd.FreeProdId &&
+                  c.InwardDtlId === stock.InwardDtlId
+              );
+
+              const usedFreeForStock = matchedCartItem?.OrderQty || 0;
+              const remainingFreeForStock = Math.max(
+                totalFreeQty - usedFreeForStock,
+                0
+              );
+
+              return {
+                FreeInwardDtlId: stock.InwardDtlId,
+                ProdOfferId: stock.ProdOfferId,
+                ActiveStatus: stock.ActiveStatus,
+                EligibleFree: totalFreeQty, // still overall, can later split if needed
+                UsedFree: usedFreeForStock,
+                RemainingFree: remainingFreeForStock,
+              };
+            }),
+          })),
+        };
+
+        updatedFreeProdList = changeFreeProductList(
+          updatedFreeProdList,
+          FreeProdList
+        );
+
+        OfferApply = false;
       }
-      if (PaymentGatewayfilter?.length === 1) {
-        if (
-          PaymentGatewayfilter?.[0]?.PaymentOptionType?.toLowerCase() === 'pg'
-        ) {
-          await dispatch(changePaymentloader(true));
-          const customerDisplayWindow = getCustomerDisplayWindow();
-          if (customerDisplayWindow && !customerDisplayWindow.closed) {
-            const updatedData = {
-              OrderBookingId: PaymentGatewayfilter?.[0]?.OrderId,
-              Paymentgateway: true,
-              OrderPaymentId: PaymentGatewayfilter?.[0]?.PaymentOrderId,
-              OrderTotalAmount: PaymentGatewayfilter?.[0]?.Amount,
+    });
+
+    return {
+      OfferAmount: totalDiscount,
+      OfferMessage: offerMessage,
+      OfferApply: OfferApply,
+      updatedFreeProdList: updatedFreeProdList,
+      ProductOfferType: sameProductOffer ? true : false,
+    };
+  }
+
+  const processFreeProducts = (updatedData, freeProdList) => {
+    if (!freeProdList || freeProdList.length === 0) {
+      return {
+        updatedOrderCardDetails: updatedData,
+        updatedFreeProdList: freeProdList,
+        updatedOfferAppliedProducts: [],
+        hasChanges: false,
+      };
+    }
+    // Filter only free products with remaining quantity
+    const availableFreeProdList = freeProdList?.filter(
+      (prod) => prod?.RemainingQty > 0
+    );
+
+    let updatedOrderCardDetails = [];
+    let updatedFreeProdList = [...freeProdList]; // Create a copy to avoid mutations
+    let updatedOfferAppliedProducts = []; // Track offer applied products
+    let hasChanges = false;
+
+    updatedData?.forEach((item) => {
+      // STEP 1: Check if item is already a free product (with offer applied)
+      const foundInFreeProdList = freeProdList?.filter(
+        (prod) =>
+          prod?.OfferId === item?.OfferMessage?.[0]?.OfferId &&
+          prod?.FreeProdId === item?.ProdId &&
+          prod?.OfferMode === item?.OfferMode &&
+          prod?.ProdVariantDetails?.some((variant) =>
+            variant?.StockDetails?.some(
+              (stock) => stock?.FreeInwardDtlId === item?.InwardDtlId
+            )
+          )
+      );
+
+      // STEP 2: Check if item is a paid product that can be converted to free
+      const availableFreeProduct = updatedFreeProdList?.find(
+        (prod) =>
+          prod?.FreeProdId === item?.ProdId &&
+          prod?.RemainingQty > 0 &&
+          prod?.ProdVariantDetails?.some((variant) =>
+            variant?.StockDetails?.some(
+              (stock) => stock?.FreeInwardDtlId === item?.InwardDtlId
+            )
+          ) &&
+          item?.SinglePc !== 'Y'
+      );
+
+      const isPaidProductThatCanBeFree =
+        availableFreeProduct &&
+        (!item.OfferMode || item.OfferMode?.trim() === '') &&
+        (item.Offer === 0 || !item.Offer);
+
+      // STEP 3: Handle paid product conversion to free
+      if (isPaidProductThatCanBeFree) {
+        hasChanges = true; // Mark that changes occurred
+
+        const maxFreeQty = Math.min(
+          item.OrderQty,
+          availableFreeProduct.RemainingQty
+        );
+        const remainingPaidQty = Math.max(
+          item.OrderQty - availableFreeProduct.RemainingQty,
+          0
+        );
+
+        // Create free item
+        if (maxFreeQty > 0) {
+          const freeItem = {
+            ...item,
+            OrderQty: maxFreeQty,
+            TotalAmt: maxFreeQty * item.OrderRate,
+            Offer: maxFreeQty * item.OrderRate, // Full discount
+            OfferType: availableFreeProduct.OfferMode,
+            OfferMode: availableFreeProduct.OfferMode,
+            TaxAmt: (
+              (maxFreeQty * item.OrderRate * item.TaxPercentage) /
+              100
+            ).toFixed(2),
+            WithoutTaxRate: (
+              maxFreeQty * item.OrderRate -
+              (maxFreeQty * item.OrderRate * item.TaxPercentage) / 100
+            ).toFixed(2),
+            OfferMessage: [
+              {
+                OfferId: availableFreeProduct.OfferId,
+                FreeQty: maxFreeQty,
+                FreeProdId: availableFreeProduct.FreeProdId,
+                FreeProdName: availableFreeProduct.FreeProdName,
+              },
+            ],
+          };
+
+          // Check if free version already exists in updatedOrderCardDetails
+          const existingFreeIndex = updatedOrderCardDetails.findIndex(
+            (od) =>
+              od.ProdId === freeItem.ProdId &&
+              od.InwardDtlId === freeItem.InwardDtlId &&
+              od.OrderRate === freeItem.OrderRate &&
+              od.BookingTypeName === freeItem.BookingTypeName &&
+              od.OfferMode === freeItem.OfferMode &&
+              od.Offer > 0 &&
+              od.MRP === freeItem.MRP
+          );
+
+          if (existingFreeIndex !== -1) {
+            // Merge with existing free item
+            const existing = updatedOrderCardDetails[existingFreeIndex];
+            updatedOrderCardDetails[existingFreeIndex] = {
+              ...existing,
+              OrderQty: existing.OrderQty + freeItem.OrderQty,
+              TotalAmt: existing.TotalAmt + freeItem.TotalAmt,
+              Offer: existing.Offer + freeItem.Offer,
+              WithoutTaxRate: (
+                parseFloat(existing.WithoutTaxRate) +
+                parseFloat(freeItem.WithoutTaxRate)
+              ).toFixed(2),
+              TaxAmt: (
+                parseFloat(existing.TaxAmt) + parseFloat(freeItem.TaxAmt)
+              ).toFixed(2),
             };
-            customerDisplayWindow.postMessage(updatedData, '*');
           } else {
-            console.error(
-              'Customer display window is not available or has been closed.'
-            );
+            freeItem.localId = uuidv4();
+            updatedOrderCardDetails.push(freeItem);
           }
-          const checkPaymentStatus = async () => {
-            const intervalId = setInterval(async () => {
-              try {
-                let getpaymentgatewaydetail = await dispatch(
-                  PaymentGatewayGetdetail(PaymentGatewayfilter?.[0]?.OrderId)
-                ).unwrap();
 
-                if (getpaymentgatewaydetail?.data?.statusCode === 1) {
-                  let paymentdataget =
-                    getpaymentgatewaydetail?.data?.PaymentOrderDtl?.find(
-                      (item) =>
-                        item?.PaymentOrderId ===
-                        PaymentGatewayfilter?.[0]?.PaymentOrderId
-                    )?.PaymentStatus;
+          // Update the free product list (create new object to avoid mutation)
+          const freeProductIndex = updatedFreeProdList.findIndex(
+            (f) =>
+              f.OfferId === availableFreeProduct.OfferId &&
+              f.FreeProdId === availableFreeProduct.FreeProdId
+          );
 
-                  if (paymentdataget === 'S') {
-                    setMessageType('success');
-                    setMessageData('Payment Success');
-                    await dispatch(changePaymentloader(false));
-                    if (
-                      getpaymentgatewaydetail?.data?.OrderDetails?.length > 0
-                    ) {
-                      setPrintOrderDetails([getpaymentgatewaydetail?.data]);
-                      CustomerDisplay(value);
-                      ClearAllGlobalStateDatas(value);
-                    }
-                    clearInterval(intervalId); // Stop the loop when payment is successful
-                  } else if (paymentdataget === 'F') {
-                    setMessageType('error');
-                    setMessageData('Payment Failed');
-                    await dispatch(changePaymentloader(false));
-                    setFirstPaymentclick(false);
-                    setPaybtnnameselected(PaymentOptionsModeName);
-                    setPaybtnselected(PaymentOptionsModeId);
-                    clearInterval(intervalId); // Stop the loop when payment fails
-                    CustomerDisplayRemovedData();
-                    ClearAllGlobalStateDatas(value);
+          if (freeProductIndex !== -1) {
+            updatedFreeProdList[freeProductIndex] = {
+              ...updatedFreeProdList[freeProductIndex],
+              FreeQty:
+                (updatedFreeProdList[freeProductIndex].FreeQty || 0) +
+                maxFreeQty,
+              RemainingQty:
+                updatedFreeProdList[freeProductIndex].RemainingQty - maxFreeQty,
+              ProdVariantDetails: updatedFreeProdList[
+                freeProductIndex
+              ].ProdVariantDetails.map((variant) => ({
+                ...variant,
+                StockDetails: variant.StockDetails.map((stock) => {
+                  if (stock.FreeInwardDtlId === item.InwardDtlId) {
+                    return {
+                      ...stock,
+                      UsedFree: (stock.UsedFree || 0) + maxFreeQty,
+                      RemainingFree: Math.max(
+                        (stock.RemainingFree || 0) - maxFreeQty,
+                        0
+                      ),
+                    };
                   }
-                }
-              } catch (error) {
-                console.error('Error fetching payment details: ', error);
-              }
-            }, 3000); // Call the API every 3 seconds
+                  return stock;
+                }),
+              })),
+              discount:
+                (updatedFreeProdList[freeProductIndex].discount || 0) +
+                maxFreeQty * item.OrderRate,
+            };
+          }
+
+          const filteredOfferAppliedProduct = offerAppliedProducts?.find(
+            (op) =>
+              op.OfferId === availableFreeProduct.OfferId &&
+              op.ProdId === availableFreeProduct.ProdId &&
+              op.InwardDtlId === availableFreeProduct.InwardDtlId &&
+              op.OfferMode === availableFreeProduct.OfferMode
+          );
+          // Create offer applied product entry
+          const offerAppliedProduct = {
+            OfferId: availableFreeProduct.OfferId,
+            ProdId: availableFreeProduct.ProdId,
+            InwardDtlId: availableFreeProduct.InwardDtlId,
+            OfferAmount:
+              (filteredOfferAppliedProduct?.OfferAmount || 0) +
+              maxFreeQty * item.OrderRate, // Total discount amount
+            OfferMode: availableFreeProduct.OfferMode,
+            OfferType: availableFreeProduct.OfferType,
+            TableName: availableFreeProduct.TableName,
+            TableUniqueName: availableFreeProduct.TableUniqueName,
+            ActualOfferAmount:
+              (filteredOfferAppliedProduct?.OfferAmount || 0) +
+              maxFreeQty * item.OrderRate,
+            OfferValue:
+              (filteredOfferAppliedProduct?.OfferValue || 0) +
+              maxFreeQty * item.OrderRate,
+            ActualFreeQty:
+              (filteredOfferAppliedProduct?.ActualFreeQty || 0) + maxFreeQty,
+            AppliesTo: item.ProdId,
+            BookingType:
+              item.BookingType ||
+              (item.BookingTypeName === 'Dine In' ? DineinId : TakAwayId),
+            FreeProductsList: [
+              {
+                FreeProdId: availableFreeProduct.FreeProdId,
+                FreeQty:
+                  (filteredOfferAppliedProduct?.FreeProductsList?.[0]
+                    ?.FreeQty || 0) + maxFreeQty,
+                FreeProdName: availableFreeProduct.FreeProdName,
+                ProdVariantDetails:
+                  availableFreeProduct.ProdVariantDetails || [],
+              },
+            ],
+            // Product-level fields
+            SinglePc: item.SinglePc,
+            StockAvailable: item.StockAvailable,
+            ProdVariantName: item.ProdVariantName,
+            Type: item.Type,
+            ProdCat: item.ProdCat,
+            HalfPrice: availableFreeProduct.HalfPrice,
+            MinQty: availableFreeProduct.MinQty,
           };
 
-          // Call the function to start checking payment status
-          checkPaymentStatus();
+          updatedOfferAppliedProducts.push(offerAppliedProduct);
         }
-      } else {
-        console.log('more pg data');
-      }
-    } else {
-      setMessageType('error');
-      setMessageData(response?.data?.response);
-      setFirstPaymentclick(false);
-      // clearInvoiceDate
-      clearInvoiceDate();
-      dispatch(changeCurrentOrderId(null));
-    }
-  };
 
-  const PutBooking = async (putdatas, value, pay) => {
-    let putdata = putdatas;
-    putdata['OrderId'] = ReportholdData?.OrderId;
-    putdata['SalesId'] = ReportholdData?.SalesId;
-    putdata['UpdatedBy'] = UserId;
-    if (value === 'Dine-In') {
-      putdata['PaymentStatus'] = pay ? 'S' : 'P';
-      putdata['PaymentDetail'] = !pay && [];
-      putdata['PaymentType'] = !pay && '';
-    } else if (value === 'Hold') {
-      ((putdata['PaymentStatus'] = pay ? 'S' : 'P'),
-        (putdata['PaymentDetail'] = !pay && []));
-      putdata['PaymentType'] = !pay && '';
-      putdata['ActiveStatus'] = pay ? 'A' : 'D';
-    } else if (value === 'Unpaid') {
-      putdata['PaymentStatus'] = pay ? 'S' : 'P';
-      putdata['PaymentDetail'] = !pay && [];
-      putdata['PaymentType'] = !pay && '';
-      putdata['PrintType'] = 'Y';
-    }
-    let response = await dispatch(PutBookingData(putdata)).unwrap();
-    let PayatCounterfilter = response?.data?.PaymentOrderDtl?.filter(
-      (item) => item?.PaymentOptionType?.toLowerCase() === 'pc'
-    );
-    if (value !== 'Unpaid') {
-      if (response?.data?.statusCode == 1) {
-        let Paymentdevicefilter = response?.data?.PaymentOrderDtl?.filter(
-          (item) =>
-            item?.PaymentOptionType?.toLowerCase() === 'pd' &&
-            item?.PaymentStatus === 'P'
-        );
-        let PaymentGatewayfilter = response?.data?.PaymentOrderDtl?.filter(
-          (item) =>
-            item?.PaymentOptionType?.toLowerCase() === 'pg' &&
-            item?.PaymentStatus === 'P'
-        );
+        // Create paid item for remaining quantity
+        if (remainingPaidQty > 0) {
+          const paidItem = {
+            ...item,
+            OrderQty: remainingPaidQty,
+            TotalAmt: remainingPaidQty * item.OrderRate,
+            TaxAmt: (
+              (remainingPaidQty * item.OrderRate * item.TaxPercentage) /
+              100
+            ).toFixed(2),
+            WithoutTaxRate: (
+              remainingPaidQty * item.OrderRate -
+              (remainingPaidQty * item.OrderRate * item.TaxPercentage) / 100
+            ).toFixed(2),
+            Offer: 0,
+            OfferType: '',
+            OfferMessage: [],
+            OfferMode: '',
+          };
 
-        if (
-          PayatCounterfilter?.length === 1 ||
-          response?.data?.PaymentOrderDtl?.length === 0
-        ) {
-          setMessageType('success');
-          setMessageData(
-            response?.data?.response +
-            ' ' +
-            (response?.data?.OrderDetails?.length > 0
-              ? response?.data?.OrderId &&
-              extractLastNumberOrderId(
-                response?.data?.OrderId,
-                response?.data?.OrderDetails?.[0]?.FYStatus
-              )
-              : '')
+          // Remove offer-related properties
+          delete paidItem.OfferType;
+          delete paidItem.OfferMessage;
+          delete paidItem.OfferMode;
+
+          // Check if paid version already exists
+          const existingPaidIndex = updatedOrderCardDetails.findIndex(
+            (od) =>
+              od.ProdId === paidItem.ProdId &&
+              od.InwardDtlId === paidItem.InwardDtlId &&
+              od.OrderRate === paidItem.OrderRate &&
+              !od.SalesId &&
+              (od.Offer === 0 || !od.Offer) &&
+              od.MRP === paidItem.MRP
           );
-          response?.data?.OrderDetails?.length > 0 &&
-            setPrintOrderDetails([response?.data]);
-          CustomerDisplay(value);
-          ClearAllGlobalStateDatas(value);
+
+          if (existingPaidIndex !== -1) {
+            // Merge with existing paid item
+            const existing = updatedOrderCardDetails[existingPaidIndex];
+            updatedOrderCardDetails[existingPaidIndex] = {
+              ...existing,
+              OrderQty: existing.OrderQty + paidItem.OrderQty,
+              TotalAmt: existing.TotalAmt + paidItem.TotalAmt,
+              WithoutTaxRate: (
+                parseFloat(existing.WithoutTaxRate) +
+                parseFloat(paidItem.WithoutTaxRate)
+              ).toFixed(2),
+              TaxAmt: (
+                parseFloat(existing.TaxAmt) + parseFloat(paidItem.TaxAmt)
+              ).toFixed(2),
+            };
+          } else {
+            paidItem.localId = uuidv4();
+            updatedOrderCardDetails.push(paidItem);
+          }
         }
-        if (Paymentdevicefilter?.length === 1) {
-          if (
-            Paymentdevicefilter?.[0]?.PaymentOptionType?.toLowerCase() === 'pd'
-          ) {
-            PaymentDeviceFlow(Paymentdevicefilter, value);
+
+        return; // Skip the rest of processing for this item
+      }
+
+      // STEP 4: Handle existing free products (original logic)
+      if (foundInFreeProdList?.length > 0) {
+        const freeProduct = foundInFreeProdList[0];
+
+        if (freeProduct?.RemainingQty !== 0) {
+          // If there are remaining free quantities, push the original item
+          const isAlreadyExists = updatedOrderCardDetails.findIndex(
+            (od) =>
+              od.ProdId === item.ProdId &&
+              od.InwardDtlId === item.InwardDtlId &&
+              od.OrderRate === item.OrderRate &&
+              od.BookingTypeName === item.BookingTypeName &&
+              !od.SalesId &&
+              od.OfferMode === item.OfferMode &&
+              od.Offer > 0 &&
+              od.MRP === item.MRP
+          );
+
+          if (isAlreadyExists !== -1) {
+            updatedOrderCardDetails[isAlreadyExists] = {
+              ...updatedOrderCardDetails[isAlreadyExists],
+              OrderQty:
+                updatedOrderCardDetails[isAlreadyExists].OrderQty +
+                item.OrderQty,
+              TotalAmt:
+                updatedOrderCardDetails[isAlreadyExists].TotalAmt +
+                item.TotalAmt,
+              WithoutTaxRate:
+                updatedOrderCardDetails[isAlreadyExists].WithoutTaxRate +
+                item.WithoutTaxRate,
+              Offer:
+                updatedOrderCardDetails[isAlreadyExists].Offer + item.Offer,
+              OfferMessage:
+                updatedOrderCardDetails[isAlreadyExists]?.OfferMessage?.[0]
+                  ?.FreeQty > item?.OfferMessage?.[0]?.FreeQty
+                  ? updatedOrderCardDetails[isAlreadyExists]?.OfferMessage
+                  : item?.OfferMessage,
+            };
+          } else {
+            updatedOrderCardDetails.push(item);
+          }
+        } else if (
+          freeProduct?.RemainingQty === 0 &&
+          item?.OrderQty > freeProduct?.FreeQty
+        ) {
+          // Split the item into free and paid portions
+          const freeQty = freeProduct.FreeQty;
+          const paidQty = item.OrderQty - freeProduct.FreeQty;
+
+          // Create free item (with original offer details)
+          const freeItem = {
+            ...item,
+            OrderQty: freeQty,
+            WithoutTaxRate: freeQty * item.OrderRate,
+            TotalAmt: freeQty * item.OrderRate,
+            Offer: freeQty * item.OrderRate,
+          };
+
+          // Create paid item (without offer details)
+          const paidItem = {
+            ...item,
+            OrderQty: paidQty,
+            TotalAmt: paidQty * (item.SellingPrice || item.OrderRate),
+            WithoutTaxRate: paidQty * item.OrderRate,
+            Offer: 0,
+            OfferType: '',
+            OfferMessage: [],
+            OfferMode: '',
+          };
+
+          delete paidItem.OfferType;
+          delete paidItem.OfferMessage;
+          delete paidItem.OfferMode;
+
+          updatedOrderCardDetails.push(freeItem);
+
+          const isAlreadyExists = updatedOrderCardDetails.findIndex(
+            (od) =>
+              od.ProdId === paidItem.ProdId &&
+              od.InwardDtlId === paidItem.InwardDtlId &&
+              od.OrderRate === paidItem.OrderRate &&
+              !od.SalesId &&
+              (od.Offer === 0 || !od.Offer)
+          );
+
+          if (isAlreadyExists !== -1) {
+            const existingItem = updatedOrderCardDetails[isAlreadyExists];
+            updatedOrderCardDetails[isAlreadyExists] = {
+              ...existingItem,
+              OrderQty: existingItem.OrderQty + paidItem.OrderQty,
+              TotalAmt: existingItem.TotalAmt + paidItem.TotalAmt,
+              WithoutTaxRate:
+                existingItem.WithoutTaxRate + paidItem.WithoutTaxRate,
+            };
+          } else {
+            paidItem.localId = uuidv4();
+            updatedOrderCardDetails.push(paidItem);
           }
         } else {
-          console.log('more pd data');
-        }
-        if (PaymentGatewayfilter?.length === 1) {
-          await PaymentGatewayFlow(PaymentGatewayfilter);
-        } else {
-          console.log('more pg data');
+          updatedOrderCardDetails.push(item);
         }
       } else {
-        // clearInvoiceDate
-        clearInvoiceDate();
-        dispatch(changeCurrentOrderId(null));
+        // STEP 5: No matching free product found, push original item
+        updatedOrderCardDetails.push(item);
       }
-    } else {
-      setPrintOrderDetails([response?.data]);
+    });
 
-      if (OfferCheckedInSetup && preferenceOffer) {
-        await applyOffer([]);
-      } else {
-        dispatch(changeOrderCardDetails([]));
-      }
-      await dispatch(changeReorderHoldDetails({}));
-      await dispatch(changeReorderProductDetails([]));
-      setFirstPaymentclick(false);
-      await dispatch(changeBookingType('TakeAway'));
-      await dispatch(changeSelectTable([]));
-      await dispatch(changeSelectChair([]));
-      getUnpaiddatas();
-    }
-  };
-  const PutFailedPayment = async (PayData, value, pay) => {
-    console.log(PayData?.PaymentDetail?.[0]?.PaymentType, 'mohanPayData');
-    let tempsplitdata = {
-      CompId: PayData?.CompId,
-      BranchId: PayData?.BranchId,
-      AppId: PayData?.AppId,
-      CustSuppId: PayData?.SelCustId ? SelCustId : null,
-      UpdatedBy: UserId,
-      OrderId: ReportholdData?.OrderId,
-      PaymentType: PayData?.PaymentDetail?.[0]?.PaymentType,
-      Amount: FailedTotalAmt,
-      PaymentOptionType: PayData?.PaymentDetail?.[0]?.PaymentOptionType,
-      ModeOfPayment: PayData?.PaymentDetail?.[0]?.ModeOfPayment,
-      AccountDtl: PayData?.PaymentDetail?.[0]?.AccountDtl,
-      PaymentStatus: PayData?.PaymentDetail?.[0]?.PaymentStatus,
-      Debit: PayData?.PaymentDetail?.[0]?.Debit,
-      Credit: PayData?.PaymentDetail?.[0]?.Credit,
+    return {
+      updatedOrderCardDetails,
+      updatedFreeProdList,
+      updatedOfferAppliedProducts,
+      hasChanges,
     };
-
-    let response = await dispatch(
-      putSplitpaymentStatus(tempsplitdata)
-    ).unwrap();
-    if (response?.data?.statusCode == 1) {
-      let Paymentdevicefilter = response?.data?.PaymentOrderDtl?.filter(
-        (item) =>
-          item?.PaymentOptionType?.toLowerCase() === 'pd' &&
-          item?.PaymentStatus === 'P'
-      );
-      let PaymentGatewayfilter = response?.data?.PaymentOrderDtl?.filter(
-        (item) =>
-          item?.PaymentOptionType?.toLowerCase() === 'pg' &&
-          item?.PaymentStatus === 'P'
-      );
-      let PayatCounterfilter = response?.data?.PaymentOrderDtl?.filter(
-        (item) =>
-          item?.PaymentOptionType?.toLowerCase() === 'pc' &&
-          item?.PaymentType === PayData?.PaymentDetail?.[0]?.PaymentType
-      );
-      if (
-        PayatCounterfilter?.length > 0 ||
-        response?.data?.PaymentOrderDtl?.length === 0
-      ) {
-        setMessageType('success');
-
-        // setSplitSelPayMode({...SplitSelPayMode,...{[`PaymentStatus-${i}`]:"S"}})
-
-        const customerDisplayWindow = getCustomerDisplayWindow();
-        if (customerDisplayWindow && !customerDisplayWindow.closed) {
-          const updatedData = {
-            upi: null,
-          };
-          customerDisplayWindow.postMessage(updatedData, '*');
-        } else {
-          console.error(
-            'Customer display window is not available or has been closed.'
-          );
-        }
-        setMessageData(
-          response?.data?.response +
-          ' ' +
-          (response?.data?.OrderDetails?.length > 0
-            ? response?.data?.OrderId &&
-            extractLastNumberOrderId(
-              response?.data?.OrderId,
-              response?.data?.OrderDetails?.[0]?.FYStatus
-            )
-            : '')
-        );
-        if (response?.data?.OrderDetails?.length > 0) {
-          setPrintOrderDetails([response?.data]);
-          CustomerDisplay();
-          ClearAllGlobalStateDatas();
-        }
-      }
-      if (Paymentdevicefilter?.length === 1) {
-        if (
-          Paymentdevicefilter?.[0]?.PaymentOptionType?.toLowerCase() === 'pd'
-        ) {
-          PaymentDeviceFlow(Paymentdevicefilter, value);
-        }
-      }
-
-      if (PaymentGatewayfilter?.length === 1) {
-        if (
-          PaymentGatewayfilter?.[0]?.PaymentOptionType?.toLowerCase() === 'pg'
-        ) {
-          PaymentGatewayFlow(PaymentGatewayfilter, value);
-        }
-      }
-    }
   };
-  const PaymentDeviceFlow = async (Paymentdevicefilter, value) => {
-    await dispatch(changePaymentloader(true));
-    await dispatch(
-      changePaymentTransactionNumber(Paymentdevicefilter?.[0]?.PaymentOrderId)
+
+  const returnCount = (ProdName, currentQty, orderDetails, overallpcs) => {
+    let SelectedProduct = ReorderProductData?.filter(
+      (a) => a?.ProdName === ProdName
+    );
+    let totalSelectedProductQty = SelectedProduct?.reduce(
+      (accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty
+                : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                  ? 0
+                  : card.OrderQty % card.NoOfPcs === 0
+                    ? Math.floor(card.OrderQty / card.NoOfPcs)
+                    : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+              : 0
+          )
+        );
+      },
+      0
     );
 
-    let paymentdetail = {
-      TransactionNumber: Paymentdevicefilter?.[0]?.PaymentOrderId,
-      SequenceNumber: 1,
-      AllowedPaymentMode:
-        Paymentdevicefilter?.[0]?.PaymentTypeName?.toLowerCase() === 'card'
-          ? '1'
-          : Paymentdevicefilter?.[0]?.PaymentTypeName?.toLowerCase() === 'upi'
-            ? '10'
-            : '',
-      Amount: `${parseInt(Paymentdevicefilter?.[0]?.Amount) * 100}`,
-      ClientID: useOptions?.[0]?.PDConfigDetails?.[0]?.ClientId,
-      StoreID: useOptions?.[0]?.PDConfigDetails?.[0]?.StoreId,
-      UserID: useOptions?.[0]?.PDConfigDetails?.[0]?.UserId,
-      MerchantID: useOptions?.[0]?.PDConfigDetails?.[0]?.MerchantId,
-      SecurityToken: useOptions?.[0]?.PDConfigDetails?.[0]?.SecurityToken,
-      IMEI: useOptions?.[0]?.PDConfigDetails?.[0]?.IMEI,
-      AutoCancelDurationInMinutes:
-        useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes,
-    };
-    let apiresponse = await dispatch(PostPaymentdevice(paymentdetail)).unwrap();
-    if (apiresponse?.ResponseMessage?.toLowerCase() === 'approved') {
-      let pendingPaymentList = {
-        MerchantID: useOptions?.[0]?.PDConfigDetails?.[0]?.MerchantId,
-        SecurityToken: useOptions?.[0]?.PDConfigDetails?.[0]?.SecurityToken,
-        ClientID: useOptions?.[0]?.PDConfigDetails?.[0]?.ClientId,
-        StoreID: useOptions?.[0]?.PDConfigDetails?.[0]?.StoreId,
-        IMEI: useOptions?.[0]?.PDConfigDetails?.[0]?.IMEI,
-        PlutusTransactionReferenceId: apiresponse?.PlutusTransactionReferenceID,
-        PaymentOrderId: Paymentdevicefilter?.[0]?.PaymentOrderId,
-        UpdatedBy: UserId,
-      };
-      await dispatch(PutPendingPaymentList(pendingPaymentList)).unwrap();
-      let isApproved = false;
-      const startTime = Date.now();
-      let postpaymentdata = {
-        MerchantID: useOptions?.[0]?.PDConfigDetails?.[0]?.MerchantId,
-        SecurityToken: useOptions?.[0]?.PDConfigDetails?.[0]?.SecurityToken,
-        ClientID: useOptions?.[0]?.PDConfigDetails?.[0]?.ClientId,
-        StoreID: useOptions?.[0]?.PDConfigDetails?.[0]?.StoreId,
-        IMEI: useOptions?.[0]?.PDConfigDetails?.[0]?.IMEI,
-        PlutusTransactionReferenceID: apiresponse?.PlutusTransactionReferenceID,
-      };
-      // Loop to call the second API every 3 seconds
-      while (!isApproved) {
-        let ApiResponseget = await dispatch(
-          GetPaymentdeviceResponse(postpaymentdata)
-        ).unwrap();
-
-        if (ApiResponseget?.ResponseMessage?.toLowerCase() === 'txn approved') {
-          let putbookingdata = {
-            OrderBookingId: Paymentdevicefilter?.[0]?.OrderId,
-            OrderId: Paymentdevicefilter?.[0]?.PaymentOrderId,
-            PaymentStatus: 'S',
-            Amount: Paymentdevicefilter?.[0]?.Amount,
-            ResponseDtl: [ApiResponseget],
-            PaymentType: Paymentdevicefilter?.[0]?.PaymentType,
-            UpdatedBy: UserId,
-          };
-
-          let bookingpaymentupdate = await dispatch(
-            PutBookingPaymentStatusChange(putbookingdata)
-          ).unwrap();
-          if (bookingpaymentupdate?.data?.statusCode === 1) {
-            setMessageType('success');
-            setMessageData(
-              bookingpaymentupdate?.data?.response +
-              ' ' +
-              (bookingpaymentupdate?.data?.OrderDetails?.length > 0
-                ? bookingpaymentupdate?.data?.OrderId &&
-                extractLastNumberOrderId(
-                  bookingpaymentupdate?.data?.OrderId,
-                  bookingpaymentupdate?.data?.OrderDetail?.[0]?.FYStatus
-                )
-                : '')
-            );
-            bookingpaymentupdate?.data?.OrderDetails?.length > 0 &&
-              setPrintOrderDetails([bookingpaymentupdate?.data]);
-            CustomerDisplay(value);
-            ClearAllGlobalStateDatas(value);
-            dispatch(changePaymentloader(false));
-          }
-          isApproved = true;
-          console.log('Transaction Approved!');
-          // Exit the loop
-          break;
-        }
-
-        // Check if 1 minute has passed
-        if (
-          Date.now() - startTime >
-          useOptions?.[0]?.PDConfigDetails?.[0]?.AutoCancelDurationInMinutes *
-          60000
-        ) {
-          // 60,000 ms = 1 minute
-
-          let putbookingdata = {
-            OrderBookingId: Paymentdevicefilter?.[0]?.OrderId,
-            OrderId: Paymentdevicefilter?.[0]?.PaymentOrderId,
-            PaymentStatus: 'F',
-            Amount: Paymentdevicefilter?.[0]?.Amount,
-            ResponseDtl: [ApiResponseget],
-            PaymentType: Paymentdevicefilter?.[0]?.PaymentType,
-            UpdatedBy: UserId,
-          };
-
-          let bookingpaymentupdate = await dispatch(
-            PutBookingPaymentStatusChange(putbookingdata)
-          ).unwrap();
-          if (bookingpaymentupdate?.data?.statusCode === 1) {
-            setMessageType('error');
-            setMessageData(
-              `Payment Failed. Your Transaction Number is ${Paymentdevicefilter?.[0]?.PaymentOrderId}`
-            );
-            setFirstPaymentclick(false);
-            setPaybtnnameselected(PaymentOptionsModeName);
-            setPaybtnselected(PaymentOptionsModeId);
-            dispatch(changePaymentloader(false));
-            CustomerDisplayRemovedData();
-            ClearAllGlobalStateDatas(value);
-          }
-
-          console.error('Transaction not approved within 1 minute.');
-          // Send an error message or handle the timeout
-          // You can dispatch an action, show a notification, etc.
-          break;
-        }
-
-        // Wait for 3 seconds before making the next call
-        await new Promise((resolve) => setTimeout(resolve, 3000));
-      }
-    } else {
-      let putbookingdata = {
-        OrderBookingId: Paymentdevicefilter?.[0]?.OrderId,
-        OrderId: Paymentdevicefilter?.[0]?.PaymentOrderId,
-        PaymentStatus: 'F',
-        Amount: Paymentdevicefilter?.[0]?.Amount,
-        PaymentType: Paymentdevicefilter?.[0]?.PaymentType,
-        UpdatedBy: UserId,
-      };
-      let bookingpaymentupdate = await dispatch(
-        PutBookingPaymentStatusChange(putbookingdata)
-      ).unwrap();
-      if (bookingpaymentupdate?.data?.statusCode === 1) {
-        setMessageType('error');
-        setMessageData(apiresponse?.ResponseMessage);
-        setFirstPaymentclick(false);
-        setPaybtnnameselected(PaymentOptionsModeName);
-        setPaybtnselected(PaymentOptionsModeId);
-        dispatch(changePaymentloader(false));
-        CustomerDisplayRemovedData();
-        ClearAllGlobalStateDatas(value);
-      }
-    }
-  };
-  const PaymentGatewayFlow = async (PaymentGatewayfilter) => {
-    if (PaymentGatewayfilter?.[0]?.PaymentOptionType?.toLowerCase() === 'pg') {
-      await dispatch(changePaymentloader(true));
-      const customerDisplayWindow = getCustomerDisplayWindow();
-      if (customerDisplayWindow && !customerDisplayWindow.closed) {
-        const updatedData = {
-          OrderBookingId: PaymentGatewayfilter?.[0]?.OrderId,
-          Paymentgateway: true,
-          OrderPaymentId: PaymentGatewayfilter?.[0]?.PaymentOrderId,
-          OrderTotalAmount: PaymentGatewayfilter?.[0]?.Amount,
-        };
-        customerDisplayWindow.postMessage(updatedData, '*');
-      } else {
-        console.error(
-          'Customer display window is not available or has been closed.'
-        );
-      }
-      const checkPaymentStatus = async () => {
-        const intervalId = setInterval(async () => {
-          try {
-            let getpaymentgatewaydetail = await dispatch(
-              PaymentGatewayGetdetail(PaymentGatewayfilter?.[0]?.OrderId)
-            ).unwrap();
-
-            if (getpaymentgatewaydetail?.data?.statusCode === 1) {
-              let paymentdataget =
-                getpaymentgatewaydetail?.data?.PaymentOrderDtl?.find(
-                  (item) =>
-                    item?.PaymentOrderId ===
-                    PaymentGatewayfilter?.[0]?.PaymentOrderId
-                )?.PaymentStatus;
-
-              if (paymentdataget === 'S') {
-                setMessageType('success');
-                setMessageData('Payment Success');
-                await dispatch(changePaymentloader(false));
-                if (getpaymentgatewaydetail?.data?.OrderDetails?.length > 0) {
-                  setPrintOrderDetails([getpaymentgatewaydetail?.data]);
-                  CustomerDisplay(value);
-
-                  ClearAllGlobalStateDatas(value);
-                }
-                clearInterval(intervalId); // Stop the loop when payment is successful
-              } else if (paymentdataget === 'F') {
-                setMessageType('error');
-                setMessageData('Payment Failed');
-                await dispatch(changePaymentloader(false));
-                setFirstPaymentclick(false);
-                setPaybtnnameselected(PaymentOptionsModeName);
-                setPaybtnselected(PaymentOptionsModeId);
-                clearInterval(intervalId); // Stop the loop when payment fails
-                CustomerDisplayRemovedData();
-                ClearAllGlobalStateDatas(value);
-                // const customerDisplayWindow = getCustomerDisplayWindow();
-                //             if (customerDisplayWindow && !customerDisplayWindow.closed) {
-                //                 const updatedData = {
-                //                     userData: OrderCardDetail,
-                //                     ExtraCharges: GlobalExtraCharge,
-                //                     upi: GlobalUpiID,
-                //                     customer: selOption != null ? selOption : GetCustId,
-                //                     paymentMethod: Paybtnnameselected,
-                //                     Paymentgateway: false,
-                //                     OrderTotalAmount:PaymentGatewayfilter?.[0]?.Amount
-
-                //                 };
-                //                 customerDisplayWindow.postMessage(updatedData, '*');
-                //             }
+    // Include combo consumption from ReorderProductData (SetCount == 0)
+    try {
+      const reorderComboLines = (ReorderProductData || []).filter(
+        (a) => a?.Type === 'C'
+      );
+      if (reorderComboLines?.length > 0) {
+        const reorderComboConsumed = reorderComboLines.reduce(
+          (sum, comboLine) => {
+            const setZero =
+              comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+            if (!setZero) return sum;
+            const details = Array.isArray(comboLine?.ProdDetail)
+              ? comboLine?.ProdDetail
+              : [];
+            const orderQty = parseInt(comboLine?.OrderQty || 1);
+            const consumed = details.reduce((inner, d) => {
+              const nameMatches =
+                d?.ProdName === ProdName || d?.ProductName === ProdName;
+              if (nameMatches && d?.StockAvailable === 'Y') {
+                const compQty = parseInt(d?.ProductQty ?? 1);
+                return inner + orderQty * (isNaN(compQty) ? 1 : compQty);
               }
+              return inner;
+            }, 0);
+            return sum + consumed;
+          },
+          0
+        );
+        totalSelectedProductQty =
+          parseInt(totalSelectedProductQty || 0) +
+          parseInt(reorderComboConsumed || 0);
+      }
+    } catch (_) {}
+    let getCurrentProdDtl = orderDetails?.filter(
+      (a) => a?.ProdName === ProdName
+    );
+    let ComboProdDtl = orderDetails?.filter((a) => a?.Type === 'C');
+    if (overallpcs === 'Y' && ComboProdDtl?.length > 0) {
+      getCurrentProdDtl = getCurrentProdDtl?.filter((a) => a?.Type !== 'C');
+    }
+    let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+      return (
+        accumulator +
+        parseInt(
+          card?.StockAvailable === 'Y'
+            ? card.SinglePc !== 'Y'
+              ? card.OrderQty
+              : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                ? 0
+                : card.OrderQty % card.NoOfPcs === 0
+                  ? Math.floor(card.OrderQty / card.NoOfPcs)
+                  : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+            : 0
+        )
+      );
+    }, 0);
+
+    // Combo adjustment:
+    // If combos (Type === 'C') include this product and that component has SetCount == 0
+    // and StockAvailable === 'Y', treat each occurrence as consuming one unit.
+    if (Array.isArray(ComboProdDtl) && ComboProdDtl.length > 0) {
+      try {
+        const comboExtraQty = ComboProdDtl.reduce((sum, comboLine) => {
+          // Use combo-level SetCount when detail-level SetCount is absent
+          const comboSetCountZero =
+            comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+          if (!comboSetCountZero) return sum;
+          const details = comboLine?.ProdDetail;
+          if (!Array.isArray(details)) return sum;
+          const orderQty = parseInt(comboLine?.OrderQty || 1);
+          const consumed = details.reduce((innerSum, d) => {
+            const nameMatches =
+              d?.ProdName === ProdName || d?.ProductName === ProdName;
+            const stockYes = d?.StockAvailable === 'Y';
+            if (nameMatches && stockYes) {
+              const compQty = parseInt(d?.ProductQty ?? 1);
+              return innerSum + orderQty * (isNaN(compQty) ? 1 : compQty);
             }
-          } catch (error) {
-            console.error('Error fetching payment details: ', error);
-          }
-        }, 3000); // Call the API every 3 seconds
-      };
+            return innerSum;
+          }, 0);
+          return sum + consumed;
+        }, 0);
+        totalOrderQty =
+          parseInt(totalOrderQty || 0) + parseInt(comboExtraQty || 0);
+      } catch (e) {
+        // ignore structure mismatches
+      }
+    }
+    let OverallProdQty = totalOrderQty - totalSelectedProductQty;
+    if (
+      parseInt(currentQty) >
+      parseInt(
+        Object?.keys(ReportholdData)?.length > 0 && totalOrderQty
+          ? OverallProdQty
+          : getCurrentProdDtl
+            ? totalOrderQty
+            : 0
+      )
+    ) {
+      let count =
+        parseInt(currentQty) -
+        parseInt(
+          Object?.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? OverallProdQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        );
 
-      // Call the function to start checking payment status
-      checkPaymentStatus();
+      return parseInt(count);
+    } else {
+      let count = 0;
+      return count;
     }
   };
-  const CustomerDisplayRemovedData = () => {
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedData = {
-        userData: [],
-        ExtraCharges: [],
-        Paymentgateway: false,
-        type: 'remove',
-        keyValue: 'customer',
-      };
-      customerDisplayWindow.postMessage(updatedData, '*');
-      const updatedRemovedData = {
-        type: 'remove',
-        keyValue: 'OrderTotalAmount',
-      };
-      customerDisplayWindow.postMessage(updatedRemovedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
+  const returnOnepcCount = (ProdName, currentQty, orderDetails, overallpcs) => {
+    let SelectedProduct = ReorderProductData?.filter(
+      (a) => a?.ProdName === ProdName
+    );
+    let totalSelectedProductQty = SelectedProduct?.reduce(
+      (accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty * card.NoOfPcs
+                : card.OrderQty
+              : 0
+          )
+        );
+      },
+      0
+    );
+    let getCurrentProdDtl = orderDetails?.filter(
+      (a) => a?.ProdName === ProdName
+    );
+
+    let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+      return (
+        accumulator +
+        parseInt(
+          card?.StockAvailable === 'Y'
+            ? card.SinglePc !== 'Y'
+              ? card.OrderQty * card.NoOfPcs
+              : card.OrderQty
+            : 0
+        )
       );
+    }, 0);
+    let OverallProdQty = totalOrderQty - totalSelectedProductQty;
+    if (
+      parseInt(currentQty) >
+      parseInt(
+        Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+          ? OverallProdQty
+          : getCurrentProdDtl
+            ? totalOrderQty
+            : 0
+      )
+    ) {
+      let count =
+        parseInt(currentQty) -
+        parseInt(
+          Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? OverallProdQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        );
+      return parseInt(count);
+    } else {
+      let count = 0;
+      return count;
     }
   };
-  const CustomerDisplay = (value) => {
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (value == 'TakeAway') {
-      if (customerDisplayWindow && !customerDisplayWindow.closed) {
-        const updatedData = {
-          userData: [],
-          ExtraCharges: [],
-          Paymentgateway: false,
-          upioption1: 'okk',
-          type: 'remove',
-          keyValue: 'customer',
-        };
-        customerDisplayWindow.postMessage(updatedData, '*');
-        const updatedRemovedData = {
-          type: 'remove',
-          keyValue: 'OrderTotalAmount',
-        };
-        customerDisplayWindow.postMessage(updatedRemovedData, '*');
-      } else {
-        console.error(
-          'Customer display window is not available or has been closed.'
+  const returnQtyCount = (ProdId, item, orderDetails) => {
+    if (onePeiceFlow) {
+      let ItemQuantity = item?.ProdVariantDetails?.reduce(
+        (accumulator, card) => {
+          return accumulator + parseInt(card.OverAllPcs || 0);
+        },
+        0
+      );
+      let SelectedProduct = ReorderProductData?.filter(
+        (a) => a?.ProdId === ProdId
+      );
+      let totalSelectedProductQty = SelectedProduct?.reduce(
+        (accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty * card.NoOfPcs
+                  : card.OrderQty
+                : 0
+            )
+          );
+        },
+        0
+      );
+
+      // Include combo consumption from ReorderProductData (pieces flow)
+      try {
+        const reorderComboLines = (ReorderProductData || []).filter(
+          (a) => a?.Type === 'C'
         );
+        if (reorderComboLines?.length > 0) {
+          const reorderComboConsumed = reorderComboLines.reduce(
+            (sum, comboLine) => {
+              const setZero =
+                comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+              if (!setZero) return sum;
+              const details = Array.isArray(comboLine?.ProdDetail)
+                ? comboLine?.ProdDetail
+                : [];
+              const orderQty = parseInt(comboLine?.OrderQty || 1);
+              const consumed = details.reduce((inner, d) => {
+                if (d?.ProdId === ProdId && d?.StockAvailable === 'Y') {
+                  const compQty = parseInt(d?.ProductQty ?? 1);
+                  return inner + orderQty * (isNaN(compQty) ? 1 : compQty);
+                }
+                return inner;
+              }, 0);
+              return sum + consumed;
+            },
+            0
+          );
+          totalSelectedProductQty =
+            parseInt(totalSelectedProductQty || 0) +
+            parseInt(reorderComboConsumed || 0);
+        }
+      } catch (_) {}
+      let getCurrentProdDtl = orderDetails?.filter((a) => a?.ProdId === ProdId);
+      let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty * card.NoOfPcs
+                : card.OrderQty
+              : 0
+          )
+        );
+      }, 0);
+      // Include combo consumption for pieces flow
+      try {
+        const comboLines = orderDetails?.filter((a) => a?.Type === 'C') || [];
+        const comboConsumed = comboLines.reduce((sum, comboLine) => {
+          const comboSetZero =
+            comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+          if (!comboSetZero) return sum;
+          const details = Array.isArray(comboLine?.ProdDetail)
+            ? comboLine?.ProdDetail
+            : [];
+          const orderQty = parseInt(comboLine?.OrderQty || 1);
+          const consumedForThisCombo = details.reduce((inner, d) => {
+            if (d?.ProdId === ProdId && d?.StockAvailable === 'Y') {
+              const compQty = parseInt(d?.ProductQty ?? 1);
+              return inner + orderQty * (isNaN(compQty) ? 1 : compQty);
+            }
+            return inner;
+          }, 0);
+          return sum + consumedForThisCombo;
+        }, 0);
+        totalOrderQty =
+          parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
+      } catch (_) {}
+      let OverallProdQty = totalOrderQty - totalSelectedProductQty;
+      if (
+        parseInt(ItemQuantity) >
+        parseInt(
+          Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? OverallProdQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        )
+      ) {
+        let count =
+          parseInt(ItemQuantity) -
+          parseInt(
+            Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+              ? OverallProdQty
+              : getCurrentProdDtl
+                ? totalOrderQty
+                : 0
+          );
+
+        return parseInt(count);
+      } else {
+        let count = 0;
+        return count;
       }
     } else {
-      if (customerDisplayWindow && !customerDisplayWindow.closed) {
-        const updatedData = {
-          type: 'remove',
-          keyValue: 'customer',
-        };
-        customerDisplayWindow.postMessage(updatedData, '*');
-      } else {
-        console.error(
-          'Customer display window is not available or has been closed.'
+      let ItemQuantity = item?.ProdVariantDetails?.reduce(
+        (accumulator, card) => {
+          return accumulator + parseInt(card.OverAllQty || 0);
+        },
+        0
+      );
+      let SelectedProduct = ReorderProductData?.filter(
+        (a) => a?.ProdId === ProdId
+      );
+      let totalSelectedProductQty = SelectedProduct?.reduce(
+        (accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty
+                  : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                    ? 0
+                    : card.OrderQty % card.NoOfPcs === 0
+                      ? Math.floor(card.OrderQty / card.NoOfPcs)
+                      : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+                : 0
+            )
+          );
+        },
+        0
+      );
+
+      // Include combo consumption from ReorderProductData (quantity flow)
+      try {
+        const reorderComboLines = (ReorderProductData || []).filter(
+          (a) => a?.Type === 'C'
         );
+        if (reorderComboLines?.length > 0) {
+          const reorderComboConsumed = reorderComboLines.reduce(
+            (sum, comboLine) => {
+              const setZero =
+                comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+              if (!setZero) return sum;
+              const details = Array.isArray(comboLine?.ProdDetail)
+                ? comboLine?.ProdDetail
+                : [];
+              const orderQty = parseInt(comboLine?.OrderQty || 1);
+              const consumed = details.reduce((inner, d) => {
+                if (d?.ProdId === ProdId && d?.StockAvailable === 'Y') {
+                  return inner + orderQty;
+                }
+                return inner;
+              }, 0);
+              return sum + consumed;
+            },
+            0
+          );
+          totalSelectedProductQty =
+            parseInt(totalSelectedProductQty || 0) +
+            parseInt(reorderComboConsumed || 0);
+        }
+      } catch (_) {}
+      let getCurrentProdDtl = orderDetails?.filter((a) => a?.ProdId === ProdId);
+      let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty
+                : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                  ? 0
+                  : card.OrderQty % card.NoOfPcs === 0
+                    ? Math.floor(card.OrderQty / card.NoOfPcs)
+                    : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+              : 0
+          )
+        );
+      }, 0);
+      // Include combo consumption for quantity flow
+      try {
+        const comboLines = orderDetails?.filter((a) => a?.Type === 'C') || [];
+        const comboConsumed = comboLines.reduce((sum, comboLine) => {
+          const comboSetZero =
+            comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+          if (!comboSetZero) return sum;
+          const details = Array.isArray(comboLine?.ProdDetail)
+            ? comboLine?.ProdDetail
+            : [];
+          const orderQty = parseInt(comboLine?.OrderQty || 1);
+          const consumedForThisCombo = details.reduce((inner, d) => {
+            if (d?.ProdId === ProdId && d?.StockAvailable === 'Y') {
+              return inner + orderQty;
+            }
+            return inner;
+          }, 0);
+          return sum + consumedForThisCombo;
+        }, 0);
+        totalOrderQty =
+          parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
+      } catch (_) {}
+      let OverallProdQty = totalOrderQty - totalSelectedProductQty;
+      if (
+        parseInt(ItemQuantity) >
+        parseInt(
+          Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? OverallProdQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        )
+      ) {
+        let count =
+          parseInt(ItemQuantity) -
+          parseInt(
+            Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+              ? OverallProdQty
+              : getCurrentProdDtl
+                ? totalOrderQty
+                : 0
+          );
+
+        return parseInt(count);
+      } else {
+        let count = 0;
+        return count;
       }
     }
   };
-  const columns = [
+
+  const returnCountStock = (
+    ProdId,
+    currentQty,
+    orderDetails,
+    InwardDtlId,
+    onepcavailable,
+    overallpcs
+  ) => {
+    if (onepcavailable === 'Y') {
+      let SelectedProduct = ReorderProductData?.filter(
+        (a) => a?.ProdId === ProdId && a?.InwardDtlId === InwardDtlId
+      );
+      let totalSelectedProductQty = SelectedProduct?.reduce(
+        (accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty * card.NoOfPcs
+                  : card.OrderQty
+                : 0
+            )
+          );
+        },
+        0
+      );
+
+      // Include combo consumption from ReorderProductData (pieces + batch)
+      try {
+        const reorderComboLines = (ReorderProductData || []).filter(
+          (a) => a?.Type === 'C'
+        );
+        if (reorderComboLines?.length > 0) {
+          const reorderComboConsumed = reorderComboLines.reduce(
+            (sum, comboLine) => {
+              const setZero =
+                comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+              if (!setZero) return sum;
+              const details = Array.isArray(comboLine?.ProdDetail)
+                ? comboLine?.ProdDetail
+                : [];
+              const orderQty = parseInt(comboLine?.OrderQty || 1);
+              const consumed = details.reduce((inner, d) => {
+                if (
+                  d?.ProdId === ProdId &&
+                  d?.InwardDtlId === InwardDtlId &&
+                  d?.StockAvailable === 'Y'
+                ) {
+                  const compQty = parseInt(d?.ProductQty ?? 1);
+                  return inner + orderQty * (isNaN(compQty) ? 1 : compQty);
+                }
+                return inner;
+              }, 0);
+              return sum + consumed;
+            },
+            0
+          );
+          totalSelectedProductQty =
+            parseInt(totalSelectedProductQty || 0) +
+            parseInt(reorderComboConsumed || 0);
+        }
+      } catch (_) {}
+      let getCurrentProdDtl = orderDetails?.filter(
+        (a) => a?.ProdId === ProdId && a?.InwardDtlId === InwardDtlId
+      );
+      let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty * card.NoOfPcs
+                : card.OrderQty
+              : 0
+          )
+        );
+      }, 0);
+
+      // Include combo consumption (no one-piece logic for combos)
+      try {
+        const comboLines = orderDetails?.filter((a) => a?.Type === 'C') || [];
+        const comboConsumed = comboLines.reduce((sum, comboLine) => {
+          const comboSetZero =
+            comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+          if (!comboSetZero) return sum;
+          const details = Array.isArray(comboLine?.ProdDetail)
+            ? comboLine?.ProdDetail
+            : [];
+          const orderQty = parseInt(comboLine?.OrderQty || 1);
+          const consumedForThisCombo = details.reduce((inner, d) => {
+            if (
+              d?.ProdId === ProdId &&
+              d?.InwardDtlId === InwardDtlId &&
+              d?.StockAvailable === 'Y'
+            ) {
+              const compQty = parseInt(d?.ProductQty ?? 1);
+              return inner + orderQty * (isNaN(compQty) ? 1 : compQty);
+            }
+            return inner;
+          }, 0);
+          return sum + consumedForThisCombo;
+        }, 0);
+        totalOrderQty =
+          parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
+      } catch (_) {}
+
+      let OverallProdQty = totalOrderQty - totalSelectedProductQty;
+      if (
+        parseInt(currentQty) >
+        parseInt(
+          Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? OverallProdQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        )
+      ) {
+        let count =
+          parseInt(currentQty) -
+          parseInt(
+            Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+              ? OverallProdQty
+              : getCurrentProdDtl
+                ? totalOrderQty
+                : 0
+          );
+        return parseInt(count);
+      } else {
+        let count = 0;
+        return count;
+      }
+    } else {
+      let SelectedProduct = ReorderProductData?.filter(
+        (a) => a?.ProdId === ProdId && a?.InwardDtlId === InwardDtlId
+      );
+      let totalSelectedProductQty = SelectedProduct?.reduce(
+        (accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty
+                  : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                    ? 0
+                    : card.OrderQty % card.NoOfPcs === 0
+                      ? Math.floor(card.OrderQty / card.NoOfPcs)
+                      : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+                : 0
+            )
+          );
+        },
+        0
+      );
+
+      // Include combo consumption from ReorderProductData (quantity + batch)
+      try {
+        const reorderComboLines = (ReorderProductData || []).filter(
+          (a) => a?.Type === 'C'
+        );
+        if (reorderComboLines?.length > 0) {
+          const reorderComboConsumed = reorderComboLines.reduce(
+            (sum, comboLine) => {
+              const setZero =
+                comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+              if (!setZero) return sum;
+              const details = Array.isArray(comboLine?.ProdDetail)
+                ? comboLine?.ProdDetail
+                : [];
+              const orderQty = parseInt(comboLine?.OrderQty || 1);
+              const consumed = details.reduce((inner, d) => {
+                if (
+                  d?.ProdId === ProdId &&
+                  d?.InwardDtlId === InwardDtlId &&
+                  d?.StockAvailable === 'Y'
+                ) {
+                  return inner + orderQty;
+                }
+                return inner;
+              }, 0);
+              return sum + consumed;
+            },
+            0
+          );
+          totalSelectedProductQty =
+            parseInt(totalSelectedProductQty || 0) +
+            parseInt(reorderComboConsumed || 0);
+        }
+      } catch (_) {}
+      let getCurrentProdDtl = orderDetails?.filter(
+        (a) => a?.ProdId === ProdId && a?.InwardDtlId === InwardDtlId
+      );
+
+      let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty
+                : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                  ? 0
+                  : card.OrderQty % card.NoOfPcs === 0
+                    ? Math.floor(card.OrderQty / card.NoOfPcs)
+                    : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+              : 0
+          )
+        );
+      }, 0);
+
+      // Include combo consumption for quantity flow
+      try {
+        const comboLines = orderDetails?.filter((a) => a?.Type === 'C') || [];
+        const comboConsumed = comboLines.reduce((sum, comboLine) => {
+          const comboSetZero =
+            comboLine?.SetCount === 0 || comboLine?.SetCount === '0';
+          if (!comboSetZero) return sum;
+          const details = Array.isArray(comboLine?.ProdDetail)
+            ? comboLine?.ProdDetail
+            : [];
+          const orderQty = parseInt(comboLine?.OrderQty || 1);
+          const consumedForThisCombo = details.reduce((inner, d) => {
+            if (
+              d?.ProdId === ProdId &&
+              d?.InwardDtlId === InwardDtlId &&
+              d?.StockAvailable === 'Y'
+            ) {
+              return inner + orderQty;
+            }
+            return inner;
+          }, 0);
+          return sum + consumedForThisCombo;
+        }, 0);
+        totalOrderQty =
+          parseInt(totalOrderQty || 0) + parseInt(comboConsumed || 0);
+      } catch (_) {}
+
+      let OverallProdQty = totalOrderQty - totalSelectedProductQty;
+      if (
+        parseInt(currentQty) >
+        parseInt(
+          Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? OverallProdQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        )
+      ) {
+        let count =
+          parseInt(currentQty) -
+          parseInt(
+            Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+              ? OverallProdQty
+              : getCurrentProdDtl
+                ? totalOrderQty
+                : 0
+          );
+        return parseInt(count);
+      } else {
+        let count = 0;
+        return count;
+      }
+    }
+  };
+
+  const returnVariantStock = (
+    ProdId,
+    currentQty,
+    orderDetails,
+    ProdVariantName
+  ) => {
+    if (onePeiceFlow) {
+      let SelectedProduct = ReorderProductData?.filter(
+        (a) => a?.ProdId === ProdId && a?.ProdVariantName === ProdVariantName
+      );
+      let totalSelectedProductQty = SelectedProduct?.reduce(
+        (accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty * card.NoOfPcs
+                  : card.OrderQty
+                : 0
+            )
+          );
+        },
+        0
+      );
+      let getCurrentProdDtl = orderDetails?.filter(
+        (a) => a?.ProdId === ProdId && a?.ProdVariantName === ProdVariantName
+      );
+      let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty * card.NoOfPcs
+                : card.OrderQty
+              : 0
+          )
+        );
+      }, 0);
+
+      if (
+        parseInt(currentQty) >
+        parseInt(
+          Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? totalOrderQty - totalSelectedProductQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        )
+      ) {
+        let count =
+          parseInt(currentQty) -
+          parseInt(
+            Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+              ? totalOrderQty - totalSelectedProductQty
+              : getCurrentProdDtl
+                ? totalOrderQty
+                : 0
+          );
+        return parseInt(count);
+      } else {
+        let count = 0;
+        return count;
+      }
+    } else {
+      let SelectedProduct = ReorderProductData?.filter(
+        (a) => a?.ProdId === ProdId && a?.ProdVariantName === ProdVariantName
+      );
+      let totalSelectedProductQty = SelectedProduct?.reduce(
+        (accumulator, card) => {
+          return (
+            accumulator +
+            parseInt(
+              card?.StockAvailable === 'Y'
+                ? card.SinglePc !== 'Y'
+                  ? card.OrderQty
+                  : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                    ? 0
+                    : card.OrderQty % card.NoOfPcs === 0
+                      ? Math.floor(card.OrderQty / card.NoOfPcs)
+                      : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+                : 0
+            )
+          );
+        },
+        0
+      );
+      let getCurrentProdDtl = orderDetails?.filter(
+        (a) => a?.ProdId === ProdId && a?.ProdVariantName === ProdVariantName
+      );
+      let totalOrderQty = getCurrentProdDtl?.reduce((accumulator, card) => {
+        return (
+          accumulator +
+          parseInt(
+            card?.StockAvailable === 'Y'
+              ? card.SinglePc !== 'Y'
+                ? card.OrderQty
+                : card.OverAllPcs % card.NoOfPcs >= card.OrderQty
+                  ? 0
+                  : card.OrderQty % card.NoOfPcs === 0
+                    ? Math.floor(card.OrderQty / card.NoOfPcs)
+                    : Math.floor(card.OrderQty / card.NoOfPcs) + 1
+              : 0
+          )
+        );
+      }, 0);
+
+      if (
+        parseInt(currentQty) >
+        parseInt(
+          Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+            ? totalOrderQty - totalSelectedProductQty
+            : getCurrentProdDtl
+              ? totalOrderQty
+              : 0
+        )
+      ) {
+        let count =
+          parseInt(currentQty) -
+          parseInt(
+            Object.keys(ReportholdData)?.length > 0 && totalOrderQty
+              ? totalOrderQty - totalSelectedProductQty
+              : getCurrentProdDtl
+                ? totalOrderQty
+                : 0
+          );
+        return parseInt(count);
+      } else {
+        let count = 0;
+        return count;
+      }
+    }
+  };
+
+  const varientcolumns = [
     {
-      title: 'Sl.No',
-      key: 'sno',
-      align: 'center',
-      width: '100px',
-      render: (text, object, index) => (
-        <a style={{ color: 'black' }}>{index + 1}</a>
+      title: 'Variant Name',
+      dataIndex: 'VarientName',
+      key: 'VarientName',
+      align: 'left',
+      render: (_, record, index) => (
+        <span
+          style={
+            record.StockCount > 0 ||
+            record.StockCount === 'Stock Not Maintained'
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {record.VarientName}
+        </span>
       ),
-    },
-    {
-      title: 'Table Name/Chair Name',
-      dataIndex: 'TableName',
-      key: 'TableName',
-      width: '150px',
-      onCell: (_, record, index) => {
+      onCell: (record) => {
         return {
           onClick: () => {
-            Unpaidfun(record);
+            if (
+              record.StockCount > 0 ||
+              record.StockCount === 'Stock Not Maintained'
+            ) {
+              Stockfun(record);
+            }
           },
         };
       },
     },
     {
-      title: 'Order Id',
-      dataIndex: 'OrderID',
-      key: 'OrderID',
-      width: '150px',
-      align: 'right',
-      onCell: (_, record, index) => {
+      title: 'Stock Count',
+      dataIndex: 'StockCount',
+      key: 'StockCount',
+      align: 'Right',
+      render: (_, record, index) => (
+        <span
+          style={
+            record.StockCount > 0 ||
+            record.StockCount === 'Stock Not Maintained'
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {record.StockCount}
+        </span>
+      ),
+      onCell: (record) => {
         return {
           onClick: () => {
-            Unpaidfun(record);
-          },
-        };
-      },
-    },
-    {
-      title: "Item's",
-      dataIndex: 'ProductName',
-      key: 'ProductName',
-      width: '250px',
-      onCell: (_, record, index) => {
-        return {
-          onClick: () => {
-            Unpaidfun(record);
+            if (
+              record.StockCount > 0 ||
+              record.StockCount === 'Stock Not Maintained'
+            ) {
+              Stockfun(record);
+            }
           },
         };
       },
     },
     {
       title: 'Amount',
-      dataIndex: 'TotalAmount',
-      key: 'TotalAmount',
-      width: '150px',
+      dataIndex: 'Amount',
+      key: 'Amount',
       align: 'right',
-      render: (text) => <span>{safeRound(text)}</span>,
-      onCell: (_, record, index) => {
+      render: (_, record, index) => (
+        <span
+          style={
+            record.StockCount > 0 ||
+            record.StockCount === 'Stock Not Maintained'
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {record.Amount}
+        </span>
+      ),
+      onCell: (record) => {
         return {
           onClick: () => {
-            Unpaidfun(record);
+            if (
+              record.StockCount > 0 ||
+              record.StockCount === 'Stock Not Maintained'
+            ) {
+              Stockfun(record);
+            }
           },
         };
       },
     },
   ];
+  const stockcolumns = [
+    {
+      title: 'Batch No',
+      dataIndex: 'Batch No',
+      key: 'Batch No',
+      align: 'center',
+      render: (text, record, index) => (
+        <span
+          style={
+            record.StockCount > 0
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {record?.['Batch No']}
+        </span>
+      ),
+      onCell: (record) => {
+        return {
+          onClick: () => {
+            if (record.StockCount > 0) {
+              StockSelected(record);
+            }
+          },
+        };
+      },
+    },
+    {
+      title: 'Stock Count',
+      dataIndex: 'StockCount',
+      key: 'StockCount',
+      align: 'center',
+      render: (_, record, index) => (
+        <span
+          style={
+            record.StockCount > 0
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {record.StockCount}
+        </span>
+      ),
+      onCell: (record) => {
+        return {
+          onClick: () => {
+            if (record.StockCount > 0) {
+              StockSelected(record);
+            }
+          },
+        };
+      },
+    },
+    {
+      title: 'Stock Date',
+      dataIndex: 'Stock Date',
+      key: 'Stock Date',
+      align: 'center',
+      render: (_, record, index) => (
+        <span
+          style={
+            record.StockCount > 0
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {record?.['Stock Date']}
+        </span>
+      ),
+      onCell: (record) => {
+        return {
+          onClick: () => {
+            if (record.StockCount > 0) {
+              StockSelected(record);
+            }
+          },
+        };
+      },
+    },
+    {
+      title: 'Exp Date',
+      dataIndex: 'ExpDate',
+      key: 'ExpDate',
+      align: 'center',
+      render: (_, record, index) => (
+        <span
+          style={
+            record.StockCount > 0
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {record.ExpDate}
+        </span>
+      ),
+      onCell: (record) => {
+        return {
+          onClick: () => {
+            if (record.StockCount > 0) {
+              StockSelected(record);
+            }
+          },
+        };
+      },
+    },
+    {
+      title: 'Price',
+      dataIndex: 'Price',
+      key: 'Price',
+      align: 'center',
+      render: (_, record, index) => (
+        <span
+          style={
+            record.StockCount > 0
+              ? { color: '#000', cursor: 'pointer' }
+              : { color: '#f49898', cursor: 'not-allowed' }
+          }
+        >
+          {safeRound(record.Price)}
+        </span>
+      ),
+      onCell: (record) => {
+        return {
+          onClick: () => {
+            if (record.StockCount > 0) {
+              StockSelected(record);
+            }
+          },
+        };
+      },
+    },
+  ];
+  const qtydataSource = [];
 
-  const TableData = [];
-  tabledata?.map((item) =>
-    TableData.push({
-      TableName: item.SalesTableLinkDetails?.map((item) =>
-        item.ChairName == null ? item.TableName : item.ChairName
-      )?.join(','),
-      OrderID: extractLastNumberOrderId(item?.OrderId, item?.FYStatus),
-      ProductName: item.productDetails
-        ?.map(
-          (item) =>
-            item?.ProdName +
-            '-' +
-            (item?.Type != 'C' ? item?.OrderQty : '1 Combo')
+  qtydata?.ProductDetail?.map((item, index) => {
+    qtydataSource.push({
+      key: index,
+      Quantity: item?.Size + ' ' + item?.UomName,
+      Amount: item?.ProdVariantDetails?.[0]?.StockDetails?.[0]?.SellPrice,
+    });
+  });
+  const varientdataSource = [];
+  qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.map((item, index) => {
+    varientdataSource.push({
+      key: index,
+      VarientName: item?.ProdVariantName,
+      Amount: onePeiceFlow
+        ? item?.StockDetails?.[0]?.OnePcsPrice
+        : item?.StockDetails?.[0]?.SellPrice,
+      StockCount:
+        qtydata?.ProductDetail?.[QtyIndex]?.StockAvailable === 'Y'
+          ? onePeiceFlow
+            ? returnVariantStock(
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdId,
+                item?.OverAllPcs,
+                CartOrderDetails,
+                item?.ProdVariantName
+              )
+            : returnVariantStock(
+                qtydata?.ProductDetail?.[QtyIndex]?.ProdId,
+                item?.OverAllQty,
+                CartOrderDetails,
+                item?.ProdVariantName
+              )
+          : 'Stock Not Maintained',
+      VariantAvailableFrom: item?.AvailableFrom,
+      VariantAvailableTo: item?.AvailableTo,
+      SlotStatus: item?.StockDetails?.[0]?.SlotStatus,
+      InwardDtlId: item?.StockDetails?.[0]?.InwardDtlId,
+      BookedDate: selectedDate,
+      BookedQty: item?.StockDetails?.[0]?.BookedQty,
+      TotalSlotQty: item?.StockDetails?.[0]?.TotalSlotQty,
+    });
+  });
+
+  const stockdataSource = [];
+  qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[
+    VarientIndex
+  ]?.StockDetails?.map((item, index) => {
+    const expDate = new Date(item?.ExpDate);
+    stockdataSource.push({
+      key: index,
+      'Batch No': item?.BatchRef,
+      StockCount: onePeiceFlow
+        ? returnCountStock(
+            item?.ProdId,
+            item?.OverAllPcs,
+            CartOrderDetails,
+            item?.InwardDtlId,
+            'Y'
+          )
+        : returnCountStock(
+            item?.ProdId,
+            item?.BalanceQty,
+            CartOrderDetails,
+            item?.InwardDtlId,
+            'N',
+            item?.OverAllPcs
+          ),
+      'Stock Date': ExtractDateFormate(item?.InwardDate),
+      Price: onePeiceFlow ? item?.OnePcsPrice : item?.SellPrice,
+      ExpDate:
+        expDate != 'Invalid Date' || null || undefined || ''
+          ? ExtractDateFormate(item?.ExpDate)
+          : '-',
+    });
+  });
+
+  const extractProductDetails = (a, QtyIndex, VarientIndex, stockIndex) => {
+    const detail = a?.ProductDetail?.[QtyIndex];
+    const variant = detail?.ProdVariantDetails?.[VarientIndex];
+    const stock = variant?.StockDetails?.[stockIndex];
+
+    return { detail, variant, stock };
+  };
+
+  const buildOrderData = (
+    a,
+    detail,
+    variant,
+    stock,
+    size,
+    orderRate,
+    onePcs,
+    weightscale
+  ) => {
+    const { ProdCat, Type, OverAllQty: OverallQuantity, CounterName } = a || {};
+    const {
+      ActiveStatus,
+      AvailableFrom,
+      AvailableTo,
+      Cess,
+      HSNCode,
+      BrandName,
+      OpeningQty,
+      PartNumber,
+      ProdId,
+      ProdLogo,
+      ProdName,
+      QRCode,
+      QtyBasedPrice,
+      Rack,
+      StockAvailable,
+      TokenAvailable,
+      TaxId,
+      TaxPercentage,
+      TaxIdName: TaxName,
+      UniqueId,
+      UomName,
+      DiscountLimitType,
+      DiscountLimit,
+    } = detail || {};
+
+    const {
+      NoOfPcs,
+      BalanceQty,
+      BatchRef,
+      ModelNumber,
+      ProductIdentifierDtls: FullProductIdentifierDtls,
+      InwardDate,
+      InwardDtlId,
+      ExpDate,
+      InwardId,
+      MRP,
+      OnePcsPrice,
+      SellPrice,
+      SuppId,
+      SuppName,
+      OverAllPcs,
+      OfferPrice: Offer,
+      TotalSlotQty,
+      BookedQty,
+    } = stock || {};
+    const BalanceBookedQty = TotalSlotQty || 0 - BookedQty || 0;
+
+    const {
+      ProdVariantName,
+      AvailableFrom: VariantAvailableFrom,
+      AvailableTo: VariantAvailableTo,
+    } = variant || {};
+
+    return {
+      ProdCat,
+      Type,
+      OverallQuantity,
+      ActiveStatus,
+      AvailableFrom,
+      AvailableTo,
+      Cess,
+      HSNCode,
+      BrandName,
+      OpeningQty,
+      PartNumber,
+      ProdId,
+      ProdLogo,
+      ProdName,
+      QRCode,
+      QtyBasedPrice,
+      Rack,
+      Size: size,
+      StockAvailable,
+      TokenAvailable,
+      TaxId,
+      TaxPercentage,
+      TaxName,
+      UniqueId,
+      UomName: onePcs ? 'PCS' : UomName,
+      SinglePc: onePcs ? 'Y' : 'N',
+      NoOfPcs,
+      ProdVariantName,
+      VariantAvailableFrom,
+      VariantAvailableTo,
+      BalanceQty,
+      BatchRef,
+      ModelNumber,
+      FullProductIdentifierDtls,
+      InwardDate,
+      InwardDtlId,
+      ExpDate,
+      InwardId,
+      MRP: onePcs ? OnePcsPrice : MRP,
+      OrderRate: orderRate,
+      SellingPrice: orderRate,
+      SuppId,
+      SuppName,
+      OverAllPcs,
+      Offer,
+      BookingTypeName: BookingType,
+      CounterName,
+      DiscountLimitType,
+      DiscountLimit,
+      BookedDate: selectedDate,
+      BalanceBookedQty,
+      ScaleType: weightscale ? weightscale : '',
+    };
+  };
+
+  const resetProductModal = () => {
+    setModelQty(false);
+    setSelectedBrand('Others');
+    setModalVarient(false);
+    setModelstock(false);
+    setQtyIndex(0);
+    setVarientIndex(0);
+    setVarItem(0);
+    setItem();
+    setStockItem();
+    dispatch(changeSearchedData(''));
+    setOnePeiceFlow(false);
+  };
+
+  const dataTransfer = async (
+    a,
+    QtyIndex,
+    VarientIndex,
+    stockIndex,
+    onePcs
+  ) => {
+    const { detail, variant, stock } = extractProductDetails(
+      a,
+      QtyIndex,
+      VarientIndex,
+      stockIndex
+    );
+
+    console.log(stock, 'stock in dataTransfer');
+    // mohan 05-08-2025
+    const price = onePcs
+      ? stock?.OnePcsPrice
+      : RetailWSSalesType === 'W'
+        ? stock?.WhSalePrice || stock?.SellPrice
+        : stock?.SellPrice;
+    const size = onePcs ? '1' : detail?.Size;
+    if (quickBranchtoBranchTransfer) {
+      const data = buildOrderData(
+        a,
+        detail,
+        variant,
+        stock,
+        size,
+        price,
+        onePcs
+      );
+      if (!selectedProducts?.some((s) => s.ProdId === detail?.ProdId)) {
+        dispatch(
+          changeBtoBQuickProductTransfer({
+            action: quickBranchtoBranchTransfer,
+            selectedProducts: [
+              ...selectedProducts,
+              {
+                ...data,
+                OrderQty: 1,
+                TotalAmt: parseFloat(detail?.OrderRate).toFixed(2),
+              },
+            ],
+          })
+        );
+      } else {
+        setMessageType('error');
+        setMessageData('Product already added');
+      }
+    } else {
+      const isKgsProduct =
+        (detail?.UomName?.toLowerCase() === 'kgs' ||
+          detail?.UomName?.toLowerCase() === 'kg') &&
+        detail?.Size === '1';
+      console.log(
+        isKgsProduct,
+        WeightScalePort,
+        WeightScaleWeight,
+        'isKgsProduct'
+      );
+      if (
+        WeightScalePort === true &&
+        isKgsProduct &&
+        WeightScaleWeight > 0.005 &&
+        WeightScaleWeight !== null
+      ) {
+        let weightscale = 'weight';
+        // if (isKgsProduct) {
+        // if (WeightScaleWeight > 0 && WeightScaleWeight !== null) {
+        const basePrice = onePcs ? stock?.OnePcsPrice : stock?.SellPrice;
+        const totalRate = (
+          (basePrice / 1000) *
+          (parseFloat(WeightScaleWeight) * 1000)
+        ).toFixed(2);
+        let orderqty = parseFloat(WeightScaleWeight);
+        const data = buildOrderData(
+          a,
+          detail,
+          variant,
+          stock,
+          detail?.Size,
+          basePrice,
+          onePcs,
+          weightscale
+        );
+        let fulldata = {
+          ...data,
+          OrderQty: orderqty,
+        };
+
+        await AddOrderDetails(fulldata);
+        // dispatch(changeWeightScaleWeight(null));
+        setRepeatedModel(false);
+        setProdexpir(false);
+        resetProductModal();
+      } else {
+        const isValidPcs =
+          onePcs && stock?.NoOfPcs > 0 && stock?.OnePcsPrice > 0;
+        const allowNonPcs =
+          !onePcs ||
+          (detail?.StockAvailable !== 'Y' && onePcs && stock?.OnePcsPrice > 0);
+
+        if (isValidPcs || allowNonPcs) {
+          const data = buildOrderData(
+            a,
+            detail,
+            variant,
+            stock,
+            size,
+            price,
+            onePcs
+          );
+
+          resetProductModal();
+          AddOrderDetails(data);
+        } else {
+          setMessageType('error');
+          setMessageData(
+            'Please add No.of pieces Inside the box in Product master'
+          );
+          resetProductModal();
+        }
+      }
+    }
+  };
+
+  useEffect(() => {
+    setPreOrderSelectedProdNames(GPreOrderList);
+  }, [GPreOrderList]);
+
+  const pickData = (e, item) => {
+    if (e.target.checked === true) {
+      setSelectedProdNames([
+        ...globalAllItemdata,
+        {
+          ProdName: item.ProdName,
+          ProdId: item.ProductDetail?.[0]?.ProdId,
+          ProdCat: item.ProdCat,
+          ProdCatName: item.ProdCatName,
+        },
+      ]);
+    } else {
+      console.log('SelectedProdNames', SelectedProdNames);
+      setSelectedProdNames(
+        SelectedProdNames?.filter(
+          (data) =>
+            !(data?.ProdName == item.ProdName && data?.ProdCat == item.ProdCat)
         )
-        ?.join(','),
-      TotalAmount: item.NetAmount,
+      );
+    }
+  };
+
+  const handleQuickCancel = async () => {
+    setQuickAdd(false);
+    dispatch(changeSearchedData(''));
+
+    // Base data for all calls
+    let baseData = {
+      CompId,
+      BranchId,
+      AppId,
+    };
+
+    // 👇 Only add date if AvailableDate and selectedDate exist
+    if (AvailableDate && selectedDate) {
+      baseData.Date = selectedDate;
+    }
+    // 1️⃣ Favourite items
+    await dispatch(getSelectedFavItems(baseData)).unwrap();
+
+    // 2️⃣ For layout with SubCategory
+    let data1 = {
+      ...baseData,
+      ProdSubCat,
+    };
+
+    // 3️⃣ For layout without SubCategory
+    let data2 = {
+      compId: CompId,
+      branchId: BranchId,
+      appId: AppId,
+      prodCat: ProdCat,
+      ...(AvailableDate && selectedDate ? { date: selectedDate } : {}), // conditionally add
+    };
+
+    if (
+      templateData?.BookingLayout?.[1]?.some(
+        (item) => item?.OptionName === 'SubCategory'
+      ) &&
+      ProdSubCat
+    ) {
+      await dispatch(getLayoutproductCard(data1)).unwrap();
+    } else if (
+      !templateData?.BookingLayout?.[1]?.some(
+        (item) => item?.OptionName === 'SubCategory'
+      )
+    ) {
+      await dispatch(getCardDataWithoutSubmodule(data2)).unwrap();
+    } else {
+      await dispatch(getCardDataWithoutSub(data2)).unwrap();
+    }
+  };
+
+  const onComplete = useCallback(() => {
+    setMessageData(null);
+    setMessageType(null);
+  }, []);
+
+  const expFun = (item) => {
+    console.log(item, 'itemitemitemitemitemitemitemitem');
+    let count = item?.ProductDetail?.length;
+    if (count > 1) {
+      Quantity();
+    } else {
+      setVarItem(0);
+      SingleQuantity(item, onePeiceFlow);
+    }
+
+    closeExpireModal();
+    setProdexpir(true);
+    setQtydata(item);
+  };
+  let brandMapping = {};
+  // Group product details by Brand ID
+  qtydata?.ProductDetail?.forEach((item) => {
+    const brandId = item?.BrandName;
+    if (!brandMapping[brandId]) {
+      brandMapping[brandId] = [];
+    }
+    brandMapping[brandId].push(item);
+  });
+  const BrandCheckresult = qtydata?.ProductDetail?.every((product) => {
+    return product.BrandName === null || product.BrandName === undefined;
+  });
+  const ItemSellingPrice = (item) => {
+    // const variantWithDetails = item?.ProductDetail?.find((variant) => variant?.ProdVariantDetails?.length > 0);
+
+    if (preferenceSingleSales && item.OnePcsAvailable === 'Y') {
+      return (
+        item?.ProductDetail?.[0]?.ProdVariantDetails?.[0]?.StockDetails?.[0]
+          ?.OnePcsPrice || null
+      );
+      //  OnePcsPrice
+    }
+
+    const variantWithDetails = item?.ProductDetail?.find(
+      (variant) =>
+        variant?.ProdVariantDetails?.length > 0 &&
+        variant?.ProdVariantDetails?.[0]?.StockDetails?.[0]?.SellPrice
+    );
+    if (variantWithDetails) {
+      // Access the details of the first variant with ProdVariantDetails
+      const firstVariantDetails =
+        variantWithDetails?.ProdVariantDetails?.[0]?.StockDetails?.[0]
+          ?.SellPrice;
+      return firstVariantDetails;
+    } else {
+      // Handle the case where no variant satisfies the condition
+      return null; // or any other value you want to return
+    }
+  };
+
+  const ItemSize = (item) => {
+    if (preferenceSingleSales && item?.OnePcsAvailable === 'Y') {
+      return 1;
+    }
+    const variantWithDetails = item?.ProductDetail?.find(
+      (variant) => variant?.ProdVariantDetails?.length > 0
+    );
+
+    if (variantWithDetails) {
+      // Access the details of the first variant with ProdVariantDetails
+      const firstVariantDetails = variantWithDetails?.Size;
+      return firstVariantDetails;
+    } else {
+      // Handle the case where no variant satisfies the condition
+      return null; // or any other value you want to return
+    }
+  };
+  const ItemUomName = (item) => {
+    if (preferenceSingleSales && item?.OnePcsAvailable === 'Y') {
+      return 'PCS';
+    }
+    const variantWithDetails = item?.ProductDetail?.find(
+      (variant) => variant?.ProdVariantDetails?.length > 0
+    );
+
+    if (variantWithDetails) {
+      // Access the details of the first variant with ProdVariantDetails
+      const firstVariantDetails = variantWithDetails?.UomName;
+      return firstVariantDetails;
+    } else {
+      // Handle the case where no variant satisfies the condition
+      return null; // or any other value you want to return
+    }
+  };
+  const expQtyFun = (index) => {
+    const selectedProIndex = qtydata?.ProductDetail?.findIndex(
+      (item) =>
+        item?.ProdId === index?.ProdId &&
+        item?.Size === index?.Size &&
+        item?.UomName === index?.UomName &&
+        item?.Brand === index?.Brand
+    );
+
+    if (selectedProIndex !== -1) {
+      const count =
+        qtydata?.ProductDetail[selectedProIndex]?.ProdVariantDetails?.length ||
+        0;
+
+      if (count > 1) {
+        setModelQty(false);
+        setSelectedBrand('Others');
+        setModalVarient(true);
+      } else {
+        const item = { QtyIndex: selectedProIndex, VarientIndex: 0 };
+        singleVarient(item);
+        setModelQty(false);
+        setSelectedBrand('Others');
+      }
+    }
+
+    setQtyIndex(selectedProIndex);
+    setRepeatedModel(true);
+    closeExpireModal();
+  };
+
+  const expVerFun = (item) => {
+    let count =
+      qtydata?.ProductDetail?.[QtyIndex]?.ProdVariantDetails?.[item]
+        ?.StockDetails?.length;
+    if (count > 1) {
+      setRepeatedModel(true);
+      setModalVarient(false);
+      setModelstock(true);
+    } else {
+      setRepeatedModel(true);
+      dataTransfer(qtydata, QtyIndex, item, 0, onePeiceFlow);
+      setModelQty(false);
+      setSelectedBrand('Others');
+    }
+    closeExpireModal();
+  };
+
+  const expStockFun = (item) => {
+    dataTransfer(qtydata, QtyIndex, VarientIndex, item, onePeiceFlow);
+    closeExpireModal();
+  };
+
+  const getMaxBrandWidth = () => {
+    let maxBrandDataLength = 0;
+
+    // Iterate through each brand and find the maximum length of the specified key
+    Object.values(brandMapping).forEach((brand) => {
+      const keyDataLength = brand.length;
+      if (keyDataLength > maxBrandDataLength) {
+        maxBrandDataLength = keyDataLength;
+      }
+    });
+
+    // Set your width logic here based on the maxBrandDataLength
+    const maxWidth = maxBrandDataLength >= 5 ? 750 : 'max-content';
+
+    return maxWidth;
+  };
+
+  useEffect(() => {
+    function handleResize() {
+      setScreenWidth(window.innerWidth);
+    }
+
+    window.addEventListener('resize', handleResize);
+
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, []);
+
+  // Example usage for checking the length of 'ProdVariantDetails'
+  const widthBasedOnProdVariantDetails = getMaxBrandWidth();
+  const ExpDate = useSelector(GlobalExpDateforHeight);
+  let containerHeight = '';
+
+  if (templateData?.BookingLayout?.[0] === 'Layout1') {
+    if (templateData?.BookingBilling?.[0] == 'Billing1') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing2') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 300}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing3') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 340}px`
+            : '63vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 350}px`
+            : '62vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing4') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 300}px`
+            : '63vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '62vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing5') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 300}px`
+            : '60vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '59vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing6') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 300}px`
+            : '60vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '59vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing7') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 300}px`
+            : '60vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '59vh'
+        : '76vh';
+    }
+  } else if (templateData?.BookingLayout?.[0] === 'Layout2') {
+    if (templateData?.BookingBilling?.[0] == 'Billing1') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '60vh'
+        : '74vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing2') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '60vh'
+        : '74vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing3') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '63vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '62vh'
+        : '74vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing4') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '63vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '62vh'
+        : '74vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing5') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '60vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '61vh'
+        : '74vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing6') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '60vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '59vh'
+        : '74vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing7') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 310}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '60vh'
+        : '75vh';
+    }
+  } else if (templateData?.BookingLayout?.[0] === 'Layout3') {
+    if (templateData?.BookingBilling?.[0] == 'Billing1') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 390}px`
+            : '58vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 400}px`
+            : '57vh'
+        : '73vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing2') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 390}px`
+            : '57vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 400}px`
+            : '56vh'
+        : '73vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing3') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 395}px`
+            : '57vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 400}px`
+            : '56vh'
+        : '73vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing4') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 390}px`
+            : '57vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 400}px`
+            : '56vh'
+        : '75vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing5') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 385}px`
+            : '57vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 395}px`
+            : '56vh'
+        : '72vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing6') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 385}px`
+            : '57vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 395}px`
+            : '56vh'
+        : '72vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing7') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 390}px`
+            : '57vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 400}px`
+            : '56vh'
+        : '72vh';
+    }
+  } else if (templateData?.BookingLayout?.[0] === 'Layout4') {
+    if (templateData?.BookingBilling?.[0] == 'Billing1') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '73vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '72vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing2') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 220}px`
+            : '73vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 230}px`
+            : '72vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing3') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '73vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '72vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing4') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 230}px`
+            : '73vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 240}px`
+            : '72vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing5') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 230}px`
+            : '73vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 240}px`
+            : '72vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing6') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '73vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '72vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing7') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '73vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '72vh'
+        : '88vh';
+    }
+  } else if (templateData?.BookingLayout?.[0] === 'Layout5') {
+    if (templateData?.BookingBilling?.[0] == 'Billing1') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 280}px`
+            : '72vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 290}px`
+            : '70vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing2') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '72vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '70vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing3') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '72vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 280}px`
+            : '70vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing4') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '72vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 280}px`
+            : '70vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing5') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '72vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '70vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing6') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '72vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '70vh'
+        : '88vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing7') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 270}px`
+            : '72vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 280}px`
+            : '70vh'
+        : '88vh';
+    }
+  } else if (templateData?.BookingLayout?.[0] === 'Layout6') {
+    if (templateData?.BookingBilling?.[0] == 'Billing1') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 340}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing2') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 260}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 370}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing3') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing4') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing5') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 290}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 300}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing6') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 320}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 330}px`
+            : '60vh'
+        : '76vh';
+    } else if (templateData?.BookingBilling?.[0] == 'Billing7') {
+      containerHeight = isMobile
+        ? ExpDate >= 7
+          ? screenWidth < 600
+            ? `${props?.screenHeight - 280}px`
+            : '61vh'
+          : screenWidth < 600
+            ? `${props?.screenHeight - 290}px`
+            : '60vh'
+        : '76vh';
+    }
+  }
+
+  //new
+  const [draggableCardData, setDraggableCardData] = useState([]);
+  useEffect(() => {
+    if (Array.isArray(cardData)) {
+      const withIds = cardData.map((item, idx) => ({
+        ...item,
+        id: item?.ProductDetail?.[0]?.ProdName + '-' + idx,
+      }));
+      setDraggableCardData(withIds);
+    }
+  }, [cardData, alphabeticFormat]);
+
+  const sensors = useSensors(
+    useSensor(PointerSensor, {
+      activationConstraint: {
+        distance: isMobile ? 5 : 8, // <- reduced distance for mobile
+      },
+    }),
+    useSensor(TouchSensor, {
+      activationConstraint: {
+        delay: isMobile ? 50 : 100, // <- even faster response for mobile
+        tolerance: isMobile ? 10 : 8, // <- more tolerance for mobile touch
+      },
     })
   );
 
-  const Unpaidfun = async (event) => {
-    const UpdatedData = tabledata?.[event]?.productDetails;
-    dispatch(changeunpaidflow(true));
-    if (
-      OrderCardDetail?.length > 0 &&
-      (BookingType === 'Dine In' || BookingTypeBoth)
-    ) {
-      if (OfferCheckedInSetup && preferenceOffer) {
-        await applyOffer([]);
-      } else {
-        dispatch(changeOrderCardDetails([]));
-      }
-      // await dispatch(changeOrderCardDetails([]))
-      // await dispatch(changeOrderCardDetails(tabledata?.[event]?.productDetails))
-      // await dispatch(ChangeTotalAmount(tabledata?.[event]?.ExtraChargeDetails))
-      // await dispatch(changeUnpaidData(true))
-      // await dispatch(changeReorderHoldDetails([tabledata?.[event]]?.[0]));
-      // await dispatch(changeReorderProductDetails(tabledata?.[event]?.productDetails))
-      // setUnpaidOpen(false)
-      setUnpaidConfirmation(true);
-      setunpaidselectedindex(event);
-    } else {
-      if (OfferCheckedInSetup && preferenceOffer) {
-        await applyOffer(UpdatedData);
-      } else {
-        dispatch(changeOrderCardDetails(UpdatedData));
-      }
-      dispatch(changeReorderHoldDetails([tabledata?.[event]]?.[0]));
-      await dispatch(
-        changeReorderProductDetails(tabledata?.[event]?.productDetails)
-      );
-      dispatch(ChangeTotalAmount(tabledata?.[event]?.ExtraChargeDetails));
-      setUnpaidOpen(false);
+  const handleDragEnd = (event) => {
+    const { active, over } = event;
+
+    // Ensure `over` is not null
+    if (!over) return;
+
+    if (active.id !== over.id) {
+      const oldIndex = draggableCardData.findIndex((i) => i.id === active.id);
+      const newIndex = draggableCardData.findIndex((i) => i.id === over.id);
+
+      const updatedData = arrayMove(draggableCardData, oldIndex, newIndex);
+
+      setDraggableCardData(updatedData);
+
+      dispatch(changeCardData(updatedData));
     }
   };
 
-  const UnpaidOk = async () => {
-    setOrderStatus(false);
-    await dispatch(changeSelectedTableDetails([]));
-    await dispatch(changeSelectTable([]));
-    await dispatch(changeSelectChair([]));
-    await dispatch(changeBookingType('TakeAway'));
-    await dispatch(
-      changeOrderCardDetails(tabledata?.[unpaidselectedindex]?.productDetails)
-    );
-    await dispatch(
-      changeReorderProductDetails(
-        tabledata?.[unpaidselectedindex]?.productDetails
-      )
-    );
-    await dispatch(
-      changeReorderHoldDetails([tabledata?.[unpaidselectedindex]]?.[0])
-    );
-    await dispatch(
-      ChangeTotalAmount(tabledata?.[unpaidselectedindex]?.ExtraChargeDetails)
-    );
-    await dispatch(changeUnpaidData(true));
-    setUnpaidOpen(false);
-    setUnpaidConfirmation(false);
-  };
-  const Unpaidclose = async () => {
-    dispatch(changeunpaidflow(false));
-    setUnpaidOpen(false);
-    setUnpaidConfirmation(false);
-  };
+  const updateScrollButtons = () => {
+    const container = scrollContainerRef.current;
+    if (!container) return;
 
-  const Recipt = async () => {
-    AddBookingDetails('Unpaid', false);
-  };
-  const navigateDineIn = async () => {
-    navigate(`${subDirectory}sales/dine-in`);
-    await dispatch(changeBookingType('Dine In'));
-    await dispatch(changeEstimateBooking('Sales'));
-    if (OrderType === 'Hold') {
-      await dispatch(changeReorderHoldDetails({}));
-      await dispatch(changeReorderProductDetails([]));
+    const { scrollLeft, scrollWidth, clientWidth } = container;
 
-      if (OfferCheckedInSetup && preferenceOffer) {
-        await applyOffer([]);
-      } else {
-        dispatch(changeOrderCardDetails([]));
-      }
-    }
+    console.log(
+      container,
+      'sl:',
+      scrollLeft,
+      'w:',
+      scrollWidth,
+      'cw:',
+      clientWidth
+    );
+
+    setShowLeftButton(scrollLeft > 5);
+    setShowRightButton(scrollLeft + clientWidth < scrollWidth - 5);
   };
 
   useEffect(() => {
-    if (ReprintModal === true) {
-      setReprint1(false);
-    }
-  }, [ReprintModal]);
-  const handleReprint = () => {
-    // setReprint1(true)
-    window.dispatchEvent(new Event('CLICK REPRINT'));
-  };
-  const handleReprintCancel = () => {
-    setReprint1(false);
-  };
-  const today = new Date();
-  const year = today.getFullYear();
-  // Note: Months are zero-based, so we add 1 to get the actual month
-  const month = today.getMonth() + 1;
-  const day = today.getDate();
+    const container = scrollContainerRef.current;
+    if (!container) return;
 
-  // Creating a formatted date string (in the format YYYY-MM-DD)
-  const Todaydate = `${day < 10 ? '0' : ''}${day}-${month < 10 ? '0' : ''}${month}-${year}`;
-  const OrderId = PrintOrderDetails?.[0]?.OrderDetails?.[0]?.OrderId;
-  let MobileNo = selOption?.value;
-  useEffect(() => {
-    if (selOption) {
-      closePrintOption();
-      setMobileNoWhatsApp(selOption);
-    }
-  }, [selOption]);
-  const UpiPayment = () => {
-    if (OrderStatus) {
-      AddBookingDetails('Dine-In', false);
-    } else {
-      if (SelectedUpiOption && TotalAmount == 0) {
-        Upimodel('Submit');
-      } else if (SelectedUpiOption) {
-        setUpiOpen(true);
-        const customerDisplayWindow = getCustomerDisplayWindow();
-        if (customerDisplayWindow && !customerDisplayWindow.closed) {
-          const updatedData = {
-            OrderTotalAmount: TotalAmount,
-          };
-          customerDisplayWindow.postMessage(updatedData, '*');
-        } else {
-          console.error(
-            'Customer display window is not available or has been closed.'
-          );
-        }
-      } else {
-        setUpinotSelected(true);
-        setMessageType('error');
-        setMessageData('Please Select Upi Option');
-      }
-    }
-  };
+    // ✅ Call once after layout
+    requestAnimationFrame(() => {
+      updateScrollButtons();
+    });
 
-  const onFinalSubmit = async () => {
-    let url = `${MainHomeUrl}payment-page?amt=${TotalAmount}&Id=${MobileNo}&cus=${SelCustId} &CusN=${selOption?.CustName}&Br=${brachName}`;
-    let response = await dispatch(SendPaymentLink({ MobileNo, url })).unwrap();
-    if (response?.data?.statusCode === 1) {
-      setMessageType('success');
-      setMessageData('Link Sent Successfully');
-    }
-  };
-  const Upimodel = (type) => {
-    setUpiOpen(false);
-    if (type == 'Submit') {
-      AddBookingDetails(BookingType, true);
-    }
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedRemovedData = {
-        type: 'remove',
-        keyValue: 'OrderTotalAmount',
-      };
-      customerDisplayWindow.postMessage(updatedRemovedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
-      );
-    }
-  };
-  const CreditCustomerHAndleCancel = async () => {
-    setcreditCustomerOpen(false);
-    await dispatch(changeCreditFocus(false));
-  };
+    container.addEventListener('scroll', updateScrollButtons);
+    window.addEventListener('resize', updateScrollButtons);
 
-  const CreditCustomerFun = async () => {
-    if (
-      OrderCardDetail?.length === 0 &&
-      (selOption?.value !== undefined ||
-        GlobalAddCustomerDetails1.length > 0 ||
-        GetCustId.CustMobile !== undefined)
-    ) {
-      setcreditCustomerOpen(true);
-      await dispatch(changeCreditFocus(true));
-    } else {
-      if (selOption?.value == undefined) {
-        setMessageType('warning');
-        setMessageData('Please Select the Customer');
-      }
-    }
-  };
-  const changeOrderStatus = () => {
-    setOrderStatus(!OrderStatus);
-    setPaybtnnameselected(PaymentOptionsModeName);
-    setPaybtnselected(PaymentOptionsModeId);
-  };
-  // split payments
-  const SplitPaymentOpen = () => {
-    if (OrderCardDetail?.length > 0) {
-      const updatedData = {
-        userData: OrderCardDetail,
-        ExtraCharges: GlobalExtraCharge,
-        customer: selOption != null ? selOption : GetCustId,
-        Paymentgateway: false,
-      };
-      setFailedOrderData(updatedData);
-      setSplitpayment(true);
-    } else {
-      setMessageType('warning');
-      setMessageData('Please Select the Product');
-    }
-  };
+    const resizeObserver = new ResizeObserver(updateScrollButtons);
+    resizeObserver.observe(container);
 
-  const handlePopoverVisibleChangeCard = (visible) => {
-    setCardOptionOpen(visible);
-  };
-
-  const handlesplitpaymentclose = () => {
-    setSplitpayment(false);
-    setPaybtnnameselected(PaymentOptionsModeName);
-    setPaybtnselected(PaymentOptionsModeId);
-    const customerDisplayWindow = getCustomerDisplayWindow();
-    if (customerDisplayWindow && !customerDisplayWindow.closed) {
-      const updatedData = {
-        paymentMethod: PaymentOptions?.[0]?.ModeName,
-        Paymentgateway: false,
-      };
-      customerDisplayWindow.postMessage(updatedData, '*');
-    } else {
-      console.error(
-        'Customer display window is not available or has been closed.'
-      );
-    }
-  };
-  // const handleClick = async () => {
-  //   if (Comboglobal == false) {
-  //     await dispatch(changeCombosearch(true));
-  //   } else {
-  //     await dispatch(changeCombosearch(false));
-  //   }
-  // };
-
-  // const Combodata = async () => {
-  //   let data = {
-  //     AppId: AppId,
-  //     CompId: CompId,
-  //     BranchId: BranchId,
-  //      ActiveStatus: 'A',
-  //   };
-
-  //   let Response = await dispatch(Comboget(data)).unwrap();
-  //   if (Response?.data?.statusCode == 1) {
-  //     setComboDropDown(Response?.data?.data);
-  //   }
-  // };
-
-  const openPreOrder = async () => {
-    setPreOrderOpen((prevState) => !prevState);
-    if (preOrderOpen) {
-      const customerDisplayWindow = getCustomerDisplayWindow();
-      if (customerDisplayWindow && !customerDisplayWindow.closed) {
-        const updatedRemovedData = {
-          userData: [],
-          ExtraCharges: [],
-          paymentMethod: 'Cash',
-          type: 'remove',
-          keyValue: 'customer',
-        };
-        customerDisplayWindow.postMessage(updatedRemovedData, '*');
-      } else {
-        console.error(
-          'Customer display window is not available or has been closed.'
-        );
-      }
-      await dispatch(changeBookingType('TakeAway'));
-      await dispatch(changepreOrder(false));
-      await dispatch(changepreOrderList(null));
-      await dispatch(changePreOrderCusName(null));
-      await dispatch(changePreOrderCusMob(null));
-      await dispatch(changePreOrderDate());
-      await dispatch(changePreOrderTime(null));
-      await dispatch(changePreOrderAdd1(null));
-      await dispatch(changePreOrderAdd2(null));
-      await dispatch(changePreOrderAdvance(null));
-      await dispatch(changePreOrderzip(null));
-      await dispatch(changePreOrderCity(null));
-      await dispatch(changePreOrderDistrict(null));
-      await dispatch(changePreOrderState(null));
-      await dispatch(changePreOrderAdditem('AddDetails'));
-      await dispatch(changeSelectedOption(null));
-      await dispatch(changeCustomerID(null));
-      await dispatch(changealldata(false));
-      await dispatch(changeSelectedCustId(null));
-    }
-  };
-
-  const closePrintOption = () => {
-    setShowWhatsAppShare(false);
-    setSMSShare(false);
-    setPrintOrderDetails([]);
-    setMobileNoWhatsApp();
-  };
-
-  // const orderIdsArray =
-  //   PrintOrderDetails?.[0]?.OrderDetails?.map(
-  //     (orderDetail) => orderDetail?.OrderId
-  //   ) || [];
-
-  const handleURL = async (PrintOrderDetails) => {
-    let orderIdsArray = PrintOrderDetails?.[0]?.OrderDetails?.map(
-      (orderDetail) => orderDetail?.OrderId
-    );
-    const encrypted = encryptObject(orderIdsArray);
-
-    const postData = {
-      Url: encrypted,
-      CreatedBy: UserId,
+    return () => {
+      container.removeEventListener('scroll', updateScrollButtons);
+      window.removeEventListener('resize', updateScrollButtons);
+      resizeObserver.disconnect();
     };
-    if (orderIdsArray) {
-      const res = await dispatch(PublicQrCodepost(postData)).unwrap();
-      const urlData = res?.data?.ReferenceNo;
-      setUrlData(urlData);
+  }, [modelstock, ModalVarient, modelQty]);
+
+  const handleScrollClickLeft = (scrollOffset) => {
+    scrollContainerRef.current.scrollBy({
+      left: -scrollOffset,
+      behavior: 'smooth',
+    });
+  };
+
+  const handleScrollClickRight = (scrollOffset) => {
+    scrollContainerRef.current.scrollBy({
+      left: scrollOffset,
+      behavior: 'smooth',
+    });
+  };
+  // const isDragging = useRef(false);
+
+  // MOUSE EVENTS
+  const handleMouseDown = (e) => {
+    isDragging.current = true;
+    startX.current = e.pageX - scrollContainerRef.current.offsetLeft;
+    scrollLeft.current = scrollContainerRef.current.scrollLeft;
+    scrollContainerRef.current.style.cursor = 'grabbing';
+  };
+
+  const handleMouseMove = (e) => {
+    if (!isDragging.current) return;
+    e.preventDefault(); // Important: prevents text selection and smooth scroll interference
+    const x = e.pageX - scrollContainerRef.current.offsetLeft;
+    const walk = (x - startX.current) * 0.8; // Adjust multiplier for speed
+    scrollContainerRef.current.scrollLeft = scrollLeft.current - walk;
+  };
+
+  const handleMouseUp = () => {
+    isDragging.current = false;
+    scrollContainerRef.current.style.cursor = 'grab';
+  };
+
+  // TOUCH EVENTS
+  const handleTouchStart = (e) => {
+    isDragging.current = true;
+    startX.current = e.touches[0].pageX - scrollContainerRef.current.offsetLeft;
+    scrollLeft.current = scrollContainerRef.current.scrollLeft;
+  };
+
+  const handleTouchMove = (e) => {
+    if (!isDragging.current) return;
+    e.preventDefault(); // Prevents native scrolling
+    const x = e.touches[0].pageX - scrollContainerRef.current.offsetLeft;
+    const walk = (x - startX.current) * 0.8; // Adjust multiplier as needed
+    scrollContainerRef.current.scrollLeft = scrollLeft.current - walk;
+  };
+
+  const handleTouchEnd = () => {
+    isDragging.current = false;
+  };
+
+  const allProducts = Object.values(brandMapping).flat();
+
+  const brandGroups = {};
+  allProducts.forEach((product) => {
+    const brandName =
+      product.BrandName &&
+      product.BrandName !== 'null' &&
+      product.BrandName !== 'undefined' &&
+      product.BrandName.trim() !== ''
+        ? product.BrandName
+        : 'Others';
+
+    if (!brandGroups[brandName]) {
+      brandGroups[brandName] = [];
     }
+
+    brandGroups[brandName].push(product);
+  });
+
+  useEffect(() => {
+    const brandKeys = Object.keys(brandGroups || {});
+    if (brandKeys.length === 0) return;
+    // Only set if selectedBrand is not present in the new brandGroups
+    if (!brandKeys.includes(selectedBrand)) {
+      if (brandKeys.includes('Others')) {
+        setSelectedBrand('Others');
+      } else {
+        setSelectedBrand(brandKeys[0]);
+      }
+    }
+  }, [brandGroups]);
+
+  const sortedBrandNames = Object.keys(brandGroups).sort((a, b) =>
+    a === 'Others' ? -1 : b === 'Others' ? 1 : 0
+  );
+
+  const [prodname, setprodname] = useState('');
+  const [prodQty, setprodQty] = useState(0);
+  const normalize = (str) => str?.toLowerCase()?.replace(/\s+/g, ' ')?.trim();
+
+  const result = prodname
+    ? (cardData || [])?.filter(
+        (item) =>
+          normalize(item.ProdName).includes(normalize(prodname)) ||
+          normalize(item.ProdCatName).includes(normalize(prodname)) ||
+          item.ProductDetail?.some((detail) =>
+            normalize(detail.ProdName).includes(normalize(prodname))
+          )
+      )
+    : cardData;
+
+  console.log(prodQty, 'cardDatacardData', result, prodname);
+  const AddnewProduct = () => {
+    setNewMoreProductModel(true);
   };
+  useEffect(() => {
+    const item = result?.[0];
+    const detail = item?.ProductDetail?.[0];
 
-  const customerNameOrMobile = MobileNoWhatsApp?.CustName?.trim()
-    ? `Dear ${MobileNoWhatsApp?.CustName}`
-    : `Dear ${MobileNoWhatsApp?.value}`;
-  const documentUrl = `${MainHomeUrl}viewbill?code=${urlData}`;
-  const encodedMessage = `${customerNameOrMobile},\n\n🙏 Thank you for being a valuable customer!\n\n🧾 To view your bill, please click the link below:\n${documentUrl}`;
-  const handlepaymentoptions = async () => {
-    await dispatch(changeSalesPaymentoption(true));
-    await dispatch(
-      getPaymentOptionsData({
-        AppId: AppId,
-        CompId: CompId,
-        BranchId: BranchId,
-      })
-    );
-  };
+    const isInStock =
+      detail?.StockAvailable === 'Y' && item?.OverAllQty > prodQty;
+    const isStockNotTracked = detail?.StockAvailable === 'N';
 
-  const handleotherservices = () => {
-    dispatch(changeOtherServices(true));
-    dispatch(changeComboRedirectionToDefaultLayoutForParking(true));
-    dispatch(
-      changetemplateData({
-        AppName,
-        SelectedApplication: AppId,
-        Type: 'ParkingRedirect',
-      })
-    );
-  };
+    if (result?.length > 0 && prodname && (isInStock || isStockNotTracked)) {
+      //  CardOnclick(item,(item?.OnePcsAvailable && preferenceSingleSales) && 'OnePeiceProduct' );
+      CardOnclick(
+        result?.[0],
+        result?.[0]?.OnePcsAvailable === 'Y' &&
+          preferenceSingleSales &&
+          'OnePeiceProduct'
+      );
+      // AddOrderDetails2(result?.[0])
+    } else if (item?.OverAllQty < prodQty) {
+      setMessageType('error');
+      setMessageData('NoStack');
+    }
+  }, [prodname]);
+  function getClassNameBasedOnCard(type) {
+    switch (type) {
+      case 'Card1':
+        return 'AddNewProductSalesBTNCard1';
+      case 'Card2':
+        return 'AddNewProductSalesBTNCard2';
+      case 'Card3':
+        return 'AddNewProductSalesBTNCard3';
+      case 'Card4':
+        return 'AddNewProductSalesBTNCard4';
+      default:
+        return 'AddNewProductSalesBTNCard1';
+    }
+  }
 
-  return (
-    <>
-      <div
-        className="BSC1Payment-Container"
-        style={{
-          // backgroundColor:
-          //   BSComboData?.BookingLayout?.[0] === 'Combo1'
-          //     ? '#645CAA'
-          //     : '#08A7B8',
-          background: 'linear-gradient(to bottom right, #1e2536, #2a3447)',
-        }}
-      >
-        <Messages messageType={messageType} messageData={messageData} />
-        <div className="BSC1Payment-div1-1">
-          <div className="BSC1Payment-div1-sub1">
-            {BSComboNavbar?.[1]?.map((item) => (
-              <>
-                {item?.OptionName == 'QuickAdd' && (
-                  <TooltipWrapper title={'QuickAdd'} isMobile={isMobile}>
-                    <div
-                      className="BSC1Payment-div1-btns"
-                      onClick={setQuickOpen}
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <PozoQuickAddIcon className="BSC1Payment-icon " />
-                      <div
-                        style={{
-                          display: 'flex',
-                          flexDirection: 'column',
-                          alignItems: 'center',
-                          justifyContent: 'center',
-                        }}
-                      >
-                        Quick Add
-                        <span
-                          style={{ fontSize: '9px', letterSpacing: '0.5px' }}
-                        >
-                          (Alt + N)
-                        </span>
-                      </div>
-                    </div>
-                  </TooltipWrapper>
-                )}
-                {item?.OptionName == 'DineIn' &&
-                  DineInPreference?.SettingValue === 'Y' &&
-                  dinePreference && (
-                    <TooltipWrapper title={'Dine In'} isMobile={isMobile}>
-                      <div
-                        className={
-                          BookingType === 'Dine In'
-                            ? 'BSC1Payment-div1-btns-select'
-                            : 'BSC1Payment-div1-btns'
-                        }
-                        onClick={navigateDineIn}
-                        style={{
-                          pointerEvents:
-                            OrderType === 'Failed' ? 'none' : 'auto',
-                        }}
-                      >
-                        <PozoDineInIcon className="BSC1Payment-icon" />
-                        DINE IN
-                      </div>
-                    </TooltipWrapper>
-                  )}
-                {item?.OptionName == 'TakeAway' && takeAwayPreference && (
-                  <TooltipWrapper title={'TakeAway'} isMobile={isMobile}>
-                    <div
-                      className={
-                        BookingType === 'TakeAway'
-                          ? 'BSC1Payment-div1-btns-select'
-                          : 'BSC1Payment-div1-btns'
-                      }
-                      onClick={() =>
-                        BookingType !== 'TakeAway' && ChangeTakeAway()
-                      }
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    >
-                      <PozoTakeAway
-                        className="BSC1Payment-icon"
-                        style={{ width: '23px', height: '30px' }}
-                      />
-                      {/* TAKE AWAY */}
-                      Take Away
-                    </div>
-                  </TooltipWrapper>
-                )}
-              </>
-            ))}
+  function encrypt(code, key) {
+    let encrypted = (
+      <Suspense fallback={<div>Suspense Loading...</div>}>
+        <>
+          <div
+            className="bs-item-card-masterdiv"
+            style={{
+              display: 'flex',
+              flexDirection: 'column',
+              overflowY: 'scroll',
+              height: '80vh',
+              paddingBottom: '6rem',
+            }}
+            ref={itemListScrollRef}
+          >
+            {messageType && messageData && (
+              <Messages
+                messageType={messageType}
+                messageData={messageData}
+                onComplete={onComplete}
+              />
+            )}
 
-            {OtherServiceStatus && (
+            <div
+              className="voiceToTextIcon"
+              onClick={() => {
+                // trigger child function
+                voiceTriggerRef?.current?.listening();
+              }}
+              style={{
+                position: 'absolute',
+                zIndex: '12',
+                top:
+                  templateData?.BookingLayout?.[0] === 'Layout5' ||
+                  templateData?.BookingLayout?.[0] === 'Layout4' ||
+                  templateData?.BookingLayout?.[0] === 'Layout6'
+                    ? '2.5rem'
+                    : '',
+              }}
+            >
+              <VoiceToTextItemCard
+                ref={voiceTriggerRef}
+                setVoiceData={(data) => {
+                  setprodname(data.product);
+                  setprodQty(data.qty);
+                }}
+              />
+            </div>
+            {/* <p>{prodname}</p> */}
+            <div style={{ display: 'flex', justifyContent: 'flex-start' }}>
               <div
-                className="BSC1Payment-div1-btns"
-                onClick={handleotherservices}
+                className="BSItemCard-master-container"
+                style={{
+                  rowGap: cardFunction?.BigImage ? '15px' : '15px',
+                  pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
+                  overflow: 'auto',
+                }}
               >
-                <TooltipWrapper title={'Other Services'} isMobile={isMobile}>
+                {/* <div className="BSItemCard-master-container" > */}
+                {cardData?.length > 0 ? (
+                  <>
+                    <DndContext
+                      sensors={sensors}
+                      collisionDetection={closestCenter}
+                      onDragEnd={handleDragEnd}
+                    >
+                      <SortableContext
+                        items={draggableCardData.map((item) => item.id)}
+                        strategy={rectSortingStrategy}
+                      >
+                        <div
+                          style={{
+                            display: 'flex',
+                            flexWrap: 'wrap',
+                            gap: '5px',
+                          }}
+                          className={
+                            templateData?.BookingCard?.[0] != 'Card4'
+                              ? ''
+                              : 'CategoryHorizontalNewcontainer'
+                          }
+                        >
+                          {AddProductCard && !favouriteCat && ProdCat && (
+                            <div
+                              className={getClassNameBasedOnCard(
+                                templateData?.BookingCard?.[0]
+                              )}
+                              style={{
+                                backgroundColor:
+                                  cardFunction?.Background &&
+                                  (SelectedCardColor
+                                    ? SelectedCardColor?.['BackgroundColor']
+                                    : ''),
+                              }}
+                              onClick={AddnewProduct}
+                            >
+                              <MdOutlineAddShoppingCart size={25} />
+                              Add Product
+                            </div>
+                          )}
+                          {draggableCardData.map((item) => (
+                            <SortableCard
+                              key={item.id || index}
+                              id={item.id || index}
+                              item={item}
+                            >
+                              {templateData?.BookingCard?.[0] != 'Card4' ? (
+                                <div
+                                  style={{
+                                    position: 'relative',
+                                    overflow: 'hidden',
+                                    scrollbarWidth: 'none',
+                                  }}
+                                  className={
+                                    (item?.OverAllQty !== undefined &&
+                                    !preferenceSingleSales
+                                      ? returnCount(
+                                          item?.ProductDetail?.[0]?.ProdName,
+                                          item?.OverAllQty,
+                                          CartOrderDetails,
+                                          item?.OverAllPcs
+                                        )
+                                      : returnOnepcCount(
+                                          item?.ProductDetail?.[0]?.ProdName,
+                                          item?.OverAllPcs,
+                                          CartOrderDetails
+                                        ) > 0) ||
+                                    item?.ProductDetail?.some(
+                                      (item) => item?.StockAvailable !== 'Y'
+                                    )
+                                      ? 'BkPrdCardActive'
+                                      : 'BkPrdCardDeActive'
+                                  }
+                                >
+                                  {!isMobile ? (
+                                    <Tooltip title={item.ProdName}>
+                                      {globaldata && (
+                                        <input
+                                          type="checkbox"
+                                          value={
+                                            item.ProductDetail?.[0]?.ProdId
+                                          }
+                                          name={item.ProdName}
+                                          onChange={(e) => pickData(e, item)}
+                                          style={{
+                                            position: 'absolute',
+                                            zIndex: 1,
+                                            transform: 'scale(1.5)',
+                                            cursor: 'pointer',
+                                          }}
+                                          checked={(
+                                            globalAllItemdata || EditfavItems
+                                          )?.some(
+                                            // (a) => a?.ProdName === item?.ProdName
+                                            (a) =>
+                                              a?.ProdName === item?.ProdName &&
+                                              a?.ProdCat === item?.ProdCat
+                                          )}
+                                        />
+                                      )}
+
+                                      <div
+                                        style={{
+                                          alignItems: 'center',
+                                          backgroundColor:
+                                            cardFunction?.SmallImage &&
+                                            cardFunction?.Background &&
+                                            (SelectedCardColor
+                                              ? SelectedCardColor?.[
+                                                  'BackgroundColor'
+                                                ]
+                                              : ''),
+                                          padding:
+                                            !cardFunction?.ImageUp &&
+                                            !cardFunction?.ImageDown
+                                              ? cardFunction?.SmallImage &&
+                                                '5px 9px'
+                                              : '8px 2px',
+                                          flexDirection:
+                                            cardFunction?.ImageRight &&
+                                            'row-reverse'
+                                              ? cardFunction?.ImageRight &&
+                                                'row-reverse'
+                                              : cardFunction?.ImageUp &&
+                                                  'column'
+                                                ? cardFunction?.ImageUp &&
+                                                  'column'
+                                                : cardFunction?.ImageDown &&
+                                                    'column-reverse'
+                                                  ? cardFunction?.ImageDown &&
+                                                    'column-reverse'
+                                                  : cardFunction?.ImageLeft &&
+                                                    'row',
+                                          borderRadius:
+                                            cardFunction?.EdgeCurve && '6px',
+                                          width:
+                                            !cardFunction?.ImageUp &&
+                                            !cardFunction?.ImageDown &&
+                                            !cardFunction?.BigImage &&
+                                            !cardFunction?.ImageRight &&
+                                            cardFunction?.SmallImage &&
+                                            (cardFunction?.ImageUp ||
+                                              cardFunction?.ImageDown)
+                                              ? '6rem'
+                                              : cardFunction?.BigImage &&
+                                                '9rem',
+                                          height:
+                                            !cardFunction?.ImageUp &&
+                                            !cardFunction?.BigImage &&
+                                            '',
+                                          pointerEvents: globaldata && 'none',
+                                        }}
+                                        className={
+                                          cardFunction?.SmallImage
+                                            ? 'BSItemCard-container-smallimage'
+                                            : 'BSItemCard-container'
+                                        }
+                                        // onMouseDown={(e) =>
+                                        //   handleMouseDownItemCard(e, item)
+                                        // }
+                                        // onMouseUp={(e) =>
+                                        //   handleMouseUpItemCard(e, item)
+                                        // }
+                                        // onMouseLeave={handleMouseLeave}
+                                        // onTouchStart={(e) =>
+                                        //   handleTouchStartItemCard(e, item)
+                                        // }
+                                        // onTouchEnd={(e) =>
+                                        //   handleTouchEndItemCard(e, item)
+                                        // }
+                                        // onTouchCancel={handleTouchCancelItemCard}
+                                        // onContextMenu={(e) => e.preventDefault()}
+                                        onClick={(e) => {
+                                          if (
+                                            !(
+                                              (item?.OverAllQty !== undefined &&
+                                              !preferenceSingleSales
+                                                ? returnCount(
+                                                    item?.ProductDetail?.[0]
+                                                      ?.ProdName,
+                                                    item?.OverAllQty,
+                                                    CartOrderDetails
+                                                  )
+                                                : returnOnepcCount(
+                                                    item?.ProductDetail?.[0]
+                                                      ?.ProdName,
+                                                    item?.OverAllPcs,
+                                                    CartOrderDetails
+                                                  ) > 0) ||
+                                              item?.ProductDetail?.some(
+                                                (item) =>
+                                                  item?.StockAvailable !== 'Y'
+                                              )
+                                            )
+                                          ) {
+                                            e.stopPropagation();
+                                          } else {
+                                            CardOnclick(
+                                              item,
+                                              item?.OnePcsAvailable === 'Y' &&
+                                                preferenceSingleSales &&
+                                                'OnePeiceProduct'
+                                            );
+                                          }
+                                        }}
+                                        data-aos="zoom-in"
+                                        data-aos-duration="600"
+                                      >
+                                        {(cardFunction?.BigImage ||
+                                          cardFunction?.SmallImage) && (
+                                          <img
+                                            style={{
+                                              objectFit:
+                                                cardFunction?.BigImage && '',
+                                              height: !cardFunction?.BigImage
+                                                ? (!cardFunction?.BigImage &&
+                                                    cardFunction?.SmallImage) ||
+                                                  cardFunction?.ImageLeft ||
+                                                  cardFunction?.ImageUp ||
+                                                  cardFunction?.ImageDown
+                                                  ? '3rem'
+                                                  : cardFunction?.BigImage &&
+                                                    '7rem'
+                                                : '5rem',
+                                            }}
+                                            className={
+                                              cardFunction?.SmallImage
+                                                ? 'BSItemCard-image-smallimage'
+                                                : 'BSItemCard-image'
+                                            }
+                                            src={
+                                              item?.ProductDetail?.[0]
+                                                ?.ProdLogo === ''
+                                                ? defaultimage
+                                                : item?.ProductDetail?.[0]
+                                                      ?.ProdLogo
+                                                  ? item?.ProductDetail?.[0]
+                                                      ?.ProdLogo
+                                                  : defaultimage
+                                            }
+                                            alt=""
+                                          />
+                                        )}
+                                        <div
+                                          className={
+                                            cardFunction?.SmallImage
+                                              ? 'BSItemCard-content-smallimage'
+                                              : 'BSItemCard-content'
+                                          }
+                                          style={{
+                                            backgroundColor:
+                                              cardFunction?.Background &&
+                                              (SelectedCardColor
+                                                ? SelectedCardColor?.[
+                                                    'BackgroundColor'
+                                                  ]
+                                                : ''),
+
+                                            position: !cardFunction?.BigImage
+                                              ? 'relative'
+                                              : 'absolute',
+                                            flexDirection:
+                                              !cardFunction?.BigImage &&
+                                              'column',
+                                            borderRadius:
+                                              !cardFunction?.BigImage &&
+                                              cardFunction?.EdgeCurve &&
+                                              '6px',
+                                            bottom:
+                                              cardFunction?.BigImage && '',
+                                            cardFunction,
+                                            width:
+                                              !cardFunction?.BigImage &&
+                                              !cardFunction?.SmallImage &&
+                                              '',
+                                            height: cardFunction?.SmallImage
+                                              ? '5.5rem'
+                                              : !cardFunction?.BigImage &&
+                                                '5.5rem',
+                                            alignItems:
+                                              !cardFunction?.BigImage &&
+                                              !cardFunction?.SmallImage &&
+                                              'center',
+                                            textAlign:
+                                              !cardFunction?.BigImage &&
+                                              !cardFunction?.SmallImage &&
+                                              'center',
+                                            flexWrap:
+                                              cardFunction?.BigImage && 'wrap',
+                                            // flexDirection:
+                                            //   cardFunction?.SmallImage ||
+                                            //   (cardFunction?.BigImage && "column"),
+                                          }}
+                                        >
+                                          <p
+                                            style={{
+                                              textTransform:
+                                                cardFunction?.TextCapitalize &&
+                                                'uppercase',
+                                              width: !cardFunction?.SmallImage
+                                                ? cardFunction?.BigImage &&
+                                                  '120px'
+                                                : cardFunction?.SmallImage &&
+                                                  !cardFunction?.ImageUp &&
+                                                  !cardFunction?.ImageDown &&
+                                                  '85px',
+                                              // Width: cardFunction?.BigImage && "70px",
+                                              fontSize:
+                                                !cardFunction?.BigImage &&
+                                                !cardFunction?.SmallImage &&
+                                                '12px', //naresh27
+                                              whiteSpace:
+                                                !cardFunction?.BigImage &&
+                                                'pre-wrap',
+                                              margin: 'auto',
+                                              fontFamily: SelectedCardFont
+                                                ? SelectedCardFont
+                                                : '',
+                                              color: SelectedCardColor
+                                                ? SelectedCardColor?.[
+                                                    'FontColor'
+                                                  ]
+                                                : '',
+                                              textOverflow: 'ellipsis',
+                                            }}
+                                            className="BSItemCard-itemName"
+                                          >
+                                            {item?.ProdName}{' '}
+                                            {(item?.OverAllQty !== undefined &&
+                                            !preferenceSingleSales
+                                              ? returnCount(
+                                                  item?.ProductDetail?.[0]
+                                                    ?.ProdName,
+                                                  item?.OverAllQty,
+                                                  CartOrderDetails,
+                                                  item
+                                                )
+                                              : returnOnepcCount(
+                                                  item?.ProductDetail?.[0]
+                                                    ?.ProdName,
+                                                  item?.OverAllPcs,
+                                                  CartOrderDetails
+                                                ) > 0) ||
+                                            item?.ProductDetail?.some(
+                                              (item) =>
+                                                item?.StockAvailable !== 'Y'
+                                            ) ? (
+                                              ''
+                                            ) : (
+                                              <p
+                                                style={{
+                                                  color: 'red',
+                                                  marginTop: '5px',
+                                                  fontSize: '15px',
+                                                }}
+                                              >
+                                                No Stock
+                                              </p>
+                                            )}
+                                          </p>
+                                          {cardFunction?.Price &&
+                                            ((item?.OverAllQty !== undefined &&
+                                              (!preferenceSingleSales
+                                                ? item?.OverAllQty !== 0
+                                                : item?.OverAllPcs !== 0) &&
+                                              item?.OverAllQty !== null) ||
+                                              item?.ProductDetail?.some(
+                                                (item) =>
+                                                  item?.StockAvailable !== 'Y'
+                                              )) && (
+                                              <p
+                                                className="BSItemCard-itemPrice"
+                                                style={{
+                                                  fontSize:
+                                                    !cardFunction?.SmallImage
+                                                      ? cardFunction?.BigImage &&
+                                                        '12px'
+                                                      : '12px',
+                                                  textAlign: 'center',
+                                                  lineHeight: '2',
+                                                  fontFamily: SelectedCardFont
+                                                    ? SelectedCardFont
+                                                    : '',
+                                                  color: SelectedCardColor
+                                                    ? SelectedCardColor?.[
+                                                        'FontColor'
+                                                      ]
+                                                    : '',
+                                                }}
+                                              >
+                                                ₹ {ItemSellingPrice(item)}&nbsp;
+                                                <span
+                                                  className="BSItemCard-itemCount"
+                                                  style={{ fontSize: '10px' }}
+                                                >
+                                                  <>
+                                                    ({ItemSize(item)}{' '}
+                                                    {ItemUomName(item)})
+                                                  </>
+                                                </span>
+                                              </p>
+                                            )}
+                                        </div>
+
+                                        {cardFunction?.StockCount &&
+                                          item?.OverAllQty !== undefined &&
+                                          (!preferenceSingleSales
+                                            ? item?.OverAllQty !== 0
+                                            : item?.OverAllPcs !== 0) && (
+                                            <div
+                                              style={{
+                                                top:
+                                                  !cardFunction?.BigImage &&
+                                                  '0',
+                                                right:
+                                                  !cardFunction?.BigImage &&
+                                                  !cardFunction?.SmallImage &&
+                                                  '0px',
+                                                position: 'absolute',
+                                              }}
+                                              className={
+                                                cardFunction?.BigImage
+                                                  ? 'BSItemCard-badge'
+                                                  : 'BSItemCard-badge-withoutimage'
+                                              }
+                                            >
+                                              {item?.ProductDetail?.some(
+                                                (item) =>
+                                                  item?.StockAvailable === 'Y'
+                                              ) &&
+                                                item?.OverAllQty !== null && (
+                                                  <Badge
+                                                    count={
+                                                      !preferenceSingleSales
+                                                        ? returnCount(
+                                                            item
+                                                              ?.ProductDetail?.[0]
+                                                              ?.ProdName,
+                                                            item?.OverAllQty,
+                                                            CartOrderDetails
+                                                          )
+                                                        : returnOnepcCount(
+                                                            item
+                                                              ?.ProductDetail?.[0]
+                                                              ?.ProdName,
+                                                            item?.OverAllPcs,
+                                                            CartOrderDetails
+                                                          )
+                                                    }
+                                                    overflowCount={10000}
+                                                  ></Badge>
+                                                )}
+                                            </div>
+                                          )}
+                                      </div>
+
+                                      {item?.ProductDetail?.filter(
+                                        (item) => item.OnePcsAvailable == 'Y'
+                                      ).length !== 0 &&
+                                        !preferenceSingleSales && (
+                                          <div
+                                            className="onepieceMain"
+                                            onClick={(e) => {
+                                              if (
+                                                !(
+                                                  (item?.OverAllQty !==
+                                                    undefined &&
+                                                    returnOnepcCount(
+                                                      item?.ProductDetail?.[0]
+                                                        ?.ProdName,
+                                                      item?.OverAllPcs,
+                                                      CartOrderDetails
+                                                    ) > 0) ||
+                                                  item?.ProductDetail?.some(
+                                                    (item) =>
+                                                      item?.StockAvailable !==
+                                                      'Y'
+                                                  )
+                                                )
+                                              ) {
+                                                e.stopPropagation();
+                                              } else {
+                                                CardOnclick(
+                                                  item,
+                                                  'OnePeiceProduct'
+                                                );
+                                              }
+                                            }}
+                                            style={{
+                                              fontFamily:
+                                                SelectedCardFont || '',
+                                              backgroundColor:
+                                                SelectedCardColor?.FontColor ||
+                                                '#ffffff',
+                                              color:
+                                                returnOnepcCount(
+                                                  item?.ProductDetail?.[0]
+                                                    ?.ProdName,
+                                                  item?.OverAllPcs,
+                                                  CartOrderDetails
+                                                ) > 0 ||
+                                                item?.ProductDetail?.some(
+                                                  (product) =>
+                                                    product?.StockAvailable !==
+                                                    'Y'
+                                                )
+                                                  ? cardFunction?.Background
+                                                    ? SelectedCardColor?.BackgroundColor ||
+                                                      '#000000'
+                                                    : '#fff'
+                                                  : '#ff4d4f',
+                                            }}
+                                          >
+                                            {SingleMember ? 'Single' : '1 PCS'}
+                                          </div>
+                                        )}
+                                    </Tooltip>
+                                  ) : (
+                                    <>
+                                      {globaldata && (
+                                        <input
+                                          type="checkbox"
+                                          value={
+                                            item.ProductDetail?.[0]?.ProdId
+                                          }
+                                          name={item.ProdName}
+                                          onChange={(e) => pickData(e, item)}
+                                          style={{
+                                            position: 'absolute',
+                                            zIndex: 1,
+                                            transform: 'scale(1.5)',
+                                            cursor: 'pointer',
+                                          }}
+                                          checked={(
+                                            globalAllItemdata || EditfavItems
+                                          )?.some(
+                                            // (a) => a?.ProdName === item?.ProdName
+                                            (a) =>
+                                              a?.ProdName === item?.ProdName &&
+                                              a?.ProdCat === item?.ProdCat
+                                          )}
+                                        />
+                                      )}
+
+                                      <div
+                                        style={{
+                                          alignItems: 'center',
+                                          backgroundColor:
+                                            cardFunction?.SmallImage &&
+                                            cardFunction?.Background &&
+                                            (SelectedCardColor
+                                              ? SelectedCardColor?.[
+                                                  'BackgroundColor'
+                                                ]
+                                              : ''),
+                                          padding:
+                                            !cardFunction?.ImageUp &&
+                                            !cardFunction?.ImageDown
+                                              ? cardFunction?.SmallImage &&
+                                                '5px 9px'
+                                              : '8px 2px',
+                                          flexDirection:
+                                            cardFunction?.ImageRight &&
+                                            'row-reverse'
+                                              ? cardFunction?.ImageRight &&
+                                                'row-reverse'
+                                              : cardFunction?.ImageUp &&
+                                                  'column'
+                                                ? cardFunction?.ImageUp &&
+                                                  'column'
+                                                : cardFunction?.ImageDown &&
+                                                    'column-reverse'
+                                                  ? cardFunction?.ImageDown &&
+                                                    'column-reverse'
+                                                  : cardFunction?.ImageLeft &&
+                                                    'row',
+                                          borderRadius:
+                                            cardFunction?.EdgeCurve && '6px',
+                                          width:
+                                            !cardFunction?.ImageUp &&
+                                            !cardFunction?.ImageDown &&
+                                            !cardFunction?.BigImage &&
+                                            !cardFunction?.ImageRight &&
+                                            cardFunction?.SmallImage &&
+                                            (cardFunction?.ImageUp ||
+                                              cardFunction?.ImageDown)
+                                              ? '6rem'
+                                              : cardFunction?.BigImage &&
+                                                '9rem',
+                                          height:
+                                            !cardFunction?.ImageUp &&
+                                            !cardFunction?.BigImage &&
+                                            '',
+                                          pointerEvents: globaldata && 'none',
+                                        }}
+                                        className={
+                                          cardFunction?.SmallImage
+                                            ? 'BSItemCard-containers-smallimage-mobile'
+                                            : 'BSItemCard-containers-mobile'
+                                        }
+                                        onClick={(e) => {
+                                          if (
+                                            !(
+                                              (item?.OverAllQty !== undefined &&
+                                              !preferenceSingleSales
+                                                ? returnCount(
+                                                    item?.ProductDetail?.[0]
+                                                      ?.ProdName,
+                                                    item?.OverAllQty,
+                                                    CartOrderDetails
+                                                  )
+                                                : returnOnepcCount(
+                                                    item?.ProductDetail?.[0]
+                                                      ?.ProdName,
+                                                    item?.OverAllPcs,
+                                                    CartOrderDetails
+                                                  ) > 0) ||
+                                              item?.ProductDetail?.some(
+                                                (item) =>
+                                                  item?.StockAvailable !== 'Y'
+                                              )
+                                            )
+                                          ) {
+                                            e.stopPropagation();
+                                          } else {
+                                            CardOnclick(
+                                              item,
+                                              item?.OnePcsAvailable === 'Y' &&
+                                                preferenceSingleSales &&
+                                                'OnePeiceProduct'
+                                            );
+                                          }
+                                        }}
+                                        // data-aos="zoom-in" data-aos-duration="600"
+                                      >
+                                        {(cardFunction?.BigImage ||
+                                          cardFunction?.SmallImage) && (
+                                          <img
+                                            style={{
+                                              objectFit:
+                                                cardFunction?.BigImage && '',
+                                              height: !cardFunction?.BigImage
+                                                ? (!cardFunction?.BigImage &&
+                                                    cardFunction?.SmallImage) ||
+                                                  cardFunction?.ImageLeft ||
+                                                  cardFunction?.ImageUp ||
+                                                  cardFunction?.ImageDown
+                                                  ? '3rem'
+                                                  : cardFunction?.BigImage &&
+                                                    '7rem'
+                                                : '4rem',
+                                            }}
+                                            className={
+                                              cardFunction?.SmallImage
+                                                ? 'BSItemCard-image-smallimage'
+                                                : 'BSItemCard-image'
+                                            }
+                                            src={
+                                              item?.ProductDetail?.[0]
+                                                ?.ProdLogo === ''
+                                                ? defaultimage
+                                                : item?.ProductDetail?.[0]
+                                                      ?.ProdLogo
+                                                  ? item?.ProductDetail?.[0]
+                                                      ?.ProdLogo
+                                                  : defaultimage
+                                            }
+                                            alt=""
+                                          />
+                                        )}
+                                        <div
+                                          className={
+                                            cardFunction?.SmallImage
+                                              ? 'BSItemCard-content-smallimage'
+                                              : 'BSItemCard-content'
+                                          }
+                                          style={{
+                                            backgroundColor:
+                                              cardFunction?.Background &&
+                                              (SelectedCardColor
+                                                ? SelectedCardColor?.[
+                                                    'BackgroundColor'
+                                                  ]
+                                                : ''),
+
+                                            position: !cardFunction?.BigImage
+                                              ? 'relative'
+                                              : 'absolute',
+                                            flexDirection:
+                                              !cardFunction?.BigImage &&
+                                              'column',
+                                            borderRadius:
+                                              !cardFunction?.BigImage &&
+                                              cardFunction?.EdgeCurve &&
+                                              '6px',
+                                            bottom:
+                                              cardFunction?.BigImage && '',
+                                            cardFunction,
+                                            width:
+                                              !cardFunction?.BigImage &&
+                                              !cardFunction?.SmallImage &&
+                                              '',
+                                            height: cardFunction?.SmallImage
+                                              ? '5.5rem'
+                                              : !cardFunction?.BigImage &&
+                                                '4.5rem',
+                                            alignItems:
+                                              !cardFunction?.BigImage &&
+                                              !cardFunction?.SmallImage &&
+                                              'center',
+                                            textAlign:
+                                              !cardFunction?.BigImage &&
+                                              !cardFunction?.SmallImage &&
+                                              'center',
+                                            flexWrap:
+                                              cardFunction?.BigImage && 'wrap',
+                                          }}
+                                        >
+                                          <p
+                                            style={{
+                                              textTransform:
+                                                cardFunction?.TextCapitalize &&
+                                                'uppercase',
+                                              width: !cardFunction?.SmallImage
+                                                ? cardFunction?.BigImage &&
+                                                  '120px'
+                                                : cardFunction?.SmallImage &&
+                                                  !cardFunction?.ImageUp &&
+                                                  !cardFunction?.ImageDown &&
+                                                  '85px',
+                                              // Width: cardFunction?.BigImage && "70px",
+                                              fontSize:
+                                                !cardFunction?.BigImage &&
+                                                !cardFunction?.SmallImage &&
+                                                '12px', //naresh27
+                                              whiteSpace:
+                                                !cardFunction?.BigImage &&
+                                                'pre-wrap',
+                                              margin: 'auto',
+                                              fontFamily: SelectedCardFont
+                                                ? SelectedCardFont
+                                                : '',
+                                              color: SelectedCardColor
+                                                ? SelectedCardColor?.[
+                                                    'FontColor'
+                                                  ]
+                                                : '',
+                                              textOverflow: 'ellipsis',
+                                            }}
+                                            className="BSItemCard-itemName"
+                                          >
+                                            {item?.ProdName}{' '}
+                                            {(item?.OverAllQty !== undefined &&
+                                            !preferenceSingleSales
+                                              ? returnCount(
+                                                  item?.ProductDetail?.[0]
+                                                    ?.ProdName,
+                                                  item?.OverAllQty,
+                                                  CartOrderDetails,
+                                                  item
+                                                )
+                                              : returnOnepcCount(
+                                                  item?.ProductDetail?.[0]
+                                                    ?.ProdName,
+                                                  item?.OverAllPcs,
+                                                  CartOrderDetails
+                                                ) > 0) ||
+                                            item?.ProductDetail?.some(
+                                              (item) =>
+                                                item?.StockAvailable !== 'Y'
+                                            ) ? (
+                                              ''
+                                            ) : (
+                                              <p
+                                                style={{
+                                                  color: 'red',
+                                                  marginTop: '5px',
+                                                  fontSize: '11px',
+                                                }}
+                                              >
+                                                No Stock
+                                              </p>
+                                            )}
+                                          </p>
+                                          {cardFunction?.Price &&
+                                            ((item?.OverAllQty !== undefined &&
+                                              (!preferenceSingleSales
+                                                ? item?.OverAllQty !== 0
+                                                : item?.OverAllPcs !== 0) &&
+                                              item?.OverAllQty !== null) ||
+                                              item?.ProductDetail?.some(
+                                                (item) =>
+                                                  item?.StockAvailable !== 'Y'
+                                              )) && (
+                                              <p
+                                                className="BSItemCard-itemPrice"
+                                                style={{
+                                                  fontSize:
+                                                    !cardFunction?.SmallImage
+                                                      ? cardFunction?.BigImage &&
+                                                        '12px'
+                                                      : '12px',
+                                                  textAlign: 'center',
+                                                  lineHeight: '2',
+                                                  fontFamily: SelectedCardFont
+                                                    ? SelectedCardFont
+                                                    : '',
+                                                  color: SelectedCardColor
+                                                    ? SelectedCardColor?.[
+                                                        'FontColor'
+                                                      ]
+                                                    : '',
+                                                }}
+                                              >
+                                                ₹ {ItemSellingPrice(item)}&nbsp;
+                                                {/* {item?.ProductDetail?.[0]?.ProdVariantDetails?.[0]?.StockDetails?.[0]?.SellPrice}&nbsp; */}
+                                                {/*  {ItemSellingPrice(item)} */}
+                                                <span className="BSItemCard-itemCount">
+                                                  ({ItemSize(item)}{' '}
+                                                  {ItemUomName(item)})
+                                                </span>
+                                              </p>
+                                            )}
+                                        </div>
+
+                                        {cardFunction?.StockCount &&
+                                          item?.OverAllQty !== undefined &&
+                                          (!preferenceSingleSales
+                                            ? item?.OverAllQty !== 0
+                                            : item?.OverAllPcs !== 0) && (
+                                            <div
+                                              style={{
+                                                top:
+                                                  !cardFunction?.BigImage &&
+                                                  '0',
+                                                right:
+                                                  !cardFunction?.BigImage &&
+                                                  !cardFunction?.SmallImage &&
+                                                  '0px',
+                                                position: 'absolute',
+                                              }}
+                                              className={
+                                                cardFunction?.BigImage
+                                                  ? 'BSItemCard-badge'
+                                                  : 'BSItemCard-badge-withoutimage'
+                                              }
+                                            >
+                                              {item?.ProductDetail?.some(
+                                                (item) =>
+                                                  item?.StockAvailable === 'Y'
+                                              ) &&
+                                                item?.OverAllQty !== null && (
+                                                  <Badge
+                                                    count={
+                                                      !preferenceSingleSales
+                                                        ? returnCount(
+                                                            item
+                                                              ?.ProductDetail?.[0]
+                                                              ?.ProdName,
+                                                            item?.OverAllQty,
+                                                            CartOrderDetails
+                                                          )
+                                                        : returnOnepcCount(
+                                                            item
+                                                              ?.ProductDetail?.[0]
+                                                              ?.ProdName,
+                                                            item?.OverAllPcs,
+                                                            CartOrderDetails
+                                                          )
+                                                    }
+                                                    overflowCount={10000}
+                                                  ></Badge>
+                                                )}
+                                            </div>
+                                          )}
+                                      </div>
+                                      {item?.ProductDetail?.filter(
+                                        (item) => item.OnePcsAvailable == 'Y'
+                                      ).length !== 0 &&
+                                        !preferenceSingleSales && (
+                                          <div
+                                            className="onepieceMain"
+                                            onClick={(e) => {
+                                              if (
+                                                !(
+                                                  (item?.OverAllQty !==
+                                                    undefined &&
+                                                    returnOnepcCount(
+                                                      item?.ProductDetail?.[0]
+                                                        ?.ProdName,
+                                                      item?.OverAllPcs,
+                                                      CartOrderDetails
+                                                    ) > 0) ||
+                                                  item?.ProductDetail?.some(
+                                                    (item) =>
+                                                      item?.StockAvailable !==
+                                                      'Y'
+                                                  )
+                                                )
+                                              ) {
+                                                e.stopPropagation();
+                                              } else {
+                                                CardOnclick(
+                                                  item,
+                                                  'OnePeiceProduct'
+                                                );
+                                              }
+                                            }}
+                                            style={{
+                                              fontFamily:
+                                                SelectedCardFont || '',
+                                              backgroundColor:
+                                                SelectedCardColor?.FontColor ||
+                                                '#ffffff',
+                                              color:
+                                                returnOnepcCount(
+                                                  item?.ProductDetail?.[0]
+                                                    ?.ProdName,
+                                                  item?.OverAllPcs,
+                                                  CartOrderDetails
+                                                ) > 0 ||
+                                                item?.ProductDetail?.some(
+                                                  (product) =>
+                                                    product?.StockAvailable !==
+                                                    'Y'
+                                                )
+                                                  ? cardFunction?.Background
+                                                    ? SelectedCardColor?.BackgroundColor ||
+                                                      '#000000'
+                                                    : '#fff'
+                                                  : '#ff4d4f',
+                                            }}
+                                          >
+                                            {SingleMember ? 'Single' : '1 PCS'}
+                                          </div>
+                                        )}
+                                    </>
+                                  )}
+                                </div>
+                              ) : (
+                                <div
+                                  className={
+                                    (item?.OverAllQty !== undefined &&
+                                    !preferenceSingleSales
+                                      ? returnCount(
+                                          item?.ProductDetail?.[0]?.ProdName,
+                                          item?.OverAllQty,
+                                          CartOrderDetails,
+                                          item?.OverAllPcs
+                                        )
+                                      : returnOnepcCount(
+                                          item?.ProductDetail?.[0]?.ProdName,
+                                          item?.OverAllPcs,
+                                          CartOrderDetails
+                                        ) > 0) ||
+                                    item?.ProductDetail?.some(
+                                      (item) => item?.StockAvailable !== 'Y'
+                                    )
+                                      ? 'card4Main card4Main-active'
+                                      : 'card4Main card4Main-deactive'
+                                  }
+                                  // onMouseDown={(e) =>
+                                  //   handleMouseDownItemCard(e, item)
+                                  // }
+                                  // onMouseUp={(e) =>
+                                  //   handleMouseUpItemCard(e, item, true)
+                                  // }
+                                  // onMouseLeave={handleMouseLeave}
+                                  // onTouchStart={(e) =>
+                                  //   handleTouchStartItemCard(e, item)
+                                  // }
+                                  // onTouchEnd={(e) =>
+                                  //   handleTouchEndItemCard(e, item, true)
+                                  // }
+                                  // onTouchCancel={handleTouchCancelItemCard}
+                                  // onContextMenu={(e) => e.preventDefault()}
+                                  onClick={(e) => {
+                                    if (
+                                      !(
+                                        (item?.OverAllQty !== undefined &&
+                                        !preferenceSingleSales
+                                          ? returnCount(
+                                              item?.ProductDetail?.[0]
+                                                ?.ProdName,
+                                              item?.OverAllQty,
+                                              CartOrderDetails
+                                            )
+                                          : returnOnepcCount(
+                                              item?.ProductDetail?.[0]
+                                                ?.ProdName,
+                                              item?.OverAllPcs,
+                                              CartOrderDetails
+                                            ) > 0) ||
+                                        item?.ProductDetail?.some(
+                                          (item) => item?.StockAvailable !== 'Y'
+                                        )
+                                      )
+                                    ) {
+                                      e.stopPropagation(); // Prevent event bubbling if no stock or condition isn't met
+                                    } else {
+                                      // Ensure this only runs if the "One Piece" condition isn't triggered
+                                      if (
+                                        !e.target.closest('.card4Main-onepiece')
+                                      ) {
+                                        CardOnclick(
+                                          item,
+                                          item?.OnePcsAvailable === 'Y' &&
+                                            preferenceSingleSales &&
+                                            'OnePeiceProduct'
+                                        );
+                                        // This will trigger if you're clicking outside the "One Piece" button
+                                      }
+                                    }
+                                  }}
+                                >
+                                  {/* Global Data Checkbox */}
+                                  {globaldata && (
+                                    <input
+                                      type="checkbox"
+                                      value={item.ProductDetail?.[0]?.ProdId}
+                                      name={item.ProdName}
+                                      onClick={(e) => e.stopPropagation()}
+                                      onChange={(e) => {
+                                        e.stopPropagation();
+                                        pickData(e, item);
+                                      }}
+                                      style={{
+                                        position: 'absolute',
+                                        zIndex: 1,
+                                        transform: 'scale(1.5)',
+                                        cursor: 'pointer',
+                                      }}
+                                      checked={(
+                                        globalAllItemdata || EditfavItems
+                                      )?.some(
+                                        (a) =>
+                                          a?.ProdName === item?.ProdName &&
+                                          a?.ProdCat === item?.ProdCat
+                                      )}
+                                    />
+                                  )}
+
+                                  {/* Tooltip for Product Name */}
+                                  <Tooltip title={item.ProdName}>
+                                    <div className="card4Img">
+                                      <img
+                                        width={50}
+                                        height={60}
+                                        src={
+                                          item?.ProductDetail?.[0]?.ProdLogo ===
+                                          ''
+                                            ? defaultimage
+                                            : item?.ProductDetail?.[0]?.ProdLogo
+                                              ? item?.ProductDetail?.[0]
+                                                  ?.ProdLogo
+                                              : defaultimage
+                                        }
+                                        alt=""
+                                      />
+                                    </div>
+                                  </Tooltip>
+
+                                  <div className="Card4datas">
+                                    <div className="card4ProductName">
+                                      {item?.ProdName}
+                                      {(item?.OverAllQty !== undefined &&
+                                      !preferenceSingleSales
+                                        ? returnCount(
+                                            item?.ProductDetail?.[0]?.ProdName,
+                                            item?.OverAllQty,
+                                            CartOrderDetails,
+                                            item
+                                          )
+                                        : returnOnepcCount(
+                                            item?.ProductDetail?.[0]?.ProdName,
+                                            item?.OverAllPcs,
+                                            CartOrderDetails
+                                          ) > 0) ||
+                                      item?.ProductDetail?.some(
+                                        (item) => item?.StockAvailable !== 'Y'
+                                      ) ? (
+                                        ''
+                                      ) : (
+                                        <p
+                                          style={{
+                                            color: 'red',
+                                            marginTop: '5px',
+                                            fontSize: '15px',
+                                          }}
+                                        >
+                                          No Stock
+                                        </p>
+                                      )}
+                                    </div>
+                                    {((item?.OverAllQty !== undefined &&
+                                    !preferenceSingleSales
+                                      ? returnCount(
+                                          item?.ProductDetail?.[0]?.ProdName,
+                                          item?.OverAllQty,
+                                          CartOrderDetails,
+                                          item
+                                        )
+                                      : returnOnepcCount(
+                                          item?.ProductDetail?.[0]?.ProdName,
+                                          item?.OverAllPcs,
+                                          CartOrderDetails
+                                        ) > 0) ||
+                                      item?.ProductDetail?.some(
+                                        (item) => item?.StockAvailable !== 'Y'
+                                      )) && (
+                                      <div className="card4PriceUom">
+                                        <div className="card4Price">
+                                          ₹ {ItemSellingPrice(item)}
+                                        </div>
+
+                                        <div className="card4Uom">
+                                          <>
+                                            ({ItemSize(item)}{' '}
+                                            {ItemUomName(item)})
+                                          </>
+                                        </div>
+                                      </div>
+                                    )}
+                                  </div>
+
+                                  {/* Stock Count Badge */}
+                                  {cardFunction?.StockCount &&
+                                    item?.OverAllQty !== undefined &&
+                                    (!preferenceSingleSales
+                                      ? item?.OverAllQty !== 0
+                                      : item?.OverAllPcs !== 0) && (
+                                      <div
+                                        style={{
+                                          top: '0',
+                                          right: '0px',
+                                          position: 'absolute',
+                                        }}
+                                        className="card4Main-badge"
+                                      >
+                                        {item?.ProductDetail?.some(
+                                          (item) => item?.StockAvailable === 'Y'
+                                        ) &&
+                                          item?.OverAllQty !== null && (
+                                            <Badge
+                                              count={
+                                                !preferenceSingleSales
+                                                  ? returnCount(
+                                                      item?.ProductDetail?.[0]
+                                                        ?.ProdName,
+                                                      item?.OverAllQty,
+                                                      CartOrderDetails
+                                                    )
+                                                  : returnOnepcCount(
+                                                      item?.ProductDetail?.[0]
+                                                        ?.ProdName,
+                                                      item?.OverAllPcs,
+                                                      CartOrderDetails
+                                                    )
+                                              }
+                                              overflowCount={10000}
+                                            ></Badge>
+                                          )}
+                                      </div>
+                                    )}
+
+                                  {/* One Piece Button */}
+                                  {item?.ProductDetail?.filter(
+                                    (item) => item.OnePcsAvailable == 'Y'
+                                  ).length !== 0 &&
+                                    !preferenceSingleSales && (
+                                      <div
+                                        className="card4Main-onepiece"
+                                        onClick={(e) => {
+                                          e.stopPropagation(); // Stop event propagation to the parent div
+
+                                          if (
+                                            !(
+                                              (item?.OverAllQty !== undefined &&
+                                                returnOnepcCount(
+                                                  item?.ProductDetail?.[0]
+                                                    ?.ProdName,
+                                                  item?.OverAllPcs,
+                                                  CartOrderDetails
+                                                ) > 0) ||
+                                              item?.ProductDetail?.some(
+                                                (item) =>
+                                                  item?.StockAvailable !== 'Y'
+                                              )
+                                            )
+                                          ) {
+                                            return; // Don't proceed if the condition isn't met
+                                          } else {
+                                            CardOnclick(
+                                              item,
+                                              'OnePeiceProduct'
+                                            ); // This only runs when you click the "One Piece" button
+                                          }
+                                        }}
+                                        style={{
+                                          fontFamily: SelectedCardFont || '',
+                                          backgroundColor:
+                                            SelectedCardColor?.FontColor ||
+                                            '#ffffff',
+                                          color:
+                                            returnOnepcCount(
+                                              item?.ProductDetail?.[0]
+                                                ?.ProdName,
+                                              item?.OverAllPcs,
+                                              CartOrderDetails
+                                            ) > 0 ||
+                                            item?.ProductDetail?.some(
+                                              (product) =>
+                                                product?.StockAvailable !== 'Y'
+                                            )
+                                              ? cardFunction?.Background
+                                                ? SelectedCardColor?.BackgroundColor ||
+                                                  '#000000'
+                                                : '#fff'
+                                              : '#ff4d4f',
+                                        }}
+                                      >
+                                        {SingleMember ? 'Single' : '1 PCS'}
+                                      </div>
+                                    )}
+                                </div>
+                              )}
+                            </SortableCard>
+                          ))}
+                        </div>
+                      </SortableContext>
+                    </DndContext>
+                  </>
+                ) : ProductSearch?.length > 5 &&
+                  GetmultipleSearchDatas.some(
+                    (e) => e.toLowerCase() === 'qrcode'
+                  ) &&
+                  (cardData?.length == 0 || cardData == undefined) ? (
+                  <div>
+                    {/* cardData mohan 18-04-2025 */}
+                    <FeaturesFunctionalities
+                      handleQuickAddCancel={handleQuickCancel}
+                      QuickAdd={QuickAdd}
+                      ProductSearch={true}
+                      ProductSearchType={'I'}
+                      cardData={cardDataForNewPrd}
+                    />
+                  </div>
+                ) : (
+                  <>
+                    <div
+                      className={!temp5 ? 'NodataFound' : 'NodataFound5'}
+                      style={{
+                        display: globalAccessForOthers && 'none',
+                      }}
+                    >
+                      <div align="center" className="fond">
+                        <div className="contener_general">
+                          <div className="contener_mixte">
+                            <div className="ballcolor ball_1">&nbsp;</div>
+                          </div>
+                          <div className="contener_mixte">
+                            <div className="ballcolor ball_2">&nbsp;</div>
+                          </div>
+                          <div className="contener_mixte">
+                            <div className="ballcolor ball_3">&nbsp;</div>
+                          </div>
+                          <div className="contener_mixte">
+                            <div className="ballcolor ball_4">&nbsp;</div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </>
+                )}
+                {paymentloader === true && (
+                  <div className="Payment-loader1">
+                    <div className="Payment-loader">
+                      <div className="contener_mixte">
+                        <div className="ballcolor ball_1">&nbsp;</div>
+                      </div>
+                      <div className="contener_mixte">
+                        <div className="ballcolor ball_2">&nbsp;</div>
+                      </div>
+                      <div className="contener_mixte">
+                        <div className="ballcolor ball_3">&nbsp;</div>
+                      </div>
+                      <div className="contener_mixte">
+                        <div className="ballcolor ball_4">&nbsp;</div>
+                      </div>
+                      <p style={{ marginTop: '2rem' }}>
+                        {' '}
+                        Please wait while we process your payment
+                      </p>
+                      {PaymentTransactionNumber != null && (
+                        <p style={{ fontSize: '16px', fontWeight: '600' }}>
+                          Transaction Number : {PaymentTransactionNumber}
+                        </p>
+                      )}
+                    </div>
+                  </div>
+                )}
+              </div>
+            </div>
+          </div>
+          {expireModal?.open && (
+            <ExpireConfirmModal
+              open={expireModal?.open}
+              title={expireModal?.title}
+              onOk={() => {
+                expireModal.onOk?.();
+                closeExpireModal();
+              }}
+              onCancel={() => {
+                expireModal.onCancel?.();
+                closeExpireModal();
+              }}
+            />
+          )}
+
+          {modelQty && (
+            <DefaultModal
+              title={
+                <div className="EditQuantity-title">
+                  <FormHeader title={'SubItem'} />
+                </div>
+              }
+              open={modelQty}
+              width={800}
+              handleCancel={CloseModal}
+              footer={null}
+              maskTransitionName=""
+              transitionName=""
+              children={
+                <div>
+                  <div className="EditQuantity-heading">
+                    <div className="EditQuantity-headingname">
+                      <p className="EditQuantity-itemname">Item Name:</p>
+                    </div>
+                    <div
+                      className="EditQuantity-headingproductname"
+                      style={{ marginLeft: '1rem' }}
+                    >
+                      <p className="EditQuantity-productname">
+                        {qtydata?.ProdName}
+                      </p>
+                    </div>
+                  </div>
                   <div
+                    style={{ height: 'auto' }}
+                    className={
+                      BrandCheckresult
+                        ? 'Card-modal-table'
+                        : 'Brand-Card-modal-table'
+                    }
+                  >
+                    {/* Horizontal scroll container */}
+
+                    <div
+                      style={{
+                        position: 'relative',
+                        display: 'flex',
+                        alignItems: 'center',
+                      }}
+                    >
+                      {/* Left Scroll Button */}
+                      {showLeftButton && (
+                        <div
+                          className="CategoryHorizontal-icon"
+                          onClick={() => handleScrollClickLeft(200)}
+                          style={{
+                            position: 'absolute',
+                            left: 0,
+                            top: '35%',
+                            transform: 'translateY(-50%)',
+                            zIndex: 10,
+                            background: '#fff',
+                            padding: '0.5rem',
+                            cursor: 'pointer',
+                            boxShadow: '0 0 5px rgba(0,0,0,0.2)',
+                          }}
+                        >
+                          ◄
+                        </div>
+                      )}
+
+                      {/* Scroll Container */}
+                      <div
+                        id="mainDiv"
+                        className="CategoryHorizontal-scroll-container"
+                        ref={scrollContainerRef}
+                        onMouseDown={handleMouseDown}
+                        onMouseMove={handleMouseMove}
+                        onMouseUp={handleMouseUp}
+                        onMouseLeave={handleMouseUp}
+                        onTouchStart={handleTouchStart}
+                        onTouchMove={handleTouchMove}
+                        onTouchEnd={handleTouchEnd}
+                        style={{
+                          cursor: 'grab',
+                          overflowX: 'auto',
+                          display: 'flex',
+                          gap: '1rem',
+                        }}
+                      >
+                        {Object.keys(brandGroups)
+                          .sort((a, b) =>
+                            a === 'Others' ? -1 : b === 'Others' ? 1 : 0
+                          )
+                          .map((brand) => (
+                            <div
+                              key={brand}
+                              onClick={() => setSelectedBrand(brand)}
+                              style={{
+                                minWidth: '150px',
+                                background:
+                                  selectedBrand === brand
+                                    ? '#cce5ff'
+                                    : '#f4f4f4',
+                                borderRadius: '8px',
+                                padding: '0.8rem',
+                                flexShrink: 0,
+                                cursor: 'pointer',
+                                userSelect: 'none',
+                                textAlign: 'center',
+                                fontWeight:
+                                  selectedBrand === brand ? 'bold' : 'normal',
+                              }}
+                            >
+                              {brand === 'Others' ? 'Others' : brand}
+                            </div>
+                          ))}
+                      </div>
+
+                      {/* Right Scroll Button */}
+                      {showRightButton && (
+                        <div
+                          className="CategoryHorizontal-icon"
+                          onClick={() => handleScrollClickRight(200)}
+                          style={{
+                            position: 'absolute',
+                            right: 0,
+                            top: '35%',
+                            transform: 'translateY(-50%)',
+                            zIndex: 10,
+                            background: '#fff',
+                            padding: '0.5rem',
+                            cursor: 'pointer',
+                            boxShadow: '0 0 5px rgba(0,0,0,0.2)',
+                          }}
+                        >
+                          ►
+                        </div>
+                      )}
+                    </div>
+                    {/* Selected brand products */}
+                    <div style={{ marginTop: '1rem', overflow: 'auto' }}>
+                      <h3 style={{ margin: '0 0 20px 0' }}>
+                        {selectedBrand === 'Others' ? 'Others' : selectedBrand}{' '}
+                        Products
+                      </h3>
+                      <ul
+                        className="webkit-ul"
+                        style={{
+                          listStyle: 'none',
+                          padding: 0,
+                          display: 'flex',
+                          flexWrap: 'wrap',
+                          gap: '1rem',
+                        }}
+                      >
+                        {(brandGroups[selectedBrand] || []).map(
+                          (product, index) => {
+                            const qtyCount = returnQtyCount(
+                              product?.ProdId,
+                              product,
+                              CartOrderDetails
+                            );
+                            const isAvailable = product?.StockAvailable !== 'Y';
+                            const isDisabled = qtyCount > 0 || isAvailable;
+
+                            return (
+                              <div key={`${product?.brandId}-${index}`}>
+                                <div
+                                  style={{ position: 'relative' }}
+                                  className={
+                                    isDisabled
+                                      ? 'ItemQtyCard'
+                                      : 'ItemQtyCard-disabled'
+                                  }
+                                  onClick={() => VarientFun(product)}
+                                >
+                                  <div className="ItemQtyImgCard">
+                                    <img
+                                      src={product?.ProdLogo || defaultimage}
+                                      width={'80px'}
+                                      height={'70px'}
+                                      alt={`Product ${index}`}
+                                    />
+                                  </div>
+                                  <div
+                                    className={
+                                      cardFunction?.BigImage
+                                        ? 'BSItemCard-badge'
+                                        : 'BSItemCard-badge-withoutimage'
+                                    }
+                                  >
+                                    <Badge
+                                      count={qtyCount}
+                                      overflowCount={10000}
+                                    ></Badge>
+                                  </div>
+
+                                  <div className="qtyDetail">
+                                    <p className="qtyUomName-itemCard">
+                                      {product?.Size + ' ' + product?.UomName}
+                                    </p>
+                                    {!isDisabled && (
+                                      <p
+                                        style={{
+                                          color: 'red',
+                                          fontSize: '12',
+                                          textAlign: 'center',
+                                          fontWeight: '600',
+                                        }}
+                                      >
+                                        No Stock
+                                      </p>
+                                    )}
+                                    {isDisabled && (
+                                      <p className="qtyprice">
+                                        <sup style={{ fontFamily: 'Gilroy' }}>
+                                          ₹
+                                        </sup>
+                                        &nbsp;
+                                        {safeRound(
+                                          product?.ProdVariantDetails?.[0]
+                                            ?.StockDetails?.[0]?.SellPrice
+                                        )}
+                                      </p>
+                                    )}
+                                  </div>
+                                </div>
+                              </div>
+                            );
+                          }
+                        )}
+                      </ul>
+                    </div>
+
+                    {Object.keys(brandMapping).length === 0 && (
+                      <p>No product details available</p>
+                    )}
+                  </div>
+                </div>
+              }
+            />
+          )}
+          {modelstock && (
+            <DefaultModal
+              title={
+                <div className="EditQuantity-title">
+                  <FormHeader title={'Item Stock'} />
+                </div>
+              }
+              open={modelstock}
+              // width={500}
+              footer={null}
+              top={0}
+              handleCancel={CloseModal1}
+              maskTransitionName=""
+              transitionName=""
+              children={
+                <div>
+                  <div
+                    className="EditQuantity-heading"
                     style={{
                       display: 'flex',
-                      gap: '2px',
-                      alignItems: 'center',
-                      whiteSpace: 'nowrap',
+                      flexDirection: 'column',
+                      marginBottom: '3rem',
+                      alignItems: 'start',
                     }}
                   >
-                    <FaParking className="BSC1Payment-icon" />
-                    Other Services
-                  </div>
-                </TooltipWrapper>
-              </div>
-            )}
-          </div>
-
-          <div className="BSC1Payment-div1-sub2">
-            {BSComboNavbar?.[1]?.map((item) => (
-              <>
-                {item?.OptionName == 'Offer' && (
-                  <div
-                    className="BSC1Payment-div1-btns"
-                    style={{
-                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                    }}
-                  >
-                    <BSNavBarOffer layoutType="Combo" />
-                  </div>
-                )}
-                {item?.OptionName == 'ExtraCharge' && (
-                  <TooltipWrapper title={'Extra Charge'} isMobile={isMobile}>
-                    <div
-                      className="BSC1Payment-div1-btns"
-                      onClick={handleextraCharges}
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                        display: 'flex',
-                        flexDirection: 'column',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                      }}
-                    >
-                      <div style={{ display: 'flex' }}>
-                        <PozoExtraChargesIcon className="BSC1Payment-icon" />
-                        {/* EXTRA CHARGE */}
-                        Extra Charge
+                    <div style={{ display: 'flex' }}>
+                      <div className="EditQuantity-headingname">
+                        <p className="EditQuantity-itemname">Item Name:</p>
                       </div>
-
-                      <div style={{ fontSize: '9px', letterSpacing: '0.5px' }}>
-                        (Alt + A)
+                      <div
+                        className="EditQuantity-headingproductname"
+                        style={{ marginLeft: '1rem' }}
+                      >
+                        <p className="EditQuantity-productname">
+                          {qtydata?.ProdName}{' '}
+                          {!qtydata?.ProductDetail?.[
+                            QtyIndex
+                          ]?.ProdVariantDetails?.[
+                            VarientIndex
+                          ]?.ProdVariantName?.toLowerCase()?.includes(
+                            'variant'
+                          ) && (
+                            <span>
+                              (
+                              {
+                                qtydata?.ProductDetail?.[QtyIndex]
+                                  ?.ProdVariantDetails?.[VarientIndex]
+                                  ?.ProdVariantName
+                              }
+                              ){' '}
+                            </span>
+                          )}
+                        </p>
                       </div>
                     </div>
-                  </TooltipWrapper>
-                )}
-                {item?.OptionName == 'RePrint' && (
-                  <TooltipWrapper title={'RePrint'} isMobile={isMobile}>
-                    <div
-                      className="BSC1Payment-div1-btns"
-                      onClick={handleReprint}
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                        display: 'flex',
-                        flexDirection: 'column',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                      }}
-                    >
-                      <div>
-                        <PozoReprintIcon className="BSC1Payment-icon" />
-                        Re-Print
+                    <div style={{ display: 'flex' }}>
+                      <div className="EditQuantity-headingname">
+                        <p className="EditQuantity-itemname">Item Unit:</p>
+                      </div>
+                      <div
+                        className="EditQuantity-headingproductname"
+                        style={{ marginLeft: '1rem' }}
+                      >
+                        <p className="EditQuantity-productname">
+                          {qtydata?.ProductDetail?.[QtyIndex]?.Size}{' '}
+                          {onePeiceFlow
+                            ? 'PCS'
+                            : qtydata?.ProductDetail?.[QtyIndex]?.UomName}
+                        </p>
                       </div>
-
-                      <span style={{ fontSize: '9px', letterSpacing: '0.5px' }}>
-                        (Alt + R)
-                      </span>
                     </div>
-                  </TooltipWrapper>
-                )}
-              </>
-            ))}
-            {/* {reprint1 && (
-              <FeaturesFunctionalities
-                handleReprintCancel={handleReprintCancel}
-                reprint={reprint1}
-              />
-            )} */}
-            {extraCharges && (
-              <FeaturesFunctionalities
-                ExtraChargesCancle={handleextraChargesCancel}
-                ExtraCharges={extraCharges}
-              />
-            )}
-            {QuickAdd && (
-              <FeaturesFunctionalities
-                handleQuickAddCancel={handleQuickCancel}
-                QuickAdd={QuickAdd}
-              />
-            )}
-            {creditCustomerOpen && (
-              <BSCreditCustomer
-                creditCustomerOpen={creditCustomerOpen}
-                CreditCustomerHAndleCancel={CreditCustomerHAndleCancel}
-              />
-            )}
-            {TotalAmount == 0 && Success && (
-              <div>
-                <QrComponent com={`WelcomeScreen**${brachName}`} />
-              </div>
-            )}
-            {TotalAmount > 0 &&
-              qrCode &&
-              PaymentUpiOptions?.length > 0 &&
-              SelectedUpiOption && (
-                <div>
-                  <QrComponent
-                    com={`DisplayQRCodeScreen**upi://pay?pa=${UpiId}&pn=Bonrix&cu=INR&am=${TotalAmount}&pn=Bonrix%20Software%20Systems**${TotalAmount}**${UpiId}`}
-                  />
+                  </div>
+                  <div className="Re-Print-table">
+                    <Tables columns={stockcolumns} data={stockdataSource} />
+                  </div>
                 </div>
-              )}
-
-            {PaymentUpiOptions?.length > 0 && OrderId && (
-              <div>
-                <QrComponent
-                  com={`DisplaySuccessQRCodeScreen**...**${extractLastNumberOrderId(OrderId, PrintOrderDetails?.[0]?.OrderDetails?.[0]?.FYStatus)}**${Todaydate}`}
-                />
-              </div>
-            )}
-          </div>
-        </div>
-
-        <div className="BSC1Payment-div1-2">
-          <div className="custom-float-menu">
-            <div
-              className="custom-float-trigger"
-              onClick={() => setIsFloatMenuOpen(!isFloatMenuOpen)}
-            >
-              <TfiMoreAlt
-                style={{ fontSize: '40px' }}
-                className="BSC1Payment-icon"
-              />
-            </div>
-
-            {isFloatMenuOpen && (
-              <div className="custom-float-items">
-                {!OtherServiceStatus && (
-                  <div className="custom-float-item">
-                    <TooltipWrapper
-                      placement="rightTop"
-                      title="Other Services"
-                      isMobile={isMobile}
-                    >
-                      <div onClick={handleotherservices}>
-                        <FaParking className="BSC1Payment-icon" />
-                        <p style={{ fontSize: '9px' }}>Parking</p>
-                      </div>
-                    </TooltipWrapper>
-                  </div>
-                )}
-                {BSComboNavbar?.[1]?.map((item) => (
-                  <>
-                    {item?.OptionName == 'QuickAdd' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="QUICK ADD"
-                          isMobile={isMobile}
-                        >
-                          <div onClick={setQuickOpen}>
-                            <PozoQuickAddIcon className="BSC1Payment-icon quickaddIconCombo" />
-                            <p style={{ fontSize: '9px' }}>
-                              Quick Add <br /> (Alt +N)
-                            </p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                    {item?.OptionName == 'DineIn' &&
-                      DineInPreference?.SettingValue === 'Y' && (
-                        <>
-                          <div className="custom-float-item">
-                            <TooltipWrapper
-                              placement="rightTop"
-                              title="DINE IN"
-                              isMobile={isMobile}
-                            >
-                              <div onClick={navigateDineIn}>
-                                <PozoDineInIcon className="BSC1Payment-icon1" />
-                                <p style={{ fontSize: '9px' }}>Dine In</p>
-                              </div>
-                            </TooltipWrapper>
-                          </div>
-                          {FirstPaymentclick === false &&
-                            !addnewAccess &&
-                            !OrderStatus && (
-                              <div className="custom-float-item">
-                                <BSTipAmount />
-                              </div>
-                            )}
-                        </>
-                      )}
-                    {item?.OptionName == 'TakeAway' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="TAKE AWAY"
-                          isMobile={isMobile}
-                        >
-                          <div>
-                            <PozoTakeAway className="BSC1Payment-icon1" />
-                            <p style={{ fontSize: '9px' }}>Take Away</p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                    {item?.OptionName == 'Offer' && (
-                      <div className="custom-float-item">
-                        <BSNavBarOffer
-                          layoutType="ComboMobile"
-                          propsPlacement="rightTop"
-                        />
-                      </div>
-                    )}
-                    {item?.OptionName == 'ExtraCharge' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="ADD ON"
-                          onClick={handleextraCharges}
-                          isMobile={isMobile}
-                        >
-                          <div>
-                            <PozoExtraChargesIcon className="BSC1Payment-icon1" />
-                            <p style={{ fontSize: '9px' }}>Extra Charge</p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                    {item?.OptionName == 'RePrint' && (
-                      <div className="custom-float-item">
-                        <TooltipWrapper
-                          placement="rightTop"
-                          title="RE PRINT"
-                          onClick={handleReprint}
-                          isMobile={isMobile}
-                        >
-                          <div>
-                            <PozoReprintIcon className="BSC1Payment-icon1" />
-                            <p style={{ fontSize: '9px' }}>Re Print</p>
-                          </div>
-                        </TooltipWrapper>
-                      </div>
-                    )}
-                  </>
-                ))}
-              </div>
-            )}
-          </div>
-        </div>
-
-        <div class="BSC1Payment-vl"></div>
-        <TooltipWrapper
-          //  title={'Payment Mode (SHIFT + M)'}
-          isMobile={isMobile}
-        >
-          <div
-            className="BSC1Payment-div2-1"
-            style={{
-              pointerEvents:
-                (BookingType === 'Dine In' ||
-                  BookingTypeBoth ||
-                  CheckOrderType?.length > 0) &&
-                  !unpaidFlow &&
-                  OrderStatus
-                  ? 'none'
-                  : 'auto',
-              opacity:
-                (BookingType === 'Dine In' ||
-                  BookingTypeBoth ||
-                  CheckOrderType?.length > 0) &&
-                  !unpaidFlow &&
-                  OrderStatus
-                  ? 0.5
-                  : 1,
-            }}
-          >
-            {paybtns?.length > 0 ? (
-              paybtns?.map((payment) => (
-                <div className="Table3-cash">
-                  <button
-                    className={
-                      paybtnselected === payment.ModeId &&
-                        (UpinotSelected || CardoptionnotSelected)
-                        ? 'Btn-payment-mode-notupisel'
-                        : paybtnselected === payment.ModeId &&
-                          (!UpinotSelected || !CardoptionnotSelected)
-                          ? 'Btn-payment-mode'
-                          : 'Btn-payment-mode-sel'
-                    }
-                    style={{
-                      position: 'relative',
-                      animation: blink
-                        ? 'blink-animation 0.5s infinite alternate'
-                        : 'none',
-                    }}
-                    onClick={() =>
-                      payment?.ModeName?.toLowerCase() === 'upi' // Change the condition to payment.Id
-                        ? handleUPIButtonClick(payment.ModeId, payment.ModeName)
-                        : handlePaymentMode(payment.ModeId, payment.ModeName)
-                    }
-                  >
-                    {/* {UpiOption === "" && payment?.ModeName?.toLowerCase() === "upi" && <p> UPI</p>} */}
-
-                    <div
-                      style={{
-                        display: 'flex',
-                        flexDirection: 'row',
-                        columnGap: '0.5rem',
-                        fontFamily: 'Poppins',
-                      }}
-                    >
-                      {payment.ModeName}
-                      {payment?.ModeName?.toLowerCase() === 'card' && (
-                        <CardPopover
-                          CardPayOption={CardPayOption}
-                          SelectedCardOption={SelectedCardOption}
-                          AddCardOption={AddCardOption}
-                          CardOptionOpen={CardOptionOpen}
-                          EnableCardOptions={EnableCardOptions}
-                          paygate={paygate}
-                          paydevice={paydevice}
-                        />
-                      )}
-                      {payment?.ModeName?.toLowerCase() === 'upi' && (
-                        <UpiPopover
-                          UpiOptionOpen={UpiOptionOpen}
-                          UpiPayOption={UpiPayOption}
-                          SelectedUPIPayOption={SelectedUPIPayOption}
-                          AddUPIPaymentOption={AddUPIPaymentOption}
-                          PaymentUpiOptions={PaymentUpiOptions}
-                          UpiOption={UpiOption}
-                          UpiId={UpiId}
-                          paygate={paygate}
-                          paydevice={paydevice}
-                          EnableUpiOptions={EnableUpiOptions}
-                          PaymentgatewayUPI={PaymentgatewayUPI}
-                          PaymentDeviceUPI={PaymentDeviceUPI}
-                          SelectedUpiOption={SelectedUpiOption}
-                          addUpiOption={addUpiOption}
-                          hideDefault={hideDefault}
-                        />
-                      )}
-                    </div>
-                  </button>
-                </div>
-              ))
-            ) : (
-              <div
-                onClick={handlepaymentoptions}
-                style={{ cursor: 'pointer' }}
-                className="payment-error-msg"
-              >
-                Please Set Payment Options
-              </div>
-            )}
-
-            {paybtns?.length > 1 && (
-              <div
-                style={{
-                  pointerEvents:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 'none'
-                      : 'auto',
-                  opacity:
-                    (BookingType === 'Dine In' ||
-                      BookingTypeBoth ||
-                      CheckOrderType?.length > 0) &&
-                      !unpaidFlow &&
-                      OrderStatus
-                      ? 0.5
-                      : 1,
-                }}
-              >
-                <TooltipWrapper
-                  title="Split Payment (Alt + S)"
-                  isMobile={isMobile}
-                >
-                  {' '}
-                  <div
-                    className="BSBillingNav-icon-table-icon splitpaymantBTNCombo"
-                    onClick={
-                      CheckBookingStatus != 'Close' && !addnewAccess
-                        ? SplitPaymentOpen
-                        : ''
-                    }
-                    style={{
-                      cursor:
-                        OrderCardDetail?.length === 0 ||
-                          CheckBookingStatus == 'Close' ||
-                          addnewAccess
-                          ? 'not-allowed'
-                          : 'pointer',
-                      color:
-                        OrderCardDetail?.length === 0 ||
-                          CheckBookingStatus == 'Close' ||
-                          addnewAccess
-                          ? '#fff'
-                          : '#ffffffff',
-                      alignItems: 'center',
-                    }}
-                  >
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        width: '100%',
-                        justifyContent: 'center',
-                        gap: '4px',
-                      }}
-                    >
-                      <PozoSplitPaymentIcon />
-                      Split Pay
-                    </div>
-                  </div>
-                </TooltipWrapper>
-              </div>
-            )}
-          </div>
-        </TooltipWrapper>
-
-        {/* <div className='BSC1Payment-div2-2'>
-                    <select className='BSC1Payment-div2-button'>
-                        <option className='BSC1Payment-div1-btns'>CASH</option>
-                        <option className='BSC1Payment-div1-btns'>CARD</option>
-                        <option className='BSC1Payment-div1-btns'>UPI</option>
-                    </select>
-                </div> */}
-
-        <div class="BSC1Payment-vl"></div>
-
-        <div className="BSC1Payment-div3">
-          <div className="BSC1Payment-div4-sub1">
-            <div
-              style={{
-                display: 'flex',
-                flexDirection: 'column',
-                rowGap: '1rem',
-              }}
-            >
-              <div
-                style={{ display: 'flex', alignItems: 'center' }}
-                className="BSC1Payment-div4-naming"
-              >
-                <div style={{ width: '3rem' }}>Items </div>
-                <div style={{ width: '4px' }}> : </div>
-                <div style={{ textAlign: 'right', width: '1rem' }}>
-                  {' '}
-                  {TotalItems}{' '}
-                </div>
-              </div>
-              <div
-                style={{ display: 'flex', alignItems: 'center' }}
-                className="BSC1Payment-div4-naming"
-              >
-                <div style={{ width: '3rem' }}>Qty </div>
-                <div style={{ width: '4px' }}> : </div>
-                <div style={{ textAlign: 'right', width: '1rem' }}> {Qty} </div>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div class="BSC1Payment-vl"></div>
-
-        <div className="BSC1Payment-div4">
-          {(addcustomer || hold) && (
-            <FeaturesFunctionalities
-              handleAddCustomerCancel={handleAddCustomerCancel}
-              addcustomer={addcustomer}
-              handleHoldCancel={handleHoldCancel}
-              modalOpen={hold}
-              closeModal={() => setHold(false)}
+              }
             />
           )}
-          <div className="BSC1Payment-div4-payment newPaySectionCombo">
-            {Estimation?.SettingValue == 'Y' &&
-              BookingType !== 'Dine In' &&
-              !BookingTypeBoth && (
-                <div
-                  style={{
-                    color: '#1292EE',
-                    pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                  }}
-                >
-                  <BSNavBarEstimate />
-                </div>
-              )}
-            {BSComboData?.BookingBilling?.[1]?.map((item) => (
-              <>
-                {/* {item?.OptionName=="Hold" && */}
-                {unpaidFlow == false
-                  ? item?.OptionName == 'Hold' &&
-                  BookingType !== 'Dine In' &&
-                  !BookingTypeBoth &&
-                  OrderCardDetail?.length != 0 &&
-                  CheckOrderType?.length === 0 &&
-                  OrderType != 'Failed' &&
-                  CheckBookingStatus != 'Close' &&
-                  !addnewAccess && (
-                    <TooltipWrapper title={'Hold'} isMobile={isMobile}>
-                      {' '}
-                      <div
-                        style={{
-                          backgroundColor: '' ? '#52c41a' : '#1292EE',
-                          color: '' ? '#52c41a' : '#ffffffff',
-                          height: '40px',
-                          width: '45px',
-                          borderRadius: '6px',
-                          display: 'flex',
-                          alignItems: 'center',
-                          justifyContent: 'center',
-                          padding: '8px 8px 12px 8px',
-                        }}
-                      >
-                        <PozoHoldIcon
-                          className="BSBillingNav-icon-table-icon"
-                          onClick={() => AddBookingDetails('Hold')}
-                          style={{
-                            cursor: 'pointer',
-                            // color: '' ? '#52c41a' : '#1292EE',
-                          }}
-                        />{' '}
-                        <p className="payOptionDecition"> Hold</p>
-                      </div>
-                    </TooltipWrapper>
-                  )
-                  : ''}
-
-                {unpaidFlow == false
-                  ? item?.OptionName == 'Hold' &&
-                  BookingType !== 'Dine In' &&
-                  !BookingTypeBoth &&
-                  Holddata?.length > 0 &&
-                  OrderCardDetail?.length == 0 &&
-                  CheckBookingStatus != 'Close' &&
-                  !addnewAccess && (
-                    <TooltipWrapper title={'Recall'} isMobile={isMobile}>
-                      {' '}
-                      <Badge
-                        count={Holddata?.length}
-                        size={'small'}
-                        offset={[0, 7]}
-                      >
-                        <div
-                          style={{
-                            backgroundColor: Holddata ? '#52c41a' : 'default',
-                            color: Holddata ? '#ffffffff' : 'default',
-                            height: '40px',
-                            width: '45px',
-                            borderRadius: '6px',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            padding: '8px 8px 12px 8px',
-                          }}
-                        >
-                          <PozoHoldIcon
-                            className="BSBillingNav-icon-table-icon"
-                            onClick={() => HandleholdModelOpen()}
-                            style={{
-                              cursor: 'pointer',
-                              // color: Holddata ? '#52c41a' : 'default',
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                            }}
-                          />
-                        </div>
-                      </Badge>
-                    </TooltipWrapper>
-                  )
-                  : ''}
-                {tabledata?.length > 0 && dinePreference && (
-                  <>
-                    {item?.OptionName == 'UnpaidBill' && (
-                      <TooltipWrapper title="Unpaid Bills" isMobile={isMobile}>
-                        {' '}
-                        <div
-                          style={{
-                            backgroundColor: unpaidFlow ? '#52c41a' : '#1292EE',
-                            color: unpaidFlow ? '#ffffffff' : '#ffffffff',
-                            height: '45px',
-                            width: '45px',
-                            borderRadius: '6px',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            padding: '4px 8px 14px 8px',
-                          }}
-                        >
-                          <PozoUnpaidIcon
-                            className="BSBillingNav-icon-table-icon"
-                            style={{
-                              fontSize: '27px',
-                              cursor: 'pointer',
-                              pointerEvents:
-                                OrderType === 'Failed' ? 'none' : 'auto',
-                              height: '45px',
-                              width: '45px',
-                              borderRadius: '6px',
-                              display: 'flex',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                              padding: '4px 8px 14px 8px',
-                            }}
-                            onClick={() => {
-                              (setUnpaidOpen(true), getUnpaiddatas());
-                            }}
-                          />
-                        </div>
-                      </TooltipWrapper>
-                    )}
-                  </>
-                )}
-              </>
-            ))}
-            {BSComboData?.BookingBilling?.[1]?.filter(
-              (item) => item.OptionName === 'AddCustomer'
-            ).length === 1 ? (
-              <>
-                {Object.keys(useOptions)?.length > 0 &&
-                  useOptions?.some((flow) =>
-                    flow.OptionDetails.some(
-                      (option) =>
-                        option.OptionName === 'Pay at the counter' &&
-                        option.ModeDetails.some(
-                          (mode) => mode.ModeName === 'Credit'
-                        )
-                    )
-                  ) && (
-                    <React.Fragment key="CreditCustomerFragment">
-                      <TooltipWrapper
-                        title="Advance Amount"
-                        isMobile={isMobile}
-                      >
-                        <div
-                          style={{
-                            backgroundColor:
-                              OrderCardDetail?.length > 0 ||
-                                (selOption?.value === undefined &&
-                                  GlobalAddCustomerDetails1?.length === 0 &&
-                                  GetCustId?.CustMobile === undefined)
-                                ? 'gray'
-                                : '#1292eeff',
-                            color: '#fff',
-                            height: '40px',
-                            width: '45px',
-                            borderRadius: '6px',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            padding: '8px 8px 12px 8px',
-                          }}
-                        >
-                          {' '}
-                          <PozoAdvanceIcon
-                            className="BSBillingNav-icon-table-icon"
-                            onClick={CreditCustomerFun}
-                            style={{
-                              cursor:
-                                OrderCardDetail?.length > 0 && 'not-allowed',
-                              // color:
-                              //   OrderCardDetail?.length > 0 ||
-                              //   (selOption?.value === undefined &&
-                              //     GlobalAddCustomerDetails1?.length === 0 &&
-                              //     GetCustId?.CustMobile === undefined)
-                              //     ? 'gray'
-                              //     : '#1292eeff',
-                              fontSize: '28px',
-                            }}
-                          />{' '}
-                          <p className="payOptionDecition">Adv Amt</p>
-                        </div>
-                      </TooltipWrapper>
-                    </React.Fragment>
-                  )}
-              </>
-            ) : (
-              ''
-            )}
-
-            {/* Customer Orders */}
-            {GetCustId && (
-              <Tooltip title="Customer Orders" isMobile={isMobile}>
-                {' '}
-                <div
-                  className="BSBillingNav-icon-table-icon"
-                  onClick={() => {
-                    if (
-                      CheckBookingStatus !== 'Close' &&
-                      !addnewAccess &&
-                      !(OrderCardDetail?.length > 0)
-                    ) {
-                      setCustomerPreviesOrders(true);
-                    }
-                  }}
-                  style={{
-                    cursor: OrderCardDetail?.length > 0 && 'not-allowed',
-                    color:
-                      OrderCardDetail?.length > 0 ||
-                        (OrderCardDetail?.length > 0 &&
-                          GetCustId?.CustMobile === undefined)
-                        ? 'gray'
-                        : 'rgb(255, 255, 255)',
-                    color: '#fff',
-                    height: '40px',
-                    width: '45px',
-                    borderRadius: '6px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    padding: '5px 5px 6px 5px',
-                    background: 'rgb(18, 146, 238)'
-                  }}
-                >
-                  <FaCartPlus style={{
-                    fontSize: '20px',
-                  }} />Cust Orders
-                </div>
-              </Tooltip>
-            )}
-            {FeatureAddonData?.FeatureDtls?.find(
-              (item) => item?.FeatureAddonName?.toLowerCase() === 'preorder'
-            ) && (
-                <>
-                  {
-                    <div
-                      style={{
-                        pointerEvents:
-                          OrderCardDetail?.length > 0 || OrderType === 'Failed'
-                            ? 'none'
-                            : 'auto',
-                        opacity: OrderCardDetail?.length > 0 ? 0.5 : 1,
-                      }}
-                    >
-                      <TooltipWrapper title={'Pre Order'} isMobile={isMobile}>
-                        <Badge
-                          count={preOrderPendingCount}
-                          offset={[-5, 10]}
-                          size="small"
-                        >
-                          <PozoPreOrderIcon
-                            className="BSBillingNav-icon"
-                            fill={preOrderOpen ? '#52C41A' : '#1292EE'}
-                            onClick={() => {
-                              openPreOrder();
-                            }}
-                          />
-                        </Badge>
-                      </TooltipWrapper>
-                    </div>
-                  }
-                </>
-              )}
-            {preOrderOpen && <BSNavBarPreOrder />}
-            {sportsAppPreference && <BSMembership />}
-            {dinePreference &&
-              (BookingType === 'Dine In' ||
-                BookingTypeBoth ||
-                CheckOrderType?.length > 0) &&
-              !unpaidFlow && (
-                <>
-                  <TooltipWrapper title="ORDER" isMobile={isMobile}>
-                    {' '}
-                    <PozoDineInIcon
-                      className={
-                        FirstPaymentclick === false && !addnewAccess
-                          ? OrderStatus
-                            ? 'Dinein-order-btn pulse-element ChairClrRed'
-                            : 'Dinein-order-btn pulse-element ChairClrGreen'
-                          : 'Dinein-order-btn-disabled pulse-element'
-                      }
-                      onClick={() =>
-                        FirstPaymentclick === false && !addnewAccess
-                          ? changeOrderStatus()
-                          : ''
-                      }
-                      style={{
-                        pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      }}
-                    />
-                  </TooltipWrapper>
-                  {FirstPaymentclick === false &&
-                    !addnewAccess &&
-                    !OrderStatus && <BSTipAmount />}
-                </>
-              )}
-            {OrderCardDetail?.length > 0 && ParkingDisplay && (
-              <div
-                style={{
-                  width: '1.5rem',
-                  color: 'rgb(18, 146, 238)',
-                  display: 'flex',
-                  alignItems: 'center',
-                  height: '2.46rem',
-                }}
-              >
-                <BSOtherServiceClaim />
-              </div>
-            )}
-            {unpaidFlow == true ? (
-              <TooltipWrapper title="Print Bill" isMobile={isMobile}>
-                <PozoBillIcon
-                  className="Hover"
-                  style={{
-                    fontSize: '25px',
-                    cursor: 'pointer',
-                    color: unpaidFlow ? '#52c41a' : '#1292EE',
-                  }}
-                  onClick={() => {
-                    Recipt();
-                  }}
-                />
-              </TooltipWrapper>
-            ) : (
-              ''
-            )}
-            {/* <div>
-              <Popover
-                content={<><a onClick={hide}><AiOutlineClose color='black' /></a>
-                  <BSSummery1 />
-                </>
-                }
-                trigger="click"
-                open={open}
-                onOpenChange={handleOpenChange}
-              >
-                <TooltipWrapper placement="topRight" title='SUMMARY' isMobile={isMobile}><UpCircleOutlined style={{ color: "rgb(18, 146, 238)" }} className='BSC1Payment-icon-button' /></TooltipWrapper>
-              </Popover>
-            </div> */}
-            {/* {ComboDropDown?.length >= 1 && (
-              <div style={{ fontSize: '1.5rem', color: 'rgb(18, 146, 238)' }}>
-                <TooltipWrapper title="Combo Product" isMobile={isMobile}>
-                  <GiBasket
-                    fill={Comboglobal === true ? '#52C41A' : '#1292EE'}
-                    onClick={handleClick}
-                    style={{
-                      pointerEvents: OrderType === 'Failed' ? 'none' : 'auto',
-                      cursor: 'pointer',
-                    }}
+          {ModalVarient && (
+            <DefaultModal
+              title={
+                <div className="EditQuantity-title">
+                  <FormHeader
+                    title={AvailableDate ? 'Slots' : 'Item Variant'}
                   />
-                </TooltipWrapper>
-              </div>
-            )} */}
-            {paymentfeataddon && (
-              <TooltipWrapper title="Failed Payment" isMobile={isMobile}>
-                <div
-                  onClick={() => {
-                    paymentFailedStatusFun();
-                  }}
-                  style={{
-                    width: '27px',
-                    cursor: 'pointer',
-                    fontWeight: '600',
-                    color: 'rgb(18, 146, 238)',
-                  }}
-                >
-                  <PozoFailedPaymentsIcon />
                 </div>
-              </TooltipWrapper>
-            )}
-            {OpenFailData && (
-              <PaymentFailedSales
-                paymentFailedStatusFun={paymentFailedStatusFun}
-                OpenFailData={OpenFailData}
-              />
-            )}
-          </div>
-        </div>
-        <div className="selctcusandpayBTNforCombo">
-          {BSComboData?.BookingBilling?.[1]?.map((item) => (
-            <>
-              {item?.OptionName == 'AddCustomer' && !preOrderOpen && (
-                <div
-                  style={{ display: 'flex', gap: '0', alignItems: 'center' }}
-                >
-                  <BSCustomerSelect />
-                  <TooltipWrapper title={'Add Customer'} isMobile={isMobile}>
-                    <div>
-                      <PozoAddCustomerIcon
-                        className="BSBillingNav-icon-table-icon bspaymentcomboAddCus"
-                        onClick={handleAddCustomer}
-                        style={{
-                          display: 'flex',
-                          fontSize: '20px',
-                          width: '35px',
-                          height: '40px',
-                          padding: '4px',
-                          borderRadius: '0 6px 6px 0',
-                          cursor: Custdisable ? 'not-allowed' : 'pointer',
-                          color:
-                            selOption || GetCustId ? '#ffffffff' : '#ffffffff',
-                          backgroundColor:
-                            selOption || GetCustId ? '#52c41a' : '#1292EE',
-                        }}
-                      />
-                    </div>
-                  </TooltipWrapper>
-                </div>
-              )}
-            </>
-          ))}
-
-          <div className="comboTotalBillBTN">
-            <TooltipWrapper title="Create Bill (F4)" isMobile={isMobile}>
-              <button
-                className={
-                  // (empData?.AddAccess === "N" || SAAccessCommonMaster?.AddAccess === "N")
-                  addnewAccess
-                    ? 'BSC1Payment-div4-button-disable'
-                    : FirstPaymentclick === false &&
-                      OrderCardDetail?.length > 0 &&
-                      paybtnselected &&
-                      CheckBookingStatus != 'Close'
-                      ? !OrderStatus
-                        ? 'BSC1Payment-div4-button'
-                        : 'BSC1Payment-div4-button Order'
-                      : 'BSC1Payment-div4-button-disable'
-                }
-                // onClick={() => {
-                //   (qrCode && SelectedUPIPayOption === "Default") ? UpiPayment() : OrderStatus ? AddBookingDetails("Dine-In") : AddBookingDetails(BookingType, true);
-                // }}
-                onClick={handleButtonClick}
-                style={{ borderRadius: '6px 0 0 6px' }}
-              >
-                {!OrderStatus ? (
-                  <>
-                    {isMobile ? (
-                      `₹ ${safeRound(
-                        OrderType === 'Failed'
-                          ? FailedTotalAmt
-                          : credit && overAllBal >= 0
-                            ? Math.max(0, TotalAmount - overAllBal)
-                            : TotalAmount
-                      )}`
-                    ) : (
-                      <div>
-                        ₹
-                        <CountUp
-                          duration={0.4}
-                          className="counter"
-                          end={safeRound(
-                            OrderType === 'Failed'
-                              ? FailedTotalAmt
-                              : credit && overAllBal >= 0
-                                ? Math.max(0, TotalAmount - overAllBal)
-                                : TotalAmount
-                          )}
-                        />
+              }
+              open={ModalVarient}
+              width={500}
+              top={0}
+              footer={null}
+              handleCancel={CloseVarientModal}
+              maskTransitionName=""
+              transitionName=""
+              children={
+                <div className="EditQuantity-Master">
+                  <div
+                    className="EditQuantity-heading"
+                    style={{
+                      display: 'flex',
+                      flexDirection: 'column',
+                      marginBottom: '3rem',
+                      alignItems: 'start',
+                    }}
+                  >
+                    <div style={{ display: 'flex' }}>
+                      <div className="EditQuantity-headingname">
+                        <p className="EditQuantity-itemname">Item Name:</p>
                       </div>
-                    )}
-                    <AiOutlineArrowRight width="25px" height="25px" />
-                  </>
-                ) : (
-                  <div className="Table4-Order">ORDER</div>
-                )}
-              </button>
-            </TooltipWrapper>
-            <Popover
-              content={
+                      <div
+                        className="EditQuantity-headingproductname"
+                        style={{ marginLeft: '1rem' }}
+                      >
+                        <p className="EditQuantity-productname">
+                          {qtydata?.ProdName}
+                        </p>
+                      </div>
+                    </div>
+                    <div style={{ display: 'flex' }}>
+                      <div className="EditQuantity-headingname">
+                        <p className="EditQuantity-itemname">Item Unit:</p>
+                      </div>
+                      <div
+                        className="EditQuantity-headingproductname"
+                        style={{ marginLeft: '1rem' }}
+                      >
+                        <p className="EditQuantity-productname">
+                          {qtydata?.ProductDetail?.[QtyIndex]?.Size}{' '}
+                          {onePeiceFlow
+                            ? 'PCS'
+                            : qtydata?.ProductDetail?.[QtyIndex]?.UomName}
+                        </p>
+                      </div>
+                    </div>
+                  </div>
+
+                  <div className="Re-Print-table">
+                    <Tables columns={varientcolumns} data={varientdataSource} />
+                  </div>
+                </div>
+              }
+            />
+          )}
+          {productPriceChange && priceChangeProduct?.length > 0 && (
+            <ProductPriceChange
+              showButton={false}
+              priceChangeProduct={priceChangeProduct}
+              productPriceChange={productPriceChange}
+              setProductPriceChange={setProductPriceChange}
+              setPriceChangeProduct={setPriceChangeProduct}
+            />
+          )}
+
+          {newMoreProductModel && (
+            <DefaultModal
+              // title="Add  Product"
+              destroyOnClose
+              open={newMoreProductModel}
+              width={900}
+              top={0}
+              footer={true}
+              handleSubmit={handleBulkUpload}
+              handleCancel={() => setNewMoreProductModel(false)}
+              children={
                 <>
-                  <a onClick={hide}>
-                    <AiOutlineClose color="black" />
-                  </a>
-                  <BSSummery1 />
+                  <AddProduct products={products} setProducts={setProducts} />
                 </>
               }
-              trigger="click"
-              open={open}
-              onOpenChange={handleOpenChange}
-            >
-              <TooltipWrapper
-                placement="topRight"
-                title="SUMMARY"
-                isMobile={isMobile}
-              >
-                <UpCircleOutlined
-                  style={{
-                    color: '#ffffffff',
-                    backgroundColor: '#1292ee',
-                    height: '50px',
-                    width: '35px',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    borderRadius: '0 6px 6px 0',
-                    padding: '7px',
-                    marginTop: '0px',
-                  }}
-                  className="BSC1Payment-icon-button"
-                />
-              </TooltipWrapper>
-            </Popover>
-          </div>
-        </div>
-        {PrintOrderDetails?.length > 0 &&
-          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <PaymentPdfBooking
-                index={index}
-                table2Data={orderDetail}
-                singleData2={orderDetail?.productDetails}
-                orderId={
-                  orderDetail?.OrderId &&
-                  extractLastNumberOrderId(
-                    orderDetail?.OrderId,
-                    orderDetail?.FYStatus
-                  )
-                }
-                CreatedDate={orderDetail?.CreatedDate}
-                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-                Preference={SettingDataSelector}
-              />
-            </div>
-          ))}
-        {PrintOrderDetails?.length > 0 &&
-          (TokenOnly?.SettingValue === 'Y' ||
-            IndividualToken?.SettingValue === 'Y') &&
-          PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
-            <div style={{ display: 'none' }}>
-              <TokensinglePrint
-                index={index}
-                table2Data={orderDetail}
-                singleData2={orderDetail?.productDetails}
-                orderId={
-                  orderDetail?.OrderId &&
-                  extractLastNumberOrderId(
-                    orderDetail?.OrderId,
-                    orderDetail?.FYStatus
-                  )
-                }
-                CreatedDate={orderDetail?.CreatedDate}
-                PaymentStatus={PrintOrderDetails?.[0]?.PaymentOrderDtl}
-              />
-            </div>
-          ))}
-        {CreditCustomer && (
-          <div style={{ display: 'none' }}>
-            <BsBillingCreditCustomer
-              ModalCreditCustomer={CreditCustomer}
-              handlemodalclose={() => {
-                handleCreditCustomer('Cancel');
-              }}
-              handleOk={() => {
-                handleCreditCustomer('Submit');
-              }}
-            />
-          </div>
-        )}
-      </div>
-      {UpiOpen && (
-        <DefaultModal
-          open={UpiOpen}
-          title="UPI PAYMENT"
-          width={500}
-          handleCancel={() => {
-            Upimodel('Cancel');
-          }}
-          footer={false}
-          children={
-            <div style={{ overflow: 'scroll' }}>
-              {/* <h1 className="formHeader">UPI PAYMENT</h1> */}
-
-              <div
-                style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  justifyContent: 'space-evenly',
-                  alignItems: 'center',
-                }}
-              >
-                <div>
-                  <QrinScreen
-                    Amount={
-                      OrderType === 'Failed'
-                        ? FailedTotalAmt
-                        : Math.round(TotalAmount)
-                    }
-                    UpiId={UpiId}
-                  />
-                </div>
-
-                <div>
-                  <h1>
-                    {' '}
-                    RS :
-                    {OrderType === 'Failed'
-                      ? FailedTotalAmt
-                      : Math.round(TotalAmount)}{' '}
-                  </h1>
-                </div>
-              </div>
-
-              <div className="sentok">
-                {(selOption || SelCustId) && (
-                  <div className="sentLink" onClick={onFinalSubmit}>
-                    Sent Payment Link
-                    <img
-                      src={WpIcon}
-                      alt="Your Alt Text"
-                      style={{ width: '30px', height: '30px' }}
-                    />
-                    {/* <ArrowRightOutlined /> */}
-                  </div>
-                )}
-
-                <div
-                  style={{
-                    display: 'flex',
-                    flexDirection: 'row-reverse',
-                    width: '100px',
-                  }}
-                >
-                  <Buttons
-                    buttonText="OK"
-                    color="901D77"
-                    icon={<ArrowRightOutlined />}
-                    handleSubmit={() => {
-                      Upimodel('Submit');
-                    }}
-                  />
-                </div>
-              </div>
-            </div>
-          }
-        />
-      )}
-      {unpaidopen && (
-        <DefaultModal
-          open={unpaidopen}
-          title="UNPAID BILL'S"
-          width={1000}
-          handleCancel={() => {
-            setUnpaidOpen(false);
-          }}
-          footer={false}
-          children={
-            <div style={{ height: '400px', overflow: 'scroll' }}>
-              <Tables
-                columns={columns}
-                data={TableData}
-                dataSource={TableData}
-              // pagination={handlePageChange}
-              // onChange={handleChange}
-              />
-            </div>
-          }
-        />
-      )}
-      {/* <Modal title="Add Customer" open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
-
-            </Modal> */}
-      {UnpaidConfirmation && (
-        <Modal
-          open={UnpaidConfirmation}
-          width={500}
-          children={
-            <>
-              <div>
-                You have already selected a table. If you click 'OK,' the table
-                selection will be removed, and the unpaid flow will continue. If
-                you click 'Cancel,' the dine-in flow will proceed as selected.
-              </div>
-            </>
-          }
-          onOk={UnpaidOk}
-          onCancel={Unpaidclose}
-        />
-      )}
-      {Splitpayment && (
-        <SplitPayment
-          SplitPaymentModal={Splitpayment}
-          handlesplitpaymentclose={handlesplitpaymentclose}
-          TotalNetAmount={
-            OrderType === 'Failed' ? FailedTotalAmt : Math.round(TotalAmount)
-          }
-          failedOrderData={failedOrderData}
-        />
-      )}
-      {PrintOrderDetails?.length > 0 && (
-        <div
-          style={{
-            display: 'flex',
-            gap: '1rem',
-            justifyContent: 'center',
-            margin: '1rem 0',
-          }}
-        >
-          {filteredSettingNames?.includes('whatsapp') &&
-            MobileNoWhatsApp?.value && (
-              <FaWhatsapp
-                size={32}
-                color="#25D366"
-                style={{ cursor: 'pointer' }}
-                onClick={handleWhatsAppClick}
-                title="Share on WhatsApp"
-              />
-            )}
-
-          <FaPrint
-            size={32}
-            color="#1292EE"
-            style={{ cursor: 'pointer' }}
-            onClick={handlePrintOrToken}
-            title="Print"
-          />
-
-          {filteredSettingNames?.includes('SMS') && isMobile && (
-            <MdSms
-              size={32}
-              color="#FF8800"
-              style={{ cursor: 'pointer' }}
-              onClick={handleSMSClick}
-              title="Send SMS"
             />
           )}
-          {/* WhatsAppShare modal/component */}
-          {showWhatsAppShare && (
-            <WhatsAppShare
-              message={encodedMessage}
-              mobileNumber={MobileNoWhatsApp?.value}
-              onClose={() => closePrintOption(false)}
-            />
-          )}
-          {showSMSShare && isMobile && (
-            <SMSShare
-              message={encodedMessage}
-              mobileNumber={MobileNoWhatsApp?.value}
-              onClose={() => closePrintOption(false)}
-            />
-          )}
-        </div>
-      )}
-      <DefaultModal
-        className={'paymentoptionsModal'}
-        open={GlobalSalesPaymentoptions}
-        width={500}
-        height={1000}
-        handleCancel={() => {
-          dispatch(changeSalesPaymentoption(false));
-        }}
-        footer={false}
-        children={
-          <div
-            className="paymentoptionsModalContent"
-            style={{ overflow: 'scroll' }}
-          >
-            <Paymentoption onSuccess={getPaymentOptionFeature} />
-          </div>
-        }
-      />
-      {customerPreviesOrders && (
-        <DefaultModal
-          open={customerPreviesOrders}
-          handleCancel={() => setCustomerPreviesOrders(false)}
-          footer={false}
-          width={700}
-          className={'ModalPaymentGatewayEmbedded'}
-          children={
-            <>
-              <CustomerOrders
-                CustomerDetails={selOption}
-                close={() => setCustomerPreviesOrders(false)}
-              />
-            </>
-          }
-        />
-      )}
-    </>
-  );
+        </>
+      </Suspense>
+    );
+    for (let i = 0; i < code?.length; i++) {
+      encrypted += String.fromCharCode(
+        code.charCodeAt(i) ^ key.charCodeAt(i % key.length)
+      );
+    }
+    return encrypted;
+  }
+
+  function decrypt(encrypted, key) {
+    // Implement decryption logic
+    let decrypted = encrypt();
+    for (let i = 0; i < encrypted?.length; i++) {
+      decrypted += String.fromCharCode(
+        encrypted.charCodeAt(i) ^ key.charCodeAt(i % key.length)
+      );
+    }
+    return decrypted;
+  }
+
+  const encryptedCode = encrypt(); // Encrypted React component code
+  const decryptionKey = decrypt(); // Decryption key (keep it secure)
+  const decryptedCode = decrypt(encryptedCode, decryptionKey);
+
+  return <>{encrypt()}</>;
 };
 
-export default BSC1Payment;
+export default React.memo(BSItemCard);
diff --git a/src/routesConfig.jsx b/src/routesConfig.jsx
index d90267a..f48462a 100644
--- a/src/routesConfig.jsx
+++ b/src/routesConfig.jsx
@@ -684,7 +684,7 @@ const initSession = () => {
 
   sessionStorage.setItem(
     'auth',
-    'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1lIjoiOTM2MDY0MjI0NCIsIlBhc3N3b3JkIjoiWkB6MTIzNCIsImF1ZCI6WyJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTMiLCJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTIiLCJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTQiLCJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTMiXSwiZXhwIjoxNzcwOTIyMDEyLCJpc3MiOiJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMDEifQ.8iuEF8S7kW1OvVUda3YAx9v7ilp-uy9PVfbBvCPoq20'
+    'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1lIjoiOTM2MDY0MjI0NCIsIlBhc3N3b3JkIjoiWkB6MTIzNCIsImF1ZCI6WyJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTMiLCJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTIiLCJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTQiLCJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMTMiXSwiZXhwIjoxNzcxODcyOTYwLCJpc3MiOiJodHRwOi8vMTkyLjE2OC4xLjM3OjgwMDEifQ.tRA41-3-m2VYm_jkndGPLzB-jxzuO1XvG94Fmf6NTGQ'
   );
 };