diff --git a/src/App.js b/src/App.js
index 57cf6a6..1904384 100644
--- a/src/App.js
+++ b/src/App.js
@@ -53,6 +53,7 @@ function App() {
   const [guestSideOfClerk, setGuestSideOfClerk] = useState(null);
   const [guestSides, setGuestSides] = useState([]);
   const [shopId, setShopId] = useState("");
+  const [shopIdentifier, setShopIdentifier] = useState("");
   const [table, setTable] = useState([]);
   const [totalItemsCount, setTotalItemsCount] = useState(0);
   const [deviceType, setDeviceType] = useState("");
@@ -94,12 +95,12 @@ function App() {
     };
   }, [shopId]);
 
-  const handleSetParam = async ({ shopId, tableCode }) => {
-    setShopId(shopId);
+  const handleSetParam = async ({ shopIdentifier, tableCode }) => {
+    setShopIdentifier(shopIdentifier);
 
     if (tableCode)
       if (table.length == 0) {
-        const gettable = await getTableByCode(shopId, tableCode);
+        const gettable = await getTableByCode(shopIdentifier, tableCode);
         if (gettable) setTable(gettable);
       }
   };
@@ -108,8 +109,9 @@ function App() {
     const fetchData = async () => {
       console.log("gettingItems");
       try {
-        const { response, cafe, data } = await getItemTypesWithItems(shopId);
+        const { response, cafe, data } = await getItemTypesWithItems(shopIdentifier);
         if (response.status === 200) {
+          setShopId(cafe.cafeId)
           setShop(cafe);
           setShopItems(data);
           console.log(data)
@@ -124,11 +126,11 @@ function App() {
           // Update local storage by removing unavailable items
           const updatedLocalStorage =
             JSON.parse(localStorage.getItem("cart")) || [];
-          const newLocalStorage = updatedLocalStorage.map((cafe) => {
-            if (cafe.cafeId === shopId) {
+          const newLocalStorage = updatedLocalStorage.map((cafee) => {
+            if (cafee.cafeId === cafe.cafeId) {
               return {
-                ...cafe,
-                items: cafe.items.filter((item) =>
+                ...cafee,
+                items: cafee.items.filter((item) =>
                   filteredData.some((filtered) =>
                     filtered.itemList.some(
                       (i) => i.itemId === item.itemId && i.availability
@@ -137,7 +139,7 @@ function App() {
                 ),
               };
             }
-            return cafe;
+            return cafee;
           });
           localStorage.setItem("cart", JSON.stringify(newLocalStorage));
 
@@ -150,8 +152,8 @@ function App() {
       }
     };
 
-    if (shopId !== "") fetchData();
-  }, [shopId]);
+    if (shopIdentifier !== "") fetchData();
+  }, [shopIdentifier]);
 
   const rmConnectedGuestSides = async (gueseSideSessionId) => {
     const sessionLeft = await removeConnectedGuestSides(gueseSideSessionId);
@@ -265,7 +267,7 @@ function App() {
       navigate("/guest-side");
     });
 
-    socket.on("updateQueue", ({queue}) => {
+    socket.on("updateQueue", ({ queue }) => {
       setQueue(queue); // Only set the queue if it's a valid non-empty array
       console.log("Updated Queue:", queue); // Log the valid queue
 
@@ -533,10 +535,11 @@ function App() {
             }
           />
           <Route
-            path="/:shopId/:tableCode?"
+            path="/:shopIdentifier/:tableCode?"
             element={
               <>
                 <CafePage
+                  shopId={shopId}
                   table={table}
                   sendParam={handleSetParam}
                   welcomePageConfig={shop.welcomePageConfig || false}
@@ -556,7 +559,7 @@ function App() {
                 />
                 <Footer
                   showTable={true}
-                  shopId={shopId}
+                  shopId={shopIdentifier}
                   table={table}
                   cartItemsLength={totalItemsCount}
                   selectedPage={0}
@@ -565,7 +568,7 @@ function App() {
             }
           />
           <Route
-            path="/:shopId/:tableCode?/search"
+            path="/:shopIdentifier/:tableCode?/search"
             element={
               <>
                 <SearchResult
@@ -579,7 +582,7 @@ function App() {
                   setModal={setModal} // Pass the function to open modal
                 />
                 <Footer
-                  shopId={shopId}
+                  shopId={shopIdentifier}
                   table={table}
                   cartItemsLength={totalItemsCount}
                   selectedPage={1}
@@ -588,10 +591,11 @@ function App() {
             }
           />
           <Route
-            path="/:shopId/:tableCode?/cart"
+            path="/:shopIdentifier/:tableCode?/cart"
             element={
               <>
                 <Cart
+                shopId={shopId}
                   table={table}
                   sendParam={handleSetParam}
                   socket={socket}
@@ -599,7 +603,7 @@ function App() {
                   deviceType={deviceType}
                 />
                 <Footer
-                  shopId={shopId}
+                  shopId={shopIdentifier}
                   table={table}
                   cartItemsLength={totalItemsCount}
                   selectedPage={2}
@@ -608,17 +612,18 @@ function App() {
             }
           />
           <Route
-            path="/:shopId/:tableCode?/invoice"
+            path="/:shopIdentifier/:tableCode?/invoice"
             element={
               <>
                 <Invoice
+                shopId={shopId}
                   table={table}
                   sendParam={handleSetParam}
                   socket={socket}
                   deviceType={deviceType}
                 />
                 <Footer
-                  shopId={shopId}
+                  shopId={shopIdentifier}
                   table={table}
                   cartItemsLength={totalItemsCount}
                   selectedPage={2}
@@ -627,15 +632,16 @@ function App() {
             }
           />
           <Route
-            path="/:shopId/:tableCode?/transactions"
+            path="/:shopIdentifier/:tableCode?/transactions"
             element={
               <>
                 <Transactions
+                shopId={shopId}
                   sendParam={handleSetParam}
                   deviceType={deviceType}
                 />
                 <Footer
-                  shopId={shopId}
+                  shopId={shopIdentifier}
                   table={table}
                   cartItemsLength={totalItemsCount}
                   selectedPage={3}
@@ -644,7 +650,7 @@ function App() {
             }
           />
           <Route
-            path="/:shopId/guest-side-login"
+            path="/:shopIdentifier/guest-side-login"
             element={<GuestSideLogin shopId={shopId} socket={socket} />}
           />
           <Route path="/guest-side" element={<GuestSide socket={socket} />} />
diff --git a/src/components/ButtonWithReplica.css b/src/components/ButtonWithReplica.css
index 2008495..cc0ed9a 100644
--- a/src/components/ButtonWithReplica.css
+++ b/src/components/ButtonWithReplica.css
@@ -64,7 +64,7 @@
 }
 
 .bussinessName.active {
-  top: -1000%;
+  top: -900%;
   position: absolute;
   color: rgb(0, 0, 0);
   width: 60vw;
@@ -75,12 +75,13 @@
   transition: all 0.5s ease-in-out;
 }
 .bussinessName h2 {
+  overflow-wrap: break-word;
   color: inherit; /* Ensures that it inherits the color from the parent */
 }
 .bussinessQR {
   position: absolute;
-  height: 25vh;
-  width: 25vh;
+  height: 480%;
+  width: 480%;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
diff --git a/src/components/ButtonWithReplica.js b/src/components/ButtonWithReplica.js
index d014b11..46ca793 100644
--- a/src/components/ButtonWithReplica.js
+++ b/src/components/ButtonWithReplica.js
@@ -60,7 +60,7 @@ const ButtonWithReplica = ({
         try {
           console.log(paymentUrl);
           const qrv = await decodeQRCodeFromUrl(paymentUrl);
-          setQRValue(qrv);
+          setQRValue('00020101021126760024ID.CO.SPEEDCASH.MERCHANT01189360081530001108500215ID10210011085060303UBE51440014ID.CO.QRIS.WWW0215ID20211101828900303UBE5204829953033605802ID5908DINNCAFE6008SURABAYA61056029462260506S155880105280940703A0163041E7B');
         } catch (error) {
           console.error(error);
         }
diff --git a/src/components/Header.js b/src/components/Header.js
index 66d984a..70d3b92 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -316,7 +316,7 @@ const Header = ({
       </Title>
       <div style={{ visibility: showProfile ? "visible" : "hidden" }}>
         <ProfileImage
-          src={user.username == undefined ? shopImage || 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS-DjX_bGBax4NL14ULvkAdU4FP3FKoWXWu5w&s' : "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS-DjX_bGBax4NL14ULvkAdU4FP3FKoWXWu5w&s"}
+          src={user.username == undefined && shopImage && !shopImage.includes('undefined') ? shopImage || 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS-DjX_bGBax4NL14ULvkAdU4FP3FKoWXWu5w&s' : "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS-DjX_bGBax4NL14ULvkAdU4FP3FKoWXWu5w&s"}
           alt="Profile"
           onClick={user.username !== undefined ? handleImageClick : null}
           animate={showRectangle && animate}
diff --git a/src/components/TablesPage.js b/src/components/TablesPage.js
index e3d4396..b1b2e03 100644
--- a/src/components/TablesPage.js
+++ b/src/components/TablesPage.js
@@ -176,6 +176,480 @@ const SetPaymentQr = ({ shop }) => {
     <div style={styles.container}>
       <h3 style={styles.title}>QR kedai</h3>
 
+      <div style={{ height: 80, position: 'relative', scale: '80%' }}>
+        <div
+          style={{
+            width: '100%',
+            height: 38,
+            left: 0,
+            top: 42,
+            position: 'absolute',
+            zIndex: 1,
+          }}
+        >
+          <div
+            style={{
+              width: '100%',
+              height: 38,
+              left: 0,
+              top: 0,
+              position: 'absolute',
+              overflow: 'hidden'
+            }}
+          >
+            <div
+              style={{
+                width: '100%',
+                height: 38,
+                left: 0,
+                top: 0,
+                position: 'absolute',
+                background: '#35363A',
+                boxShadow: '0px -1px 0px #DADCE0 inset',
+              }}
+            />
+            <div
+              style={{
+                width: 51,
+                height: 22,
+                left: 1375,
+                top: 8,
+                position: 'absolute',
+              }}
+            >
+              <div
+                style={{
+                  width: 16,
+                  height: 16,
+                  left: 35,
+                  top: 3,
+                  position: 'absolute',
+                }}
+              >
+                <img
+                  style={{
+                    width: 3,
+                    height: 12,
+                    left: 6.67,
+                    top: 2,
+                    position: 'absolute',
+                  }}
+                  src='https://via.placeholder.com/3x12'
+                />
+              </div>
+              <img
+                style={{
+                  width: 22,
+                  height: 22,
+                  left: 0,
+                  top: 0,
+                  position: 'absolute',
+                  borderRadius: 9999,
+                }}
+                src='https://via.placeholder.com/22x22'
+              />
+            </div>
+            <div
+              style={{
+                width: '100%',
+                height: 28,
+                left: 134,
+                top: 5,
+                position: 'absolute',
+              }}
+            >
+              <div
+                style={{
+                  width: '100%',
+                  height: 28,
+                  left: 0,
+                  top: 0,
+                  position: 'absolute',
+                  background: '#202124',
+                  borderRadius: 14,
+                }}
+              />
+              <div
+                style={{
+                  width: 16,
+                  height: 16,
+                  left: 1199,
+                  top: 6,
+                  position: 'absolute',
+                }}
+              >
+                <img
+                  style={{
+                    width: 12,
+                    height: 11.47,
+                    left: 2,
+                    top: 2,
+                    position: 'absolute',
+                  }}
+                  src='https://via.placeholder.com/12x11'
+                />
+              </div>
+              <div
+                style={{
+                  width: 165,
+                  height: 16,
+                  left: 33,
+                  top: 6,
+                  position: 'absolute',
+                }}
+              >
+                <div
+                  style={{
+                    left: 0,
+                    top: 0,
+                    position: 'absolute',
+                    justifyContent: 'flex-start',
+                    alignItems: 'center',
+                    display: 'inline-flex',
+                  }}
+                >
+                  <div
+                    style={{
+                      color: 'white',
+                      fontSize: 14,
+                      fontFamily: 'Roboto',
+                      fontWeight: '400',
+                      letterSpacing: 0.25,
+                      wordWrap: 'break-word',
+                    }}
+                  >
+                    kedaimaster.com/
+                  </div>
+                  <div
+                    style={{
+                      color: '#86888A',
+                      fontSize: 14,
+                      fontFamily: 'Roboto',
+                      fontWeight: '400',
+                      letterSpacing: 0.25,
+                      wordWrap: 'break-word',
+                    }}
+                  >
+                    galauers
+                  </div>
+                </div>
+              </div>
+              <div
+                style={{
+                  width: 12,
+                  height: 12,
+                  left: 11,
+                  top: 8,
+                  position: 'absolute',
+                }}
+              >
+                <img
+                  style={{
+                    width: 8,
+                    height: 10.5,
+                    left: 2,
+                    top: 0.5,
+                    position: 'absolute',
+                  }}
+                  src='https://via.placeholder.com/8x10'
+                />
+              </div>
+            </div>
+            <div
+              style={{
+                width: 109,
+                height: 16,
+                left: 12,
+                top: 11,
+                position: 'absolute',
+              }}
+            >
+              <div
+                style={{
+                  width: 16,
+                  height: 16,
+                  left: 93,
+                  top: 0,
+                  position: 'absolute',
+                }}
+              >
+                <img
+                  style={{
+                    width: 12,
+                    height: 12,
+                    left: 2,
+                    top: 2,
+                    position: 'absolute',
+                  }}
+                  src='https://via.placeholder.com/12x12'
+                />
+              </div>
+              <div
+                style={{
+                  width: 16,
+                  height: 16,
+                  left: 62,
+                  top: 0,
+                  position: 'absolute',
+                }}
+              >
+                <div
+                  style={{
+                    width: 12,
+                    height: 12,
+                    left: 2,
+                    top: 2,
+                    position: 'absolute',
+                    background: 'white',
+                  }}
+                ></div>
+              </div>
+              <div
+                style={{
+                  width: 16,
+                  height: 16,
+                  left: 31,
+                  top: 0,
+                  position: 'absolute',
+                }}
+              >
+                <div
+                  style={{
+                    width: 12,
+                    height: 11.69,
+                    left: 2,
+                    top: 2,
+                    position: 'absolute',
+                    background: '#86888A',
+                  }}
+                ></div>
+              </div>
+              <div
+                style={{
+                  width: 16,
+                  height: 16,
+                  left: 0,
+                  top: 0,
+                  position: 'absolute',
+                }}
+              >
+                <div
+                  style={{
+                    width: 12,
+                    height: 11.69,
+                    left: 2,
+                    top: 2,
+                    position: 'absolute',
+                    background: 'white',
+                  }}
+                ></div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          style={{
+            width: '100%',
+            height: 42,
+            left: 0,
+            top: 0,
+            position: 'absolute',
+          }}
+        >
+          <div
+            style={{
+              width: '100%',
+              height: 42,
+              left: 0,
+              top: 0,
+              position: 'absolute',
+            }}
+          >
+            <div
+              style={{
+                width: '100%',
+                height: 42,
+                left: 0,
+                top: 0,
+                position: 'absolute',
+                background: '#202124',
+                boxShadow: '0px 4px 4px rgba(0, 0, 0, 0.25)',
+                borderTopLeftRadius: 8,
+                borderTopRightRadius: 8,
+              }}
+            />
+            <div
+              style={{
+                width: 167,
+                height: 34,
+                left: 72,
+                top: 8,
+                position: 'absolute',
+              }}
+            >
+              <div
+                style={{
+                  width: 131,
+                  height: 34,
+                  left: 8,
+                  top: 0,
+                  position: 'absolute',
+                }}
+              >
+                <div
+                  style={{
+                    left: -6,
+                    top: 0,
+                    position: 'absolute',
+                    justifyContent: 'flex-start',
+                    alignItems: 'center',
+                    gap: 8,
+                    display: 'inline-flex',
+                  }}
+                >
+                  <div
+                    style={{
+                      justifyContent: 'flex-start',
+                      alignItems: 'flex-start',
+                      display: 'flex',
+                    }}
+                  >
+                    <div
+                      style={{ width: 6, height: 8, background: '#35363A' }}
+                    ></div>
+                    <div
+                      style={{
+                        padding: 8,
+                        background: '#35363A',
+                        borderTopLeftRadius: 8,
+                        borderTopRightRadius: 8,
+                        overflow: 'hidden',
+                        justifyContent: 'flex-start',
+                        alignItems: 'center',
+                        gap: 9,
+                        display: 'flex',
+                      }}
+                    >
+                      <img
+                        style={{ width: 16, height: 16 }}
+                        src='https://via.placeholder.com/16x16'
+                      />
+                      <div>
+                        <span
+                          style={{
+                            color: 'white',
+                            fontSize: 12,
+                            fontFamily: 'Roboto',
+                            fontWeight: '400',
+                            letterSpacing: 0.2,
+                            wordWrap: 'break-word',
+                          }}
+                        >
+                          KedaiMaster
+                        </span>
+                        <span
+                          style={{
+                            color: '#35363A',
+                            fontSize: 12,
+                            fontFamily: 'Roboto',
+                            fontWeight: '400',
+                            letterSpacing: 0.2,
+                            wordWrap: 'break-word',
+                          }}
+                        >
+                          .
+                        </span>
+                      </div>
+
+                      <div
+                        style={{ width: 18, height: 18, position: 'relative' }}
+                      >
+                        <div
+                          style={{
+                            width: 7.5,
+                            height: 7.5,
+                            left: 5.25,
+                            top: 5.25,
+                            position: 'absolute',
+                            background: 'white',
+                          }}
+                        ></div>
+                      </div>
+                    </div>
+                    <div
+                      style={{
+                        width: 6,
+                        height: 8,
+                        transform: 'rotate(180deg)',
+                        transformOrigin: '0 0',
+                        background: '#35363A',
+                      }}
+                    ></div>
+                  </div>
+                  <div style={{ width: 20, height: 20, position: 'relative' }}>
+                    <div
+                      style={{
+                        width: 13.33,
+                        height: 13.33,
+                        left: 3.33,
+                        top: 3.33,
+                        position: 'absolute',
+                        background: '#BDC1C6',
+                      }}
+                    ></div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              style={{
+                width: 52,
+                height: 12,
+                left: 13,
+                top: 15.5,
+                position: 'absolute',
+              }}
+            >
+              <div
+                style={{
+                  width: 12,
+                  height: 12,
+                  left: 40,
+                  top: 0,
+                  position: 'absolute',
+                  background: '#27CA40',
+                  borderRadius: 9999,
+                  border: '0.50px #3EAF3F solid',
+                }}
+              />
+              <div
+                style={{
+                  width: 12,
+                  height: 12,
+                  left: 20,
+                  top: 0,
+                  position: 'absolute',
+                  background: '#FFC130',
+                  borderRadius: 9999,
+                  border: '0.50px #E1A325 solid',
+                }}
+              />
+              <div
+                style={{
+                  width: 12,
+                  height: 12,
+                  left: 0,
+                  top: 0,
+                  position: 'absolute',
+                  background: '#FF6058',
+                  borderRadius: 9999,
+                  border: '0.50px #E14942 solid',
+                }}
+              />
+            </div>
+          </div>
+        </div>
+      </div>
       <div
         id="qr-code-container"
         style={{
diff --git a/src/helpers/cafeHelpers.js b/src/helpers/cafeHelpers.js
index 6296f51..e474c88 100644
--- a/src/helpers/cafeHelpers.js
+++ b/src/helpers/cafeHelpers.js
@@ -62,6 +62,28 @@ export const saveWelcomePageConfig = async (cafeId, details) => {
 };
 
 
+export async function getCafeByIdentifier(cafeIdentifyName) {
+  try {
+    const response = await fetch(
+      `${API_BASE_URL}/cafe/get-cafeId/` + cafeIdentifyName,
+      {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+      }
+    );
+
+    if (!response.ok) {
+      return -1;
+    }
+
+    const cafeId = await response.json();
+    return cafeId;
+  } catch (error) {
+    return -1;
+  }
+}
 export async function getOwnedCafes(userId) {
   try {
     const response = await fetch(
diff --git a/src/pages/CafePage.js b/src/pages/CafePage.js
index bb04088..faf1b5e 100644
--- a/src/pages/CafePage.js
+++ b/src/pages/CafePage.js
@@ -24,6 +24,7 @@ import { unsubscribeUser } from "../helpers/subscribeHelpers.js";
 import WelcomePage from "./WelcomePage.js";
 
 function CafePage({
+  shopId,
   table,
   sendParam,
   welcomePageConfig,
@@ -44,9 +45,9 @@ function CafePage({
   const location = useLocation();
   const [searchParams] = useSearchParams();
   const token = searchParams.get("token");
-  const { shopId, tableCode } = useParams();
-  sendParam({ shopId, tableCode });
-
+  const { shopIdentifier, tableCode } = useParams();
+  sendParam({ shopIdentifier, tableCode });
+  
   const navigate = useNavigate();
 
   const [screenMessage, setScreenMessage] = useState("");
diff --git a/src/pages/Cart.js b/src/pages/Cart.js
index 289a95e..0696338 100644
--- a/src/pages/Cart.js
+++ b/src/pages/Cart.js
@@ -13,9 +13,9 @@ import {
 
 import { getItemsByCafeId } from "../helpers/cartHelpers.js";
 
-export default function Invoice({ table, sendParam, deviceType, socket }) {
-  const { shopId, tableCode } = useParams();
-  sendParam({ shopId, tableCode });
+export default function Invoice({ shopId, table, sendParam, deviceType, socket }) {
+  const { shopIdentifier, tableCode } = useParams();
+  sendParam({ shopIdentifier, tableCode });
 
   const [cartItems, setCartItems] = useState([]);
   const [totalPrice, setTotalPrice] = useState(0);
diff --git a/src/pages/Invoice.js b/src/pages/Invoice.js
index 8c29fa8..dcc2e3a 100644
--- a/src/pages/Invoice.js
+++ b/src/pages/Invoice.js
@@ -11,9 +11,9 @@ import {
   handlePaymentFromGuestDevice,
 } from "../helpers/transactionHelpers";
 
-export default function Invoice({ table, sendParam, deviceType, socket }) {
-  const { shopId, tableCode } = useParams();
-  sendParam({ shopId, tableCode });
+export default function Invoice({ shopId, table, sendParam, deviceType, socket }) {
+  const { shopIdentifier, tableCode } = useParams();
+  sendParam({ shopIdentifier, tableCode });
 
   const location = useLocation(); // Use useLocation hook instead of useSearchParams
   const searchParams = new URLSearchParams(location.search); // Pass location.search directly
diff --git a/src/pages/Transaction_confirmed.js b/src/pages/Transaction_confirmed.js
index 51dbc17..7441ab9 100644
--- a/src/pages/Transaction_confirmed.js
+++ b/src/pages/Transaction_confirmed.js
@@ -176,7 +176,7 @@ export default function Transactions({
                     transaction.Table ? transaction.Table.tableNo : "N/A"
                   }`}
             </h2>
-            {(transaction.notes !== "" || isPaymentOpen) && (
+            {(transaction.notes !== "") && (
               <>
                 <div
                   className={styles.NoteContainer}
@@ -233,9 +233,7 @@ export default function Transactions({
               </ButtonWithReplica>
             </div>
             <h5
-              className={`${styles.DeclineButton} ${
-                isPaymentOpen ? styles.active : ""
-              }`}
+              className={`${styles.DeclineButton}`}
               onClick={() =>
                 isPaymentOpen
                   ? setIsPaymentOpen(false)
diff --git a/src/pages/Transactions.js b/src/pages/Transactions.js
index a5981c5..aea2325 100644
--- a/src/pages/Transactions.js
+++ b/src/pages/Transactions.js
@@ -11,9 +11,9 @@ import {
 import { getTables } from "../helpers/tableHelper";
 import TableCanvas from "../components/TableCanvas";
 
-export default function Transactions({ propsShopId, sendParam, deviceType }) {
-  const { shopId, tableId } = useParams();
-  if (sendParam) sendParam({ shopId, tableId });
+export default function Transactions({ shopId, propsShopId, sendParam, deviceType }) {
+  const { shopIdentifier, tableId } = useParams();
+  if (sendParam) sendParam({ shopIdentifier, tableId });
 
   const [tables, setTables] = useState([]);
   const [selectedTable, setSelectedTable] = useState(null);
diff --git a/src/pages/Transactions.module.css b/src/pages/Transactions.module.css
index 5ba0676..40c15ab 100644
--- a/src/pages/Transactions.module.css
+++ b/src/pages/Transactions.module.css
@@ -98,6 +98,8 @@
 }
 .DeclineButton {
   font-family: "Plus Jakarta Sans", sans-serif;
+  z-index: 201;
+  position: relative;
   font-weight: 500;
   font-style: normal;
   font-size: 15px;