diff --git a/src/pages/orders/core/_models.ts b/src/pages/orders/core/_models.ts
index 678049c..984437e 100644
--- a/src/pages/orders/core/_models.ts
+++ b/src/pages/orders/core/_models.ts
@@ -65,6 +65,20 @@ export interface OrderPayment {
   paid_at?: string;
 }
 
+export interface OrderPaymentRecord {
+  id: number;
+  invoice_id: number;
+  user_id: number;
+  created_at: string;
+  updated_at: string;
+  payment_type: string;
+  status: string;
+  step?: string;
+  amount: number;
+  transaction_id?: string;
+  image_urls?: string[];
+}
+
 export interface OrderCustomer {
   id: number;
   first_name: string;
@@ -97,10 +111,12 @@ export interface Order {
       avatar?: string;
     };
     payment_status?: PaymentStatus;
+    payments?: OrderPaymentRecord[];
     net_total?: number;
     vat_total?: number;
     shipping_total?: number;
     discount_total?: number;
+    base_gold_price?: number;
     // legacy totals kept for compatibility
     subtotal?: number;
     tax_amount?: number;
diff --git a/src/pages/orders/order-detail/OrderDetailPage.tsx b/src/pages/orders/order-detail/OrderDetailPage.tsx
index 1340127..934ba6d 100644
--- a/src/pages/orders/order-detail/OrderDetailPage.tsx
+++ b/src/pages/orders/order-detail/OrderDetailPage.tsx
@@ -59,6 +59,20 @@ const formatDate = (dateString: string) => {
     });
 };
 
