diff --git a/src/components/product/product-purchase-panel.tsx b/src/components/product/product-purchase-panel.tsx
index ca5a299..d7f431e 100644
--- a/src/components/product/product-purchase-panel.tsx
+++ b/src/components/product/product-purchase-panel.tsx
@@ -94,7 +94,7 @@ export function ProductPurchasePanel({ product, children }: { product: ProductDe
 
       <div className="fixed inset-x-0 bottom-0 z-10 mx-auto flex w-full max-w-97.5 flex-col items-center gap-2 bg-white px-4 pt-4 pb-2 shadow-[0_-4px_15px_0_rgba(0,0,0,0.102)]">
         <div className="flex w-full items-center justify-between gap-4">
-          <div className="flex flex-col items-end gap-0.5">
+          <div className="flex flex-col items-start gap-2">
             <span className="text-[12px] leading-none text-gray-600">جمع کل</span>
             <span className="text-[18px] font-bold leading-none text-foreground">
               {(product.price * quantity).toLocaleString("fa-IR")} تومان
diff --git a/src/components/store/sticky-cart-bar.tsx b/src/components/store/sticky-cart-bar.tsx
index c0744a8..523f79d 100644
--- a/src/components/store/sticky-cart-bar.tsx
+++ b/src/components/store/sticky-cart-bar.tsx
@@ -1,32 +1,31 @@
 import Link from "next/link";
-import { ShoppingBag } from "lucide-react";
 
 /** designspec.md §2.6 — only rendered when this store's cart group actually has items. */
 export function StickyCartBar({ itemCount, total }: { itemCount: number; total: number }) {
   return (
-    <div className="fixed inset-x-0 bottom-0 z-10 mx-auto flex w-full max-w-[390px] flex-col items-center gap-2 bg-white px-4 pt-4 pb-2 shadow-[0_-4px_15px_0_rgba(0,0,0,0.102)]">
+    <div className="fixed inset-x-0 bottom-0 z-10 mx-auto flex w-full max-w-97.5 flex-col items-center gap-2 bg-white px-4 pt-4 pb-2 shadow-[0_-4px_15px_0_rgba(0,0,0,0.102)]">
+      {/* 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. */}
       <div className="flex w-full items-center justify-between">
-        <Link
-          href="/cart"
-          className="flex h-[50px] items-center gap-2 rounded-full bg-primary-action px-6 text-white shadow-[0_6px_16px_-6px_rgba(0,0,0,0.078),0_2px_8px_-2px_rgba(0,0,0,0.071)]"
-        >
-          <span className="relative flex h-[18px] w-[18px] items-center justify-center">
-            <ShoppingBag className="h-[18px] w-[18px]" />
-            <span className="absolute -top-1.5 -left-1.5 flex h-[14px] min-w-[14px] items-center justify-center rounded-full bg-white text-[10px] font-bold text-primary-action">
-              {itemCount.toLocaleString("fa-IR")}
-            </span>
-          </span>
-          <span className="text-body-large font-bold">مشاهده سبد</span>
-        </Link>
-
-        <div className="flex flex-col items-end gap-0.5">
+        <div className="flex flex-col items-start gap-2">
           <span className="text-[12px] leading-none text-gray-600">جمع کل</span>
           <span className="text-[18px] font-bold leading-none text-foreground">
             {total.toLocaleString("fa-IR")} تومان
           </span>
         </div>
+
+        <Link
+          href="/cart"
+          className="flex h-12.5 items-center gap-2 rounded-xl bg-primary-action py-1 px-5 text-white shadow-[0_6px_16px_-6px_rgba(0,0,0,0.078),0_2px_8px_-2px_rgba(0,0,0,0.071)]"
+        >
+          <span className="text-body-large font-bold">مشاهده سبد</span>
+          <span className="flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-white/20 text-[13px] font-bold text-white">
+            {itemCount.toLocaleString("fa-IR")}
+          </span>
+        </Link>
       </div>
-      <div className="mt-2 h-[5px] w-[134px] rounded-full bg-black" />
+      <div className="mt-2 h-1.5 w-32 rounded-full bg-black" />
     </div>
   );
 }