interface CheckoutSingleItemDarkProps {
  thumb_src: string;
  thumb_alt: string;
  title: string;
  color?: string;
  size?: string;
  price: number;
}

export default function CheckoutSingleItemDark({ thumb_src, thumb_alt, title, color, size, price }: CheckoutSingleItemDarkProps) {
  return (
    <div className="flex gap-4 py-4 border-b border-gray-700">
      <img
        src={thumb_src}
        alt={thumb_alt}
        className="w-20 h-20 object-cover rounded-lg"
      />
      <div className="flex-1">
        <h4 className="font-medium text-white">{title}</h4>
        {(color || size) && (
          <p className="text-sm text-gray-400">
            {[color, size].filter(Boolean).join(' / ')}
          </p>
        )}
        <p className="font-bold mt-1 text-green-400">฿{price.toLocaleString()}</p>
      </div>
    </div>
  );
}