'use client';

export function ProgressBar({
  value,
  max,
  color = 'var(--accent-primary)',
}: {
  value: number;
  max: number;
  color?: string;
}) {
  const pct = max > 0 ? Math.min((value / max) * 100, 100) : 0;
  return (
    <div className="progress-bar h-2 w-full">
      <div className="progress-fill" style={{ width: `${pct}%`, background: color }} />
    </div>
  );
}
