hey-pharmacist-ecommerce 1.1.38 → 1.1.40

package/README.md

@@ -91,9 +91,6 @@ export default function ShopPage() {
 
 The package exposes CSS variables for theme colors and a dynamic header gradient. Update via `EcommerceConfig`:
 
-```ts
-headerGradient?: { from: string; via: string; to: string } // hex colors
-```
 
 Under the hood, `ThemeProvider` sets `--color-<brand>-<shade>` and:
 

package/dist/index.d.mts

@@ -9,14 +9,11 @@ interface EcommerceConfig {
     logo: string;
     colors: {
         primary: string;
+        primaryDark: string;
         secondary: string;
         accent: string;
-    };
-    /** Optional hex colors to override header gradient */
-    headerGradient?: {
-        from: string;
-        via: string;
-        to: string;
+        accentDark: string;
+        textMuted: string;
     };
     apiBaseUrl: string;
 }

package/dist/index.d.ts

@@ -9,14 +9,11 @@ interface EcommerceConfig {
     logo: string;
     colors: {
         primary: string;
+        primaryDark: string;
         secondary: string;
         accent: string;
-    };
-    /** Optional hex colors to override header gradient */
-    headerGradient?: {
-        from: string;
-        via: string;
-        to: string;
+        accentDark: string;
+        textMuted: string;
     };
     apiBaseUrl: string;
 }

package/dist/index.js

@@ -236,12 +236,41 @@ function useTheme() {
   }
   return context;
 }
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React10.useLayoutEffect : React10.useEffect;
 function ThemeProvider({ config, children }) {
-  React10.useEffect(() => {
+  const cssVariables = React10__default.default.useMemo(() => {
     const primaryShades = generateColorShades(config.colors.primary);
     const secondaryShades = generateColorShades(config.colors.secondary);
     const accentShades = generateColorShades(config.colors.accent);
+    const vars = [];
+    vars.push(`--color-primary: ${config.colors.primary}`);
+    vars.push(`--color-primary-dark: ${config.colors.primaryDark}`);
+    vars.push(`--color-secondary: ${config.colors.secondary}`);
+    vars.push(`--color-accent: ${config.colors.accent}`);
+    vars.push(`--color-accent-dark: ${config.colors.accentDark}`);
+    vars.push(`--color-text-muted: ${config.colors.textMuted}`);
+    Object.entries(primaryShades).forEach(([shade, rgb]) => {
+      vars.push(`--color-primary-${shade}: ${rgb}`);
+    });
+    Object.entries(secondaryShades).forEach(([shade, rgb]) => {
+      vars.push(`--color-secondary-${shade}: ${rgb}`);
+    });
+    Object.entries(accentShades).forEach(([shade, rgb]) => {
+      vars.push(`--color-accent-${shade}: ${rgb}`);
+    });
+    return vars.join("; ");
+  }, [config.colors]);
+  useIsomorphicLayoutEffect(() => {
     const root = document.documentElement;
+    const primaryShades = generateColorShades(config.colors.primary);
+    const secondaryShades = generateColorShades(config.colors.secondary);
+    const accentShades = generateColorShades(config.colors.accent);
+    root.style.setProperty("--color-primary", config.colors.primary);
+    root.style.setProperty("--color-primary-dark", config.colors.primaryDark);
+    root.style.setProperty("--color-secondary", config.colors.secondary);
+    root.style.setProperty("--color-accent", config.colors.accent);
+    root.style.setProperty("--color-accent-dark", config.colors.accentDark);
+    root.style.setProperty("--color-text-muted", config.colors.textMuted);
     Object.entries(primaryShades).forEach(([shade, rgb]) => {
       root.style.setProperty(`--color-primary-${shade}`, rgb);
     });
@@ -251,20 +280,11 @@ function ThemeProvider({ config, children }) {
     Object.entries(accentShades).forEach(([shade, rgb]) => {
       root.style.setProperty(`--color-accent-${shade}`, rgb);
     });
-    if (config.headerGradient) {
-      const [fr, fg, fb] = hexToRgb(config.headerGradient.from);
-      const [vr, vg, vb] = hexToRgb(config.headerGradient.via);
-      const [tr, tg, tb] = hexToRgb(config.headerGradient.to);
-      root.style.setProperty(`--header-from`, `${fr} ${fg} ${fb}`);
-      root.style.setProperty(`--header-via`, `${vr} ${vg} ${vb}`);
-      root.style.setProperty(`--header-to`, `${tr} ${tg} ${tb}`);
-    } else {
-      root.style.setProperty(`--header-from`, primaryShades[700]);
-      root.style.setProperty(`--header-via`, primaryShades[600]);
-      root.style.setProperty(`--header-to`, secondaryShades[600]);
-    }
   }, [config]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value: { config }, children });
+  return /* @__PURE__ */ jsxRuntime.jsxs(ThemeContext.Provider, { value: { config }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: `:root { ${cssVariables} }` } }),
+    children
+  ] });
 }
 
 // src/providers/AuthProvider.tsx
