import type { Team } from "@/lib/types";

// 모든 국기를 직사각형 SVG로 통일 (flagcdn, 퍼블릭 도메인).
// 이모지(OS별 휘날림/광택 렌더) 제거 → 일관된 사각형. object-cover로 박스를 꽉 채움(왜곡 없음).
const FLAG_FILE: Record<string, string> = {
  KOR: "kr",
  CZE: "cz",
  MEX: "mx",
  RSA: "za",
};

export default function TeamFlag({
  team,
  className = "",
}: {
  team: Team;
  className?: string;
}) {
  const file = FLAG_FILE[team.code];
  if (file) {
    return (
      <img
        src={`/icons/flags/${file}.svg`}
        alt={team.name}
        className={`border border-[var(--line-d)] object-cover ${className}`}
      />
    );
  }
  // 미등록 국가 fallback — 이모지(직사각형 박스, 잘림 없음)
  return (
    <span
      className={`grid place-items-center overflow-hidden border border-[var(--line-d)] bg-white/[0.06] ${className}`}
      style={{ containerType: "size" }}
      aria-label={team.name}
    >
      <span className="leading-none" style={{ fontSize: "92cqh" }}>
        {team.flag}
      </span>
    </span>
  );
}