'use client';

import Link from 'next/link';
import { ShoppingCart } from 'lucide-react';
import { useCartStore } from '@/stores/cart';

export function CartBadge() {
  const itemCount = useCartStore((s) => s.itemCount);

  return (
    <Link href="/cart" className="relative" aria-label="Cart">
      <ShoppingCart className="h-5 w-5 text-slate-600" />
      {itemCount > 0 && (
        <span className="absolute -top-1.5 -right-1.5 bg-forest-600 text-white text-[10px] font-bold rounded-full h-4 w-4 flex items-center justify-center">
          {itemCount > 99 ? '99+' : itemCount}
        </span>
      )}
    </Link>
  );
}