[V0_FILE]plaintext:file=".gitignore" # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies /node_modules # next.js /.next/ /out/ # production /build # debug npm-debug.log* yarn-debug.log* yarn-error.log* .pnpm-debug.log* # env files .env* # vercel .vercel # typescript *.tsbuildinfo next-env.d.ts [V0_FILE]markdown:file="README.md" # Kerry's Kitchen website *Automatically synced with your [v0.app](https://v0.app) deployments* [![Deployed on Vercel](https://img.shields.io/badge/Deployed%20on-Vercel-black?style=for-the-badge&logo=vercel)](https://vercel.com/ricodeansharma-6114s-projects/v0-kerry-s-kitchen-website) [![Built with v0](https://img.shields.io/badge/Built%20with-v0.app-black?style=for-the-badge)](https://v0.app/chat/projects/LeX4c3SdJER) ## Overview This repository will stay in sync with your deployed chats on [v0.app](https://v0.app). Any changes you make to your deployed app will be automatically pushed to this repository from [v0.app](https://v0.app). ## Deployment Your project is live at: **[https://vercel.com/ricodeansharma-6114s-projects/v0-kerry-s-kitchen-website](https://vercel.com/ricodeansharma-6114s-projects/v0-kerry-s-kitchen-website)** ## Build your app Continue building your app on: **[https://v0.app/chat/projects/LeX4c3SdJER](https://v0.app/chat/projects/LeX4c3SdJER)** ## How It Works 1. Create and modify your project using [v0.app](https://v0.app) 2. Deploy your chats from the v0 interface 3. Changes are automatically pushed to this repository 4. Vercel deploys the latest version from this repository [V0_FILE]typescriptreact:file="app/about/AboutClient.tsx" "use client" import { useState } from "react" import { Button } from "@/components/ui/button" import { Card } from "@/components/ui/card" import Link from "next/link" export default function AboutClient() { const [isDark, setIsDark] = useState(false) const toggleTheme = () => { setIsDark(!isDark) document.documentElement.classList.toggle("dark") } return (

{/* Header */}

ABOUT US

The Story Behind Kerry's Kitchen

{/* Main Content */}

{/* Our Story */}

Our Story

{/* Photo positioned at top right */}

Dedicated to our beloved Mom

{/* Text content that flows around and under the photo */}

At Kerry's Kitchen, our journey began with a shared passion for nature and wellness. Founded by a dedicated family of researchers and wellness enthusiasts, the idea was born from a simple yet powerful curiosity: exploring the health benefits of plants.

Our Founders:

Denaught Sharma (Dad)
Billy Sharma
Rico Sharma
Chay Sharma

Through extensive research and foraging, we discovered the immense potential these plants held for improving well-being. Each family member brought their unique expertise and passion to the venture - from botanical research to traditional herbal knowledge, creating a comprehensive approach to natural wellness.

As we ventured further into the world of natural remedies, we decided to turn our passion into something tangible—creating high-quality, handcrafted products designed to nurture both body and mind. Our commitment extends beyond just creating products; we're dedicated to educating our community about the incredible healing properties found in nature.

The name Kerry's Kitchen is a tribute to our beloved mother, Kerry Turner, whose nurturing spirit has always been at the heart of everything we do. Her wisdom, love, and dedication to family wellness inspired us to share these natural remedies with the world. The word "Kitchen" reflects our commitment to creating products in small, thoughtful batches—handcrafted with care and attention to detail, just as she would have done.

At Kerry's Kitchen, we are dedicated to bringing nature's best ingredients to your doorstep, empowering you to live a healthier, more vibrant life. Every product we create carries forward Kerry's legacy of love, care, and the belief that the best medicine comes from nature itself.

{/* Clear float to ensure proper layout */}

{/* Our Mission */}

Our Mission

At Kerry's Kitchen, we're committed to:

Creating products that enhance both flavor and health
Using only the highest quality, sustainably sourced ingredients
Supporting traditional herbal knowledge with modern research
Making wellness accessible and delicious for everyone
Building a community around mindful eating and natural health

{/* Our Values */}

🌱 Natural & Pure

We use only natural ingredients, free from artificial additives, preservatives, and synthetic flavors. What you see on the label is exactly what you get.

🌍 Sustainable Sourcing

We partner with ethical suppliers who share our commitment to environmental responsibility and fair trade practices.

🔬 Science-Backed

Every ingredient is chosen based on both traditional use and modern scientific research, ensuring maximum benefit and efficacy.

❤️ Made with Love

Each product is crafted in small batches with care and attention to detail, ensuring the highest quality in every package.

{/* Contact */}

Get in Touch

Have questions about our products or want to learn more about natural wellness? We'd love to hear from you!

{/* Footer */}

) } [V0_FILE]typescriptreact:file="app/about/page.tsx" import type { Metadata } from "next" import AboutClient from "./AboutClient" export const metadata: Metadata = { title: "About Kerry's Kitchen | Our Story & Mission | Natural Wellness Products", description: "Discover the story behind Kerry's Kitchen - a passionate herbalist's journey to create premium natural herbs, spices, and wellness products. Learn about our mission, values, and commitment to sustainable, science-backed nutrition.", keywords: [ "Kerry's Kitchen story", "natural wellness company", "herbalist founded", "sustainable ingredients", "traditional herbal wisdom", "modern nutrition science", "ethical sourcing", "natural health mission", ], openGraph: { title: "About Kerry's Kitchen | Our Story & Mission", description: "Meet Kerry and discover our passion for combining traditional herbal wisdom with modern nutritional science to create premium wellness products.", images: ["/about-og.jpg"], }, } export default function About() { return } [V0_FILE]typescriptreact:file="app/cart/page.tsx" "use client" import { useCart } from "@/lib/cart-context" import Link from "next/link" export default function CartPage() { const { state, removeItem, updateQuantity, clearCart } = useCart() const items = state?.items || [] const subtotal = state?.total || 0 return (

Your Cart

{!items.length ? (

Your cart is empty.{" "} Continue shopping .

) : ( <> {items.map((it) => ( ))}

Item	Price	Qty	Total
{it.image && ( )} {it.name} {it.id}	£{it.price.toFixed(2)}	updateQuantity(it.id, Number(e.target.value \|\| 0))} />	£{(it.price * it.quantity).toFixed(2)}

Subtotal: £{subtotal.toFixed(2)}

Checkout

)}

) } [V0_FILE]typescriptreact:file="app/checkout/page.tsx" "use client" import type React from "react" import { useState } from "react" import { Button } from "@/components/ui/button" import { Card } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import Link from "next/link" import { useCart } from "@/lib/cart-context" import { useRouter } from "next/navigation" export default function Checkout() { const { state, dispatch } = useCart() const router = useRouter() const [isDark, setIsDark] = useState(false) const [isProcessing, setIsProcessing] = useState(false) const [paymentMethod, setPaymentMethod] = useState<"card" | "apple-pay">("card") const [formData, setFormData] = useState({ email: "", firstName: "", lastName: "", address: "", city: "", postalCode: "", country: "United Kingdom", cardNumber: "", expiryDate: "", cvv: "", nameOnCard: "", }) const toggleTheme = () => { setIsDark(!isDark) document.documentElement.classList.toggle("dark") } const handleInputChange = (field: string, value: string) => { setFormData((prev) => ({ ...prev, [field]: value })) } const handleSubmit = async (e: React.FormEvent) => { e.preventDefault() setIsProcessing(true) // Simulate payment processing setTimeout(() => { // Clear cart and redirect to success page dispatch({ type: "CLEAR_CART" }) router.push("/order-success") }, 2000) } const handleApplePayClick = () => { setIsProcessing(true) // Simulate Apple Pay processing setTimeout(() => { dispatch({ type: "CLEAR_CART" }) router.push("/order-success") }, 1500) } if (state.items.length === 0) { return (

🛒

Your cart is empty

Add some products before checking out!

) } return (

Checkout

Complete your order securely

{/* Payment Form */}

Contact Information

Email Address handleInputChange("email", e.target.value)} placeholder="your@email.com" required />

First Name handleInputChange("firstName", e.target.value)} placeholder="John" required />

Last Name handleInputChange("lastName", e.target.value)} placeholder="Doe" required />

Shipping Address

Address handleInputChange("address", e.target.value)} placeholder="123 Main Street" required />

City handleInputChange("city", e.target.value)} placeholder="London" required />

Postal Code handleInputChange("postalCode", e.target.value)} placeholder="SW1A 1AA" required />

Payment Method

{/* Payment Method Selection */}

