import { Card, CardContent } from "@/components/ui/card";

interface StatCardProps {
  label: string;
  value: string | number;
  sub?: React.ReactNode;
}

export function StatCard({ label, value, sub }: StatCardProps) {
  return (
    <Card>
      <CardContent className="pt-4 pb-3 px-4">
        <p className="text-[10px] uppercase tracking-wider text-muted-foreground font-medium mb-1">
          {label}
        </p>
        <p className="text-2xl font-bold text-foreground">{value}</p>
        {sub && <div className="mt-1 text-xs text-muted-foreground">{sub}</div>}
      </CardContent>
    </Card>
  );
}