+const formatPaymentType = (type?: string) => {
+    if (!type) return '';
+    const key = type.toLowerCase().replace(/\s+/g, '-').replace(/_/g, '-');
+    const mapping: Record<string, string> = {
+        'card-to-card': 'کارت به کارت',
+        'credit-card': 'پرداخت بانکی',
+        'debit-card': 'کارت بانکی',
+        'bank-transfer': 'حواله بانکی',
+        'cash-on-delivery': 'پرداخت در محل',
+        'wallet': 'کیف پول',
+    };
+    return mapping[key] || type;
+};
+
 const OrderDetailPage = () => {
     const navigate = useNavigate();
     const { id } = useParams();
@@ -206,8 +220,8 @@ const OrderDetailPage = () => {
                         </div>
                         <div className="p-0">
                             {order?.items && order.items.length > 0 ? (
-                                <div className="divide-y divide-gray-200 dark:divide-gray-700">
-                                    <div className="grid grid-cols-12 px-6 py-3 text-xs text-gray-500 dark:text-gray-400">
+                                <div className="md:divide-y divide-gray-200 dark:divide-gray-700 space-y-4 md:space-y-0">
+                                    <div className="hidden md:grid grid-cols-12 px-6 py-3 text-xs text-gray-500 dark:text-gray-400">
                                         <div className="col-span-5">محصول</div>
                                         <div className="col-span-2 text-center">تعداد</div>
                                         <div className="col-span-2 text-center">وزن (گرم)</div>
@@ -215,23 +229,49 @@ const OrderDetailPage = () => {
                                         <div className="col-span-2 text-left">جمع</div>
                                     </div>
                                     {order.items.map((item) => {
-                                        const baseWeight = (item.final_weight ?? item.weight ?? 0) as number;
+                                        const baseWeight = (item.weight ?? 0) as number;
                                         const weightGr = Math.round(baseWeight * 1000);
                                         const formatFa = (n: number) => new Intl.NumberFormat('fa-IR').format(n);
                                         return (
-                                            <div key={item.id} className="grid grid-cols-12 px-6 py-4 items-center">
-                                                <div className="col-span-5">
-                                                    <div className="font-medium text-gray-900 dark:text-gray-100">
+                                            <div key={item.id} className="px-4 md:px-6 py-0 md:py-4">
+                                                <div className="grid grid-cols-12 items-center hidden md:grid">
+                                                    <div className="col-span-5">
+                                                        <div className="font-medium text-gray-900 dark:text-gray-100">
+                                                            {item.product_name || `محصول شناسه: ${item.product_id}`}
+                                                        </div>
+                                                        <div className="text-sm text-gray-500 dark:text-gray-400">
+                                                            {item.product_variant_name || `واریانت شناسه: ${item.product_variant_id}`}
+                                                        </div>
+                                                    </div>
+                                                    <div className="col-span-2 text-center text-sm text-gray-700 dark:text-gray-300">{formatFa(item.quantity || 0)}</div>
+                                                    <div className="col-span-2 text-center text-sm text-gray-700 dark:text-gray-300">{formatFa(weightGr)}</div>
+                                                    <div className="col-span-1 text-center text-sm text-gray-700 dark:text-gray-300">{formatCurrency(item.unit_price || 0)}</div>
+                                                    <div className="col-span-2 text-left font-semibold text-gray-900 dark:text-gray-100">{formatCurrency(item.total_price || 0)}</div>
+                                                </div>
+                                                <div className="md:hidden space-y-3 bg-gray-50 dark:bg-gray-700/50 rounded-lg p-4 border border-gray-200 dark:border-gray-600">
+                                                    <div className="font-medium text-gray-900 dark:text-gray-100 leading-relaxed">
                                                         {item.product_name || `محصول شناسه: ${item.product_id}`}
                                                     </div>
                                                     <div className="text-sm text-gray-500 dark:text-gray-400">
                                                         {item.product_variant_name || `واریانت شناسه: ${item.product_variant_id}`}
                                                     </div>
+                                                    <div className="flex justify-between text-sm text-gray-700 dark:text-gray-300">
+                                                        <span>تعداد</span>
+                                                        <span>{formatFa(item.quantity || 0)}</span>
+                                                    </div>
+                                                    <div className="flex justify-between text-sm text-gray-700 dark:text-gray-300">
+                                                        <span>وزن (گرم)</span>
+                                                        <span>{formatFa(weightGr)}</span>
+                                                    </div>
+                                                    <div className="flex justify-between text-sm text-gray-700 dark:text-gray-300">
+                                                        <span>قیمت واحد</span>
+                                                        <span>{formatCurrency(item.unit_price || 0)}</span>
+                                                    </div>
+                                                    <div className="flex justify-between text-sm font-semibold text-gray-900 dark:text-gray-100">
+                                                        <span>جمع</span>
+                                                        <span>{formatCurrency(item.total_price || 0)}</span>
+                                                    </div>
                                                 </div>
-                                                <div className="col-span-2 text-center text-sm text-gray-700 dark:text-gray-300">{formatFa(item.quantity || 0)}</div>
-                                                <div className="col-span-2 text-center text-sm text-gray-700 dark:text-gray-300">{formatFa(weightGr)}</div>
-                                                <div className="col-span-1 text-center text-sm text-gray-700 dark:text-gray-300">{formatCurrency(item.unit_price || 0)}</div>
-                                                <div className="col-span-2 text-left font-semibold text-gray-900 dark:text-gray-100">{formatCurrency(item.total_price || 0)}</div>
                                             </div>
                                         );
                                     })}
@@ -337,34 +377,40 @@ const OrderDetailPage = () => {
                             </div>
                         </div>
                         <div className="p-6 space-y-4">
-                            <div className="flex justify-between">
-                                <span className="text-gray-600 dark:text-gray-400">جمع فرعی</span>
-                                <span className="font-medium">{formatCurrency(order?.net_total || 0)}</span>
+                            <div className="flex items-center justify-between text-base">
+                                <span className="text-gray-800 dark:text-gray-200">جمع اقلام</span>
+                                <span className="font-medium text-gray-900 dark:text-gray-100">{formatCurrency(order?.net_total || 0)}</span>
                             </div>
-                            <div className="flex justify-between">
-                                <span className="text-gray-600 dark:text-gray-400">مالیات</span>
-                                <span className="font-medium">{formatCurrency(order?.vat_total || 0)}</span>
+                            <div className="flex items-center justify-between text-base">
+                                <span className="text-gray-800 dark:text-gray-200">مالیات</span>
+                                <span className="font-medium text-gray-900 dark:text-gray-100">{formatCurrency(order?.vat_total || 0)}</span>
                             </div>
-                            <div className="flex justify-between">
-                                <span className="text-gray-600 dark:text-gray-400">هزینه ارسال</span>
-                                <span className="font-medium">{formatCurrency(order?.shipping_total || 0)}</span>
+                            {order?.base_gold_price !== undefined && (
+                                <div className="flex items-center justify-between text-base">
+                                    <span className="text-gray-800 dark:text-gray-200">قیمت پایه طلا</span>
+                                    <span className="font-medium text-gray-900 dark:text-gray-100">{formatCurrency(order.base_gold_price)}</span>
+                                </div>
+                            )}
+                            <div className="flex items-center justify-between text-base">
+                                <span className="text-gray-800 dark:text-gray-200">هزینه ارسال</span>
+                                <span className="font-medium text-gray-900 dark:text-gray-100">{formatCurrency(order?.shipping_total || 0)}</span>
                             </div>
                             {(order?.discount_total || 0) > 0 && (
                                 <div className="flex justify-between text-green-600 dark:text-green-400">
-                                    <span>تخفیف</span>
+                                    <span>تخفیف کل</span>
                                     <span className="font-medium">-{formatCurrency(order?.discount_total || 0)}</span>
                                 </div>
                             )}
                             <hr className="border-gray-200 dark:border-gray-700" />
-                            <div className="flex justify-between text-lg font-bold">
-                                <span>مجموع نهایی</span>
-                                <span>{formatCurrency(order?.final_total || 0)}</span>
+                            <div className="flex items-center justify-between text-lg font-bold">
+                                <span className="text-gray-900 dark:text-gray-100">مجموع نهایی</span>
+                                <span className="text-gray-900 dark:text-gray-100">{formatCurrency(order?.final_total || 0)}</span>
                             </div>
 
                             <div className="mt-4 pt-4 border-t border-gray-200 dark:border-gray-700">
                                 <div className="space-y-2">
-                                    <div className="flex justify-between">
-                                        <span className="text-sm text-gray-600 dark:text-gray-400">وضعیت پرداخت</span>
+                                    <div className="flex items-center justify-between text-base">
+                                        <span className="text-gray-700 dark:text-gray-200">وضعیت پرداخت</span>
                                         <span className={`text-sm font-medium px-2 py-1 rounded-full ${order?.payment_status === 'paid'
                                             ? 'bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200'
                                             : 'bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200'
@@ -372,10 +418,30 @@ const OrderDetailPage = () => {
                                             {order?.payment_status === 'paid' ? 'پرداخت شده' : 'در انتظار پرداخت'}
                                         </span>
                                     </div>
+                                    {Array.isArray((data as any)?.payments) && (data as any)?.payments.length > 0 && (
+                                        <div className="flex items-center justify-between text-base">
+                                            <span className="text-gray-700 dark:text-gray-200">روش پرداخت</span>
+                                            <span className="text-gray-900 dark:text-gray-100">{formatPaymentType((data as any).payments[0].payment_type)}</span>
+                                        </div>
+                                    )}
                                     {order?.invoice_id && (
-                                        <div className="flex justify-between">
-                                            <span className="text-sm text-gray-600 dark:text-gray-400">شماره فاکتور</span>
-                                            <span className="text-sm font-mono text-gray-900 dark:text-gray-100">{order.invoice_id}</span>
+                                        <div className="flex items-center justify-between text-base">
+                                            <span className="text-gray-700 dark:text-gray-200">شماره فاکتور</span>
+                                            <span className="font-mono text-gray-900 dark:text-gray-100">{order.invoice_id}</span>
+                                        </div>
+                                    )}
+                                    {Array.isArray((data as any)?.payments) && (data as any)?.payments[0]?.transaction_id && (
+                                        <div className="flex items-center justify-between text-base">
+                                            <span className="text-gray-700 dark:text-gray-200">شناسه تراکنش</span>
+                                            <span className="font-mono text-gray-900 dark:text-gray-100">{(data as any).payments[0].transaction_id}</span>
+                                        </div>
+                                    )}
+                                    {Array.isArray((data as any)?.payments) && (data as any)?.payments[0]?.image_urls?.length > 0 && (
+                                        <div className="flex items-center justify-between text-base">
+                                            <span className="text-gray-700 dark:text-gray-200">رسید پرداخت</span>
+                                            <a href={(data as any).payments[0].image_urls[0]} target="_blank" rel="noreferrer" className="shrink-0">
+                                                <img src={(data as any).payments[0].image_urls[0]} alt="رسید پرداخت" className="h-14 w-14 rounded-md object-cover border border-gray-200 dark:border-gray-600" />
+                                            </a>
                                         </div>
                                     )}
                                 </div>