{paymentMethod === "apple-pay" ? (

Touch ID or Face ID required

) : (

Card Number handleInputChange("cardNumber", e.target.value)} placeholder="1234 5678 9012 3456" required />

Expiry Date handleInputChange("expiryDate", e.target.value)} placeholder="MM/YY" required />

CVV handleInputChange("cvv", e.target.value)} placeholder="123" required />

Name on Card handleInputChange("nameOnCard", e.target.value)} placeholder="John Doe" required />

)}

🔒 Your payment information is secure and encrypted

Payments processed securely by Stripe

{/* Order Summary */}

Order Summary

{state.items.map((item) => (

{item.name}

Qty: {item.quantity}

£{(item.price * item.quantity).toFixed(2)}

))}

Subtotal ({state.itemCount} items) £{state.total.toFixed(2)}

Shipping Free

VAT (20%) £{(state.total * 0.2).toFixed(2)}

Total £{(state.total * 1.2).toFixed(2)}

Payment Details

Payments will be processed securely and deposited into:

Account Name: Prescient Promotions

Account Number: 81182899

Sort Code: 04-29-09

) } [V0_FILE]typescriptreact:file="app/faq/FAQClient.tsx" "use client" import { useState, useEffect } from "react" import { Button } from "@/components/ui/button" import { Card } from "@/components/ui/card" import Link from "next/link" const FAQ_DATA = [ { category: "Orders & Shipping", questions: [ { question: "How long does shipping take?", answer: "We offer free standard shipping (3-5 business days) on orders over £25. Express shipping (1-2 business days) is available for £4.99. All orders are processed within 24 hours on weekdays.", }, { question: "Do you ship internationally?", answer: "Currently, we ship within the UK only. We're working on expanding our shipping to EU countries soon. Sign up for our newsletter to be notified when international shipping becomes available.", }, { question: "Can I track my order?", answer: "Yes! Once your order ships, you'll receive a tracking number via email. You can use this to monitor your package's progress until it arrives at your door.", }, ], }, { category: "Products & Ingredients", questions: [ { question: "Are your products organic?", answer: "Many of our products are certified organic, and all are made with natural ingredients. We source from trusted suppliers who share our commitment to quality and sustainability. Check individual product pages for specific certifications.", }, { question: "Do you have allergen information?", answer: "Yes, all allergen information is clearly listed on each product page. Our products are processed in facilities that may handle nuts, soy, and other common allergens. Please read labels carefully if you have allergies.", }, { question: "How should I store my products?", answer: "Store all products in a cool, dry place away from direct sunlight. Teas and seasonings should be kept in airtight containers to maintain freshness. Most products have a shelf life of 12-24 months when stored properly.", }, { question: "Are your products suitable for vegans?", answer: "Yes! All Kerry's Kitchen products are 100% plant-based and suitable for vegans and vegetarians. We never use any animal-derived ingredients in our blends.", }, ], }, { category: "Health & Usage", questions: [ { question: "Can I take these products with medications?", answer: "While our products are natural, some herbs and spices can interact with medications. We recommend consulting with your healthcare provider before using our products if you're taking any medications or have health conditions.", }, { question: "How much should I use per serving?", answer: "Usage instructions are provided on each product page and package. Generally, start with smaller amounts and adjust to taste. For teas, use 1-2 teaspoons per cup. For seasonings, start with 1/4 teaspoon per serving.", }, { question: "Are your products safe during pregnancy?", answer: "Some herbs may not be suitable during pregnancy or breastfeeding. Please consult your healthcare provider before using any herbal products during pregnancy or while nursing.", }, ], }, { category: "Returns & Refunds", questions: [ { question: "What is your return policy?", answer: "We offer a 30-day satisfaction guarantee. If you're not completely happy with your purchase, contact us for a full refund or exchange. Products must be in original condition with at least 80% remaining.", }, { question: "How do I return a product?", answer: "Contact us at solarcaptureindustries@gmail.com with your order number and reason for return. We'll provide a prepaid return label and full instructions. Refunds are processed within 5-7 business days of receiving the return.", }, { question: "Do you offer exchanges?", answer: "Yes! If you'd like to exchange a product for a different item, just let us know when you contact us about your return. We'll help you find the perfect replacement.", }, ], }, ] const FAQClient = () => { const [isDark, setIsDark] = useState(false) const [isVisible, setIsVisible] = useState(false) const [openItems, setOpenItems] = useState([]) useEffect(() => { const timer = setTimeout(() => setIsVisible(true), 100) return () => clearTimeout(timer) }, []) const toggleTheme = () => { setIsDark(!isDark) document.documentElement.classList.toggle("dark") } const toggleItem = (itemId: string) => { setOpenItems((prev) => (prev.includes(itemId) ? prev.filter((id) => id !== itemId) : [...prev, itemId])) } return (

Frequently Asked Questions

Find answers to common questions about our products and services

{FAQ_DATA.map((category, categoryIndex) => (

{category.category}

{category.questions.map((faq, questionIndex) => { const itemId = `${categoryIndex}-${questionIndex}` const isOpen = openItems.includes(itemId) return (

{faq.answer}

) })}

))}

Still Have Questions?

Can't find what you're looking for? We're here to help!

) } export default FAQClient [V0_FILE]typescriptreact:file="app/faq/page.tsx" import type { Metadata } from "next" import FAQClient from "./FAQClient" export const metadata: Metadata = { title: "FAQ | Kerry's Kitchen | Frequently Asked Questions About Natural Products", description: "Find answers to common questions about Kerry's Kitchen natural herbs, spices, and wellness products. Learn about shipping, ingredients, health benefits, returns, and more.", keywords: [ "Kerry's Kitchen FAQ", "natural products questions", "herbal tea shipping", "organic spices information", "wellness products help", "ingredient questions", "return policy", "health benefits", ], openGraph: { title: "FAQ | Kerry's Kitchen", description: "Get answers to frequently asked questions about our natural herbs, spices, and wellness products.", images: ["/faq-og.jpg"], }, } export default function FAQ() { return } [V0_FILE]css:file="app/globals.css" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { /* Updated color palette from green to orange theme */ --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); } .dark { /* Updated dark mode colors to orange theme */ --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { --font-sans: var(--font-geist-sans); --font-mono: var(--font-geist-mono); --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } /* Added premium animation keyframes and utilities */ @keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-10px); } } @keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } } @keyframes pulse-glow { 0%, 100% { /* Updated glow effect to orange */ box-shadow: 0 0 20px rgba(234, 88, 12, 0.3); } 50% { box-shadow: 0 0 40px rgba(234, 88, 12, 0.6); } } @keyframes slide-up { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } @keyframes scale-in { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } } .animate-float { animation: float 3s ease-in-out infinite; } .animate-shimmer { background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent); background-size: 200% 100%; animation: shimmer 2s infinite; } .animate-pulse-glow { animation: pulse-glow 2s ease-in-out infinite; } .animate-slide-up { animation: slide-up 0.6s ease-out forwards; } .animate-scale-in { animation: scale-in 0.4s ease-out forwards; } .stagger-1 { animation-delay: 0.1s; } .stagger-2 { animation-delay: 0.2s; } .stagger-3 { animation-delay: 0.3s; } .stagger-4 { animation-delay: 0.4s; } .stagger-5 { animation-delay: 0.5s; } /* Added smooth scroll behavior */ html { scroll-behavior: smooth; } /* Updated gradient backgrounds to orange theme */ .gradient-hero { background: linear-gradient(135deg, #ea580c 0%, #f97316 50%, #fb923c 100%); background-size: 200% 200%; animation: gradient-shift 8s ease infinite; } @keyframes gradient-shift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } .glass-effect { backdrop-filter: blur(10px); background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.3); } [V0_FILE]typescriptreact:file="app/layout.tsx" import type React from "react" import type { Metadata } from "next" import { GeistSans } from "geist/font/sans" import { GeistMono } from "geist/font/mono" import { Analytics } from "@vercel/analytics/next" import { Suspense } from "react" import { CartProvider } from "@/lib/cart-context" import { ReviewsProvider } from "@/lib/reviews-context" import { CartBadge } from "@/components/cart-badge" import Script from "next/script" import "./globals.css" export const metadata: Metadata = { title: "Kerry's Kitchen | Premium Natural Herbs, Spices & Wellness Teas | Flavour Your Health", description: "Discover Kerry's Kitchen's premium collection of natural herbs, spices, and functional foods. From energizing teas to healing seasonings, we craft wellness products that flavour your health naturally.", keywords: [ "natural herbs", "organic spices", "wellness teas", "functional foods", "healthy seasonings", "herbal blends", "natural health products", "Kerry's Kitchen", "premium botanicals", "plant-based nutrition", ], authors: [{ name: "Kerry's Kitchen" }], creator: "Kerry's Kitchen", publisher: "Kerry's Kitchen", formatDetection: { email: false, address: false, telephone: false, }, metadataBase: new URL("https://www.kerrys-kitchen.com"), // Updated domain from vercel.app to live domain alternates: { canonical: "/", }, openGraph: { title: "Kerry's Kitchen | Premium Natural Herbs & Wellness Products", description: "Transform your health with our premium collection of natural herbs, spices, and functional foods. Expertly crafted blends for wellness and flavor.", url: "https://www.kerrys-kitchen.com", // Updated OpenGraph URL to live domain siteName: "Kerry's Kitchen", images: [ { url: "/og-image.jpg", width: 1200, height: 630, alt: "Kerry's Kitchen - Premium Natural Herbs and Spices", }, ], locale: "en_GB", type: "website", }, twitter: { card: "summary_large_image", title: "Kerry's Kitchen | Premium Natural Herbs & Wellness Products", description: "Transform your health with our premium collection of natural herbs, spices, and functional foods.", images: ["/og-image.jpg"], }, robots: { index: true, follow: true, googleBot: { index: true, follow: true, "max-video-preview": -1, "max-image-preview": "large", "max-snippet": -1, }, }, verification: { google: "your-google-verification-code", }, category: "food", generator: "v0.app", } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/liver-comparison/page.tsx" import type { Metadata } from "next" export const metadata: Metadata = { title: "Liver Comparison - Kerry's Kitchen", description: "Comprehensive comparison of different liver types for vitiligo and histamine sensitivity management", } export default function LiverComparisonPage() { return (

{/* Header */}

Liver Type Comparison Guide

A comprehensive analysis of different liver types for managing vitiligo and histamine sensitivity

{/* Main Comparison Table */}

Liver Type Analysis

Liver Type	DAO Content	Histamine Burden	Suitability
Beef Liver	Higher Rich in DAO enzyme	Moderate-High Contains measurable biogenic amines	Best theoretical benefit due to higher DAO. Requires fresh preparation and minimal storage. Caution needed with histamine sensitivity.
Chicken Liver	Unknown/Lower No reliable published data	Possibly High Variable, depends on storage	Less optimal due to lack of DAO data and potential higher histamine load. May not be ideal for histamine management.
Lamb Liver	Unknown No clear published data	Moderate Variable based on freshness	Middle-ground option. Missing DAO data means no assumed enzyme benefit. Requires tolerance testing.

{/* Recommendations */}

Recommendations

For DAO support: Beef liver offers the best theoretical benefit due to higher DAO content, but requires fresh preparation, minimal storage, and proper cooking to limit histamine formation.

For histamine sensitivity: If you have known histamine sensitivity, you may need to avoid or limit all organ livers, select only extremely fresh ones, keep portion sizes small, and monitor reactions carefully.

For vitiligo management: While there's no direct evidence that liver choice influences vitiligo outcomes via DAO/histamine, choosing options that support histamine breakdown and avoid additional histamine burden makes sense for managing inflammation.

General advice: Proceed cautiously with small amounts, monitor skin and other reactions, keep liver very fresh or frozen, and ensure your overall diet supports histamine breakdown (vitamins B6, copper, etc.).

{/* Copper Content Comparison */}

Copper Content Comparison

Beef Liver

9.8-14 mg

per 100g raw

Highest Copper

Lamb Liver

7.0-11.4 mg

per 100g raw

Moderate Copper

Chicken Liver

0.49-1.0 mg

per 100g raw

Lower Copper

{/* Vitiligo Statistics */}

Vitiligo & Autoimmune Disease Statistics

Condition	Ethnic/Regional Group	Metric & Value	Notes
Vitiligo – U.S.	Asian American	~41.2 per 100,000 PY	Highest age-adjusted incidence
Vitiligo – U.S.	Hispanic/Latino	~37.3 per 100,000 PY Prevalence: ~0.29%	Second highest incidence; highest prevalence
Vitiligo – U.S.	Black (non-Hispanic)	~29.6 per 100,000 PY Prevalence: ~0.22%	Intermediate values
Vitiligo – U.S.	White (non-Hispanic)	~18.7 per 100,000 PY Prevalence: ~0.13%	Lowest among listed groups
Vitiligo – Global	South Asia; Central Europe	~0.52% prevalence	Among highest regional prevalence
Vitiligo – Global	All ethnicities	~0.5%-2% (most studies ≤0.6%)	Broad global estimate
Autoimmune (IMIDs)	Non-Hispanic Black & Hispanic	Higher odds of SLE	Other IMIDs vary by group
Autoimmune (IMIDs)	UK ethnic minorities	Earlier onset & higher severity	Suggests ethnic disparity

{/* Key Takeaways */}

Key Takeaways

🇺🇸

U.S. Vitiligo Patterns

Asian American and Hispanic/Latino groups show higher incidence and prevalence compared to White non-Hispanic groups.

🌍

Global Distribution

Certain regions like South Asia and Central Europe report higher general prevalence of vitiligo (~0.5%).

🔬

Autoimmune Risk

Minority ethnic groups in the U.S. and UK appear to have greater risk or earlier onset for certain autoimmune conditions.

{/* Disclaimer */}

Disclaimer: This information is for educational purposes only and should not replace professional medical advice. Always consult with a healthcare provider before making dietary changes, especially when managing medical conditions.

) } [V0_FILE]typescriptreact:file="app/order-success/page.tsx" "use client" import { useState, useEffect } from "react" import { Button } from "@/components/ui/button" import { Card } from "@/components/ui/card" import Link from "next/link" export default function OrderSuccess() { const [isDark, setIsDark] = useState(false) const [orderNumber] = useState(() => Math.random().toString(36).substr(2, 9).toUpperCase()) const toggleTheme = () => { setIsDark(!isDark) document.documentElement.classList.toggle("dark") } useEffect(() => { // Confetti effect simulation const timer = setTimeout(() => { console.log("Order confirmed! 🎉") }, 500) return () => clearTimeout(timer) }, []) return (

🎉

Order Confirmed!

Thank you for your purchase from Kerry's Kitchen

📦

Order Details

Order Number: #{orderNumber}

Order Date: {new Date().toLocaleDateString("en-GB", { day: "numeric", month: "long", year: "numeric", })}

Payment Status: ✅ Confirmed

Estimated Delivery: {new Date(Date.now() + 3 * 24 * 60 * 60 * 1000).toLocaleDateString("en-GB", { day: "numeric", month: "long", year: "numeric", })}

💳

Payment Information

✅ Payment Processed Successfully

Your payment has been securely processed and funds will be deposited into our business account.

Deposit Account:

Account Name: Prescient Promotions

Account Number: 81182899

Sort Code: 04-29-09

📧 Confirmation Email Sent

A detailed receipt and tracking information has been sent to your email address.

🚚

What Happens Next?

📋

Order Processing

We'll prepare your natural products with care within 1-2 business days.

📦

Packaging & Dispatch

Your items will be carefully packaged and dispatched via Royal Mail.

🏠

Delivery

Expect delivery within 3-5 business days. Tracking details will be provided.

Thank You for Choosing Kerry's Kitchen! 🌿

We're excited to help you on your wellness journey with our premium natural products.

) } [V0_FILE]typescriptreact:file="app/page.tsx" "use client" import { useState, useEffect } from "react" import { Button } from "@/components/ui/button" import { Card } from "@/components/ui/card" import { NewsletterSignup } from "@/components/newsletter-signup" import Link from "next/link" export default function Home() { const [isDark, setIsDark] = useState(false) const [isVisible, setIsVisible] = useState(false) useEffect(() => { const timer = setTimeout(() => setIsVisible(true), 100) return () => clearTimeout(timer) }, []) const toggleTheme = () => { setIsDark(!isDark) document.documentElement.classList.toggle("dark") } return (

🌿

KERRY'S KITCHEN

Flavour Your Health

Discover premium herbs, spices, and botanicals crafted with care. Where traditional knowledge meets modern nutrition to bring wellness to your table.

Why Choose Kerry's Kitchen?

🌱

Natural & Pure

All our products are crafted from the finest natural ingredients, free from artificial additives and preservatives.

🧠

Health Focused

Every blend is designed to support your wellness journey with scientifically-backed health benefits.

👩‍🍳

Expertly Crafted

Traditional knowledge meets modern nutrition in every carefully curated blend and seasoning.

Ready to Transform Your Kitchen?

Explore our collection of premium seasonings, teas, and functional foods designed to elevate your culinary experience and support your health.

) } [V0_FILE]typescriptreact:file="app/products/ProductsClient.tsx" "use client" import { useCart } from "@/lib/cart-context" import { useState } from "react" type WeightOption = { weight: string price: number } type Product = { id: string title: string price: number image: string blurb: string ingredients: string[] benefits: string[] category: string weightOptions: WeightOption[] } const PRODUCTS: Product[] = [ { id: "numatcha", title: "Florida Red Tea", price: 18.99, image: "/chamomile-tea-in-clear-glass-cup-with-dried-flowers.png", blurb: "Discover the ENERGY of Florida Red Tea: Comfort AND Nutrition in Every Cup. A functional tea blend that doesn't just taste incredible, but actively supports your health with nature's most potent botanicals.", category: "Teas", ingredients: ["Pear Leaves", "Camellia Leaves", "Cloves", "Orange Peel", "Rosemary"], benefits: [ "2,100 mg of polyphenols per day (3× beneficial daily intake) - fights oxidative stress, supports brain health", "85% of daily manganese needs - essential for bone strength and protection against osteoporosis", "28% of daily Vitamin C - boosts immune system resilience and aids collagen formation", "Helps balance cytokine activity - reduces inflammation and strengthens cardiovascular health", "100% botanical ingredients - no chemicals, additives, or artificial enhancers", "Hand-selected and carefully balanced for taste and function", ], weightOptions: [ { weight: "Sample (25g/50g)", price: 10.0 }, { weight: "50g", price: 18.99 }, { weight: "100g", price: 32.99 }, { weight: "250g", price: 75.99 }, ], }, { id: "good-night-tea", title: "Good Night Tea", price: 9.99, image: "/chamomile-tea-in-clear-glass-cup-with-dried-flowers.png", blurb: "A calming herbal tea for sleep and relaxation.", category: "Teas", ingredients: ["Rosemary", "Lavender", "Chamomile", "Eastern white pine", "3 more ingredients"], benefits: ["Relieves stress & anxiety", "Promotes restful sleep", "Antioxidant-rich botanicals"], weightOptions: [ { weight: "Sample (25g/50g)", price: 10.0 }, { weight: "50g", price: 9.99 }, { weight: "100g", price: 17.99 }, { weight: "250g", price: 39.99 }, ], }, { id: "vitamin-d2-mushrooms", title: "Vitamin D2 Enriched Mushrooms", price: 22.99, image: "/sun-dried-button-mushrooms-on-wooden-cutting-board.png", blurb: "Sun-cured mushrooms, a plant-based Vitamin D source.", category: "Functional Foods", ingredients: ["Sun-cured button mushrooms", "Garlic", "Rosemary", "Olive Oil"], benefits: ["Supports bone & immune health", "Helps regulate mood", "Plant-based nutrition"], weightOptions: [ { weight: "Sample (25g/50g)", price: 10.0 }, { weight: "50g", price: 22.99 }, { weight: "100g", price: 39.99 }, { weight: "250g", price: 89.99 }, ], }, { id: "querceto-verde", title: "Querceto Verde", price: 15.99, image: "/vibrant-green-herb-condiment-sauce-in-glass-jar.png", blurb: "A green condiment rich in quercetin for immunity and mood balance.", category: "Condiments", ingredients: ["Cilantro", "Parsley", "Green chili", "Lemon", "4 more ingredients"], benefits: [ "Contains May Slow & dietary symptoms", "Supports mood & neurological health", "Boosts antioxidants & immunity", ], weightOptions: [ { weight: "Sample (25g/50g)", price: 10.0 }, { weight: "50g", price: 15.99 }, { weight: "100g", price: 27.99 }, { weight: "250g", price: 62.99 }, ], }, { id: "ranch-dry-rub", title: "Ranch Dry Rub Seasoning", price: 9.00, image: "/ranch-dry-rub-seasoning-in-rustic-bowl.jpg", blurb: "A nutrient-dense and convenient butter replacement. Kerry's Kitchen Ranch Dry Rub provides a protein-rich seasoning to deliver nutrients whilst satisfying diverse taste requirements, with a piquant creamy lemon and chilli note.", category: "Seasonings", ingredients: [ "Soyabean Flour - heart-healthy fats, high protein, lowers LDL cholesterol", "Peanut Flour - high protein, rich in arginine, fibre & B vitamins", "Lentils - plant-based protein, fibre, iron & folate, low glycemic index", "Barley - high-fibre, beta-glucan for heart health & gut support", "Oats - beta-glucan, sustained energy, regulates blood sugar", "Rosemary - improves memory & concentration, rich in antioxidants", "Lemon Rind - Vitamin C, D-limonene, boosts immunity & digestion", "Garlic, Salt, Black Pepper", ], benefits: [ "Soyabean Flour - nutrient-dense, gluten-free, high-protein with heart-healthy fats, dietary fiber & essential minerals. Helps lower LDL cholesterol, manage blood pressure, reduce cancer risk & support bone health", "Peanut Flour - nutrient-dense, gluten-free, high-protein from roasted defatted peanuts. Improves heart health, muscle building & blood sugar control. Rich in arginine, fiber, potassium, magnesium & B vitamins", "Lentils - nutrient-dense, gluten-free alternative packed with plant-based protein, fiber, iron & folate. Supports heart health, aids weight management, stabilizes blood sugar with low glycemic index & powerful antioxidants", "Barley - nutrient-dense, high-fiber flour promoting heart health, weight management & blood sugar stability via beta-glucan. Rich in selenium & magnesium, acts as a prebiotic for gut health & helps lower cholesterol", "Oats - highly nutritious, gluten-free, fiber-rich flour promoting heart health, blood sugar regulation & weight management. High beta-glucan content reduces LDL cholesterol with slow-digesting complex carbs for sustained energy", "Rosemary (Salvia rosmarinus) - potent, nutrient-rich herb improving memory, concentration & mental clarity. High in antioxidants like carnosic acid supporting immune health, reducing inflammation & protecting against free radical damage", "Lemon Rind - packed with fiber, Vitamin C (iron absorption) & antioxidants like D-limonene. Boosts immunity, improves heart health, promotes digestion, supports bone health & provides antibacterial properties", ], weightOptions: [ { weight: "Sample (25g/50g)", price: 10.0 }, { weight: "250g", price: 9.0 }, { weight: "500g (10% off)", price: 16.20 }, ], }, { id: "sunburst-100", title: "Sunburst Seasoning", price: 12.99, image: "/vibrant-golden-spice-blend-seasoning-in-wooden-bow.png", blurb: "A vibrant all-purpose seasoning for flavour and brain health.", category: "Seasonings", ingredients: ["Salt", "Black pepper", "Ginger", "Cloves", "7 more ingredients"], benefits: ["Supports healthy brain function", "Rich in antioxidants", "Anti-inflammatory effects"], weightOptions: [ { weight: "Sample (25g/50g)", price: 10.0 }, { weight: "50g", price: 12.99 }, { weight: "100g", price: 22.99 }, { weight: "250g", price: 49.99 }, ], }, ] export default function ProductsClient() { const { addItem } = useCart() const [quantities, setQuantities] = useState<{ [key: string]: number }>({}) const [selectedWeights, setSelectedWeights] = useState<{ [key: string]: number }>({}) const handleAddToCart = (product: Product) => { const qty = quantities[product.id] || 1 const weightIndex = selectedWeights[product.id] || 0 const selectedWeight = product.weightOptions[weightIndex] console.log("[v0] Adding to cart:", { product: product.title, quantity: qty, weight: selectedWeight.weight, price: selectedWeight.price, }) try { addItem( { id: `${product.id}-${selectedWeight.weight}`, title: `${product.title} (${selectedWeight.weight})`, price: selectedWeight.price, image: product.image, }, qty, ) console.log("[v0] Successfully added to cart") } catch (error) { console.error("[v0] Cart error:", error) } } const updateQuantity = (productId: string, qty: number) => { setQuantities((prev) => ({ ...prev, [productId]: Math.max(1, qty), })) } const updateWeight = (productId: string, weightIndex: number) => { setSelectedWeights((prev) => ({ ...prev, [productId]: weightIndex, })) } return (

OUR PRODUCTS

Premium herbs, spices, and botanicals for your wellness journey

{PRODUCTS.map((product) => { const selectedWeightIndex = selectedWeights[product.id] || 0 const currentPrice = product.weightOptions[selectedWeightIndex].price return (

{product.category} {product.id === "ranch-dry-rub" && ( 20% Online Discount )}

{product.title}

{product.id === "ranch-dry-rub" && ( 38g protein per 100g )} {product.id === "sunburst-100" && ( Designed for cognition )}

{product.blurb}

Ingredients

{product.ingredients.map((ingredient, idx) => { const parts = ingredient.split(" - ") return ( ) })}

#	Ingredient
{idx + 1}	{parts.length > 1 ? ( <> {parts[0]} - {parts.slice(1).join(" - ")} ) : ( ingredient )}

Benefits

{product.benefits.map((benefit, idx) => { const parts = benefit.split(" - ") return ( ) })}

#	Benefit
{idx + 1}	{parts.length > 1 ? ( <> {parts[0]} - {parts.slice(1).join(" - ")} ) : ( benefit )}

Select Weight:

{product.id === "ranch-dry-rub" && selectedWeightIndex !== 0 && (

Also available: ${selectedWeightIndex === 1 ? "9.00" : "18.00"} USD | {"\u20AC"}{selectedWeightIndex === 1 ? "9.00" : "18.00"} EUR

)}

£{currentPrice.toFixed(2)}

Qty updateQuantity(product.id, Number.parseInt(e.target.value))} className="w-16 px-2 py-1 border rounded text-center" />

) })}

) } [V0_FILE]typescriptreact:file="app/products/page.tsx" import type { Metadata } from "next" import ProductsClient from "./ProductsClient" export const metadata: Metadata = { title: "Premium Natural Products | Herbs, Spices & Wellness Teas | Kerry's Kitchen", description: "Shop Kerry's Kitchen's complete collection of premium natural herbs, organic spices, wellness teas, and functional foods. From Sunburst Seasoning to Good Night Tea - discover products that flavour your health.", keywords: [ "buy natural herbs", "organic spices online", "wellness tea shop", "functional foods store", "Sunburst Seasoning", "Good Night Tea", "Numatcha", "Querceto Verde", "Vitamin D2 mushrooms", ], openGraph: { title: "Premium Natural Products | Kerry's Kitchen", description: "Shop our complete collection of premium natural herbs, spices, and wellness teas. Expert-crafted blends for health and flavor.", images: ["/products-og.jpg"], }, } export default function Products() { return } [V0_FILE]typescriptreact:file="app/test-cart/page.tsx" "use client" import { useEffect } from "react" import { Button } from "@/components/ui/button" export default function TestCart() { useEffect(() => { // Add debugging info to console console.log("[v0] KKCart object:", typeof window.KKCart) if (window.KKCart) { console.log("[v0] KKCart methods:", Object.keys(window.KKCart)) console.log("[v0] Current cart:", window.KKCart.get()) } }, []) const testAddToCart = () => { if (window.KKCart) { console.log("[v0] Testing manual cart add...") window.KKCart.add({ id: "sunburst-100", title: "Sunburst Seasoning (100g)", price: 12.99, image: "/vibrant-golden-spice-blend-seasoning-in-wooden-bow.png", qty: 1, }) console.log("[v0] Cart after add:", window.KKCart.get()) setTimeout(() => { window.location.href = "/cart-html" }, 1000) } else { console.error("[v0] KKCart not available") alert("KKCart not loaded yet. Please wait and try again.") } } const checkCart = () => { if (window.KKCart) { console.log("[v0] Current cart contents:", window.KKCart.get()) console.log("[v0] Cart totals:", window.KKCart.totals()) alert(`Cart has ${window.KKCart.totals().count} items`) } } return (

Cart Test Page

Open browser console to see debug information.

) } [V0_FILE]json:file="components.json" { "$schema": "https://ui.shadcn.com/schema.json", "style": "new-york", "rsc": true, "tsx": true, "tailwind": { "config": "", "css": "app/globals.css", "baseColor": "neutral", "cssVariables": true, "prefix": "" }, "aliases": { "components": "@/components", "utils": "@/lib/utils", "ui": "@/components/ui", "lib": "@/lib", "hooks": "@/hooks" }, "iconLibrary": "lucide" } [V0_FILE]typescriptreact:file="components/cart-badge.tsx" "use client" import { useCart } from "@/lib/cart-context" import Link from "next/link" import { useEffect, useState } from "react" export function CartBadge() { const { state } = useCart() const [mounted, setMounted] = useState(false) useEffect(() => { setMounted(true) }, []) // Don't render until mounted to avoid hydration issues if (!mounted) { return (

🛒 Cart{" "} 0

) } return (

🛒 Cart{" "} {state.itemCount}

) } [V0_FILE]typescriptreact:file="components/cart-button.tsx" "use client" import { Button } from "@/components/ui/button" import { useCart } from "@/lib/cart-context" import Link from "next/link" export function CartButton() { const { state } = useCart() return ( ) } [V0_FILE]typescriptreact:file="components/newsletter-signup.tsx" "use client" import type React from "react" import { useState } from "react" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Card } from "@/components/ui/card" export function NewsletterSignup() { const [email, setEmail] = useState("") const [isSubmitted, setIsSubmitted] = useState(false) const [isLoading, setIsLoading] = useState(false) const handleSubmit = async (e: React.FormEvent) => { e.preventDefault() if (!email) return setIsLoading(true) // Simulate API call await new Promise((resolve) => setTimeout(resolve, 1000)) setIsSubmitted(true) setIsLoading(false) setEmail("") } if (isSubmitted) { return (

🎉

Welcome to the Family!

Thank you for subscribing! Check your email for your 15% discount code.

) } return (

📧

Join Our Newsletter

Get exclusive recipes, health tips, and be the first to know about new products. Plus, enjoy 15% off your first order!

No spam, unsubscribe anytime. Your email is safe with us.

) } [V0_FILE]typescriptreact:file="components/reviews-section.tsx" "use client" import type React from "react" import { useState } from "react" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Card } from "@/components/ui/card" import { Label } from "@/components/ui/label" import { useReviews } from "@/lib/reviews-context" interface ReviewsSectionProps { productSlug: string } export function ReviewsSection({ productSlug }: ReviewsSectionProps) { const { state, dispatch } = useReviews() const [showForm, setShowForm] = useState(false) const [formData, setFormData] = useState({ customerName: "", rating: 5, comment: "", }) const productReviews = state.reviews.filter((review) => review.productSlug === productSlug) const averageRating = productReviews.length > 0 ? productReviews.reduce((sum, review) => sum + review.rating, 0) / productReviews.length : 0 const handleSubmit = (e: React.FormEvent) => { e.preventDefault() if (formData.customerName && formData.comment) { dispatch({ type: "ADD_REVIEW", payload: { productSlug, customerName: formData.customerName, rating: formData.rating, comment: formData.comment, }, }) setFormData({ customerName: "", rating: 5, comment: "" }) setShowForm(false) } } const renderStars = (rating: number, interactive = false, onChange?: (rating: number) => void) => { return (

{[1, 2, 3, 4, 5].map((star) => ( ))}

) } return (

Customer Reviews

{productReviews.length > 0 && (

{renderStars(Math.round(averageRating))} {averageRating.toFixed(1)} ({productReviews.length} review{productReviews.length !== 1 ? "s" : ""})

)}

{showForm && (

Your Name setFormData({ ...formData, customerName: e.target.value })} placeholder="Enter your name" className="mt-2" required />

Rating

{renderStars(formData.rating, true, (rating) => setFormData({ ...formData, rating }))}

Your Review

setFormData({ ...formData, comment: e.target.value })}
                placeholder="Share your experience with this product..."
                className="mt-2 w-full p-3 border-2 rounded-lg focus:border-primary transition-all duration-300 min-h-[100px] resize-none"
                required
              />
            </div>

<Button
              type="submit"
              className="w-full bg-primary hover:bg-primary/90 text-primary-foreground rounded-full py-3 font-semibold transition-all duration-300 hover:scale-105"
            >
              Submit Review
            </Button>
          </form>
        </Card>
      )}