@@ -13042,7 +13062,7 @@ function ProductCard({
     /* @__PURE__ */ jsxRuntime.jsxs(
       framerMotion.motion.div,
       {
-        className: "bg-white rounded-[16px] overflow-hidden border-2 border-gray-100 hover:border-[#5B9BD5] hover:shadow-lg transition-all duration-300 group h-full flex flex-col",
+        className: "bg-white rounded-[16px] overflow-hidden border-2 border-gray-100 hover:border-secondary hover:shadow-lg transition-all duration-300 group h-full flex flex-col",
         whileHover: { y: -4 },
         onMouseEnter: () => setIsHovered(true),
         onMouseLeave: () => setIsHovered(false),
@@ -13094,7 +13114,7 @@ function ProductCard({
                 displayDiscountAmount,
                 "%"
               ] }) }) }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-['Poppins',sans-serif] text-xs text-[#5B9BD5] uppercase tracking-wide font-medium", children: product.brand }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-['Poppins',sans-serif] text-xs text-secondary uppercase tracking-wide font-medium", children: product.brand }) }),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "h-[40px] mb-3", children: [
                 /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-sm font-['Poppins',sans-serif] font-semibold text-[#2B4B7C] line-clamp-2", children: product.name }),
                 selectedVariant && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-['Poppins',sans-serif] text-[#676c80]", children: selectedVariant.name })
@@ -13193,7 +13213,7 @@ function ProductCard({
                   }
                 },
                 disabled: isAddingToCart || variantImages.length > 0 && !selectedVariantId || displayInventoryCount === 0,
-                className: "w-full font-['Poppins',sans-serif] font-medium text-[11px] px-3 py-2 rounded-full bg-[#5B9BD5] text-white hover:bg-[#4a8ac4] hover:shadow-lg transition-all duration-300 flex items-center justify-center gap-1.5 disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer",
+                className: "w-full font-['Poppins',sans-serif] font-medium text-[11px] px-3 py-2 rounded-full bg-secondary text-white hover:bg-secondary/80 hover:shadow-lg transition-all duration-300 flex items-center justify-center gap-1.5 disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer",
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ShoppingCart, { className: "h-4 w-4" }),
                   displayInventoryCount === 0 ? "Out of Stock" : "Add to Cart"
@@ -14738,7 +14758,7 @@ function ReviewCard({ review, showProductInfo = false }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border border-gray-200 rounded-lg p-4 bg-white", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between mb-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 bg-[#E67E50]/10 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "size-5 text-[#E67E50]" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 bg-secondary/10 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "size-5 text-secondary" }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-medium text-gray-900", children: "Customer Review" }),
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-gray-500", children: dateFns.formatDistanceToNow(reviewDate, { addSuffix: true }) })
@@ -14748,9 +14768,9 @@ function ReviewCard({ review, showProductInfo = false }) {
     ] }),
     review.reviewType && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block px-2 py-1 text-xs bg-gray-100 text-gray-600 rounded mb-2", children: review.reviewType }),
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-gray-700 text-sm leading-relaxed mb-3", children: review.review }),
-    review.reply && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 pl-4 border-l-2 border-[#E67E50] bg-gray-50 p-3 rounded", children: [
+    review.reply && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 pl-4 border-l-2 border-secondary bg-gray-50 p-3 rounded", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircle, { className: "size-4 text-[#E67E50]" }),
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircle, { className: "size-4 text-secondary" }),
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-gray-900", children: "Store Response" }),
         replyDate && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-gray-500", children: dateFns.formatDistanceToNow(replyDate, { addSuffix: true }) })
       ] }),
