import { cn } from '@/lib/cn';

interface LiveIndicatorProps {
  className?: string;
  size?: 'sm' | 'md';
}

export function LiveIndicator({ className, size = 'md' }: LiveIndicatorProps) {
  return (
    <div className={cn('flex items-center gap-1.5', className)}>
      <span className="relative flex">
        <span className={cn(
          'absolute inline-flex rounded-full bg-red-500 opacity-75 animate-ping',
          size === 'sm' ? 'h-2 w-2' : 'h-2.5 w-2.5'
        )} />
        <span className={cn(
          'relative inline-flex rounded-full bg-red-500',
          size === 'sm' ? 'h-2 w-2' : 'h-2.5 w-2.5'
        )} />
      </span>
      <span className={cn(
        'font-medium text-red-400 uppercase tracking-wider',
        size === 'sm' ? 'text-[10px]' : 'text-xs'
      )}>
        Live
      </span>
    </div>
  );
}