<div className="space-y-4">
        {productReviews.length === 0 ? (
          <Card className="p-6 text-center">
            <p className="text-muted-foreground text-lg">No reviews yet. Be the first to review this product!</p>
          </Card>
        ) : (
          productReviews.map((review) => (
            <Card key={review.id} className="p-6 hover:shadow-lg transition-shadow duration-300">
              <div className="flex items-start justify-between mb-3">
                <div>
                  <h4 className="font-semibold text-lg">{review.customerName}</h4>
                  <div className="flex items-center gap-2 mt-1">
                    {renderStars(review.rating)}
                    <span className="text-sm text-muted-foreground">{review.date}</span>
                  </div>
                </div>
              </div>
              <p className="text-muted-foreground leading-relaxed">{review.comment}</p>
            </Card>
          ))
        )}
      </div>
    </div>
  )
}
[V0_FILE]typescriptreact:file="components/theme-provider.tsx"
'use client'

import * as React from 'react'
import {
  ThemeProvider as NextThemesProvider,
  type ThemeProviderProps,
} from 'next-themes'

export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
  return <NextThemesProvider {...props}>{children}</NextThemesProvider>
}
[V0_FILE]typescriptreact:file="components/ui/button.tsx"
import * as React from "react"
import { Slot } from "@radix-ui/react-slot"
import { cva, type VariantProps } from "class-variance-authority"

