import { ReactNode } from "react";

interface StatsCounterProps {
  value: number;
  label: string;
  icon?: ReactNode;
}

export default function StatsCounter({ value, label, icon }: StatsCounterProps) {
  return (
    <div className="flex flex-col items-center gap-1 px-4 py-3">
      {icon && <div className="text-primary mb-1">{icon}</div>}
      <span className="text-2xl md:text-3xl font-bold text-white tabular-nums">
        {value.toLocaleString()}
      </span>
      <span className="text-xs md:text-sm text-text-muted font-medium uppercase tracking-wider">
        {label}
      </span>
    </div>
  );
}