@burdenoff/microfe-coolandlovely 2026.614.1

package/dist/coolandlovely/pages/customer/CartDetailPage.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Cart Detail Page
+ * @module coolandlovely/pages/customer
+ *
+ * Full detail view with shopping cart sidebar (Your Order with +/- controls,
+ * remove, total, Proceed to Checkout), product customization modal,
+ * category-grouped product listing, search, category filter,
+ * investment opportunity card, scheduled stops, direct service card,
+ * veg/vegan icons, availability badges, calories, original price
+ * strikethrough, and cart closed warning banner.
+ */
+export declare function CartDetailPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CartDetailPage.d.ts.map

package/dist/coolandlovely/pages/customer/CartDetailPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CartDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/coolandlovely/pages/customer/CartDetailPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AA0DH,wBAAgB,cAAc,4CAkoB7B"}

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

@@ -0,0 +1,620 @@
+import { useCoolAndLovely as e } from "../../context/CoolAndLovelyContext.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/useCoolAndLovelyApi.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";
+//#region src/coolandlovely/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) => ({
+		id: e.id,
+		name: e.name,
+		price: e.price,
+		description: e.description,
+		image: e.media?.[0] || "https://images.unsplash.com/photo-1567620905732-2d1ec7ab7445?w=400",
+		category: e.category,
+		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();
+			e = e.filter((e) => e.name.toLowerCase().includes(t) || e.description.toLowerCase().includes(t));
+		}
+		return e;
+	}, [
+		q,
+		z,
+		L
+	]), X = u(() => {
+		let e = {};
+		return Y.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 ? {
+			...n,
+			quantity: n.quantity + t
+		} : n) : [...r, {
+			id: `cart-${Date.now()}`,
+			productId: e.id,
+			name: e.name,
+			price: e.price,
+			quantity: t,
+			specialInstructions: n
+		}]);
+	}, Q = (e, t) => {
+		H((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({
+			product: e,
+			quantity: 1,
+			specialInstructions: ""
+		}), W(!0);
+	};
+	return F ? /* @__PURE__ */ k(n, {
+		title: /* @__PURE__ */ k("div", {
+			className: "flex items-center gap-3",
+			children: [
+				/* @__PURE__ */ O("button", {
+					type: "button",
+					onClick: () => j("/customer/carts"),
+					className: "rounded-md p-1 text-muted-foreground hover:bg-accent hover:text-foreground transition-colors",
+					children: /* @__PURE__ */ O(f, { className: "h-5 w-5" })
+				}),
+				/* @__PURE__ */ O("span", {
+					className: "truncate",
+					children: F.name
+				}),
+				F.isVerified && /* @__PURE__ */ O(m, { className: "h-5 w-5 text-blue-500 shrink-0" })
+			]
+		}),
+		description: F.category,
+		children: [
+			/* @__PURE__ */ k("div", {
+				className: "relative h-48 rounded-lg bg-muted 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,
+										")"
+									]
+								})
+							]
+						})]
+					})
+				})]
+			}),
+			!F.isOpen && /* @__PURE__ */ O("div", {
+				className: "mt-4 rounded-lg border border-yellow-500/30 bg-yellow-500/10 p-3",
+				children: /* @__PURE__ */ k("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."]
+				})
+			}),
+			/* @__PURE__ */ k("div", {
+				className: "mt-4 grid grid-cols-1 gap-3 sm:grid-cols-3",
+				children: [
+					/* @__PURE__ */ k("div", {
+						className: "rounded-lg border border-border bg-card p-3",
+						children: [
+							/* @__PURE__ */ k("div", {
+								className: "flex items-center gap-2 text-muted-foreground text-xs mb-1",
+								children: [/* @__PURE__ */ O(y, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ O("span", {
+									className: "font-medium uppercase tracking-wider",
+									children: "Location"
+								})]
+							}),
+							/* @__PURE__ */ O("p", {
+								className: "text-sm text-foreground",
+								children: F.location.address
+							}),
+							/* @__PURE__ */ k("p", {
+								className: "text-xs text-muted-foreground",
+								children: [c(F.distance), " away"]
+							})
+						]
+					}),
+					/* @__PURE__ */ k("div", {
+						className: "rounded-lg border border-border bg-card p-3",
+						children: [
+							/* @__PURE__ */ k("div", {
+								className: "flex items-center gap-2 text-muted-foreground text-xs mb-1",
+								children: [/* @__PURE__ */ O(h, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ O("span", {
+									className: "font-medium uppercase tracking-wider",
+									children: "Estimated Time"
+								})]
+							}),
+							/* @__PURE__ */ O("p", {
+								className: "text-sm text-foreground",
+								children: l(F.estimatedTime)
+							}),
+							F.averageOrderValue && /* @__PURE__ */ k("p", {
+								className: "text-xs text-muted-foreground",
+								children: ["Avg ", s(F.averageOrderValue, { minimumFractionDigits: 0 })]
+							})
+						]
+					}),
+					/* @__PURE__ */ k("div", {
+						className: "rounded-lg border border-border bg-card p-3",
+						children: [
+							/* @__PURE__ */ k("div", {
+								className: "flex items-center gap-2 text-muted-foreground text-xs mb-1",
+								children: [/* @__PURE__ */ O(w, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ O("span", {
+									className: "font-medium uppercase tracking-wider",
+									children: "Rating"
+								})]
+							}),
+							/* @__PURE__ */ k("p", {
+								className: "text-sm text-foreground",
+								children: [F.rating, " / 5.0"]
+							}),
+							/* @__PURE__ */ k("p", {
+								className: "text-xs text-muted-foreground",
+								children: [F.totalRatings, " reviews"]
+							})
+						]
+					})
+				]
+			}),
+			F.businessHours && Object.keys(F.businessHours).length > 0 && /* @__PURE__ */ k("section", {
+				className: "mt-6",
+				children: [/* @__PURE__ */ O("h2", {
+					className: "text-base font-semibold text-foreground mb-2",
+					children: "Operating Hours"
+				}), /* @__PURE__ */ O("div", {
+					className: "rounded-lg border border-border bg-card overflow-hidden",
+					children: Object.entries(F.businessHours).map(([e, t]) => /* @__PURE__ */ k("div", {
+						className: "flex items-center justify-between px-4 py-2 border-b border-border last:border-b-0",
+						children: [/* @__PURE__ */ O("span", {
+							className: "text-sm font-medium text-foreground capitalize",
+							children: e
+						}), t.isOpen ? /* @__PURE__ */ k("span", {
+							className: "text-sm text-muted-foreground",
+							children: [
+								t.open,
+								" - ",
+								t.close
+							]
+						}) : /* @__PURE__ */ O("span", {
+							className: "text-sm text-destructive",
+							children: "Closed"
+						})]
+					}, e))
+				})]
+			}),
+			/* @__PURE__ */ k("div", {
+				className: "mt-6 grid grid-cols-1 gap-6 lg:grid-cols-3",
+				children: [/* @__PURE__ */ k("div", {
+					className: "lg:col-span-2",
+					children: [
+						/* @__PURE__ */ k("div", {
+							className: "flex flex-col gap-3 sm:flex-row mb-4",
+							children: [/* @__PURE__ */ k("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-muted-foreground" }), /* @__PURE__ */ O("input", {
+									type: "text",
+									placeholder: "Search offerings...",
+									value: L,
+									onChange: (e) => R(e.target.value),
+									className: "w-full rounded-lg border border-border bg-card py-2 pl-10 pr-3 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+								})]
+							}), /* @__PURE__ */ k("select", {
+								value: z,
+								onChange: (e) => B(e.target.value),
+								className: "rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+								children: [/* @__PURE__ */ O("option", {
+									value: "",
+									children: "All Categories"
+								}), J.map((e) => /* @__PURE__ */ O("option", {
+									value: e,
+									children: e
+								}, e))]
+							})]
+						}),
+						/* @__PURE__ */ k("h2", {
+							className: "text-lg font-semibold text-foreground mb-3",
+							children: [
+								"Menu & Services (",
+								Y.length,
+								")"
+							]
+						}),
+						Y.length === 0 ? /* @__PURE__ */ k("div", {
+							className: "rounded-lg border border-border bg-card p-8 text-center",
+							children: [/* @__PURE__ */ O(S, { className: "mx-auto h-10 w-10 text-muted-foreground/50" }), /* @__PURE__ */ O("p", {
+								className: "mt-3 text-sm text-muted-foreground",
+								children: "No offerings found"
+							})]
+						}) : /* @__PURE__ */ O("div", {
+							className: "space-y-6",
+							children: Object.entries(X).map(([e, n]) => /* @__PURE__ */ k("div", { children: [/* @__PURE__ */ O("h3", {
+								className: "text-sm font-semibold text-foreground mb-2 px-1",
+								children: e
+							}), /* @__PURE__ */ O("div", {
+								className: "space-y-2",
+								children: n.map((e) => {
+									let n = ie(e.id);
+									return /* @__PURE__ */ k("div", {
+										className: "flex gap-4 rounded-lg border border-border bg-card p-4",
+										children: [/* @__PURE__ */ O("div", {
+											className: "h-20 w-20 shrink-0 rounded-md bg-muted overflow-hidden",
+											children: /* @__PURE__ */ O("img", {
+												src: e.image,
+												alt: e.name,
+												className: "h-full w-full object-cover"
+											})
+										}), /* @__PURE__ */ k("div", {
+											className: "flex-1 min-w-0",
+											children: [
+												/* @__PURE__ */ k("div", {
+													className: "flex items-start justify-between gap-2",
+													children: [/* @__PURE__ */ k("div", { children: [/* @__PURE__ */ k("div", {
+														className: "flex items-center gap-2",
+														children: [/* @__PURE__ */ O("h4", {
+															className: "text-sm font-semibold text-foreground",
+															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", {
+														className: "text-xs text-muted-foreground mt-0.5",
+														children: e.category
+													})] }), /* @__PURE__ */ O("span", {
+														className: "text-sm font-bold text-foreground whitespace-nowrap",
+														children: s(e.price, { minimumFractionDigits: 0 })
+													})]
+												}),
+												/* @__PURE__ */ O("p", {
+													className: "mt-1 text-xs text-muted-foreground line-clamp-2",
+													children: e.description
+												}),
+												/* @__PURE__ */ k("div", {
+													className: "mt-2 flex flex-wrap items-center gap-2 text-[10px] text-muted-foreground",
+													children: [
+														e.duration != null && e.duration > 0 && /* @__PURE__ */ k("span", {
+															className: "flex items-center gap-0.5",
+															children: [/* @__PURE__ */ O(h, { className: "h-3 w-3" }), l(e.duration)]
+														}),
+														e.serviceType && /* @__PURE__ */ O("span", {
+															className: "rounded bg-muted px-1.5 py-0.5 capitalize",
+															children: e.serviceType
+														}),
+														e.spiceLevel && /* @__PURE__ */ k("span", {
+															className: "flex items-center gap-0.5 rounded bg-muted px-1.5 py-0.5 capitalize",
+															children: [/* @__PURE__ */ O(g, { className: "h-3 w-3" }), e.spiceLevel]
+														})
+													]
+												}),
+												/* @__PURE__ */ O("div", {
+													className: "mt-2 flex justify-end",
+													children: n > 0 ? /* @__PURE__ */ k("div", {
+														className: "flex items-center gap-2",
+														children: [
+															/* @__PURE__ */ O("button", {
+																type: "button",
+																onClick: () => Q(e.id, -1),
+																className: "flex h-7 w-7 items-center justify-center rounded-full bg-muted text-foreground hover:bg-accent",
+																children: /* @__PURE__ */ O(b, { className: "h-3.5 w-3.5" })
+															}),
+															/* @__PURE__ */ O("span", {
+																className: "min-w-[2ch] text-center text-sm font-medium text-foreground",
+																children: n
+															}),
+															/* @__PURE__ */ O("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" })
+															}),
+															/* @__PURE__ */ O("button", {
+																type: "button",
+																onClick: () => $(e.id),
+																className: "ml-1 flex h-7 w-7 items-center justify-center rounded-full text-destructive hover:bg-destructive/10",
+																children: /* @__PURE__ */ O(T, { className: "h-3.5 w-3.5" })
+															})
+														]
+													}) : /* @__PURE__ */ O("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-muted text-muted-foreground cursor-not-allowed"),
+														children: "Add"
+													})
+												})
+											]
+										})]
+									}, e.id);
+								})
+							})] }, e))
+						})
+					]
+				}), /* @__PURE__ */ k("div", {
+					className: "space-y-4",
+					children: [
+						/* @__PURE__ */ k("div", {
+							className: "rounded-lg border border-border bg-card p-4 lg:sticky lg:top-6",
+							children: [/* @__PURE__ */ k("h3", {
+								className: "text-base font-semibold text-foreground mb-3 flex items-center gap-2",
+								children: [/* @__PURE__ */ O(C, { className: "h-4 w-4" }), "Your Order"]
+							}), V.length === 0 ? /* @__PURE__ */ k("div", {
+								className: "py-6 text-center",
+								children: [/* @__PURE__ */ O(C, { className: "mx-auto h-8 w-8 text-muted-foreground/40" }), /* @__PURE__ */ O("p", {
+									className: "mt-2 text-sm text-muted-foreground",
+									children: "Your cart is empty"
+								})]
+							}) : /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O("div", {
+								className: "space-y-2 max-h-64 overflow-y-auto mb-3",
+								children: V.map((e) => /* @__PURE__ */ k("div", {
+									className: "flex items-center justify-between gap-2",
+									children: [/* @__PURE__ */ k("div", {
+										className: "flex-1 min-w-0",
+										children: [/* @__PURE__ */ O("p", {
+											className: "text-sm font-medium text-foreground truncate",
+											children: e.name
+										}), /* @__PURE__ */ k("p", {
+											className: "text-xs text-muted-foreground",
+											children: [
+												s(e.price, { minimumFractionDigits: 0 }),
+												" x",
+												" ",
+												e.quantity
+											]
+										})]
+									}), /* @__PURE__ */ k("div", {
+										className: "flex items-center gap-1",
+										children: [
+											/* @__PURE__ */ O("button", {
+												type: "button",
+												onClick: () => Q(e.productId, -1),
+												className: "flex h-6 w-6 items-center justify-center rounded bg-muted text-foreground text-xs",
+												children: "-"
+											}),
+											/* @__PURE__ */ O("span", {
+												className: "min-w-[2ch] text-center text-xs font-medium",
+												children: e.quantity
+											}),
+											/* @__PURE__ */ O("button", {
+												type: "button",
+												onClick: () => Q(e.productId, 1),
+												className: "flex h-6 w-6 items-center justify-center rounded bg-muted text-foreground text-xs",
+												children: "+"
+											}),
+											/* @__PURE__ */ O("button", {
+												type: "button",
+												onClick: () => $(e.productId),
+												className: "ml-1 text-destructive hover:text-destructive/80",
+												children: /* @__PURE__ */ O(T, { className: "h-3.5 w-3.5" })
+											})
+										]
+									})]
+								}, e.id))
+							}), /* @__PURE__ */ k("div", {
+								className: "border-t border-border pt-3",
+								children: [/* @__PURE__ */ k("div", {
+									className: "flex justify-between items-center mb-3",
+									children: [/* @__PURE__ */ k("span", {
+										className: "text-sm font-semibold text-foreground",
+										children: ["Total: ", s(ae, { minimumFractionDigits: 0 })]
+									}), /* @__PURE__ */ k("span", {
+										className: "text-xs text-muted-foreground",
+										children: [oe, " items"]
+									})]
+								}), /* @__PURE__ */ O("button", {
+									type: "button",
+									onClick: () => j("/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", {
+							className: "rounded-lg border border-purple-500/30 bg-purple-500/10 p-4",
+							children: [
+								/* @__PURE__ */ k("h3", {
+									className: "text-sm font-semibold text-foreground flex items-center gap-2 mb-2",
+									children: [/* @__PURE__ */ O(_, { className: "h-4 w-4 text-purple-600 dark:text-purple-400" }), "Direct Service"]
+								}),
+								/* @__PURE__ */ O("p", {
+									className: "text-xs text-muted-foreground mb-3",
+									children: "Cart comes to your location!"
+								}),
+								/* @__PURE__ */ O("button", {
+									type: "button",
+									onClick: () => j(`/customer/carts/${F.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", {
+							className: "rounded-lg border border-blue-500/30 bg-blue-500/10 p-4",
+							children: [/* @__PURE__ */ k("h3", {
+								className: "text-sm font-semibold text-foreground 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", {
+								className: "text-xs text-muted-foreground",
+								children: "This service provider accepts appointments. Contact them to schedule."
+							})]
+						}),
+						I && /* @__PURE__ */ k("div", {
+							className: "rounded-lg border border-green-500/30 bg-green-500/10 p-4",
+							children: [
+								/* @__PURE__ */ k("h3", {
+									className: "text-sm font-semibold text-foreground 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"]
+								}),
+								/* @__PURE__ */ O("p", {
+									className: "text-xs text-muted-foreground mb-2",
+									children: I.description
+								}),
+								/* @__PURE__ */ k("div", {
+									className: "space-y-1 text-xs text-muted-foreground 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: [
+											"Expected Returns: ",
+											I.expectedReturns,
+											"%"
+										] }),
+										/* @__PURE__ */ k("p", { children: [
+											"Min Investment:",
+											" ",
+											s(I.minimumInvestment, { minimumFractionDigits: 0 })
+										] })
+									]
+								}),
+								/* @__PURE__ */ O("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",
+									children: "Fund This Business"
+								})
+							]
+						})
+					]
+				})]
+			}),
+			U && G && /* @__PURE__ */ O("div", {
+				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
+				children: /* @__PURE__ */ O("div", {
+					className: "w-full max-w-md max-h-[90vh] overflow-y-auto rounded-lg border border-border bg-card",
+					children: /* @__PURE__ */ k("div", {
+						className: "p-5",
+						children: [
+							/* @__PURE__ */ k("div", {
+								className: "flex items-center justify-between mb-4",
+								children: [/* @__PURE__ */ O("h3", {
+									className: "text-lg font-semibold text-foreground",
+									children: G.product.name
+								}), /* @__PURE__ */ O("button", {
+									type: "button",
+									onClick: () => {
+										W(!1), K(null);
+									},
+									className: "rounded-md p-1 text-muted-foreground hover:text-foreground",
+									children: /* @__PURE__ */ O(T, { className: "h-5 w-5" })
+								})]
+							}),
+							/* @__PURE__ */ O("p", {
+								className: "text-sm text-muted-foreground mb-4",
+								children: G.product.description
+							}),
+							/* @__PURE__ */ O("p", {
+								className: "text-lg font-bold text-foreground mb-4",
+								children: s(G.product.price, { minimumFractionDigits: 0 })
+							}),
+							/* @__PURE__ */ k("div", {
+								className: "mb-4",
+								children: [/* @__PURE__ */ O("label", {
+									className: "block text-sm font-medium text-foreground mb-2",
+									children: "Quantity"
+								}), /* @__PURE__ */ k("div", {
+									className: "flex items-center gap-3",
+									children: [
+										/* @__PURE__ */ O("button", {
+											type: "button",
+											onClick: () => K((e) => e && {
+												...e,
+												quantity: Math.max(1, e.quantity - 1)
+											}),
+											className: "flex h-8 w-8 items-center justify-center rounded-full bg-muted text-foreground",
+											children: /* @__PURE__ */ O(b, { className: "h-4 w-4" })
+										}),
+										/* @__PURE__ */ O("span", {
+											className: "min-w-[2ch] text-center font-medium text-foreground",
+											children: G.quantity
+										}),
+										/* @__PURE__ */ O("button", {
+											type: "button",
+											onClick: () => K((e) => e && {
+												...e,
+												quantity: e.quantity + 1
+											}),
+											className: "flex h-8 w-8 items-center justify-center rounded-full bg-muted text-foreground",
+											children: /* @__PURE__ */ O(x, { className: "h-4 w-4" })
+										})
+									]
+								})]
+							}),
+							/* @__PURE__ */ k("div", {
+								className: "mb-4",
+								children: [/* @__PURE__ */ O("label", {
+									className: "block text-sm font-medium text-foreground mb-2",
+									children: "Special Instructions"
+								}), /* @__PURE__ */ O("textarea", {
+									value: G.specialInstructions,
+									onChange: (e) => K((t) => t && {
+										...t,
+										specialInstructions: e.target.value
+									}),
+									placeholder: "Any special requests...",
+									className: "w-full rounded-lg border border-border bg-background p-3 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+									rows: 3
+								})]
+							}),
+							/* @__PURE__ */ k("button", {
+								type: "button",
+								onClick: () => {
+									G && (Z(G.product, G.quantity, G.specialInstructions), W(!1), K(null), alert(`${G.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 })
+								]
+							})
+						]
+					})
+				})
+			})
+		]
+	}) : /* @__PURE__ */ O(n, {
+		title: "Cart Not Found",
+		children: /* @__PURE__ */ O(r, {
+			icon: /* @__PURE__ */ O(C, { className: "h-12 w-12" }),
+			title: "Cart not found",
+			description: `No cart found with ID "${A}".`,
+			action: /* @__PURE__ */ O("button", {
+				type: "button",
+				onClick: () => j("/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"
+			})
+		})
+	});
+}
+//#endregion
+export { A as CartDetailPage };
+
+//# sourceMappingURL=CartDetailPage.js.map