import { cn } from "@/lib/utils"

const buttonVariants = cva(
  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
  {
    variants: {
      variant: {
        default:
          "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
        destructive:
          "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
        outline:
          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
        secondary:
          "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
        ghost:
          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
        link: "text-primary underline-offset-4 hover:underline",
      },
      size: {
        default: "h-9 px-4 py-2 has-[>svg]:px-3",
        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
        icon: "size-9",
      },
    },
    defaultVariants: {
      variant: "default",
      size: "default",
    },
  }
)

function Button({
  className,
  variant,
  size,
  asChild = false,
  ...props
}: React.ComponentProps<"button"> &
  VariantProps<typeof buttonVariants> & {
    asChild?: boolean
  }) {
  const Comp = asChild ? Slot : "button"

return (
    <Comp
      data-slot="button"
      className={cn(buttonVariants({ variant, size, className }))}
      {...props}
    />
  )
}

export { Button, buttonVariants }
[V0_FILE]typescriptreact:file="components/ui/card.tsx"
import * as React from "react"

import { cn } from "@/lib/utils"

function Card({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card"
      className={cn(
        "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
        className
      )}
      {...props}
    />
  )
}

function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-header"
      className={cn(
        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
        className
      )}
      {...props}
    />
  )
}

function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-title"
      className={cn("leading-none font-semibold", className)}
      {...props}
    />
  )
}

