From c2b4c4a69050ad1d816bd1160cd6f7509c912aa6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Afra=20=E2=80=8C?= <afra@Afras-MacBook-Air.local>
Date: Sat, 5 Sep 2026 14:00:55 +0330
Subject: [PATCH] fix: minor modification on cart page's design

---
 src/app/(customer)/(shop)/cart/page.tsx | 37 ++++++++++++++-----------
 1 file changed, 21 insertions(+), 16 deletions(-)

diff --git a/src/app/(customer)/(shop)/cart/page.tsx b/src/app/(customer)/(shop)/cart/page.tsx
index 56ee906..a33af69 100644
--- a/src/app/(customer)/(shop)/cart/page.tsx
+++ b/src/app/(customer)/(shop)/cart/page.tsx
@@ -26,10 +26,7 @@ export default async function CartPage() {
   );
 
   return (
-    <main className="mx-auto flex w-full max-w-md flex-1 flex-col gap-6 px-4 pt-4 pb-6">
-      {/* DOM order intentionally mirrors the screenshot's left→right layout, not reading
-          order — under this app's inherited dir="rtl", the first child renders at the
-          right edge and the last at the left. */}
+    <main className="mx-auto flex w-full max-w-md flex-1 flex-col gap-6 px-4 pt-4 pb-28">
       <div className="flex items-center justify-start gap-3">
         <Link href="/" aria-label="بازگشت">
           <ArrowRight className="h-5 w-5 text-foreground" />
@@ -49,7 +46,11 @@ export default async function CartPage() {
             )}
 
             <Link
-              href={group.meets_minimum_order ? `/checkout/${group.store.uuid}` : "#"}
+              href={
+                group.meets_minimum_order
+                  ? `/checkout/${group.store.uuid}`
+                  : "#"
+              }
               aria-disabled={!group.meets_minimum_order}
               className="mt-4 flex justify-center"
             >
@@ -65,19 +66,23 @@ export default async function CartPage() {
         ))}
       </div>
 
-      <div className="flex flex-row justify-between border-t border-gray-200 pt-4 px-5">
-        <div className="flex flex-col items-start justify-start gap-2">
-          <span className="text-[14px] font-semibold text-foreground">
-            جمع کل سبد ({cart.groups.length.toLocaleString("fa-IR")} فروشگاه،{" "}
-            {totalItemLines.toLocaleString("fa-IR")} کالا)
+      <div className="fixed inset-x-0 bottom-0 z-50 flex w-full flex-col items-center">
+        <div className="flex w-full flex-row justify-between border-t border-gray-200 bg-white px-8 pt-6 pb-6">
+          <div className="flex flex-col items-start justify-start gap-2">
+            <span className="text-[14px] font-semibold text-foreground">
+              جمع کل سبد ({cart.groups.length.toLocaleString("fa-IR")} فروشگاه،{" "}
+              {totalItemLines.toLocaleString("fa-IR")} کالا)
+            </span>
+
+            <p className="text-end text-[12px] leading-normal text-gray-600">
+              هر فروشگاه جداگانه پرداخت و ارسال می‌شود
+            </p>
+          </div>
+
+          <span className="text-[16px] font-bold leading-none text-foreground">
+            {cart.grand_total.toLocaleString("fa-IR")} تومان
           </span>
-          <p className="text-end text-[12px] leading-normal text-gray-600">
-            هر فروشگاه جداگانه پرداخت و ارسال می‌شود
-          </p>
         </div>
-        <span className="text-[16px] font-bold leading-none text-foreground">
-          {cart.grand_total.toLocaleString("fa-IR")} تومان
-        </span>
       </div>
     </main>
   );