import React from 'react'
import { toneClasses } from './groupStyles'

export default function GroupBadgePill({ label, tone = 'slate', className = '' }) {
  if (!label) return null

  return (
    <span className={`inline-flex items-center rounded-full border px-3 py-1 text-[11px] font-semibold uppercase tracking-[0.16em] ${toneClasses(tone)} ${className}`.trim()}>
      {label}
    </span>
  )
}