function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-description"
      className={cn("text-muted-foreground text-sm", className)}
      {...props}
    />
  )
}

function CardAction({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-action"
      className={cn(
        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
        className
      )}
      {...props}
    />
  )
}

function CardContent({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-content"
      className={cn("px-6", className)}
      {...props}
    />
  )
}

function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-footer"
      className={cn("flex items-center px-6 [.border-t]:pt-6", className)}
      {...props}
    />
  )
}

export {
  Card,
  CardHeader,
  CardFooter,
  CardTitle,
  CardAction,
  CardDescription,
  CardContent,
}
[V0_FILE]typescriptreact:file="components/ui/input.tsx"
import * as React from "react"

import { cn } from "@/lib/utils"

function Input({ className, type, ...props }: React.ComponentProps<"input">) {
  return (
    <input
      type={type}
      data-slot="input"
      className={cn(
        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
        "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
        className
      )}
      {...props}
    />
  )
}

export { Input }
[V0_FILE]typescriptreact:file="components/ui/label.tsx"
"use client"

import * as React from "react"
import * as LabelPrimitive from "@radix-ui/react-label"
import { cva, type VariantProps } from "class-variance-authority"

import { cn } from "@/lib/utils"

const labelVariants = cva("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70")

const Label = React.forwardRef<
  React.ElementRef<typeof LabelPrimitive.Root>,
  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>
