import React from 'react';

interface StatProps {
    title: string;
    value: string;
    icon: string;
}

export default function Stat({ title = '', value = '', icon = '' }: StatProps) {
    return (
        <div className="bg-white rounded-lg shadow p-4">
            <div className="flex items-center justify-between">
                <div>
                    <p className="text-sm text-gray-500 font-medium">{title}</p>
                    <h4 className="text-2xl font-semibold mt-1">{value}</h4>
                </div>
                <div className="flex-shrink-0 h-12 w-12 rounded-full bg-indigo-100 flex items-center justify-center">
                    <i className={`${icon} text-xl text-indigo-600`}></i>
                </div>
            </div>
        </div>
    );
}