@burdenoff/microfe-atheletebridge 2026.624.1 → 2026.625.2

package/dist/atheletebridge/pages/customer/CartDetailPage.js

@@ -2,15 +2,16 @@ import { useAthleteBridge as e } from "../../context/AthleteBridgeContext.js";
 import { cn as t } from "../../utils/cn.js";
 import { PageLayout as n } from "../../components/PageLayout.js";
 import { EmptyState as r } from "../../components/EmptyState.js";
-import { useInvestmentOpportunities as i, useOfferings as a, useProviders as o } from "../../hooks/useAthleteBridgeApi.js";
-import { formatCurrency as s, formatDistance as c, formatDuration as l } from "../../utils/formatters.js";
-import { useMemo as u, useState as d } from "react";
-import { ArrowLeft as f, Calendar as p, CheckCircle2 as m, Clock as h, Flame as g, Home as _, Leaf as v, MapPin as y, Minus as b, Plus as x, Search as S, ShoppingCart as C, Star as w, TrendingUp as ee, X as T } from "lucide-react";
-import { useParams as E } from "react-router-dom";
-import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
+import { useInvestmentOpportunities as i, useOfferings as ee, useProviders as a } from "../../hooks/useAthleteBridgeApi.js";
+import { formatCurrency as o, formatDistance as s, formatDuration as c } from "../../utils/formatters.js";
+import { useMemo as l, useState as u } from "react";
+import { ArrowLeft as d, Calendar as f, CheckCircle2 as p, Clock as m, Flame as h, Home as g, Leaf as _, MapPin as v, Minus as y, Plus as b, Search as x, ShoppingCart as S, Star as C, TrendingUp as te, X as w } from "lucide-react";
+import { useParams as T } from "react-router-dom";
+import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
+import { EmphasisPanel as k, NextSteps as A, PagePurpose as j } from "@burdenoff/fe-libs/ui";
 //#region src/atheletebridge/pages/customer/CartDetailPage.tsx