>(({ className, ...props }, ref) => (
  <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />
))
Label.displayName = LabelPrimitive.Root.displayName

export { Label }
[V0_FILE]typescriptreact:file="lib/cart-context.tsx"
"use client"

import { useState } from "react"
import type React from "react"
import { createContext, useContext, useReducer, useEffect, type ReactNode } from "react"

interface CartItem {
  id: string
  name: string
  price: number
  quantity: number
  image: string
  category: string
}

interface CartState {
  items: CartItem[]
  total: number
  itemCount: number
}

type CartAction =
  | { type: "ADD_ITEM"; payload: Omit<CartItem, "quantity"> }
  | { type: "REMOVE_ITEM"; payload: string }
  | { type: "UPDATE_QUANTITY"; payload: { id: string; quantity: number } }
  | { type: "CLEAR_CART" }
  | { type: "LOAD_CART"; payload: CartState }

const CartContext = createContext<{
  state: CartState
  dispatch: React.Dispatch<CartAction>
} | null>(null)

function cartReducer(state: CartState, action: CartAction): CartState {
  switch (action.type) {
    case "LOAD_CART":
      return action.payload

case "ADD_ITEM": {
      const existingItem = state.items.find((item) => item.id === action.payload.id)

if (existingItem) {
        const updatedItems = state.items.map((item) =>
          item.id === action.payload.id ? { ...item, quantity: item.quantity + 1 } : item,
        )
        const total = updatedItems.reduce((sum, item) => sum + item.price * item.quantity, 0)
        const itemCount = updatedItems.reduce((sum, item) => sum + item.quantity, 0)

return { items: updatedItems, total, itemCount }
      } else {
        const newItem = { ...action.payload, quantity: 1 }
        const updatedItems = [...state.items, newItem]
        const total = updatedItems.reduce((sum, item) => sum + item.price * item.quantity, 0)
        const itemCount = updatedItems.reduce((sum, item) => sum + item.quantity, 0)

return { items: updatedItems, total, itemCount }
      }
    }

case "REMOVE_ITEM": {
      const updatedItems = state.items.filter((item) => item.id !== action.payload)
      const total = updatedItems.reduce((sum, item) => sum + item.price * item.quantity, 0)
      const itemCount = updatedItems.reduce((sum, item) => sum + item.quantity, 0)

return { items: updatedItems, total, itemCount }
    }

case "UPDATE_QUANTITY": {
      const updatedItems = state.items
        .map((item) =>
          item.id === action.payload.id ? { ...item, quantity: Math.max(0, action.payload.quantity) } : item,
        )
        .filter((item) => item.quantity > 0)

const total = updatedItems.reduce((sum, item) => sum + item.price * item.quantity, 0)
      const itemCount = updatedItems.reduce((sum, item) => sum + item.quantity, 0)

return { items: updatedItems, total, itemCount }
    }

case "CLEAR_CART":
      return { items: [], total: 0, itemCount: 0 }

default:
      return state
  }
}

export function CartProvider({ children }: { children: ReactNode }) {
  const [state, dispatch] = useReducer(cartReducer, { items: [], total: 0, itemCount: 0 })
  const [isLoaded, setIsLoaded] = useState(false)

useEffect(() => {
    if (typeof window !== "undefined") {
      const stored = localStorage.getItem("kk_cart_v1")
      if (stored) {
        try {
          const parsedState = JSON.parse(stored)
          if (parsedState.items && Array.isArray(parsedState.items)) {
            dispatch({ type: "LOAD_CART", payload: parsedState })
          }
        } catch (e) {
          console.error("Failed to parse cart from localStorage:", e)
        }
      }
      setIsLoaded(true)
    }
  }, [])

useEffect(() => {
    if (isLoaded && typeof window !== "undefined") {
      localStorage.setItem("kk_cart_v1", JSON.stringify(state))
      console.log("[v0] Cart saved to localStorage:", state)
    }
  }, [state, isLoaded])

return <CartContext.Provider value={{ state, dispatch }}>{children}</CartContext.Provider>
}

export function useCart() {
  const context = useContext(CartContext)
  if (!context) {
    throw new Error("useCart must be used within a CartProvider")
  }

const removeItem = (id: string) => {
    context.dispatch({ type: "REMOVE_ITEM", payload: id })
  }

const updateQuantity = (id: string, quantity: number) => {
    context.dispatch({ type: "UPDATE_QUANTITY", payload: { id, quantity } })
  }

const clearCart = () => {
    context.dispatch({ type: "CLEAR_CART" })
  }

return {
    ...context,
    addItem,
    removeItem,
    updateQuantity,
    clearCart,
  }
}
[V0_FILE]typescriptreact:file="lib/reviews-context.tsx"
"use client"

import type React from "react"

import { createContext, useContext, useReducer, type ReactNode } from "react"

interface Review {
  id: string
  productSlug: string
  customerName: string
  rating: number
  comment: string
  date: string
}

