import React from 'react';

type BadgeProps = {
  children: React.ReactNode;
  variant?: 'accent' | 'muted';
  className?: string;
};

const Badge = ({ children, variant = 'accent', className = '' }: BadgeProps) => {
  const variantClasses =
    variant === 'accent'
      ? 'bg-[var(--tg-accent)] text-white'
      : 'bg-[var(--tg-bg-secondary)] text-[var(--tg-text-secondary)]';

  return (
    <span
      className={`inline-flex items-center justify-center min-w-[20px] h-5 px-1.5
        text-xs font-semibold rounded-full ${variantClasses} ${className}`}
    >
      {children}
    </span>
  );
};

export default Badge;
