import { n as __toESM } from "../_runtime.mjs";
import { u as require_react } from "../_libs/@floating-ui/react-dom+[...].mjs";
import { p as require_jsx_runtime } from "../_libs/@radix-ui/react-checkbox+[...].mjs";
import { f as useStore, s as fmt, t as Button, u as slugify } from "./categories-MJJjwt1u.mjs";
import { M as notFound, h as Link } from "../_libs/@tanstack/react-router+[...].mjs";
import { D as Minus, S as RotateCcw, f as Star, h as Sparkles, i as Video, l as Truck, q as CircleCheck, v as ShieldCheck, w as Plus } from "../_libs/lucide-react.mjs";
import { l as Header, n as CheckoutFlow, t as CartDrawer, u as SignInModal } from "./Modals-PUPoXlMv.mjs";
import { t as Route } from "./product._id-e7c1iT8u.mjs";
//#region node_modules/.nitro/vite/services/ssr/assets/product._id-DgYV85YJ.js
var import_react = /* @__PURE__ */ __toESM(require_react());
var import_jsx_runtime = require_jsx_runtime();
function ProductPage() {
	const { id } = Route.useParams();
	const { addToCart, getAllProducts } = useStore();
	const [signInOpen, setSignInOpen] = (0, import_react.useState)(false);
	const [cartOpen, setCartOpen] = (0, import_react.useState)(false);
	const [checkoutOpen, setCheckoutOpen] = (0, import_react.useState)(false);
	const [qty, setQty] = (0, import_react.useState)(1);
	const [activeImg, setActiveImg] = (0, import_react.useState)(0);
	const [reviews, setReviews] = (0, import_react.useState)([]);
	const [activeVideoModal, setActiveVideoModal] = (0, import_react.useState)(null);
	const all = getAllProducts();
	const product = all.find((p) => p.id === id);
	const [color, setColor] = (0, import_react.useState)(product?.colors?.[0] || "");
	const [size, setSize] = (0, import_react.useState)(product?.sizes?.[0] || "");
	(0, import_react.useEffect)(() => {
		if (!product) return;
		fetch(`/api/reviews.php?product_id=${product.id}`).then((r) => r.json()).then((data) => {
			if (Array.isArray(data)) setReviews(data);
		}).catch(() => {});
	}, [product]);
	if (!product) throw notFound();
	const images = product.images && product.images.length > 0 ? product.images : product.images?.length ? product.images : [
		0,
		1,
		2,
		3
	].map((i) => `https://picsum.photos/seed/${product.seed}${i}/600/600`);
	const related = all.filter((p) => p.id !== product.id && p.category === product.category).slice(0, 6);
	const fallback = all.filter((p) => p.id !== product.id).slice(0, 6);
	const you = related.length > 0 ? related : fallback;
	const handleAdd = () => {
		for (let i = 0; i < qty; i++) addToCart(product);
	};
	const handleBuyNow = () => {
		handleAdd();
		setCartOpen(true);
	};
	const sampleVideoReviews = [{
		id: "demo1",
		product_id: product.id,
		order_id: "ORD-DEMO1",
		user_email: "amina@example.com",
		user_name: "Amina Ibrahim",
		rating: 5,
		title: "Super fast delivery to Suleja & 100% authentic!",
		comment: "I received the package directly from the vendor in 2 days. Sealed condition, tested working great!",
		video_url: "https://assets.mixkit.co/videos/preview/mixkit-unboxing-a-new-smartphone-41484-large.mp4",
		created_at: Date.now() - 864e5 * 2
	}, {
		id: "demo2",
		product_id: product.id,
		order_id: "ORD-DEMO2",
		user_email: "emeka@example.com",
		user_name: "Emeka Okafor",
		rating: 5,
		title: "Excellent build quality, verified vendor!",
		comment: "Very impressive item. Unboxed it on video right after receiving it from the courier.",
		video_url: "https://assets.mixkit.co/videos/preview/mixkit-hands-holding-a-smartphone-with-green-screen-41487-large.mp4",
		created_at: Date.now() - 864e5 * 5
	}];
	const displayReviews = reviews.length > 0 ? reviews : sampleVideoReviews;
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
		className: "min-h-screen",
		style: { backgroundColor: "#f0f2f5" },
		children: [
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SignInModal, {
				open: signInOpen,
				onOpenChange: setSignInOpen
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CartDrawer, {
				open: cartOpen,
				onOpenChange: setCartOpen,
				onCheckout: () => {
					setCartOpen(false);
					setCheckoutOpen(true);
				}
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckoutFlow, {
				open: checkoutOpen,
				onOpenChange: setCheckoutOpen
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Header, {
				onOpenCart: () => setCartOpen(true),
				onOpenSignIn: () => setSignInOpen(true)
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("main", {
				className: "max-w-[1200px] mx-auto px-4 py-4 space-y-4",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("nav", {
						className: "text-xs text-neutral-500",
						children: [
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
								to: "/",
								className: "hover:text-orange-600",
								children: "Home"
							}),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
								className: "mx-1.5",
								children: "/"
							}),
							product.category && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
								to: "/category/$slug",
								params: { slug: slugify(product.category) },
								className: "hover:text-orange-600",
								children: product.category
							}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
								className: "mx-1.5",
								children: "/"
							})] }),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
								className: "text-neutral-800 line-clamp-1 inline",
								children: product.name
							})
						]
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
						className: "grid grid-cols-12 gap-3",
						children: [
							/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", {
								className: "col-span-5 bg-white rounded-md p-4",
								children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
									src: images[activeImg],
									alt: product.name,
									className: "w-full aspect-square object-cover rounded"
								}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
									className: "grid grid-cols-4 gap-2 mt-3",
									children: images.map((src, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
										onClick: () => setActiveImg(i),
										className: `aspect-square rounded overflow-hidden border-2 ${activeImg === i ? "border-orange-500" : "border-transparent"}`,
										children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
											src,
											alt: `${product.name} view ${i + 1}`,
											className: "w-full h-full object-cover"
										})
									}, i))
								})]
							}),
							/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", {
								className: "col-span-4 bg-white rounded-md p-4 space-y-3",
								children: [
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "text-xs text-neutral-500",
										children: ["Official Store · ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
											className: "text-emerald-600 font-medium",
											children: "In stock"
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", {
										className: "text-lg font-semibold text-neutral-800 leading-snug",
										children: product.name
									}),
									product.summary && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
										className: "text-sm text-neutral-600 mt-1",
										children: product.summary
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex items-center gap-2 text-sm mt-1",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "flex text-orange-500",
											children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Star, {
												className: "w-4 h-4",
												fill: i < 5 ? "currentColor" : "none"
											}, i))
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
											className: "text-xs text-neutral-500",
											children: [
												"(",
												displayReviews.length,
												" verified video reviews)"
											]
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "pt-2 border-t",
										children: [
											/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
												className: "text-2xl font-bold text-neutral-900",
												children: ["₦ ", fmt(product.price)]
											}),
											product.old && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
												className: "flex items-center gap-2 mt-1",
												children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
													className: "text-sm text-neutral-400 line-through",
													children: ["₦ ", fmt(product.old)]
												}), product.disc && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
													className: "bg-orange-100 text-orange-700 text-[11px] font-bold px-1.5 py-0.5 rounded",
													children: product.disc
												})]
											}),
											/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
												className: "text-xs text-neutral-500 mt-1",
												children: "+ shipping from ₦ 1,200 to Suleja"
											})
										]
									}),
									product.colors && product.colors.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "pt-2 border-t space-y-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
											className: "text-xs text-neutral-600 font-medium",
											children: ["Color: ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
												className: "text-neutral-900 font-bold",
												children: color
											})]
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "flex gap-2 flex-wrap",
											children: product.colors.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
												onClick: () => setColor(c),
												className: `px-3 py-1.5 text-xs font-medium rounded border ${color === c ? "border-orange-500 bg-orange-50 text-orange-700" : "border-neutral-200 hover:bg-neutral-50"}`,
												children: c
											}, c))
										})]
									}),
									product.sizes && product.sizes.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "pt-2 border-t space-y-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
											className: "text-xs text-neutral-600 font-medium",
											children: ["Size: ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
												className: "text-neutral-900 font-bold",
												children: size
											})]
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "flex gap-2 flex-wrap",
											children: product.sizes.map((s) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
												onClick: () => setSize(s),
												className: `px-3 py-1.5 text-xs font-medium rounded border ${size === s ? "border-orange-500 bg-orange-50 text-orange-700" : "border-neutral-200 hover:bg-neutral-50"}`,
												children: s
											}, s))
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "pt-2 border-t space-y-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "text-xs text-neutral-600 font-medium",
											children: "Quantity"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
											className: "flex items-center gap-2",
											children: [
												/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
													onClick: () => setQty((q) => Math.max(1, q - 1)),
													className: "w-8 h-8 rounded border flex items-center justify-center hover:bg-neutral-50",
													"aria-label": "Decrease quantity",
													children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Minus, { className: "w-4 h-4" })
												}),
												/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
													className: "w-10 text-center font-medium",
													children: qty
												}),
												/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
													onClick: () => setQty((q) => q + 1),
													className: "w-8 h-8 rounded border flex items-center justify-center hover:bg-neutral-50",
													"aria-label": "Increase quantity",
													children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Plus, { className: "w-4 h-4" })
												})
											]
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "pt-2 space-y-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
											onClick: handleAdd,
											className: "w-full h-11 bg-orange-500 hover:bg-orange-600 text-white font-semibold",
											children: "Add to cart"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
											onClick: handleBuyNow,
											variant: "outline",
											className: "w-full h-11 border-orange-500 text-orange-600 hover:bg-orange-50 font-semibold",
											children: "Buy now"
										})]
									})
								]
							}),
							/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("aside", {
								className: "col-span-3 bg-white rounded-md p-4 space-y-3 text-sm",
								children: [
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
										className: "font-semibold text-neutral-800",
										children: "Delivery & Returns"
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex gap-3",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Truck, { className: "w-5 h-5 text-orange-500 shrink-0" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "font-medium text-neutral-800",
											children: "Door Delivery"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "text-xs text-neutral-500",
											children: "Delivery in 2 – 5 business days"
										})] })]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex gap-3",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(RotateCcw, { className: "w-5 h-5 text-orange-500 shrink-0" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "font-medium text-neutral-800",
											children: "Free Returns"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "text-xs text-neutral-500",
											children: "Free return within 7 days for eligible items"
										})] })]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex gap-3",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ShieldCheck, { className: "w-5 h-5 text-orange-500 shrink-0" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "font-medium text-neutral-800",
											children: "Warranty"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "text-xs text-neutral-500",
											children: "1 year manufacturer warranty"
										})] })]
									})
								]
							})
						]
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", {
						className: "bg-white rounded-md p-5 space-y-4",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
							className: "flex items-center justify-between border-b pb-3",
							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h2", {
								className: "text-base font-bold text-neutral-900 flex items-center gap-2",
								children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Video, { className: "w-5 h-5 text-orange-500" }), " Customer Video Reviews"]
							}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
								className: "text-xs text-neutral-500 mt-0.5",
								children: "Real video unboxings & reviews recorded by customers who received this product."
							})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
								className: "text-xs bg-orange-100 text-orange-700 font-bold px-2.5 py-1 rounded-full flex items-center gap-1",
								children: [
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Sparkles, { className: "w-3.5 h-3.5" }),
									" ",
									displayReviews.length,
									" Verified Clips"
								]
							})]
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
							className: "grid grid-cols-1 md:grid-cols-2 gap-4",
							children: displayReviews.map((rev) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
								className: "border rounded-xl p-4 bg-neutral-50/50 space-y-3",
								children: [
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex items-center justify-between",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
											className: "flex items-center gap-2",
											children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
												className: "w-8 h-8 rounded-full bg-orange-500 text-white flex items-center justify-center font-bold text-xs",
												children: rev.user_name.charAt(0)
											}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
												className: "text-xs font-bold text-neutral-900 flex items-center gap-1",
												children: [rev.user_name, /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CircleCheck, { className: "w-3.5 h-3.5 text-emerald-600 fill-emerald-100" })]
											}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
												className: "text-[10px] text-neutral-400",
												children: ["Verified Purchaser · ", new Date(rev.created_at).toLocaleDateString()]
											})] })]
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
											className: "flex text-amber-400",
											children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Star, {
												className: "w-3.5 h-3.5",
												fill: i < rev.rating ? "currentColor" : "none"
											}, i))
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
										className: "text-xs font-bold text-neutral-800",
										children: rev.title
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
										className: "relative rounded-lg overflow-hidden bg-black aspect-video group border",
										children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("video", {
											src: rev.video_url,
											controls: true,
											className: "w-full h-full object-cover"
										})
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
										className: "text-xs text-neutral-600 leading-relaxed",
										children: rev.comment
									})
								]
							}, rev.id))
						})]
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", {
						className: "grid grid-cols-12 gap-3",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
							className: "col-span-8 bg-white rounded-md p-4 space-y-3",
							children: [
								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
									className: "text-base font-semibold text-neutral-800",
									children: "Product details"
								}),
								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
									className: "text-sm text-neutral-700 leading-relaxed whitespace-pre-wrap",
									children: product.description ? product.description : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [product.name, " is a genuine, quality-tested item shipped directly from the vendor. Enjoy competitive pricing, secure Paystack checkout and fast delivery across Nigeria. Package includes the item and standard accessories."] })
								}),
								/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("ul", {
									className: "text-sm text-neutral-700 list-disc pl-5 space-y-1 mt-4",
									children: [
										/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { children: ["Category: ", product.category ?? "General"] }),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: "Ships from: Suleja, Niger State" }),
										/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { children: ["SKU: ", product.id.toUpperCase()] }),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: "Condition: Brand new" })
									]
								})
							]
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
							className: "col-span-4 bg-white rounded-md p-4",
							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
								className: "text-base font-semibold text-neutral-800 mb-2",
								children: "Specifications"
							}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("dl", {
								className: "text-sm divide-y",
								children: [
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex justify-between py-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", {
											className: "text-neutral-500",
											children: "Brand"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", {
											className: "text-neutral-800",
											children: "Generic"
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex justify-between py-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", {
											className: "text-neutral-500",
											children: "Model"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", {
											className: "text-neutral-800",
											children: product.id.toUpperCase()
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex justify-between py-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", {
											className: "text-neutral-500",
											children: "Weight"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", {
											className: "text-neutral-800",
											children: "1.2 kg"
										})]
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "flex justify-between py-2",
										children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", {
											className: "text-neutral-500",
											children: "Color"
										}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", {
											className: "text-neutral-800",
											children: "As shown"
										})]
									})
								]
							})]
						})]
					}),
					you.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", {
						className: "bg-white rounded-md overflow-hidden",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
							className: "bg-orange-400 text-white px-4 py-2.5 font-semibold",
							children: "You may also like"
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
							className: "grid grid-cols-6",
							children: you.map((p) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Link, {
								to: "/product/$id",
								params: { id: p.id },
								className: "border-r border-b last:border-r-0 p-3 bg-white hover:shadow-md transition",
								children: [
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
										src: p.images?.[0] || `https://picsum.photos/seed/${p.seed}/240/240`,
										alt: p.name,
										className: "w-full aspect-square object-cover rounded"
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
										className: "mt-2 text-xs text-neutral-700 line-clamp-2",
										children: p.name
									}),
									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
										className: "text-sm font-bold text-neutral-900",
										children: ["₦ ", fmt(p.price)]
									})
								]
							}, p.id))
						})]
					})
				]
			})
		]
	});
}
//#endregion
export { ProductPage as component };