@@ -15344,7 +15364,7 @@ function ProductDetailScreen({ productId }) {
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4 p-6 bg-linear-to-br from-[#5B9BD5]/5 to-[#2B4B7C]/5 rounded-[24px]", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4 p-6 bg-linear-to-br from-secondary/5 to-secondary/5 rounded-[24px]", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-10 rounded-full bg-white flex items-center justify-center shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Truck, { className: "size-5 text-primary" }) }),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
@@ -15454,7 +15474,7 @@ function CartItem({ item }) {
       initial: { opacity: 0, y: 20 },
       animate: { opacity: 1, y: 0 },
       exit: { opacity: 0, x: -100 },
-      className: "bg-white border-2 border-gray-100 rounded-[24px] p-6 hover:border-[#5B9BD5]/30 transition-all duration-300",
+      className: "bg-white border-2 border-gray-100 rounded-[24px] p-6 hover:border-secondary/30 transition-all duration-300",
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-4 pr-8", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-28 h-28 rounded-[16px] overflow-hidden bg-gray-50 shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(
           Image4__default.default,
@@ -15509,7 +15529,7 @@ function CartItem({ item }) {
               )
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-right", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-['Poppins',sans-serif] font-bold text-[18px] text-[#E67E50]", children: formatPrice(itemTotal) }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-['Poppins',sans-serif] font-bold text-[18px] text-secondary", children: formatPrice(itemTotal) }),
               /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "font-['Poppins',sans-serif] text-[11px] text-[#676c80]", children: [
                 formatPrice(unitPrice),
                 " each"
@@ -15545,7 +15565,7 @@ function CartScreen() {
             {
               type: "button",
               onClick: () => router.push(buildPath("/shop")),
-              className: "rounded-xl border-2 border-primary bg-primary text-white px-6 py-3 text-sm font-medium transition-colors flex items-center justify-center gap-2 hover:opacity-80",
+              className: "rounded-xl border-2 border-primary bg-secondary text-white px-6 py-3 text-sm font-medium transition-colors flex items-center justify-center gap-2 hover:opacity-80",
               children: [
                 "Discover products",
                 /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "h-5 w-5" })
@@ -15619,7 +15639,7 @@ function CartScreen() {
           animate: { opacity: 1, y: 0 },
           transition: { delay: 0.1 },
           className: "space-y-6 lg:sticky lg:top-24 h-fit lg:col-span-1",
-          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-linear-to-br from-[#5B9BD5]/10 to-[#2B4B7C]/10 rounded-[24px] p-8 border-2 border-[#5B9BD5]/20 sticky top-24", children: [
+          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-linear-to-br from-secondary/10 to-secondary/10 rounded-[24px] p-8 border-2 border-secondary/20 sticky top-24", children: [
             /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-['Poppins',sans-serif] font-semibold text-secondary mb-6", children: "Order Summary" }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4 mb-6", children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
@@ -15647,7 +15667,7 @@ function CartScreen() {
                 {
                   type: "submit",
                   onClick: handleSubmit,
-                  className: "w-full rounded-full border-2 border-[#E67E50] bg-[#E67E50] hover:bg-[#E67E50]/80 text-white px-4 py-3 text-sm font-medium transition-colors flex items-center justify-center gap-2",
+                  className: "w-full rounded-full border-2 border-secondary bg-secondary hover:bg-secondary/80 text-white px-4 py-3 text-sm font-medium transition-colors flex items-center justify-center gap-2",
                   children: [
                     "Proceed to Checkout",
                     /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "h-5 w-5" })
@@ -16957,8 +16977,8 @@ function CheckoutScreen() {
           animate: { opacity: 1, y: 0 },
           transition: { duration: 0.5, ease: "easeOut", delay: 0.1 },
           className: "space-y-10 lg:sticky lg:top-24 lg:col-span-1",
-          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-linear-to-br from-[#5B9BD5]/10 to-[#2B4B7C]/10 rounded-[24px] p-8 border-2 border-[#5B9BD5]/20 sticky top-24", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-['Poppins',sans-serif] font-semibold text-[#2B4B7C] mb-6 text-2xl", children: "Order Summary" }),
+          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-linear-to-br from-secondary/10 to-secondary/10 rounded-[24px] p-8 border-2 border-secondary/20 sticky top-24", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-['Poppins',sans-serif] font-semibold text-secondary mb-6 text-2xl", children: "Order Summary" }),
             /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "mt-8 pt-6 border-t border-slate-100", children: [
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4 mb-6", children: cart?.cartBody?.items?.map((item) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3", children: [
                 /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-16 h-16 rounded-xl overflow-hidden bg-white shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(Image4__default.default, { src: item.productVariantData?.media?.[0]?.file || PLACEHOLDER_IMAGE_SRC, alt: item.productVariantData.name, className: "w-full h-full object-cover", height: 200, width: 200 }) }),
@@ -16969,10 +16989,10 @@ function CheckoutScreen() {
                     " \u2022 Qty: ",
                     item.quantity
                   ] }),
-                  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-['Poppins',sans-serif] font-semibold text-[12px] text-[#E67E50] mt-1", children: formatPrice(item.productVariantData.finalPrice * item.quantity) })
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-['Poppins',sans-serif] font-semibold text-[12px] text-secondary mt-1", children: formatPrice(item.productVariantData.finalPrice * item.quantity) })
                 ] })
               ] }, item.productVariantId || item.id)) }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px bg-[#5B9BD5]/20 my-4" }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px bg-secondary/20 my-4" }),
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-6", children: /* @__PURE__ */ jsxRuntime.jsx(
                 CouponCodeInput,
                 {
@@ -17004,14 +17024,14 @@ function CheckoutScreen() {
                   /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Estimated tax" }),
                   /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: formatPrice(tax) })
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px bg-[#5B9BD5]/20 mt-6" }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px bg-secondary/20 mt-6" }),
                 /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-6", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-['Poppins',sans-serif] font-semibold text-[16px] text-[#2B4B7C]", children: "Total" }),
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-['Poppins',sans-serif] font-bold text-[24px] text-[#E67E50]", children: formatPrice(total) })
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-['Poppins',sans-serif] font-semibold text-[16px] text-secondary", children: "Total" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-['Poppins',sans-serif] font-bold text-[24px] text-secondary", children: formatPrice(total) })
                 ] })
               ] }),
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-white/80 rounded-xl p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "font-['Poppins',sans-serif] text-[11px] text-[#676c80] leading-[1.6]", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-[#2B4B7C]", children: "Payment:" }),
+                /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-secondary", children: "Payment:" }),
                 " We'll contact you to arrange payment upon pickup or delivery. We accept cash, credit cards, and all major payment methods."
               ] }) })
             ] }),
