// File: lib/widgets/product_card.dart

import 'package:flutter/material.dart';

class ProductCard extends StatelessWidget {
  final String productName;
  final String brand;
  final double rating;
  final double originalPrice;
  final double discountedPrice;
  final int sold;
  final int total;
  final String imageUrl;
  final int discount;
  final VoidCallback onPressed;

  const ProductCard({
    super.key,
    required this.productName,
    required this.brand,
    required this.rating,
    required this.originalPrice,
    required this.discountedPrice,
    required this.sold,
    required this.total,
    required this.imageUrl,
    required this.discount,
    required this.onPressed,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(10),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(12),
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withOpacity(0.1),
            blurRadius: 4,
            spreadRadius: 2,
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // Save Banner (Top Left)
          if (discount > 0)
            Align(
              alignment: Alignment.topLeft,
              child: Container(
                padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
                decoration: BoxDecoration(
                  color: Colors.green,
                  borderRadius: BorderRadius.only(topRight: Radius.circular(6)),
                ),
                child: Text(
                  "Save $discount%",
                  style: const TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                    fontSize: 10,
                  ),
                ),
              ),
            ),
          const SizedBox(height: 8),




          //  CENTERED IMAGE — FIXED HEIGHT + FITTEDBOX
          SizedBox(
            child: FittedBox(
              fit: BoxFit.contain, // Scales image to fit without distortion
              alignment: Alignment.center, // Centers image
              child: Image.network(
                imageUrl,
                fit: BoxFit.contain, // Redundant but safe
                errorBuilder: (_, __, ___) => const Icon(Icons.image_not_supported, size: 40),
              ),
            ),
          ),

          const SizedBox(height: 12),

          // Brand
          Text(
            brand,
            style: TextStyle(fontSize: 12, color: Colors.grey[600]),
          ),
          const SizedBox(height: 4),

          // Product Name
          Text(
            productName,
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
            style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
          ),
          const SizedBox(height: 8),

          // Rating Stars
          Row(
            children: List.generate(5, (i) {
              return Icon(
                i < rating.floor()
                    ? Icons.star
                    : (i < rating.ceil() ? Icons.star_half : Icons.star_border),
                color: Colors.yellow[700],
                size: 16,
              );
            }),
          ),
          const SizedBox(height: 8),

          // Price
          Row(
            children: [
              Text(
                '\$$discountedPrice',
                style: const TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                  color: Colors.green,
                ),
              ),
              const SizedBox(width: 8),
              Text(
                '\$$originalPrice',
                style: const TextStyle(
                  decoration: TextDecoration.lineThrough,
                  color: Colors.grey,
                ),
              ),
            ],
          ),
          const SizedBox(height: 8),

          // Progress Bar
          LinearProgressIndicator(
            value: sold / total,
            backgroundColor: Colors.grey[200],
            valueColor: const AlwaysStoppedAnimation<Color>(Colors.green),
          ),
          const SizedBox(height: 4),

          // Sold / Total
          Text(
            'Sold: $sold/$total',
            style: const TextStyle(fontSize: 12, color: Colors.grey),
          ),
          const SizedBox(height: 16),

          // Add To Cart Button
          ElevatedButton.icon(
            onPressed: onPressed,
            icon: const Icon(Icons.shopping_cart, size: 18),
            label: const Text('Add To Cart'),
            style: ElevatedButton.styleFrom(
              backgroundColor: Colors.green,
              foregroundColor: Colors.white,
              padding: const EdgeInsets.symmetric(vertical: 12),
              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
            ),
          ),
        ],
      ),
    );
  }
}