interface NavigationProps {
  total: number;
  current: number;
  setCurrent: (index: number) => void;
}

export function Navigation({ total, current, setCurrent }: NavigationProps) {
  return (
    <div className="fixed top-4 left-1/2 -translate-x-1/2 flex gap-2 z-50">
      {Array.from({ length: total }).map((_, i) => (
        <button
          key={i}
          onClick={() => setCurrent(i)}
          className={`h-2 rounded-full transition-all ${
            current === i ? 'bg-white w-8' : 'bg-white/40 w-4'
          }`}
        />
      ))}
    </div>
  );
}