@@ -17047,7 +17067,7 @@ function CheckoutScreen() {
               {
                 type: "submit",
                 disabled: isSubmitting,
-                className: "font-['Poppins',sans-serif] font-medium text-[14px] px-6 py-3 rounded-full text-white hover:bg-[#d66f45] hover:shadow-lg transition-all duration-300 mt-4 w-full bg-[#E67E50] hover:bg-[#2B4B7C] flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
+                className: "font-['Poppins',sans-serif] font-medium text-[14px] px-6 py-3 rounded-full text-white hover:bg-[#d66f45] hover:shadow-lg transition-all duration-300 mt-4 w-full bg-secondary hover:bg-[#2B4B7C] flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CreditCard, { className: "h-5 w-5" }),
                   isSubmitting ? "Placing order..." : "Place Secure Order"
@@ -17152,14 +17172,11 @@ function LoginScreen() {
               boxShadow: "0px 4px 6px -4px #0000001A, 0px 10px 15px -3px #0000001A"
             },
             children: [
-              status && /* @__PURE__ */ jsxRuntime.jsxs(
+              status && /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
                 {
                   className: `flex flex-row items-start gap-2 rounded-2xl border px-4 py-3 text-sm ${status.type === "success" ? "border-green-200 bg-green-50 text-green-800" : "border-red-200 bg-red-50 text-red-700"}`,
-                  children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: " text-base", children: status.type === "success" ? "\u2714" : "!" }),
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { children: status.message })
-                  ]
+                  children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: status.message })
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-start text-secondary", children: [
@@ -17202,26 +17219,14 @@ function LoginScreen() {
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-sm", children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center gap-2 text-slate-600", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    "input",
-                    {
-                      type: "checkbox",
-                      className: "h-4 w-4 rounded-sm border-slate-300 text-primary-600 focus:ring-primary-500"
-                    }
-                  ),
-                  "Remember me"
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  Link9__default.default,
-                  {
-                    href: buildPath("/forgot-password"),
-                    className: "font-medium text-primary transition hover:opacity-80",
-                    children: "Forgot password?"
-                  }
-                )
-              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-end text-sm", children: /* @__PURE__ */ jsxRuntime.jsx(
+                Link9__default.default,
+                {
+                  href: buildPath("/forgot-password"),
+                  className: "font-medium text-primary transition hover:opacity-80",
+                  children: "Forgot password?"
+                }
+              ) }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 "button",
                 {
@@ -17992,7 +17997,7 @@ function AccountOverviewTab() {
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "h-5 w-5 text-[#5B9BD5]" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "h-5 w-5 text-secondary" }) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted", children: "Full Name" }),
             /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm font-medium text-secondary", children: [
