import { SPORT } from '@/lib/vyndrTokens';

type SportBadgeProps = {
  sport: 'nba' | 'mlb' | 'wnba' | 'soccer' | string;
  size?: 'sm' | 'md';
};

/** Colored sport chip from the sport token (§5). JetBrains Mono caps. */
export default function SportBadge({ sport, size = 'md' }: SportBadgeProps) {
  const s = SPORT[sport as keyof typeof SPORT] || SPORT.nba;
  const pad = size === 'sm' ? '2px 6px' : '3px 8px';
  const fs = size === 'sm' ? 10 : 11;
  return (
    <span
      className="mono"
      style={{
        display: 'inline-block',
        padding: pad,
        fontSize: fs,
        fontWeight: 700,
        letterSpacing: '0.08em',
        color: s.hex,
        border: `1px solid ${s.hex}`,
        borderRadius: 3,
        background: `${s.hex}1a`,
        lineHeight: 1,
      }}
    >
      {s.label}
    </span>
  );
}
