import Image from "next/image";

const DonationSummary: React.FC = () => {
  return (
    <div className="space-y-4">
      <div className="flex bg-black items-center space-x-2 p-2 rounded h-12">
        <div className="flex -space-x-2">
          <Image
            height={500}
            width={500}
            src="/assets/images/interior.webp"
            alt="Avatar 1"
            className="w-7 h-7 rounded-full border border-white"
          />
          <Image
            height={500}
            width={500}
            src="/assets/images/interior.webp"
            alt="Avatar 2"
            className="w-7 h-7 rounded-full border border-white"
          />
          <Image
            height={500}
            width={500}
            src="/assets/images/interior.webp"
            alt="Avatar 3"
            className="w-7 h-7 rounded-full border border-white"
          />
        </div>
        <div className="text-white">
          <p className="text-sm font-semibold">{263}</p>
          <p className="text-xs text-neutral-200">Donations</p>
        </div>{" "}
      </div>
      <div className="flex gap-1 bg-black justify-center h-12 items-center text-white p-2 rounded">
        <p className="text-sm font-semibold">{37}</p>
        <p className="text-xs text-neutral-200">Days To Go</p>
      </div>
    </div>
  );
};

export default DonationSummary;