@@ -18003,21 +18008,21 @@ function AccountOverviewTab() {
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mail, { className: "h-5 w-5 text-[#5B9BD5]" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mail, { className: "h-5 w-5 text-secondary" }) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted", children: "E-mail Address" }),
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-secondary", children: user.email })
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Phone, { className: "h-5 w-5 text-[#5B9BD5]" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Phone, { className: "h-5 w-5 text-secondary" }) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted", children: "Phone Number" }),
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-secondary", children: user.phoneNumber || "Not provided" })
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MapPin, { className: "h-5 w-5 text-[#5B9BD5]" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-[#DBEAFE]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MapPin, { className: "h-5 w-5 text-secondary" }) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted", children: "Date of Birth" }),
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-secondary", children: "Not provided" })
@@ -18049,7 +18054,8 @@ function AccountOverviewTab() {
       )) }) : recentOrders.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted text-center py-8", children: "No orders yet" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-3", children: recentOrders.map((order) => /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
-          className: "flex items-center justify-between rounded-lg bg-slate-50 p-4 hover:bg-slate-100 transition-colors",
+          onClick: () => router.push(buildPath(`/account/orders/${order._id}`)),
+          className: "flex items-center justify-between rounded-lg bg-slate-50 p-4 hover:bg-slate-100 transition-colors cursor-pointer",
           children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-lg bg-white", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Package, { className: "h-5 w-5 text-slate-600" }) }),
@@ -18081,6 +18087,8 @@ function AccountOverviewTab() {
 }
 function AccountOrdersTab() {
   const { orders, isLoading, error } = useCurrentOrders();
+  const router = navigation.useRouter();
+  const { buildPath } = useBasePath();
   if (isLoading) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-6 px-3 pb-24", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
       "div",
@@ -18108,7 +18116,8 @@ function AccountOrdersTab() {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        className: "rounded-xl border border-slate-200 bg-white p-6 hover:shadow-md transition-shadow",
+        onClick: () => router.push(buildPath(`/account/orders/${order._id}`)),
+        className: "rounded-xl border border-slate-200 bg-white p-6 hover:shadow-md transition-shadow cursor-pointer",
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between mb-4 pb-4 border-b border-slate-200", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
@@ -18548,7 +18557,7 @@ function AccountReviewsTab() {
         "button",
         {
           onClick: () => router.push(buildPath("/reviews")),
-          className: "inline-flex items-center gap-2 px-4 py-2 border border-[#E67E50] text-[#E67E50] rounded-lg font-medium hover:bg-[#E67E50]/5 transition-colors text-sm",
+          className: "inline-flex items-center gap-2 px-4 py-2 border border-secondary text-secondary rounded-lg font-medium hover:bg-secondary/5 transition-colors text-sm",
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "size-4" }),
             "Write a Review"
@@ -19923,7 +19932,7 @@ function WishlistScreen() {
               {
                 type: "button",
                 onClick: () => router.push(buildPath("/shop")),
-                className: "rounded-xl border-2 border-primary bg-primary text-white px-6 py-3 text-sm font-medium transition-colors flex items-center justify-center gap-2 hover:opacity-80",
+                className: "rounded-xl border-2 border-secondary bg-secondary text-white px-6 py-3 text-sm font-medium transition-colors flex items-center justify-center gap-2 hover:opacity-80",
                 children: "Discover products"
               }
             ) })
@@ -21314,6 +21323,23 @@ function OrderDetailScreen({ id }) {
   const router = navigation.useRouter();
   const { buildPath } = useBasePath();
   const { order, isLoading, error } = useOrder(id);
+  const [storeAddress, setStoreAddress] = React10.useState(null);
+  React10.useEffect(() => {
+    if (order && order.orderType !== "Delivery" && !order.pickUpAddress) {
+      const fetchStoreAddress = async () => {
+        try {
+          const api = new ShippingApi(AXIOS_CONFIG);
+          const res = await api.getStoreAddress();
+          if (res.data) {
+            setStoreAddress(res.data);
+          }
+        } catch (e) {
+          console.error("Failed to fetch store address:", e);
+        }
+      };
+      fetchStoreAddress();
+    }
+  }, [order]);
   if (isLoading) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-h-screen bg-slate-50 flex flex-col items-center justify-center p-4", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-16 h-16 border-4 border-primary-20 border-t-primary rounded-full animate-spin mb-4" }),
@@ -21348,7 +21374,7 @@ function OrderDetailScreen({ id }) {
     }
   };
   const shippingAddress = order.shippingInfo?.addressTo;
-  const pickupAddress = order.pickUpAddress;
+  const pickupAddress = order.pickUpAddress || storeAddress;
   const activeAddress = isDelivery ? shippingAddress : pickupAddress;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-h-screen bg-linear-to-b from-[#F8FAFC] to-[#EBF4FB] pb-20", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "container mx-auto px-4 pt-8 max-w-6xl", children: [