import ResponsiveImage from '@/components/shared/ResponsiveImage';

const Counter: React.FC<CounterProps> = ({ icon, label, count }) => {
  return (
    <div className="flex items-start h-full gap-5 grow">
      <ResponsiveImage
        src={icon.url}
        width={icon.width}
        height={icon.height}
        sizes="50px"
        className="max-w-[4.5rem] bg-background"
      />
      <div className="space-y-1 w-fit">
        <h5 className="text-wrap text-white text-4xl lg:text-[2.75rem] whitespace-nowrap font-serif min-w-20">
          {count}
        </h5>
        <p
          className="font-thin text-white opacity-70"
          dangerouslySetInnerHTML={{ __html: label }}
        />
      </div>
    </div>
  );
};

export default Counter;
