Contect with order api

features/cart/components/CartItemCard.tsx

@@ -329,15 +329,13 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
               <p className="text-sm font-semibold">
                 {t("unit_price")} <span className="text-primary">{item.price_formatted}</span>
               </p>
-              <p className="text-sm font-semibold">
-                {t("extra_price")} {item.sub_total_formatted}
-              </p>
+              
               {item.discount_formatted && item.discount_formatted !== "0 TMT" && (
                 <p className="text-sm font-semibold">{t("discount")} {item.discount_formatted}</p>
               )}
               <div className="flex items-center gap-2">
                 <span className="text-sm font-semibold">{t("total_price")}</span>
-                <span className="bg-green-500 text-white px-3 py-1 rounded-xl font-semibold text-base">
+                <span className="bg-green-500 text-white px-3 py-1 rounded-lg font-semibold text-base">
                   {(parseFloat(item.product.price_amount || "0") * localQuantity).toFixed(2)} TMT
                 </span>
               </div>
@@ -348,7 +346,7 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
                 variant="outline"
                 size="icon"
                 onClick={handleQuantityDecrease}
-                className={`rounded-xl bg-blue-50 ${isSyncing ? 'opacity-70' : ''}`}
+                className={` cursor-pointerrounded-xl bg-blue-50 ${isSyncing ? 'opacity-70' : ''}`}
               >
                 <Minus className="h-4 w-4" />
               </Button>
@@ -368,11 +366,11 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
                 size="icon"
                 onClick={handleQuantityIncrease}
                 disabled={localQuantity >= availableStock}
-                className={`rounded-xl bg-blue-50 ${isSyncing ? 'opacity-70' : ''} ${
+                className={`rounded-xl cursor-pointer bg-blue-50 ${isSyncing ? 'opacity-70' : ''} ${
                   localQuantity >= availableStock ? 'opacity-50 cursor-not-allowed' : ''
                 }`}
               >
-                <Plus className="h-4 w-4" />
+                <Plus className="h-4 w-4 text-[#007AFF]" />
               </Button>
             </div>
           </div>

features/cart/components/OrderSummary.tsx

@@ -15,6 +15,7 @@ import {
 import DeliveryTypeSelector from "./DeliveryTypeSelector";
 import { useTranslations } from "next-intl";
 import type { DeliveryType, PaymentType, Province } from "@/lib/types/api";
+import { Input } from "@/components/ui/input";
 
 interface OrderBillingItem {
   title: string;
@@ -42,6 +43,8 @@ interface OrderSummaryProps {
   regionGroups: Record<string, Province[]>;
   availableRegions: string[];
   paymentTypes: PaymentType[];
+  phone: string;
+  onPhoneChange: (phone: string) => void;
   onPaymentTypeChange: (type: PaymentType) => void;
   onDeliveryTypeChange: (type: DeliveryType) => void;
   onRegionChange: (regionCode: string) => void;
@@ -61,6 +64,7 @@ export default function OrderSummary({
   regionGroups,
   availableRegions,
   paymentTypes,
+  phone,  onPhoneChange,
   onPaymentTypeChange,
   onDeliveryTypeChange,
   onRegionChange,
@@ -74,7 +78,7 @@ export default function OrderSummary({
   const provincesForSelectedRegion = selectedRegion
     ? regionGroups[selectedRegion] || []
     : [];
-  const isFormValid = selectedRegion && selectedProvince && paymentType;
+  const isFormValid = selectedRegion && selectedProvince && paymentType && phone;
 
   return (
     <Card className="w-full md:w-[380px] p-6 rounded-xl h-fit sticky top-20">
@@ -167,6 +171,17 @@ export default function OrderSummary({
         </div>
       )}
 
+{/* Phone Number */}
+<div className="mb-6">
+  <Label className="text-lg font-semibold mb-3 block">{t("phone")}</Label>
+  <Input
+    type="tel"
+    value={phone}
+    onChange={(e) => onPhoneChange(e.target.value)}
+    placeholder={t("phone")}
+    className="rounded-xl"
+  />
+</div>
       {/* Note */}
       <div className="mb-6">
         <Label className="text-lg font-semibold mb-3 block">{t("note")}</Label>