interface ReviewsState {
  reviews: Review[]
}

type ReviewsAction = { type: "ADD_REVIEW"; payload: Omit<Review, "id" | "date"> }

const initialState: ReviewsState = {
  reviews: [
    {
      id: "1",
      productSlug: "sunburst-seasoning",
      customerName: "Sarah M.",
      rating: 5,
      comment: "Amazing flavor! Really enhances every dish I make.",
      date: "2024-12-15",
    },
    {
      id: "2",
      productSlug: "good-night-tea",
      customerName: "Mike R.",
      rating: 4,
      comment: "Helps me sleep better. Very relaxing blend.",
      date: "2024-12-10",
    },
    {
      id: "3",
      productSlug: "numatcha",
      customerName: "Emma L.",
      rating: 5,
      comment: "Perfect for morning focus. Love the unique taste!",
      date: "2024-12-08",
    },
  ],
}

const ReviewsContext = createContext<{
  state: ReviewsState
  dispatch: React.Dispatch<ReviewsAction>
} | null>(null)

function reviewsReducer(state: ReviewsState, action: ReviewsAction): ReviewsState {
  switch (action.type) {
    case "ADD_REVIEW":
      const newReview: Review = {
        ...action.payload,
        id: Date.now().toString(),
        date: new Date().toISOString().split("T")[0],
      }
      return {
        ...state,
        reviews: [newReview, ...state.reviews],
      }
    default:
      return state
  }
}

export function ReviewsProvider({ children }: { children: ReactNode }) {
  const [state, dispatch] = useReducer(reviewsReducer, initialState)

return <ReviewsContext.Provider value={{ state, dispatch }}>{children}</ReviewsContext.Provider>
}

export function useReviews() {
  const context = useContext(ReviewsContext)
  if (!context) {
    throw new Error("useReviews must be used within a ReviewsProvider")
  }
  return context
}
[V0_FILE]typescript:file="lib/utils.ts"
import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}
[V0_FILE]javascript:file="next.config.mjs"
/** @type {import('next').NextConfig} */
const nextConfig = {
  eslint: {
    ignoreDuringBuilds: true,
  },
  typescript: {
    ignoreBuildErrors: true,
  },
  images: {
    unoptimized: true,
  },
}

export default nextConfig
[V0_FILE]json:file="package.json"
{
  "name": "my-v0-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "build": "next build",
    "dev": "next dev",
    "lint": "next lint",
    "start": "next start"
  },
  "dependencies": {
    "@hookform/resolvers": "^3.10.0",
    "@opentelemetry/api": "latest",
    "@pinia/colada": "latest",
    "@radix-ui/react-accordion": "1.2.2",
    "@radix-ui/react-alert-dialog": "1.1.4",
    "@radix-ui/react-aspect-ratio": "1.1.1",
    "@radix-ui/react-avatar": "1.1.2",
    "@radix-ui/react-checkbox": "1.1.3",
    "@radix-ui/react-collapsible": "1.1.2",
    "@radix-ui/react-context-menu": "2.2.4",
    "@radix-ui/react-dialog": "1.1.4",
    "@radix-ui/react-dropdown-menu": "2.1.4",
    "@radix-ui/react-hover-card": "1.1.4",
    "@radix-ui/react-label": "latest",
    "@radix-ui/react-menubar": "1.1.4",
    "@radix-ui/react-navigation-menu": "1.2.3",
    "@radix-ui/react-popover": "1.1.4",
    "@radix-ui/react-progress": "1.1.1",
    "@radix-ui/react-radio-group": "1.2.2",
    "@radix-ui/react-scroll-area": "1.2.2",
    "@radix-ui/react-select": "2.1.4",
    "@radix-ui/react-separator": "1.1.1",
    "@radix-ui/react-slider": "1.2.2",
    "@radix-ui/react-slot": "latest",
    "@radix-ui/react-switch": "1.1.2",
    "@radix-ui/react-tabs": "1.1.2",
    "@radix-ui/react-toast": "1.2.4",
    "@radix-ui/react-toggle": "1.1.1",
    "@radix-ui/react-toggle-group": "1.1.1",
    "@radix-ui/react-tooltip": "1.1.6",
    "@remix-run/react": "latest",
    "@sveltejs/kit": "latest",
    "@sveltejs/vite-plugin-svelte": "latest",
    "@vercel/analytics": "latest",
    "@vue/compiler-sfc": "latest",
    "autoprefixer": "^10.4.20",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "cmdk": "1.0.4",
    "date-fns": "4.1.0",
    "embla-carousel-react": "8.5.1",
    "geist": "latest",
    "input-otp": "1.4.1",
    "jiti": "latest",
    "less": "latest",
    "lightningcss": "latest",
    "lucide-react": "^0.454.0",
    "next": "15.2.8",
    "next-themes": "latest",
    "pinia": "latest",
    "react": "^19",
    "react-day-picker": "9.8.0",
    "react-dom": "^19",
    "react-hook-form": "^7.60.0",
    "react-resizable-panels": "^2.1.7",
    "recharts": "2.15.4",
    "sass": "latest",
    "sass-embedded": "latest",
    "sonner": "^1.7.4",
    "stylus": "latest",
    "sugarss": "latest",
    "svelte": "latest",
    "tailwind-merge": "^2.5.5",
    "tailwindcss-animate": "^1.0.7",
    "terser": "latest",
    "tsx": "latest",
    "vaul": "^0.9.9",
    "vite": "latest",
    "vue": "latest",
    "vue-router": "latest",
    "yaml": "latest",
    "zod": "3.25.67"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4.1.9",
    "@types/node": "^22",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "postcss": "^8.5",
    "tailwindcss": "^4.1.9",
    "tw-animate-css": "1.3.3",
    "typescript": "^5"
  }
}
[V0_FILE]javascript:file="postcss.config.mjs"
/** @type {import('postcss-load-config').Config} */
const config = {
  plugins: {
    '@tailwindcss/postcss': {},
  },
}

