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

/** English primary + Tagalog secondary line for worker-friendly UI. */
export function BilingualText({
  en,
  tl,
  className,
  tlClassName,
  as: Tag = 'p',
}: {
  en: string;
  tl: string;
  className?: string;
  tlClassName?: string;
  as?: 'p' | 'span' | 'div' | 'h1' | 'h2' | 'h3';
}) {
  return (
    <Tag className={cn(className)}>
      <span className="block">{en}</span>
      <span className={cn('block text-[0.85em] font-normal opacity-80 mt-0.5', tlClassName)}>
        {tl}
      </span>
    </Tag>
  );
}

export function bilingualLabel(en: string, tl: string) {
  return `${en} / ${tl}`;
}