-function A() {
-	let { cartId: A } = E(), { navigateTo: j } = e(), { data: M = [], isLoading: te } = o(), { data: N = [], isLoading: ne } = a(A), { data: P = [], isLoading: re } = i(), F = u(() => M.find((e) => e.id === A), [M, A]), I = u(() => P.find((e) => e.cartId === A), [P, A]), [L, R] = d(""), [z, B] = d(""), [V, H] = d([]), [U, W] = d(!1), [G, K] = d(null), q = u(() => N.map((e) => ({
+function M() {
+	let { cartId: M } = T(), { navigateTo: N } = e(), { data: P = [], isLoading: ne } = a(), { data: F = [], isLoading: re } = ee(M), { data: I = [], isLoading: ie } = i(), L = l(() => P.find((e) => e.id === M), [P, M]), R = l(() => I.find((e) => e.cartId === M), [I, M]), [z, B] = u(""), [V, H] = u(""), [U, W] = u([]), [G, K] = u(!1), [q, J] = u(null), Y = l(() => F.map((e) => ({
 		id: e.id,
 		name: e.name,
 		price: e.price,
@@ -20,24 +21,24 @@ function A() {
 		isVeg: !0,
 		duration: e.durationMinutes,
 		serviceType: e.serviceType
-	})), [N]), J = u(() => [...new Set(q.map((e) => e.category))], [q]), Y = u(() => {
-		let e = q;
-		if (z && (e = e.filter((e) => e.category === z)), L.trim()) {
-			let t = L.toLowerCase();
+	})), [F]), X = l(() => [...new Set(Y.map((e) => e.category))], [Y]), Z = l(() => {
+		let e = Y;
+		if (V && (e = e.filter((e) => e.category === V)), z.trim()) {
+			let t = z.toLowerCase();
 			e = e.filter((e) => e.name.toLowerCase().includes(t) || e.description.toLowerCase().includes(t));
 		}
 		return e;
 	}, [
-		q,
-		z,
-		L
-	]), X = u(() => {
+		Y,
+		V,
+		z
+	]), ae = l(() => {
 		let e = {};
-		return Y.forEach((t) => {
+		return Z.forEach((t) => {
 			e[t.category] || (e[t.category] = []), e[t.category].push(t);
 		}), e;
-	}, [Y]), Z = (e, t = 1, n) => {
-		H((r) => r.find((t) => t.productId === e.id) ? r.map((n) => n.productId === e.id ? {
+	}, [Z]), oe = (e, t = 1, n) => {
+		W((r) => r.find((t) => t.productId === e.id) ? r.map((n) => n.productId === e.id ? {
 			...n,
 			quantity: n.quantity + t
 		} : n) : [...r, {
@@ -49,304 +50,338 @@ function A() {
 			specialInstructions: n
 		}]);
 	}, Q = (e, t) => {
-		H((n) => n.map((n) => n.productId === e ? {
+		W((n) => n.map((n) => n.productId === e ? {
 			...n,
 			quantity: Math.max(0, n.quantity + t)
 		} : n).filter((e) => e.quantity > 0));
 	}, $ = (e) => {
-		H((t) => t.filter((t) => t.productId !== e));
-	}, ie = (e) => V.find((t) => t.productId === e)?.quantity ?? 0, ae = V.reduce((e, t) => e + t.price * t.quantity, 0), oe = V.reduce((e, t) => e + t.quantity, 0), se = (e) => {
-		K({
+		W((t) => t.filter((t) => t.productId !== e));
+	}, se = (e) => U.find((t) => t.productId === e)?.quantity ?? 0, ce = U.reduce((e, t) => e + t.price * t.quantity, 0), le = U.reduce((e, t) => e + t.quantity, 0), ue = (e) => {
+		J({
 			product: e,
 			quantity: 1,
 			specialInstructions: ""
-		}), W(!0);
+		}), K(!0);
 	};
-	return F ? /* @__PURE__ */ k(n, {
-		title: /* @__PURE__ */ k("div", {
+	return L ? /* @__PURE__ */ O(n, {
+		title: /* @__PURE__ */ O("div", {
 			className: "flex items-center gap-3",
 			children: [
-				/* @__PURE__ */ O("button", {
+				/* @__PURE__ */ D("button", {
 					type: "button",
-					onClick: () => j("/customer/carts"),
+					onClick: () => N("/customer/carts"),
 					className: "rounded-md p-1 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors",
-					children: /* @__PURE__ */ O(f, { className: "h-5 w-5" })
+					children: /* @__PURE__ */ D(d, { className: "h-5 w-5" })
 				}),
-				/* @__PURE__ */ O("span", {
+				/* @__PURE__ */ D("span", {
 					className: "truncate",
-					children: F.name
+					children: L.name
 				}),
-				F.isVerified && /* @__PURE__ */ O(m, { className: "h-5 w-5 text-blue-500 shrink-0" })
+				L.isVerified && /* @__PURE__ */ D(p, { className: "h-5 w-5 text-blue-500 shrink-0" })
 			]
 		}),
-		description: F.category,
+		description: L.category,
 		children: [
-			/* @__PURE__ */ k("div", {
-				className: "relative h-48 rounded-lg bg-bg-sunken overflow-hidden",
-				children: [/* @__PURE__ */ O("img", {
-					src: F.image,
-					alt: F.name,
-					className: "h-full w-full object-cover"
-				}), /* @__PURE__ */ O("div", {
-					className: "absolute bottom-0 inset-x-0 bg-gradient-to-t from-black/60 to-transparent p-4",
-					children: /* @__PURE__ */ k("div", {
-						className: "flex items-center gap-3",
-						children: [/* @__PURE__ */ O("span", {
-							className: t("inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium", F.isOpen ? "bg-green-500/20 text-green-300" : "bg-red-500/20 text-red-300"),
-							children: F.isOpen ? "Open Now" : "Closed"
-						}), /* @__PURE__ */ k("div", {
-							className: "flex items-center gap-1 text-white text-sm",
-							children: [
-								/* @__PURE__ */ O(w, { className: "h-3.5 w-3.5 fill-yellow-400 text-yellow-400" }),
-								/* @__PURE__ */ O("span", {
-									className: "font-medium",
-									children: F.rating
-								}),
-								/* @__PURE__ */ k("span", {
-									className: "text-white/70",
-									children: [
-										"(",
-										F.totalRatings,
-										")"
-									]
-								})
-							]
-						})]
-					})
-				})]
+			/* @__PURE__ */ D(j, {
+				className: "mb-6",
+				children: "Everything this provider offers, in one place. Browse and search their offerings, customise items, add them to your order, then proceed to checkout. Use the operating hours and ratings to decide before you order."
+			}),
+			/* @__PURE__ */ D(k, {
+				className: "p-0 overflow-hidden",
+				children: /* @__PURE__ */ O("div", {
+					className: "relative h-48 rounded-lg bg-bg-sunken overflow-hidden",
+					children: [/* @__PURE__ */ D("img", {
+						src: L.image,
+						alt: L.name,
+						className: "h-full w-full object-cover"
+					}), /* @__PURE__ */ D("div", {
+						className: "absolute bottom-0 inset-x-0 bg-gradient-to-t from-black/60 to-transparent p-4",
+						children: /* @__PURE__ */ O("div", {
+							className: "flex items-center gap-3",
+							children: [/* @__PURE__ */ D("span", {
+								className: t("inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium", L.isOpen ? "bg-green-500/20 text-green-300" : "bg-red-500/20 text-red-300"),
+								children: L.isOpen ? "Open Now" : "Closed"
+							}), /* @__PURE__ */ O("div", {
+								className: "flex items-center gap-1 text-white text-sm",
+								children: [
+									/* @__PURE__ */ D(C, { className: "h-3.5 w-3.5 fill-yellow-400 text-yellow-400" }),
+									/* @__PURE__ */ D("span", {
+										className: "font-medium",
+										children: L.rating
+									}),
+									/* @__PURE__ */ O("span", {
+										className: "text-white/70",
+										children: [
+											"(",
+											L.totalRatings,
+											")"
+										]
+									})
+								]
+							})]
+						})
+					})]
+				})
 			}),
-			!F.isOpen && /* @__PURE__ */ O("div", {
+			/* @__PURE__ */ D(A, {
+				className: "mt-6",
+				storageKey: "atheletebridge-cart-detail",
+				steps: [
+					{
+						id: "browse",
+						label: "Browse the offerings",
+						description: "Search or filter by category to find what you want.",
+						icon: /* @__PURE__ */ D(x, { className: "h-4 w-4" }),
+						onClick: () => {
+							document.getElementById("cart-offerings")?.scrollIntoView({ behavior: "smooth" });
+						}
+					},
+					{
+						id: "add",
+						label: "Add items to your order",
+						description: "Use the + control on any item to build your order.",
+						icon: /* @__PURE__ */ D(b, { className: "h-4 w-4" })
+					},
+					{
+						id: "checkout",
+						label: "Proceed to checkout",
+						description: "Review your order and place it when you are ready.",
+						icon: /* @__PURE__ */ D(S, { className: "h-4 w-4" }),
+						onClick: () => N("/customer/checkout")
+					}
+				]
+			}),
+			!L.isOpen && /* @__PURE__ */ D("div", {
 				className: "mt-4 rounded-lg border border-yellow-500/30 bg-yellow-500/10 p-3",
-				children: /* @__PURE__ */ k("p", {
+				children: /* @__PURE__ */ O("p", {
 					className: "text-sm text-yellow-700 dark:text-yellow-400",
-					children: [/* @__PURE__ */ O("strong", { children: "This cart is currently closed." }), " You can browse the offerings but orders are not being accepted."]
+					children: [/* @__PURE__ */ D("strong", { children: "This cart is currently closed." }), " You can browse the offerings but orders are not being accepted."]
 				})
 			}),
-			/* @__PURE__ */ k("div", {
+			/* @__PURE__ */ O("div", {
 				className: "mt-4 grid grid-cols-1 gap-3 sm:grid-cols-3",
 				children: [
-					/* @__PURE__ */ k("div", {
+					/* @__PURE__ */ O("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-3",
 						children: [
-							/* @__PURE__ */ k("div", {
+							/* @__PURE__ */ O("div", {
 								className: "flex items-center gap-2 text-text-secondary text-xs mb-1",
-								children: [/* @__PURE__ */ O(y, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ O("span", {
+								children: [/* @__PURE__ */ D(v, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ D("span", {
 									className: "font-medium uppercase tracking-wider",
 									children: "Location"
 								})]
 							}),
-							/* @__PURE__ */ O("p", {
+							/* @__PURE__ */ D("p", {
 								className: "text-sm text-text-primary",
-								children: F.location.address
+								children: L.location.address
 							}),
-							/* @__PURE__ */ k("p", {
+							/* @__PURE__ */ O("p", {
 								className: "text-xs text-text-secondary",
-								children: [c(F.distance), " away"]
+								children: [s(L.distance), " away"]
 							})
 						]
 					}),
-					/* @__PURE__ */ k("div", {
+					/* @__PURE__ */ O("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-3",
 						children: [
-							/* @__PURE__ */ k("div", {
+							/* @__PURE__ */ O("div", {
 								className: "flex items-center gap-2 text-text-secondary text-xs mb-1",
-								children: [/* @__PURE__ */ O(h, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ O("span", {
+								children: [/* @__PURE__ */ D(m, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ D("span", {
 									className: "font-medium uppercase tracking-wider",
 									children: "Estimated Time"
 								})]
 							}),
-							/* @__PURE__ */ O("p", {
+							/* @__PURE__ */ D("p", {
 								className: "text-sm text-text-primary",
-								children: l(F.estimatedTime)
+								children: c(L.estimatedTime)
 							}),
-							F.averageOrderValue && /* @__PURE__ */ k("p", {
+							L.averageOrderValue && /* @__PURE__ */ O("p", {
 								className: "text-xs text-text-secondary",
-								children: ["Avg ", s(F.averageOrderValue, { minimumFractionDigits: 0 })]
+								children: ["Avg ", o(L.averageOrderValue, { minimumFractionDigits: 0 })]
 							})
 						]
 					}),
-					/* @__PURE__ */ k("div", {
+					/* @__PURE__ */ O("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-3",
 						children: [
-							/* @__PURE__ */ k("div", {
+							/* @__PURE__ */ O("div", {
 								className: "flex items-center gap-2 text-text-secondary text-xs mb-1",
-								children: [/* @__PURE__ */ O(w, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ O("span", {
+								children: [/* @__PURE__ */ D(C, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ D("span", {
 									className: "font-medium uppercase tracking-wider",
 									children: "Rating"
 								})]
 							}),
-							/* @__PURE__ */ k("p", {
+							/* @__PURE__ */ O("p", {
 								className: "text-sm text-text-primary",
-								children: [F.rating, " / 5.0"]
+								children: [L.rating, " / 5.0"]
 							}),
-							/* @__PURE__ */ k("p", {
+							/* @__PURE__ */ O("p", {
 								className: "text-xs text-text-secondary",
-								children: [F.totalRatings, " reviews"]
+								children: [L.totalRatings, " reviews"]
 							})
 						]
 					})
 				]
 			}),
-			F.businessHours && Object.keys(F.businessHours).length > 0 && /* @__PURE__ */ k("section", {
+			L.businessHours && Object.keys(L.businessHours).length > 0 && /* @__PURE__ */ O("section", {
 				className: "mt-6",
-				children: [/* @__PURE__ */ O("h2", {
+				children: [/* @__PURE__ */ D("h2", {
 					className: "text-base font-semibold text-text-primary mb-2",
 					children: "Operating Hours"
-				}), /* @__PURE__ */ O("div", {
+				}), /* @__PURE__ */ D("div", {
 					className: "rounded-lg border border-border-subtle bg-bg-surface overflow-hidden",
-					children: Object.entries(F.businessHours).map(([e, t]) => /* @__PURE__ */ k("div", {
+					children: Object.entries(L.businessHours).map(([e, t]) => /* @__PURE__ */ O("div", {
 						className: "flex items-center justify-between px-4 py-2 border-b border-border-subtle last:border-b-0",
-						children: [/* @__PURE__ */ O("span", {
+						children: [/* @__PURE__ */ D("span", {
 							className: "text-sm font-medium text-text-primary capitalize",
 							children: e
-						}), t.isOpen ? /* @__PURE__ */ k("span", {
+						}), t.isOpen ? /* @__PURE__ */ O("span", {
 							className: "text-sm text-text-secondary",
 							children: [
 								t.open,
 								" - ",
 								t.close
 							]
-						}) : /* @__PURE__ */ O("span", {
+						}) : /* @__PURE__ */ D("span", {
 							className: "text-sm text-status-error-text",
 							children: "Closed"
 						})]
 					}, e))
 				})]
 			}),
-			/* @__PURE__ */ k("div", {
+			/* @__PURE__ */ O("div", {
 				className: "mt-6 grid grid-cols-1 gap-6 lg:grid-cols-3",
-				children: [/* @__PURE__ */ k("div", {
+				children: [/* @__PURE__ */ O("div", {
 					className: "lg:col-span-2",
 					children: [
-						/* @__PURE__ */ k("div", {
+						/* @__PURE__ */ O("div", {
 							className: "flex flex-col gap-3 sm:flex-row mb-4",
-							children: [/* @__PURE__ */ k("div", {
+							children: [/* @__PURE__ */ O("div", {
 								className: "relative flex-1",
-								children: [/* @__PURE__ */ O(S, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ O("input", {
+								children: [/* @__PURE__ */ D(x, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ D("input", {
 									type: "text",
 									placeholder: "Search offerings...",
-									value: L,
-									onChange: (e) => R(e.target.value),
+									value: z,
+									onChange: (e) => B(e.target.value),
 									className: "w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-10 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 								})]
-							}), /* @__PURE__ */ k("select", {
-								value: z,
-								onChange: (e) => B(e.target.value),
+							}), /* @__PURE__ */ O("select", {
+								value: V,
+								onChange: (e) => H(e.target.value),
 								className: "rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
-								children: [/* @__PURE__ */ O("option", {
+								children: [/* @__PURE__ */ D("option", {
 									value: "",
 									children: "All Categories"
-								}), J.map((e) => /* @__PURE__ */ O("option", {
+								}), X.map((e) => /* @__PURE__ */ D("option", {
 									value: e,
 									children: e
 								}, e))]
 							})]
 						}),
-						/* @__PURE__ */ k("h2", {
+						/* @__PURE__ */ O("h2", {
+							id: "cart-offerings",
 							className: "text-lg font-semibold text-text-primary mb-3",
 							children: [
 								"Menu & Services (",
-								Y.length,
+								Z.length,
 								")"
 							]
 						}),
-						Y.length === 0 ? /* @__PURE__ */ k("div", {
-							className: "rounded-lg border border-border-subtle bg-bg-surface p-8 text-center",
-							children: [/* @__PURE__ */ O(S, { className: "mx-auto h-10 w-10 text-text-secondary/50" }), /* @__PURE__ */ O("p", {
-								className: "mt-3 text-sm text-text-secondary",
-								children: "No offerings found"
-							})]
-						}) : /* @__PURE__ */ O("div", {
+						Z.length === 0 ? /* @__PURE__ */ D(r, {
+							illustration: "empty-search",
+							title: "No offerings found",
+							description: "No items match your search. Try a different keyword or clear the category filter."
+						}) : /* @__PURE__ */ D("div", {
 							className: "space-y-6",
-							children: Object.entries(X).map(([e, n]) => /* @__PURE__ */ k("div", { children: [/* @__PURE__ */ O("h3", {
+							children: Object.entries(ae).map(([e, n]) => /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("h3", {
 								className: "text-sm font-semibold text-text-primary mb-2 px-1",
 								children: e
-							}), /* @__PURE__ */ O("div", {
+							}), /* @__PURE__ */ D("div", {
 								className: "space-y-2",
 								children: n.map((e) => {
-									let n = ie(e.id);
-									return /* @__PURE__ */ k("div", {
+									let n = se(e.id);
+									return /* @__PURE__ */ O("div", {
 										className: "flex gap-4 rounded-lg border border-border-subtle bg-bg-surface p-4",
-										children: [/* @__PURE__ */ O("div", {
+										children: [/* @__PURE__ */ D("div", {
 											className: "h-20 w-20 shrink-0 rounded-md bg-bg-sunken overflow-hidden",
-											children: /* @__PURE__ */ O("img", {
+											children: /* @__PURE__ */ D("img", {
 												src: e.image,
 												alt: e.name,
 												className: "h-full w-full object-cover"
 											})
-										}), /* @__PURE__ */ k("div", {
+										}), /* @__PURE__ */ O("div", {
 											className: "flex-1 min-w-0",
 											children: [
-												/* @__PURE__ */ k("div", {
+												/* @__PURE__ */ O("div", {
 													className: "flex items-start justify-between gap-2",
-													children: [/* @__PURE__ */ k("div", { children: [/* @__PURE__ */ k("div", {
+													children: [/* @__PURE__ */ O("div", { children: [/* @__PURE__ */ O("div", {
 														className: "flex items-center gap-2",
-														children: [/* @__PURE__ */ O("h4", {
+														children: [/* @__PURE__ */ D("h4", {
 															className: "text-sm font-semibold text-text-primary",
 															children: e.name
-														}), e.isVeg && /* @__PURE__ */ O(v, { className: "h-3.5 w-3.5 text-green-600 dark:text-green-400" })]
-													}), /* @__PURE__ */ O("p", {
+														}), e.isVeg && /* @__PURE__ */ D(_, { className: "h-3.5 w-3.5 text-green-600 dark:text-green-400" })]
+													}), /* @__PURE__ */ D("p", {
 														className: "text-xs text-text-secondary mt-0.5",
 														children: e.category
-													})] }), /* @__PURE__ */ O("span", {
+													})] }), /* @__PURE__ */ D("span", {
 														className: "text-sm font-bold text-text-primary whitespace-nowrap",
-														children: s(e.price, { minimumFractionDigits: 0 })
+														children: o(e.price, { minimumFractionDigits: 0 })
 													})]
 												}),
-												/* @__PURE__ */ O("p", {
+												/* @__PURE__ */ D("p", {
 													className: "mt-1 text-xs text-text-secondary line-clamp-2",
 													children: e.description
 												}),
-												/* @__PURE__ */ k("div", {
+												/* @__PURE__ */ O("div", {
 													className: "mt-2 flex flex-wrap items-center gap-2 text-[10px] text-text-secondary",
 													children: [
-														e.duration != null && e.duration > 0 && /* @__PURE__ */ k("span", {
+														e.duration != null && e.duration > 0 && /* @__PURE__ */ O("span", {
 															className: "flex items-center gap-0.5",
-															children: [/* @__PURE__ */ O(h, { className: "h-3 w-3" }), l(e.duration)]
+															children: [/* @__PURE__ */ D(m, { className: "h-3 w-3" }), c(e.duration)]
 														}),
-														e.serviceType && /* @__PURE__ */ O("span", {
+														e.serviceType && /* @__PURE__ */ D("span", {
 															className: "rounded bg-bg-sunken px-1.5 py-0.5 capitalize",
 															children: e.serviceType
 														}),
-														e.spiceLevel && /* @__PURE__ */ k("span", {
+														e.spiceLevel && /* @__PURE__ */ O("span", {
 															className: "flex items-center gap-0.5 rounded bg-bg-sunken px-1.5 py-0.5 capitalize",
-															children: [/* @__PURE__ */ O(g, { className: "h-3 w-3" }), e.spiceLevel]
+															children: [/* @__PURE__ */ D(h, { className: "h-3 w-3" }), e.spiceLevel]
 														})
 													]
 												}),
-												/* @__PURE__ */ O("div", {
+												/* @__PURE__ */ D("div", {
 													className: "mt-2 flex justify-end",
-													children: n > 0 ? /* @__PURE__ */ k("div", {
+													children: n > 0 ? /* @__PURE__ */ O("div", {
 														className: "flex items-center gap-2",
 														children: [
-															/* @__PURE__ */ O("button", {
+															/* @__PURE__ */ D("button", {
 																type: "button",
 																onClick: () => Q(e.id, -1),
 																className: "flex h-7 w-7 items-center justify-center rounded-full bg-bg-sunken text-text-primary hover:bg-accent",
-																children: /* @__PURE__ */ O(b, { className: "h-3.5 w-3.5" })
+																children: /* @__PURE__ */ D(y, { className: "h-3.5 w-3.5" })
 															}),
-															/* @__PURE__ */ O("span", {
+															/* @__PURE__ */ D("span", {
 																className: "min-w-[2ch] text-center text-sm font-medium text-text-primary",
 																children: n
 															}),
-															/* @__PURE__ */ O("button", {
+															/* @__PURE__ */ D("button", {
 																type: "button",
 																onClick: () => Q(e.id, 1),
 																className: "flex h-7 w-7 items-center justify-center rounded-full bg-foreground text-background hover:opacity-90",
-																children: /* @__PURE__ */ O(x, { className: "h-3.5 w-3.5" })
+																children: /* @__PURE__ */ D(b, { className: "h-3.5 w-3.5" })
 															}),
-															/* @__PURE__ */ O("button", {
+															/* @__PURE__ */ D("button", {
 																type: "button",
 																onClick: () => $(e.id),
 																className: "ml-1 flex h-7 w-7 items-center justify-center rounded-full text-status-error-text hover:bg-status-error-bg/10",
-																children: /* @__PURE__ */ O(T, { className: "h-3.5 w-3.5" })
+																children: /* @__PURE__ */ D(w, { className: "h-3.5 w-3.5" })
 															})
 														]
-													}) : /* @__PURE__ */ O("button", {
+													}) : /* @__PURE__ */ D("button", {
 														type: "button",
-														disabled: !F.isOpen,
-														onClick: () => se(e),
-														className: t("rounded-lg px-4 py-1.5 text-xs font-medium transition-opacity", F.isOpen ? "bg-foreground text-background hover:opacity-90" : "bg-bg-sunken text-text-secondary cursor-not-allowed"),
+														disabled: !L.isOpen,
+														onClick: () => ue(e),
+														className: t("rounded-lg px-4 py-1.5 text-xs font-medium transition-opacity", L.isOpen ? "bg-foreground text-background hover:opacity-90" : "bg-bg-sunken text-text-secondary cursor-not-allowed"),
 														children: "Add"
 													})
 												})
@@ -357,143 +392,143 @@ function A() {
 							})] }, e))
 						})
 					]
-				}), /* @__PURE__ */ k("div", {
+				}), /* @__PURE__ */ O("div", {
 					className: "space-y-4",
 					children: [
-						/* @__PURE__ */ k("div", {
+						/* @__PURE__ */ O("div", {
 							className: "rounded-lg border border-border-subtle bg-bg-surface p-4 lg:sticky lg:top-6",
-							children: [/* @__PURE__ */ k("h3", {
+							children: [/* @__PURE__ */ O("h3", {
 								className: "text-base font-semibold text-text-primary mb-3 flex items-center gap-2",
-								children: [/* @__PURE__ */ O(C, { className: "h-4 w-4" }), "Your Order"]
-							}), V.length === 0 ? /* @__PURE__ */ k("div", {
+								children: [/* @__PURE__ */ D(S, { className: "h-4 w-4" }), "Your Order"]
+							}), U.length === 0 ? /* @__PURE__ */ O("div", {
 								className: "py-6 text-center",
-								children: [/* @__PURE__ */ O(C, { className: "mx-auto h-8 w-8 text-text-secondary/40" }), /* @__PURE__ */ O("p", {
+								children: [/* @__PURE__ */ D(S, { className: "mx-auto h-8 w-8 text-text-secondary/40" }), /* @__PURE__ */ D("p", {
 									className: "mt-2 text-sm text-text-secondary",
 									children: "Your cart is empty"
 								})]
-							}) : /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O("div", {
+							}) : /* @__PURE__ */ O(E, { children: [/* @__PURE__ */ D("div", {
 								className: "space-y-2 max-h-64 overflow-y-auto mb-3",
-								children: V.map((e) => /* @__PURE__ */ k("div", {
+								children: U.map((e) => /* @__PURE__ */ O("div", {
 									className: "flex items-center justify-between gap-2",
-									children: [/* @__PURE__ */ k("div", {
+									children: [/* @__PURE__ */ O("div", {
 										className: "flex-1 min-w-0",
-										children: [/* @__PURE__ */ O("p", {
+										children: [/* @__PURE__ */ D("p", {
 											className: "text-sm font-medium text-text-primary truncate",
 											children: e.name
-										}), /* @__PURE__ */ k("p", {
+										}), /* @__PURE__ */ O("p", {
 											className: "text-xs text-text-secondary",
 											children: [
-												s(e.price, { minimumFractionDigits: 0 }),
+												o(e.price, { minimumFractionDigits: 0 }),
 												" x",
 												" ",
 												e.quantity
 											]
 										})]
-									}), /* @__PURE__ */ k("div", {
+									}), /* @__PURE__ */ O("div", {
 										className: "flex items-center gap-1",
 										children: [
-											/* @__PURE__ */ O("button", {
+											/* @__PURE__ */ D("button", {
 												type: "button",
 												onClick: () => Q(e.productId, -1),
 												className: "flex h-6 w-6 items-center justify-center rounded bg-bg-sunken text-text-primary text-xs",
 												children: "-"
 											}),
-											/* @__PURE__ */ O("span", {
+											/* @__PURE__ */ D("span", {
 												className: "min-w-[2ch] text-center text-xs font-medium",
 												children: e.quantity
 											}),
-											/* @__PURE__ */ O("button", {
+											/* @__PURE__ */ D("button", {
 												type: "button",
 												onClick: () => Q(e.productId, 1),
 												className: "flex h-6 w-6 items-center justify-center rounded bg-bg-sunken text-text-primary text-xs",
 												children: "+"
 											}),
-											/* @__PURE__ */ O("button", {
+											/* @__PURE__ */ D("button", {
 												type: "button",
 												onClick: () => $(e.productId),
 												className: "ml-1 text-status-error-text hover:text-status-error-text/80",
-												children: /* @__PURE__ */ O(T, { className: "h-3.5 w-3.5" })
+												children: /* @__PURE__ */ D(w, { className: "h-3.5 w-3.5" })
 											})
 										]
 									})]
 								}, e.id))
-							}), /* @__PURE__ */ k("div", {
+							}), /* @__PURE__ */ O("div", {
 								className: "border-t border-border-subtle pt-3",
-								children: [/* @__PURE__ */ k("div", {
+								children: [/* @__PURE__ */ O("div", {
 									className: "flex justify-between items-center mb-3",
-									children: [/* @__PURE__ */ k("span", {
+									children: [/* @__PURE__ */ O("span", {
 										className: "text-sm font-semibold text-text-primary",
-										children: ["Total: ", s(ae, { minimumFractionDigits: 0 })]
-									}), /* @__PURE__ */ k("span", {
+										children: ["Total: ", o(ce, { minimumFractionDigits: 0 })]
+									}), /* @__PURE__ */ O("span", {
 										className: "text-xs text-text-secondary",
-										children: [oe, " items"]
+										children: [le, " items"]
 									})]
-								}), /* @__PURE__ */ O("button", {
+								}), /* @__PURE__ */ D("button", {
 									type: "button",
-									onClick: () => j("/customer/checkout"),
+									onClick: () => N("/customer/checkout"),
 									className: "w-full rounded-lg bg-foreground py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity",
 									children: "Proceed to Checkout"
 								})]
 							})] })]
 						}),
-						F.serviceTypes?.includes("direct_service") && /* @__PURE__ */ k("div", {
+						L.serviceTypes?.includes("direct_service") && /* @__PURE__ */ O("div", {
 							className: "rounded-lg border border-purple-500/30 bg-purple-500/10 p-4",
 							children: [
-								/* @__PURE__ */ k("h3", {
+								/* @__PURE__ */ O("h3", {
 									className: "text-sm font-semibold text-text-primary flex items-center gap-2 mb-2",
-									children: [/* @__PURE__ */ O(_, { className: "h-4 w-4 text-purple-600 dark:text-purple-400" }), "Direct Service"]
+									children: [/* @__PURE__ */ D(g, { className: "h-4 w-4 text-purple-600 dark:text-purple-400" }), "Direct Service"]
 								}),
-								/* @__PURE__ */ O("p", {
+								/* @__PURE__ */ D("p", {
 									className: "text-xs text-text-secondary mb-3",
 									children: "Cart comes to your location!"
 								}),
-								/* @__PURE__ */ O("button", {
+								/* @__PURE__ */ D("button", {
 									type: "button",
-									onClick: () => j(`/customer/carts/${F.id}`),
+									onClick: () => N(`/customer/carts/${L.id}`),
 									className: "w-full rounded-lg bg-purple-600 py-2 text-xs font-medium text-white hover:bg-purple-700 transition-colors",
 									children: "Book Direct Service"
 								})
 							]
 						}),
-						F.serviceTypes?.includes("appointment") && /* @__PURE__ */ k("div", {
+						L.serviceTypes?.includes("appointment") && /* @__PURE__ */ O("div", {
 							className: "rounded-lg border border-blue-500/30 bg-blue-500/10 p-4",
-							children: [/* @__PURE__ */ k("h3", {
+							children: [/* @__PURE__ */ O("h3", {
 								className: "text-sm font-semibold text-text-primary flex items-center gap-2 mb-2",
-								children: [/* @__PURE__ */ O(p, { className: "h-4 w-4 text-blue-600 dark:text-blue-400" }), "Appointments Available"]
-							}), /* @__PURE__ */ O("p", {
+								children: [/* @__PURE__ */ D(f, { className: "h-4 w-4 text-blue-600 dark:text-blue-400" }), "Appointments Available"]
+							}), /* @__PURE__ */ D("p", {
 								className: "text-xs text-text-secondary",
 								children: "This service provider accepts appointments. Contact them to schedule."
 							})]
 						}),
-						I && /* @__PURE__ */ k("div", {
+						R && /* @__PURE__ */ O("div", {
 							className: "rounded-lg border border-green-500/30 bg-green-500/10 p-4",
 							children: [
-								/* @__PURE__ */ k("h3", {
+								/* @__PURE__ */ O("h3", {
 									className: "text-sm font-semibold text-text-primary flex items-center gap-2 mb-2",
-									children: [/* @__PURE__ */ O(ee, { className: "h-4 w-4 text-green-600 dark:text-green-400" }), "Investment Opportunity"]
+									children: [/* @__PURE__ */ D(te, { className: "h-4 w-4 text-green-600 dark:text-green-400" }), "Investment Opportunity"]
 								}),
-								/* @__PURE__ */ O("p", {
+								/* @__PURE__ */ D("p", {
 									className: "text-xs text-text-secondary mb-2",
-									children: I.description
+									children: R.description
 								}),
-								/* @__PURE__ */ k("div", {
+								/* @__PURE__ */ O("div", {
 									className: "space-y-1 text-xs text-text-secondary mb-3",
 									children: [
-										/* @__PURE__ */ k("p", { children: ["Target: ", s(I.targetAmount, { minimumFractionDigits: 0 })] }),
-										/* @__PURE__ */ k("p", { children: ["Raised: ", s(I.raisedAmount, { minimumFractionDigits: 0 })] }),
-										/* @__PURE__ */ k("p", { children: [
+										/* @__PURE__ */ O("p", { children: ["Target: ", o(R.targetAmount, { minimumFractionDigits: 0 })] }),
+										/* @__PURE__ */ O("p", { children: ["Raised: ", o(R.raisedAmount, { minimumFractionDigits: 0 })] }),
+										/* @__PURE__ */ O("p", { children: [
 											"Expected Returns: ",
-											I.expectedReturns,
+											R.expectedReturns,
 											"%"
 										] }),
-										/* @__PURE__ */ k("p", { children: [
+										/* @__PURE__ */ O("p", { children: [
 											"Min Investment:",
 											" ",
-											s(I.minimumInvestment, { minimumFractionDigits: 0 })
+											o(R.minimumInvestment, { minimumFractionDigits: 0 })
 										] })
 									]
 								}),
-								/* @__PURE__ */ O("button", {
+								/* @__PURE__ */ D("button", {
 									type: "button",
 									onClick: () => alert("Navigate to investor section to fund this business."),
 									className: "w-full rounded-lg bg-green-600 py-2 text-xs font-medium text-white hover:bg-green-700 transition-colors",
@@ -504,76 +539,76 @@ function A() {
 					]
 				})]
 			}),
-			U && G && /* @__PURE__ */ O("div", {
+			G && q && /* @__PURE__ */ D("div", {
 				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
-				children: /* @__PURE__ */ O("div", {
+				children: /* @__PURE__ */ D("div", {
 					className: "w-full max-w-md max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface",
-					children: /* @__PURE__ */ k("div", {
+					children: /* @__PURE__ */ O("div", {
 						className: "p-5",
 						children: [
-							/* @__PURE__ */ k("div", {
+							/* @__PURE__ */ O("div", {
 								className: "flex items-center justify-between mb-4",
-								children: [/* @__PURE__ */ O("h3", {
+								children: [/* @__PURE__ */ D("h3", {
 									className: "text-lg font-semibold text-text-primary",
-									children: G.product.name
-								}), /* @__PURE__ */ O("button", {
+									children: q.product.name
+								}), /* @__PURE__ */ D("button", {
 									type: "button",
 									onClick: () => {
-										W(!1), K(null);
+										K(!1), J(null);
 									},
 									className: "rounded-md p-1 text-text-secondary hover:text-text-primary",
-									children: /* @__PURE__ */ O(T, { className: "h-5 w-5" })
+									children: /* @__PURE__ */ D(w, { className: "h-5 w-5" })
 								})]
 							}),
-							/* @__PURE__ */ O("p", {
+							/* @__PURE__ */ D("p", {
 								className: "text-sm text-text-secondary mb-4",
-								children: G.product.description
+								children: q.product.description
 							}),
-							/* @__PURE__ */ O("p", {
+							/* @__PURE__ */ D("p", {
 								className: "text-lg font-bold text-text-primary mb-4",
-								children: s(G.product.price, { minimumFractionDigits: 0 })
+								children: o(q.product.price, { minimumFractionDigits: 0 })
 							}),
-							/* @__PURE__ */ k("div", {
+							/* @__PURE__ */ O("div", {
 								className: "mb-4",
-								children: [/* @__PURE__ */ O("label", {
+								children: [/* @__PURE__ */ D("label", {
 									className: "block text-sm font-medium text-text-primary mb-2",
 									children: "Quantity"
-								}), /* @__PURE__ */ k("div", {
+								}), /* @__PURE__ */ O("div", {
 									className: "flex items-center gap-3",
 									children: [
-										/* @__PURE__ */ O("button", {
+										/* @__PURE__ */ D("button", {
 											type: "button",
-											onClick: () => K((e) => e && {
+											onClick: () => J((e) => e && {
 												...e,
 												quantity: Math.max(1, e.quantity - 1)
 											}),
 											className: "flex h-8 w-8 items-center justify-center rounded-full bg-bg-sunken text-text-primary",
-											children: /* @__PURE__ */ O(b, { className: "h-4 w-4" })
+											children: /* @__PURE__ */ D(y, { className: "h-4 w-4" })
 										}),
-										/* @__PURE__ */ O("span", {
+										/* @__PURE__ */ D("span", {
 											className: "min-w-[2ch] text-center font-medium text-text-primary",
-											children: G.quantity
+											children: q.quantity
 										}),
-										/* @__PURE__ */ O("button", {
+										/* @__PURE__ */ D("button", {
 											type: "button",
-											onClick: () => K((e) => e && {
+											onClick: () => J((e) => e && {
 												...e,
 												quantity: e.quantity + 1
 											}),
 											className: "flex h-8 w-8 items-center justify-center rounded-full bg-bg-sunken text-text-primary",
-											children: /* @__PURE__ */ O(x, { className: "h-4 w-4" })
+											children: /* @__PURE__ */ D(b, { className: "h-4 w-4" })
 										})
 									]
 								})]
 							}),
-							/* @__PURE__ */ k("div", {
+							/* @__PURE__ */ O("div", {
 								className: "mb-4",
-								children: [/* @__PURE__ */ O("label", {
+								children: [/* @__PURE__ */ D("label", {
 									className: "block text-sm font-medium text-text-primary mb-2",
 									children: "Special Instructions"
-								}), /* @__PURE__ */ O("textarea", {
-									value: G.specialInstructions,
-									onChange: (e) => K((t) => t && {
+								}), /* @__PURE__ */ D("textarea", {
+									value: q.specialInstructions,
+									onChange: (e) => J((t) => t && {
 										...t,
 										specialInstructions: e.target.value
 									}),
@@ -582,16 +617,16 @@ function A() {
 									rows: 3
 								})]
 							}),
-							/* @__PURE__ */ k("button", {
+							/* @__PURE__ */ O("button", {
 								type: "button",
 								onClick: () => {
-									G && (Z(G.product, G.quantity, G.specialInstructions), W(!1), K(null), alert(`${G.product.name} added to cart`));
+									q && (oe(q.product, q.quantity, q.specialInstructions), K(!1), J(null), alert(`${q.product.name} added to cart`));
 								},
 								className: "w-full rounded-lg bg-foreground py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity",
 								children: [
 									"Add to Cart -",
 									" ",
-									s(G.product.price * G.quantity, { minimumFractionDigits: 0 })
+									o(q.product.price * q.quantity, { minimumFractionDigits: 0 })
 								]
 							})
 						]
@@ -599,15 +634,16 @@ function A() {
 				})
 			})
 		]
-	}) : /* @__PURE__ */ O(n, {
+	}) : /* @__PURE__ */ D(n, {
 		title: "Cart Not Found",
-		children: /* @__PURE__ */ O(r, {
-			icon: /* @__PURE__ */ O(C, { className: "h-12 w-12" }),
+		children: /* @__PURE__ */ D(r, {
+			illustration: "empty-generic",
+			icon: /* @__PURE__ */ D(S, { className: "h-12 w-12" }),
 			title: "Cart not found",
-			description: `No cart found with ID "${A}".`,
-			action: /* @__PURE__ */ O("button", {
+			description: `No cart found with ID "${M}".`,
+			action: /* @__PURE__ */ D("button", {
 				type: "button",
-				onClick: () => j("/customer/carts"),
+				onClick: () => N("/customer/carts"),
 				className: "rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity",
 				children: "Browse Carts"
 			})
@@ -615,6 +651,6 @@ function A() {
 	});
 }
 //#endregion
-export { A as CartDetailPage };
+export { M as CartDetailPage };
 
 //# sourceMappingURL=CartDetailPage.js.map