@burdenoff/microfe-coolandlovely 2026.625.1 → 2026.625.2

package/dist/coolandlovely/pages/customer/BookingDetailsPage.js

@@ -8,8 +8,9 @@ import { useMemo as s, useState as c } from "react";
 import { AlertTriangle as l, ArrowLeft as u, Calendar as d, CalendarCheck as f, CheckCircle2 as p, Circle as m, Clock as h, Headphones as g, MapPin as _, Phone as v, ShoppingBag as y, Star as b, XCircle as x } from "lucide-react";
 import { useParams as S } from "react-router-dom";
 import { jsx as C, jsxs as w } from "react/jsx-runtime";
+import { EmphasisPanel as T, NextSteps as E, PagePurpose as D } from "@burdenoff/fe-libs/ui";
 //#region src/coolandlovely/pages/customer/BookingDetailsPage.tsx
-var T = [
+var O = [
 	{
 		id: "BK-001",
 		serviceName: "Men's Haircut + Beard Trim",
@@ -184,410 +185,446 @@ var T = [
 			}
 		]
 	}
-], E = (e) => T.find((t) => t.id === e);
-function D() {
-	let { bookingId: T } = S(), { navigateTo: D } = e(), [O, k] = c(null), A = s(() => T ? E(T) : void 0, [T]), j = (e) => {
-		k(e), setTimeout(() => k(null), 3e3);
+], k = (e) => O.find((t) => t.id === e);
+function A() {
+	let { bookingId: O } = S(), { navigateTo: A } = e(), [j, M] = c(null), N = s(() => O ? k(O) : void 0, [O]), P = (e) => {
+		M(e), setTimeout(() => M(null), 3e3);
 	};
-	if (!A) return /* @__PURE__ */ C(n, {
+	if (!N) return /* @__PURE__ */ C(n, {
 		title: "Booking Not Found",
 		children: /* @__PURE__ */ C(i, {
-			icon: /* @__PURE__ */ C(f, { className: "h-12 w-12" }),
+			illustration: "empty-search",
 			title: "Booking not found",
-			description: `No booking found with ID"${T}".`,
+			description: `No booking found with ID"${O}".`,
 			action: /* @__PURE__ */ C("button", {
 				type: "button",
-				onClick: () => D("/customer/dashboard"),
+				onClick: () => A("/customer/dashboard"),
 				className: "rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity",
 				children: "Go to Dashboard"
 			})
 		})
 	});
-	let M = A.status === "cancelled", N = A.status === "completed", P = !M && !N;
+	let F = N.status === "cancelled", I = N.status === "completed", L = !F && !I, R = () => {
+		P("Support team will contact you shortly.");
+	}, z = () => {
+		P("Thank you! Rating feature coming soon.");
+	};
 	return /* @__PURE__ */ w(n, {
 		title: /* @__PURE__ */ w("div", {
 			className: "flex items-center gap-3",
 			children: [/* @__PURE__ */ C("button", {
 				type: "button",
-				onClick: () => D("/customer/dashboard"),
+				onClick: () => A("/customer/dashboard"),
 				className: "rounded-md p-1 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors",
 				children: /* @__PURE__ */ C(u, { className: "h-5 w-5" })
-			}), /* @__PURE__ */ w("span", { children: ["Booking #", A.id] })]
+			}), /* @__PURE__ */ w("span", { children: ["Booking #", N.id] })]
 		}),
-		actions: /* @__PURE__ */ C(r, { status: A.status }),
-		children: [O && /* @__PURE__ */ w("div", {
-			className: "mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2",
-			children: [/* @__PURE__ */ C(p, { className: "h-4 w-4 text-status-success-text shrink-0" }), /* @__PURE__ */ C("p", {
-				className: "text-sm text-status-success-text",
-				children: O
-			})]
-		}), /* @__PURE__ */ w("div", {
-			className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
-			children: [/* @__PURE__ */ w("div", {
-				className: "lg:col-span-2 space-y-6",
-				children: [
-					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-6 bg-gloss-card shadow-pop",
-						children: [
-							/* @__PURE__ */ C("h2", {
-								className: "text-lg font-semibold text-text-primary",
-								children: A.serviceName
-							}),
-							/* @__PURE__ */ C("p", {
-								className: "mt-1 text-sm text-text-secondary",
-								children: A.serviceDescription
-							}),
-							/* @__PURE__ */ w("div", {
-								className: "mt-4 flex flex-wrap gap-4 text-sm text-text-secondary",
-								children: [
-									/* @__PURE__ */ w("div", {
-										className: "flex items-center gap-1.5",
-										children: [/* @__PURE__ */ C(d, { className: "h-4 w-4" }), /* @__PURE__ */ C("span", { children: A.scheduledDate })]
-									}),
-									/* @__PURE__ */ w("div", {
-										className: "flex items-center gap-1.5",
-										children: [/* @__PURE__ */ C(h, { className: "h-4 w-4" }), /* @__PURE__ */ C("span", { children: A.scheduledTime })]
-									}),
-									/* @__PURE__ */ w("div", {
-										className: "flex items-center gap-1.5",
-										children: [/* @__PURE__ */ C(h, { className: "h-4 w-4" }), /* @__PURE__ */ w("span", { children: [A.duration, " min"] })]
-									})
-								]
-							}),
-							A.notes && /* @__PURE__ */ w("div", {
-								className: "mt-4 rounded-md bg-bg-sunken p-3",
-								children: [/* @__PURE__ */ C("p", {
-									className: "text-xs text-text-secondary mb-1",
-									children: "Notes"
-								}), /* @__PURE__ */ C("p", {
-									className: "text-sm text-text-primary",
-									children: A.notes
-								})]
-							}),
-							A.cancellationReason && /* @__PURE__ */ w("div", {
-								className: "mt-4 rounded-md bg-status-error-bg-subtle/5 border border-status-error-border/20 p-3",
-								children: [/* @__PURE__ */ w("div", {
-									className: "flex items-center gap-2 mb-1",
-									children: [/* @__PURE__ */ C(l, { className: "h-3.5 w-3.5 text-status-error-text" }), /* @__PURE__ */ C("p", {
-										className: "text-xs font-medium text-status-error-text",
-										children: "Cancellation Reason"
+		actions: /* @__PURE__ */ C(r, { status: N.status }),
+		children: [
+			/* @__PURE__ */ C(D, {
+				className: "mb-6",
+				icon: /* @__PURE__ */ C(f, { className: "h-4 w-4" }),
+				children: "Everything about this service booking in one view: what you booked, who is providing it, when it is scheduled, where it stands right now, and the full cost. Reach support, rate the service when it is done, or check the cart details — all from here."
+			}),
+			/* @__PURE__ */ C(E, {
+				className: "mb-6",
+				storageKey: "coolandlovely-booking-details",
+				steps: [
+					{
+						id: "support",
+						label: "Contact support",
+						description: "Have a question about this booking? Reach the support team.",
+						icon: /* @__PURE__ */ C(g, { className: "h-4 w-4" }),
+						onClick: R
+					},
+					{
+						id: "rate",
+						label: "Rate the service",
+						description: "Share your experience once the service is completed.",
+						icon: /* @__PURE__ */ C(b, { className: "h-4 w-4" }),
+						onClick: z,
+						done: !I
+					},
+					{
+						id: "rebook",
+						label: "Book this provider again",
+						description: "Liked the service? Book the same provider for another time.",
+						icon: /* @__PURE__ */ C(f, { className: "h-4 w-4" }),
+						onClick: () => A("/customer/carts")
+					}
+				]
+			}),
+			j && /* @__PURE__ */ w("div", {
+				className: "mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2",
+				children: [/* @__PURE__ */ C(p, { className: "h-4 w-4 text-status-success-text shrink-0" }), /* @__PURE__ */ C("p", {
+					className: "text-sm text-status-success-text",
+					children: j
+				})]
+			}),
+			/* @__PURE__ */ w("div", {
+				className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+				children: [/* @__PURE__ */ w("div", {
+					className: "lg:col-span-2 space-y-6",
+					children: [
+						/* @__PURE__ */ w("div", {
+							className: "rounded-lg border border-border-seam bg-bg-surface p-6 bg-gloss-card shadow-pop",
+							children: [
+								/* @__PURE__ */ C("h2", {
+									className: "text-lg font-semibold text-text-primary",
+									children: N.serviceName
+								}),
+								/* @__PURE__ */ C("p", {
+									className: "mt-1 text-sm text-text-secondary",
+									children: N.serviceDescription
+								}),
+								/* @__PURE__ */ w("div", {
+									className: "mt-4 flex flex-wrap gap-4 text-sm text-text-secondary",
+									children: [
+										/* @__PURE__ */ w("div", {
+											className: "flex items-center gap-1.5",
+											children: [/* @__PURE__ */ C(d, { className: "h-4 w-4" }), /* @__PURE__ */ C("span", { children: N.scheduledDate })]
+										}),
+										/* @__PURE__ */ w("div", {
+											className: "flex items-center gap-1.5",
+											children: [/* @__PURE__ */ C(h, { className: "h-4 w-4" }), /* @__PURE__ */ C("span", { children: N.scheduledTime })]
+										}),
+										/* @__PURE__ */ w("div", {
+											className: "flex items-center gap-1.5",
+											children: [/* @__PURE__ */ C(h, { className: "h-4 w-4" }), /* @__PURE__ */ w("span", { children: [N.duration, " min"] })]
+										})
+									]
+								}),
+								N.notes && /* @__PURE__ */ w("div", {
+									className: "mt-4 rounded-md bg-bg-sunken p-3",
+									children: [/* @__PURE__ */ C("p", {
+										className: "text-xs text-text-secondary mb-1",
+										children: "Notes"
+									}), /* @__PURE__ */ C("p", {
+										className: "text-sm text-text-primary",
+										children: N.notes
 									})]
-								}), /* @__PURE__ */ C("p", {
-									className: "text-sm text-text-primary",
-									children: A.cancellationReason
-								})]
-							})
-						]
-					}),
-					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-6 bg-gloss-card shadow-pop",
-						children: [
-							/* @__PURE__ */ C("h2", {
-								className: "text-base font-semibold text-text-primary mb-4",
-								children: "Service Provider"
-							}),
-							/* @__PURE__ */ w("div", {
-								className: "flex items-center gap-4",
-								children: [
-									/* @__PURE__ */ C("div", {
-										className: "flex h-12 w-12 items-center justify-center rounded-full bg-bg-sunken text-text-secondary",
-										children: /* @__PURE__ */ C(y, { className: "h-6 w-6" })
-									}),
-									/* @__PURE__ */ w("div", {
-										className: "flex-1 min-w-0",
-										children: [
-											/* @__PURE__ */ C("p", {
-												className: "text-sm font-semibold text-text-primary",
-												children: A.provider.name
-											}),
-											/* @__PURE__ */ C("p", {
-												className: "text-xs text-text-secondary",
-												children: A.provider.category
-											}),
-											/* @__PURE__ */ w("div", {
-												className: "flex items-center gap-1 mt-1",
-												children: [/* @__PURE__ */ C(b, { className: "h-3 w-3 fill-status-warning-text text-status-warning-text" }), /* @__PURE__ */ C("span", {
-													className: "text-xs font-medium text-text-primary",
-													children: A.provider.rating
-												})]
-											})
-										]
-									}),
-									/* @__PURE__ */ C("a", {
-										href: `tel:${A.provider.phone}`,
-										className: "flex h-10 w-10 items-center justify-center rounded-full bg-bg-sunken text-text-secondary hover:bg-accent hover:text-text-primary transition-colors",
-										children: /* @__PURE__ */ C(v, { className: "h-4 w-4" })
-									})
-								]
-							}),
-							/* @__PURE__ */ w("div", {
-								className: "mt-3 flex items-center gap-2 text-sm text-text-secondary",
-								children: [/* @__PURE__ */ C(v, { className: "h-4 w-4 shrink-0" }), /* @__PURE__ */ C("span", { children: A.provider.phone })]
-							})
-						]
-					}),
-					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-6 bg-gloss-card shadow-pop",
-						children: [/* @__PURE__ */ C("h2", {
-							className: "text-base font-semibold text-text-primary mb-5",
-							children: "Booking Timeline"
-						}), /* @__PURE__ */ C("div", {
-							className: "relative",
-							children: A.timeline.map((e, n) => {
-								let r = n === A.timeline.length - 1, i = e.status === "cancelled", a = i ? x : e.completed ? p : m;
-								return /* @__PURE__ */ w("div", {
-									className: "flex gap-4",
+								}),
+								N.cancellationReason && /* @__PURE__ */ w("div", {
+									className: "mt-4 rounded-md bg-status-error-bg-subtle/5 border border-status-error-border/20 p-3",
 									children: [/* @__PURE__ */ w("div", {
-										className: "flex flex-col items-center",
-										children: [/* @__PURE__ */ C("div", {
-											className: t("flex h-8 w-8 shrink-0 items-center justify-center rounded-full", i ? "bg-status-error-bg-subtle/10 text-status-error-text" : e.completed ? "bg-status-success-bg-subtle/10 text-status-success-text" : "bg-bg-sunken text-text-secondary"),
-											children: /* @__PURE__ */ C(a, { className: "h-4 w-4" })
-										}), !r && /* @__PURE__ */ C("div", { className: t("w-0.5 flex-1 my-1", e.completed ? "bg-status-success-bg-subtle/30" : "bg-border") })]
-									}), /* @__PURE__ */ w("div", {
-										className: t("pb-6", r && "pb-0"),
-										children: [/* @__PURE__ */ C("p", {
-											className: "text-sm font-medium text-text-primary",
-											children: e.label
-										}), /* @__PURE__ */ C("p", {
-											className: "mt-0.5 text-xs text-text-secondary",
-											children: e.timestamp ? o(e.timestamp) : "Pending"
+										className: "flex items-center gap-2 mb-1",
+										children: [/* @__PURE__ */ C(l, { className: "h-3.5 w-3.5 text-status-error-text" }), /* @__PURE__ */ C("p", {
+											className: "text-xs font-medium text-status-error-text",
+											children: "Cancellation Reason"
 										})]
+									}), /* @__PURE__ */ C("p", {
+										className: "text-sm text-text-primary",
+										children: N.cancellationReason
 									})]
-								}, `${e.status}-${n}`);
-							})
-						})]
-					}),
-					/* @__PURE__ */ w("div", {
-						className: "flex flex-col sm:flex-row gap-3",
-						children: [/* @__PURE__ */ w("button", {
-							type: "button",
-							onClick: () => {
-								j("Support team will contact you shortly.");
-							},
-							className: "flex-1 flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-4 py-3 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
-							children: [/* @__PURE__ */ C(g, { className: "h-4 w-4" }), "Contact Support"]
-						}), N && /* @__PURE__ */ w("button", {
-							type: "button",
-							onClick: () => {
-								j("Thank you! Rating feature coming soon.");
-							},
-							className: "flex-1 flex items-center justify-center gap-2 rounded-lg bg-foreground px-4 py-3 text-sm font-medium text-background hover:opacity-90 transition-opacity",
-							children: [/* @__PURE__ */ C(b, { className: "h-4 w-4" }), "Rate Service"]
-						})]
-					})
-				]
-			}), /* @__PURE__ */ w("div", {
-				className: "space-y-6",
-				children: [
-					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
-						children: [
-							/* @__PURE__ */ C("h3", {
-								className: "text-base font-semibold text-text-primary mb-3",
-								children: "Cart Information"
-							}),
-							/* @__PURE__ */ w("div", {
-								className: "flex items-center gap-3 mb-4",
-								children: [/* @__PURE__ */ C("img", {
-									src: A.provider.image,
-									alt: A.provider.name,
-									className: "h-14 w-14 rounded-lg object-cover"
-								}), /* @__PURE__ */ w("div", {
-									className: "min-w-0",
+								})
+							]
+						}),
+						/* @__PURE__ */ w("div", {
+							className: "rounded-lg border border-border-seam bg-bg-surface p-6 bg-gloss-card shadow-pop",
+							children: [
+								/* @__PURE__ */ C("h2", {
+									className: "text-base font-semibold text-text-primary mb-4",
+									children: "Service Provider"
+								}),
+								/* @__PURE__ */ w("div", {
+									className: "flex items-center gap-4",
 									children: [
-										/* @__PURE__ */ C("p", {
-											className: "text-sm font-semibold text-text-primary",
-											children: A.provider.name
-										}),
-										/* @__PURE__ */ C("p", {
-											className: "text-xs text-text-secondary",
-											children: A.provider.category
+										/* @__PURE__ */ C("div", {
+											className: "flex h-12 w-12 items-center justify-center rounded-full bg-bg-sunken text-text-secondary",
+											children: /* @__PURE__ */ C(y, { className: "h-6 w-6" })
 										}),
 										/* @__PURE__ */ w("div", {
-											className: "flex items-center gap-1 mt-0.5",
+											className: "flex-1 min-w-0",
 											children: [
-												/* @__PURE__ */ C(b, { className: "h-3 w-3 fill-status-warning-text text-status-warning-text" }),
-												/* @__PURE__ */ C("span", {
-													className: "text-xs font-medium text-text-primary",
-													children: A.provider.rating
+												/* @__PURE__ */ C("p", {
+													className: "text-sm font-semibold text-text-primary",
+													children: N.provider.name
 												}),
-												/* @__PURE__ */ w("span", {
+												/* @__PURE__ */ C("p", {
 													className: "text-xs text-text-secondary",
-													children: [
-														"(",
-														A.provider.reviewCount,
-														")"
-													]
+													children: N.provider.category
+												}),
+												/* @__PURE__ */ w("div", {
+													className: "flex items-center gap-1 mt-1",
+													children: [/* @__PURE__ */ C(b, { className: "h-3 w-3 fill-status-warning-text text-status-warning-text" }), /* @__PURE__ */ C("span", {
+														className: "text-xs font-medium text-text-primary",
+														children: N.provider.rating
+													})]
 												})
 											]
+										}),
+										/* @__PURE__ */ C("a", {
+											href: `tel:${N.provider.phone}`,
+											className: "flex h-10 w-10 items-center justify-center rounded-full bg-bg-sunken text-text-secondary hover:bg-accent hover:text-text-primary transition-colors",
+											children: /* @__PURE__ */ C(v, { className: "h-4 w-4" })
 										})
 									]
-								})]
-							}),
-							/* @__PURE__ */ C("div", {
-								className: "space-y-2 text-sm mb-4",
-								children: /* @__PURE__ */ w("div", {
-									className: "flex items-start gap-2",
-									children: [/* @__PURE__ */ C(_, { className: "h-4 w-4 text-text-secondary shrink-0 mt-0.5" }), /* @__PURE__ */ C("span", {
-										className: "text-text-secondary",
-										children: A.provider.location
-									})]
-								})
-							}),
-							/* @__PURE__ */ C("button", {
-								type: "button",
-								onClick: () => D(`/customer/carts/${A.provider.id}`),
-								className: "w-full rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
-								children: "View Cart Menu"
-							})
-						]
-					}),
-					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
-						children: [/* @__PURE__ */ C("h3", {
-							className: "text-base font-semibold text-text-primary mb-3",
-							children: "Service Location"
-						}), /* @__PURE__ */ w("div", {
-							className: "flex items-start gap-3",
-							children: [/* @__PURE__ */ C(_, { className: "mt-0.5 h-5 w-5 shrink-0 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [
-								/* @__PURE__ */ C("p", {
-									className: "text-sm text-text-primary",
-									children: A.location.street
-								}),
-								/* @__PURE__ */ w("p", {
-									className: "text-sm text-text-secondary",
-									children: [
-										A.location.area,
-										", ",
-										A.location.city,
-										" - ",
-										A.location.pincode
-									]
 								}),
-								A.location.landmark && /* @__PURE__ */ w("p", {
-									className: "text-xs text-text-secondary mt-1",
-									children: ["Landmark: ", A.location.landmark]
+								/* @__PURE__ */ w("div", {
+									className: "mt-3 flex items-center gap-2 text-sm text-text-secondary",
+									children: [/* @__PURE__ */ C(v, { className: "h-4 w-4 shrink-0" }), /* @__PURE__ */ C("span", { children: N.provider.phone })]
 								})
-							] })]
-						})]
-					}),
-					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
-						children: [/* @__PURE__ */ C("h3", {
-							className: "text-base font-semibold text-text-primary mb-3",
-							children: "Price Breakdown"
-						}), /* @__PURE__ */ w("div", {
-							className: "space-y-2.5 text-sm",
+							]
+						}),
+						/* @__PURE__ */ w(T, {
+							className: "p-6",
+							children: [/* @__PURE__ */ C("h2", {
+								className: "text-base font-semibold text-text-primary mb-5",
+								children: "Booking Timeline"
+							}), /* @__PURE__ */ C("div", {
+								className: "relative",
+								children: N.timeline.map((e, n) => {
+									let r = n === N.timeline.length - 1, i = e.status === "cancelled", a = i ? x : e.completed ? p : m;
+									return /* @__PURE__ */ w("div", {
+										className: "flex gap-4",
+										children: [/* @__PURE__ */ w("div", {
+											className: "flex flex-col items-center",
+											children: [/* @__PURE__ */ C("div", {
+												className: t("flex h-8 w-8 shrink-0 items-center justify-center rounded-full", i ? "bg-status-error-bg-subtle/10 text-status-error-text" : e.completed ? "bg-status-success-bg-subtle/10 text-status-success-text" : "bg-bg-sunken text-text-secondary"),
+												children: /* @__PURE__ */ C(a, { className: "h-4 w-4" })
+											}), !r && /* @__PURE__ */ C("div", { className: t("w-0.5 flex-1 my-1", e.completed ? "bg-status-success-bg-subtle/30" : "bg-border") })]
+										}), /* @__PURE__ */ w("div", {
+											className: t("pb-6", r && "pb-0"),
+											children: [/* @__PURE__ */ C("p", {
+												className: "text-sm font-medium text-text-primary",
+												children: e.label
+											}), /* @__PURE__ */ C("p", {
+												className: "mt-0.5 text-xs text-text-secondary",
+												children: e.timestamp ? o(e.timestamp) : "Pending"
+											})]
+										})]
+									}, `${e.status}-${n}`);
+								})
+							})]
+						}),
+						/* @__PURE__ */ w("div", {
+							className: "flex flex-col sm:flex-row gap-3",
+							children: [/* @__PURE__ */ w("button", {
+								type: "button",
+								onClick: R,
+								className: "flex-1 flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-4 py-3 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
+								children: [/* @__PURE__ */ C(g, { className: "h-4 w-4" }), "Contact Support"]
+							}), I && /* @__PURE__ */ w("button", {
+								type: "button",
+								onClick: z,
+								className: "flex-1 flex items-center justify-center gap-2 rounded-lg bg-foreground px-4 py-3 text-sm font-medium text-background hover:opacity-90 transition-opacity",
+								children: [/* @__PURE__ */ C(b, { className: "h-4 w-4" }), "Rate Service"]
+							})]
+						})
+					]
+				}), /* @__PURE__ */ w("div", {
+					className: "space-y-6",
+					children: [
+						/* @__PURE__ */ w("div", {
+							className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 							children: [
-								/* @__PURE__ */ w("div", {
-									className: "flex justify-between",
-									children: [/* @__PURE__ */ C("span", {
-										className: "text-text-secondary",
-										children: "Service Charge"
-									}), /* @__PURE__ */ C("span", {
-										className: "text-text-primary",
-										children: a(A.pricing.serviceCharge, { minimumFractionDigits: 0 })
-									})]
-								}),
-								/* @__PURE__ */ w("div", {
-									className: "flex justify-between",
-									children: [/* @__PURE__ */ C("span", {
-										className: "text-text-secondary",
-										children: "Convenience Fee"
-									}), /* @__PURE__ */ C("span", {
-										className: "text-text-primary",
-										children: a(A.pricing.convenienceFee, { minimumFractionDigits: 0 })
-									})]
+								/* @__PURE__ */ C("h3", {
+									className: "text-base font-semibold text-text-primary mb-3",
+									children: "Cart Information"
 								}),
 								/* @__PURE__ */ w("div", {
-									className: "flex justify-between",
-									children: [/* @__PURE__ */ C("span", {
-										className: "text-text-secondary",
-										children: "Tax"
-									}), /* @__PURE__ */ C("span", {
-										className: "text-text-primary",
-										children: a(A.pricing.tax, { minimumFractionDigits: 0 })
+									className: "flex items-center gap-3 mb-4",
+									children: [/* @__PURE__ */ C("img", {
+										src: N.provider.image,
+										alt: N.provider.name,
+										className: "h-14 w-14 rounded-lg object-cover"
+									}), /* @__PURE__ */ w("div", {
+										className: "min-w-0",
+										children: [
+											/* @__PURE__ */ C("p", {
+												className: "text-sm font-semibold text-text-primary",
+												children: N.provider.name
+											}),
+											/* @__PURE__ */ C("p", {
+												className: "text-xs text-text-secondary",
+												children: N.provider.category
+											}),
+											/* @__PURE__ */ w("div", {
+												className: "flex items-center gap-1 mt-0.5",
+												children: [
+													/* @__PURE__ */ C(b, { className: "h-3 w-3 fill-status-warning-text text-status-warning-text" }),
+													/* @__PURE__ */ C("span", {
+														className: "text-xs font-medium text-text-primary",
+														children: N.provider.rating
+													}),
+													/* @__PURE__ */ w("span", {
+														className: "text-xs text-text-secondary",
+														children: [
+															"(",
+															N.provider.reviewCount,
+															")"
+														]
+													})
+												]
+											})
+										]
 									})]
 								}),
-								A.pricing.discount > 0 && /* @__PURE__ */ w("div", {
-									className: "flex justify-between",
-									children: [/* @__PURE__ */ C("span", {
-										className: "text-status-success-text",
-										children: "Discount"
-									}), /* @__PURE__ */ w("span", {
-										className: "text-status-success-text",
-										children: ["-", a(A.pricing.discount, { minimumFractionDigits: 0 })]
-									})]
+								/* @__PURE__ */ C("div", {
+									className: "space-y-2 text-sm mb-4",
+									children: /* @__PURE__ */ w("div", {
+										className: "flex items-start gap-2",
+										children: [/* @__PURE__ */ C(_, { className: "h-4 w-4 text-text-secondary shrink-0 mt-0.5" }), /* @__PURE__ */ C("span", {
+											className: "text-text-secondary",
+											children: N.provider.location
+										})]
+									})
 								}),
-								/* @__PURE__ */ w("div", {
-									className: "flex justify-between border-t border-border-subtle pt-2.5",
-									children: [/* @__PURE__ */ C("span", {
-										className: "font-semibold text-text-primary",
-										children: "Total"
-									}), /* @__PURE__ */ C("span", {
-										className: "font-bold text-text-primary",
-										children: a(A.pricing.total, { minimumFractionDigits: 0 })
-									})]
+								/* @__PURE__ */ C("button", {
+									type: "button",
+									onClick: () => A(`/customer/carts/${N.provider.id}`),
+									className: "w-full rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
+									children: "View Cart Menu"
 								})
 							]
-						})]
-					}),
-					/* @__PURE__ */ w("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
-						children: [/* @__PURE__ */ C("h3", {
-							className: "text-base font-semibold text-text-primary mb-3",
-							children: "Booking Info"
-						}), /* @__PURE__ */ w("div", {
-							className: "space-y-3",
-							children: [
-								/* @__PURE__ */ w("div", {
-									className: "flex items-center gap-2",
-									children: [/* @__PURE__ */ C(f, { className: "h-4 w-4 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-										className: "text-xs text-text-secondary",
-										children: "Booked On"
-									}), /* @__PURE__ */ C("p", {
-										className: "text-sm text-text-primary",
-										children: o(A.createdAt)
-									})] })]
-								}),
-								/* @__PURE__ */ w("div", {
-									className: "flex items-center gap-2",
-									children: [/* @__PURE__ */ C(d, { className: "h-4 w-4 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-										className: "text-xs text-text-secondary",
-										children: "Scheduled"
-									}), /* @__PURE__ */ w("p", {
+						}),
+						/* @__PURE__ */ w("div", {
+							className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
+							children: [/* @__PURE__ */ C("h3", {
+								className: "text-base font-semibold text-text-primary mb-3",
+								children: "Service Location"
+							}), /* @__PURE__ */ w("div", {
+								className: "flex items-start gap-3",
+								children: [/* @__PURE__ */ C(_, { className: "mt-0.5 h-5 w-5 shrink-0 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [
+									/* @__PURE__ */ C("p", {
 										className: "text-sm text-text-primary",
+										children: N.location.street
+									}),
+									/* @__PURE__ */ w("p", {
+										className: "text-sm text-text-secondary",
 										children: [
-											A.scheduledDate,
-											" at ",
-											A.scheduledTime
+											N.location.area,
+											", ",
+											N.location.city,
+											" - ",
+											N.location.pincode
 										]
-									})] })]
-								}),
-								/* @__PURE__ */ w("div", {
-									className: "flex items-center gap-2",
-									children: [/* @__PURE__ */ C(h, { className: "h-4 w-4 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
-										className: "text-xs text-text-secondary",
-										children: "Duration"
-									}), /* @__PURE__ */ w("p", {
-										className: "text-sm text-text-primary",
-										children: [A.duration, " minutes"]
-									})] })]
-								})
-							]
-						})]
-					}),
-					P && /* @__PURE__ */ w("button", {
-						type: "button",
-						className: "w-full inline-flex items-center justify-center gap-2 rounded-lg border border-status-error-border/30 bg-status-error-bg-subtle/5 px-4 py-3 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle/10 transition-colors",
-						children: [/* @__PURE__ */ C(x, { className: "h-4 w-4" }), "Cancel Booking"]
-					})
-				]
-			})]
-		})]
+									}),
+									N.location.landmark && /* @__PURE__ */ w("p", {
+										className: "text-xs text-text-secondary mt-1",
+										children: ["Landmark: ", N.location.landmark]
+									})
+								] })]
+							})]
+						}),
+						/* @__PURE__ */ w("div", {
+							className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
+							children: [/* @__PURE__ */ C("h3", {
+								className: "text-base font-semibold text-text-primary mb-3",
+								children: "Price Breakdown"
+							}), /* @__PURE__ */ w("div", {
+								className: "space-y-2.5 text-sm",
+								children: [
+									/* @__PURE__ */ w("div", {
+										className: "flex justify-between",
+										children: [/* @__PURE__ */ C("span", {
+											className: "text-text-secondary",
+											children: "Service Charge"
+										}), /* @__PURE__ */ C("span", {
+											className: "text-text-primary",
+											children: a(N.pricing.serviceCharge, { minimumFractionDigits: 0 })
+										})]
+									}),
+									/* @__PURE__ */ w("div", {
+										className: "flex justify-between",
+										children: [/* @__PURE__ */ C("span", {
+											className: "text-text-secondary",
+											children: "Convenience Fee"
+										}), /* @__PURE__ */ C("span", {
+											className: "text-text-primary",
+											children: a(N.pricing.convenienceFee, { minimumFractionDigits: 0 })
+										})]
+									}),
+									/* @__PURE__ */ w("div", {
+										className: "flex justify-between",
+										children: [/* @__PURE__ */ C("span", {
+											className: "text-text-secondary",
+											children: "Tax"
+										}), /* @__PURE__ */ C("span", {
+											className: "text-text-primary",
+											children: a(N.pricing.tax, { minimumFractionDigits: 0 })
+										})]
+									}),
+									N.pricing.discount > 0 && /* @__PURE__ */ w("div", {
+										className: "flex justify-between",
+										children: [/* @__PURE__ */ C("span", {
+											className: "text-status-success-text",
+											children: "Discount"
+										}), /* @__PURE__ */ w("span", {
+											className: "text-status-success-text",
+											children: ["-", a(N.pricing.discount, { minimumFractionDigits: 0 })]
+										})]
+									}),
+									/* @__PURE__ */ w("div", {
+										className: "flex justify-between border-t border-border-subtle pt-2.5",
+										children: [/* @__PURE__ */ C("span", {
+											className: "font-semibold text-text-primary",
+											children: "Total"
+										}), /* @__PURE__ */ C("span", {
+											className: "font-bold text-text-primary",
+											children: a(N.pricing.total, { minimumFractionDigits: 0 })
+										})]
+									})
+								]
+							})]
+						}),
+						/* @__PURE__ */ w("div", {
+							className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
+							children: [/* @__PURE__ */ C("h3", {
+								className: "text-base font-semibold text-text-primary mb-3",
+								children: "Booking Info"
+							}), /* @__PURE__ */ w("div", {
+								className: "space-y-3",
+								children: [
+									/* @__PURE__ */ w("div", {
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ C(f, { className: "h-4 w-4 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
+											className: "text-xs text-text-secondary",
+											children: "Booked On"
+										}), /* @__PURE__ */ C("p", {
+											className: "text-sm text-text-primary",
+											children: o(N.createdAt)
+										})] })]
+									}),
+									/* @__PURE__ */ w("div", {
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ C(d, { className: "h-4 w-4 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
+											className: "text-xs text-text-secondary",
+											children: "Scheduled"
+										}), /* @__PURE__ */ w("p", {
+											className: "text-sm text-text-primary",
+											children: [
+												N.scheduledDate,
+												" at ",
+												N.scheduledTime
+											]
+										})] })]
+									}),
+									/* @__PURE__ */ w("div", {
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ C(h, { className: "h-4 w-4 text-text-secondary" }), /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
+											className: "text-xs text-text-secondary",
+											children: "Duration"
+										}), /* @__PURE__ */ w("p", {
+											className: "text-sm text-text-primary",
+											children: [N.duration, " minutes"]
+										})] })]
+									})
+								]
+							})]
+						}),
+						L && /* @__PURE__ */ w("button", {
+							type: "button",
+							className: "w-full inline-flex items-center justify-center gap-2 rounded-lg border border-status-error-border/30 bg-status-error-bg-subtle/5 px-4 py-3 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle/10 transition-colors",
+							children: [/* @__PURE__ */ C(x, { className: "h-4 w-4" }), "Cancel Booking"]
+						})
+					]
+				})]
+			})
+		]
 	});
 }
 //#endregion
-export { D as BookingDetailsPage };
+export { A as BookingDetailsPage };
 
 //# sourceMappingURL=BookingDetailsPage.js.map