interface Product {
  name: string;
  price: number;
  description: string;
}

export default function ProductCard({ product }: { product: Product }) {
  return (
    <div className="rounded-lg border bg-white p-4 shadow-sm hover:shadow-md">
      <h3 className="text-lg font-bold">{product.name}</h3>
      <p className="text-gray-600">${product.price.toFixed(2)}</p>
      <p className="mt-2 text-sm text-gray-500">{product.description}</p>
      <button className="mt-4 w-full rounded bg-blue-500 px-4 py-2 font-bold text-white hover:bg-blue-700">
        Add to Cart
      </button>
    </div>
  );
}
