import { Header } from "@/components/Header";
import { Footer } from "@/components/Footer";
import { HeroSlider } from "@/components/HeroSlider";
import { CategoryCard } from "@/components/CategoryCard";
import { ProductCard } from "@/components/ProductCard";
import { Smartphone, Shirt, Home, Book, Gamepad2, Heart } from "lucide-react";

const categories = [
  { title: "کالای دیجیتال", icon: "📱", link: "/category/electronics" },
  { title: "مد و پوشاک", icon: "👕", link: "/category/fashion" },
  { title: "خانه و آشپزخانه", icon: "🏠", link: "/category/home" },
  { title: "کتاب و لوازم تحریر", icon: "📚", link: "/category/books" },
  { title: "اسباب بازی", icon: "🎮", link: "/category/toys" },
  { title: "زیبایی و سلامت", icon: "💄", link: "/category/beauty" },
  { title: "ورزش و سفر", icon: "⚽", link: "/category/sports" },
  { title: "محصولات غذایی", icon: "🍔", link: "/category/food" },
];

const featuredProducts = [
  {
    id: 1,
    title: "گوشی موبایل سامسونگ مدل Galaxy S23 Ultra",
    price: 45000000,
    originalPrice: 50000000,
    image: "https://images.unsplash.com/photo-1610945415295-d9bbf067e59c?w=400",
    rating: 4.5,
    reviews: 234,
    discount: 10,
  },
  {
    id: 2,
    title: "لپ تاپ 15 اینچی ایسوس مدل VivoBook",
    price: 25000000,
    originalPrice: 30000000,
    image: "https://images.unsplash.com/photo-1588872657578-7efd1f1555ed?w=400",
    rating: 4.8,
    reviews: 156,
    discount: 17,
  },
  {
    id: 3,
    title: "هدفون بلوتوثی سونی مدل WH-1000XM5",
    price: 12000000,
    image: "https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=400",
    rating: 4.9,
    reviews: 432,
  },
  {
    id: 4,
    title: "ساعت هوشمند اپل واچ سری 9",
    price: 18000000,
    originalPrice: 20000000,
    image: "https://images.unsplash.com/photo-1579586337278-3befd40fd17a?w=400",
    rating: 4.7,
    reviews: 289,
    discount: 10,
  },
  {
    id: 5,
    title: "دوربین دیجیتال کانن مدل EOS R6",
    price: 95000000,
    image: "https://images.unsplash.com/photo-1516035069371-29a1b244cc32?w=400",
    rating: 4.9,
    reviews: 87,
  },
  {
    id: 6,
    title: "تبلت سامسونگ مدل Galaxy Tab S9",
    price: 22000000,
    originalPrice: 26000000,
    image: "https://images.unsplash.com/photo-1561154464-82e9adf32764?w=400",
    rating: 4.6,
    reviews: 198,
    discount: 15,
  },
  {
    id: 7,
    title: "کنسول بازی PlayStation 5",
    price: 28000000,
    image: "https://images.unsplash.com/photo-1606813907291-d86efa9b94db?w=400",
    rating: 4.8,
    reviews: 543,
  },
  {
    id: 8,
    title: "اسپیکر بلوتوثی JBL مدل Charge 5",
    price: 5500000,
    originalPrice: 6500000,
    image: "https://images.unsplash.com/photo-1608043152269-423dbba4e7e1?w=400",
    rating: 4.7,
    reviews: 321,
    discount: 15,
  },
];

const Index = () => {
  return (
    <div className="min-h-screen flex flex-col bg-background" dir="rtl">
      <Header />
      
      <main className="flex-1">
        {/* Hero Slider */}
        <section className="container mx-auto px-4 py-6">
          <HeroSlider />
        </section>

        {/* Categories */}
        <section className="container mx-auto px-4 py-8">
          <h2 className="mb-6 text-2xl font-bold text-foreground">دسته‌بندی‌ها</h2>
          <div className="grid grid-cols-2 gap-4 sm:grid-cols-4 lg:grid-cols-8">
            {categories.map((category) => (
              <CategoryCard key={category.title} {...category} />
            ))}
          </div>
        </section>

        {/* Featured Products */}
        <section className="container mx-auto px-4 py-8">
          <div className="mb-6 flex items-center justify-between">
            <h2 className="text-2xl font-bold text-foreground">محصولات ویژه</h2>
            <a href="/products" className="text-primary hover:text-primary-dark transition-smooth">
              مشاهده همه
            </a>
          </div>
          <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
            {featuredProducts.map((product) => (
              <ProductCard key={product.id} {...product} />
            ))}
          </div>
        </section>

        {/* Banner */}
        <section className="container mx-auto px-4 py-8">
          <div className="rounded-2xl bg-gradient-primary p-8 text-center text-white md:p-12">
            <h2 className="mb-4 text-3xl font-bold md:text-4xl">
              تخفیف ویژه فصل!
            </h2>
            <p className="mb-6 text-lg md:text-xl">
              تا ۴۰٪ تخفیف روی محصولات منتخب
            </p>
            <button className="rounded-lg bg-white px-8 py-3 font-bold text-primary transition-all hover:scale-105">
              خرید کنید
            </button>
          </div>
        </section>
      </main>

      <Footer />
    </div>
  );
};

export default Index;