export default config
[V0_FILE]css:file="public/assets/cart.css"
/* /assets/cart.css */
:root {
  --gap: 1rem;
  --radius: 14px;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.wrap {
  max-width: 960px;
  margin: 0 auto;
  padding: 1rem;
}
header.wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.product {
  border: 1px solid #eee;
  border-radius: var(--radius);
  padding: 1rem;
}
.product img {
  width: 100%;
  height: auto;
  border-radius: 12px;
}
.cart-link {
  position: relative;
}
#cart-count {
  display: inline-block;
  min-width: 1.25em;
  text-align: center;
  margin-left: .35em;
  background: #ff5a3c;
  color: #fff;
  border-radius: 999px;
  padding: 0 .4em;
  font-weight: 700;
}
.cart-table {
  width: 100%;
  border-collapse: collapse;
}
.cart-table th,
.cart-table td {
  border-bottom: 1px solid #eee;
  padding: .75rem;
  vertical-align: middle;
}
.cart-table .ci {
  display: flex;
  gap: .75rem;
  align-items: center;
}
.cart-table .ci img {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 8px;
}
.cart-summary {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
button {
  border: 0;
  padding: .7rem 1rem;
  border-radius: 10px;
  background: #111;
  color: #fff;
  cursor: pointer;
}
button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
input[type="number"] {
  width: 80px;
  padding: .4rem;
  border: 1px solid #ddd;
  border-radius: 8px;
}
[V0_FILE]javascript:file="public/assets/cart.js"
/* /assets/cart.js */
;(() => {
  const STORAGE_KEY = "kk_cart"

const Cart = {
    _load() {
      try {
        return JSON.parse(localStorage.getItem(STORAGE_KEY)) || { items: [] }
      } catch {
        return { items: [] }
      }
    },
    _save(state) {
      localStorage.setItem(STORAGE_KEY, JSON.stringify(state))
      return state
    },
    get() {
      return this._load()
    },
    clear() {
      return this._save({ items: [] })
    },
    _findIndex(state, id) {
      return state.items.findIndex((i) => i.id === id)
    },
    add({ id, title, price, image, qty }) {
      const state = this._load()
      const idx = this._findIndex(state, id)
      const q = Math.max(1, Number(qty || 1))
      if (idx > -1) {
        state.items[idx].qty += q
      } else {
        state.items.push({ id, title, price: Number(price), image: image || "", qty: q })
      }
      return this._save(state)
    },
    updateQty(id, qty) {
      const state = this._load()
      const idx = this._findIndex(state, id)
      if (idx > -1) {
        const q = Math.max(0, Number(qty))
        if (q === 0) state.items.splice(idx, 1)
        else state.items[idx].qty = q
      }
      return this._save(state)
    },
    remove(id) {
      const state = this._load()
      const idx = this._findIndex(state, id)
      if (idx > -1) state.items.splice(idx, 1)
      return this._save(state)
    },
    totals() {
      const { items } = this._load()
      const subtotal = items.reduce((s, i) => s + i.price * i.qty, 0)
      return { subtotal, count: items.reduce((s, i) => s + i.qty, 0) }
    },
  }

// Expose for cart page
  window.KKCart = Cart

// ------- UI Helpers -------
  function setCartCount() {
    const el = document.getElementById("cart-count")
    if (!el) return
    const { count } = Cart.totals()
    el.textContent = String(count)
  }

function toast(msg) {
    let t = document.querySelector(".kk-toast")
    if (!t) {
      t = document.createElement("div")
      t.className = "kk-toast"
      Object.assign(t.style, {
        position: "fixed",
        right: "1rem",
        bottom: "1rem",
        padding: "0.75rem 1rem",
        background: "black",
        color: "white",
        borderRadius: "10px",
        fontSize: "0.95rem",
        zIndex: 9999,
        boxShadow: "0 6px 20px rgba(0,0,0,.2)",
        opacity: "0.95",
      })
      document.body.appendChild(t)
    }
    t.textContent = msg
    t.style.display = "block"
    clearTimeout(t._hide)
    t._hide = setTimeout(() => (t.style.display = "none"), 1600)
  }

// ------- Add to cart handler (event delegation) -------
  document.addEventListener("click", (e) => {
    const btn = e.target.closest(".js-add-to-cart")
    if (!btn) return

const card = btn.closest("[data-product-id]")
    if (!card) {
      console.warn("Add to Cart: missing data-product-* attributes.")
      return
    }

const id = card.getAttribute("data-product-id")
    const title = card.getAttribute("data-product-title") || "Untitled Product"
    const price = card.getAttribute("data-product-price") || "0"
    const image = card.getAttribute("data-product-image") || ""
    const qtyInput = card.querySelector(".js-qty")
    const qty = qtyInput ? Number(qtyInput.value || 1) : 1

btn.disabled = true
    btn.setAttribute("aria-busy", "true")

try {
      Cart.add({ id, title, price, image, qty })
      setCartCount()
      toast(`Added ${qty} × ${title} to cart`)
    } catch (err) {
      console.error(err)
      toast("Sorry—couldn’t add to cart.")
    } finally {
      btn.disabled = false
      btn.removeAttribute("aria-busy")
    }
  })

// Init badge on load
  document.addEventListener("DOMContentLoaded", setCartCount)
})()
[V0_FILE]css:file="styles/globals.css"
@import 'tailwindcss';
@import 'tw-animate-css';

@custom-variant dark (&:is(.dark *));

:root {
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --radius: 0.625rem;
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
}

.dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.145 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.145 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.985 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.396 0.141 25.723);
  --destructive-foreground: oklch(0.637 0.237 25.331);
  --border: oklch(0.269 0 0);
  --input: oklch(0.269 0 0);
  --ring: oklch(0.439 0 0);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(0.269 0 0);
  --sidebar-ring: oklch(0.439 0 0);
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-popover: var(--popover);
  --color-popover-foreground: var(--popover-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-destructive-foreground: var(--destructive-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --color-chart-1: var(--chart-1);
  --color-chart-2: var(--chart-2);
  --color-chart-3: var(--chart-3);
  --color-chart-4: var(--chart-4);
  --color-chart-5: var(--chart-5);
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --color-sidebar: var(--sidebar);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-ring: var(--sidebar-ring);
}

@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
  }
}
[V0_FILE]json:file="tsconfig.json"
{
  "compilerOptions": {
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "target": "ES6",
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules"]
}
[V0_FILE]png:file="public/apple-icon.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/IbCKqe8aOyKCr3C9s15usz/public/apple-icon.png"
[V0_FILE]png:file="public/calming-herbal-tea-blend-with-lavender-and-rosemar.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/zRY7PiQXHPjIjgTDtIAzif/public/calming-herbal-tea-blend-with-lavender-and-rosemar.png"
[V0_FILE]png:file="public/chamomile-tea-in-clear-glass-cup-with-dried-flowers.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/pjrP325T3AoCunnbmNXcz9/public/chamomile-tea-in-clear-glass-cup-with-dried-flowers.png"
[V0_FILE]png:file="public/dried-pear-leaves-tea-in-clear-glass-teapot-with-s.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/ZqBUmauiB44a39NvktXtzX/public/dried-pear-leaves-tea-in-clear-glass-teapot-with-s.png"
[V0_FILE]png:file="public/icon-dark-32x32.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/_NLAIkeVwoL6vEzK2uSXmZ/public/icon-dark-32x32.png"
[V0_FILE]png:file="public/icon-light-32x32.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/DVnRdScnZe8NA9byc6_b4H/public/icon-light-32x32.png"
[V0_FILE]xml:file="public/icon.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/l2-w3jDSPuRqpmK6lDq3GH/public/icon.svg"
[V0_FILE]png:file="public/placeholder-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/1uv3SMJqY6_jxcFCTgTEak/public/placeholder-logo.png"
[V0_FILE]xml:file="public/placeholder-logo.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/XB_XF8ESrwbAjotfOd5Wmb/public/placeholder-logo.svg"
[V0_FILE]jpg:file="public/placeholder-user.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/ONejAluG3EJATcwwA61bXn/public/placeholder-user.jpg"
[V0_FILE]jpg:file="public/placeholder.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/BlrBc_c6JuPtjsBHFMcNJn/public/placeholder.jpg"
[V0_FILE]xml:file="public/placeholder.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/J0QvC3Vjlpi92ZtRdLC4Mx/public/placeholder.svg"
[V0_FILE]jpg:file="public/ranch-dry-rub-seasoning-in-rustic-bowl.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/nKyZu-ONpN6Hj8ybkLRm8T/public/ranch-dry-rub-seasoning-in-rustic-bowl.jpg"
[V0_FILE]png:file="public/spicy-red-chili-salsa-in-glass-jar-with-fresh-pepp.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/lmay6BXNklniu_Ky_NdUc4/public/spicy-red-chili-salsa-in-glass-jar-with-fresh-pepp.png"
[V0_FILE]png:file="public/sun-dried-button-mushrooms-on-wooden-cutting-board.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/Zt1Ckr_Hr6NGa5N0P7n18k/public/sun-dried-button-mushrooms-on-wooden-cutting-board.png"
[V0_FILE]png:file="public/vibrant-golden-spice-blend-seasoning-in-wooden-bow.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/iPqali0uU9_A-p5RHAQEra/public/vibrant-golden-spice-blend-seasoning-in-wooden-bow.png"
[V0_FILE]png:file="public/vibrant-green-herb-condiment-sauce-in-glass-jar.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/pP3Io2ZyA-CkEcbcSKC2Xt/public/vibrant-green-herb-condiment-sauce-in-glass-jar.png"
[V0_FILE]png:file="public/vibrant-green-matcha-powder-in-traditional-bamboo-.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_XXr1RGSR5JKAPIno2fBvBG89bRvz/bAmD5RwbD4RxwAQh0FoWKJ/public/vibrant-green-matcha-powder-in-traditional-bamboo-.png"</article></body></html>

Our Story

Our Founders:

Our Mission

🌱 Natural & Pure

🌍 Sustainable Sourcing

🔬 Science-Backed

❤️ Made with Love

Get in Touch

Your Cart

Your cart is empty

Contact Information

Shipping Address

Payment Method

Order Summary

{item.name}

Payment Details

{category.category}

{faq.question}

Still Have Questions?

Liver Type Comparison Guide

Liver Type Analysis

Recommendations

Copper Content Comparison

Beef Liver

Lamb Liver

Chicken Liver

Vitiligo & Autoimmune Disease Statistics

Key Takeaways

U.S. Vitiligo Patterns

Global Distribution

Autoimmune Risk

Order Details

Payment Information

Deposit Account:

What Happens Next?

Order Processing

Packaging & Dispatch

Delivery

Thank You for Choosing Kerry's Kitchen! 🌿

Why Choose Kerry's Kitchen?

Natural & Pure

Health Focused

Expertly Crafted

Ready to Transform Your Kitchen?

OUR PRODUCTS

{product.title}

Ingredients

Benefits

Cart Test Page

Welcome to the Family!

Join Our Newsletter

Customer Reviews