// Icon + Flag primitives (lightweight, scoped for landing)

const ICONS = {
  check: "M5 13l4 4L19 7",
  star: "M10 1.5l2.6 5.3 5.9.85-4.25 4.15 1 5.85L10 14.85 4.75 17.65l1-5.85L1.5 7.65l5.9-.85L10 1.5z",
  shield: "M12 2l8 4v6c0 5-3.5 9-8 10-4.5-1-8-5-8-10V6l8-4z",
  users: "M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2M9 11a4 4 0 100-8 4 4 0 000 8zm14 10v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75",
  trophy: "M8 21h8m-4-4v4M6 9H4a2 2 0 01-2-2V5a2 2 0 012-2h14a2 2 0 012 2v2a2 2 0 01-2 2h-2M6 3h12v6a6 6 0 01-12 0V3z",
  chart: "M3 3v18h18M7 14l4-4 4 4 5-5",
  coin: "M12 1v22M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6",
  stadium: "M2 12c0 2 4 4 10 4s10-2 10-4-4-4-10-4-10 2-10 4zm0 0v4c0 2 4 4 10 4s10-2 10-4v-4M7 12v-3M17 12v-3M12 11.5V8",
  globe: "M12 1v22M1 12h22M12 1a11 11 0 010 22M12 1a11 11 0 000 22",
  shirt: "M16 3l-4 2-4-2-5 3 2 5 3-1v11h8V10l3 1 2-5-5-3z",
};

const Icon = ({ name, size = 14 }) => {
  const d = ICONS[name];
  if (!d) return null;
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" style={{display: "inline-block", verticalAlign: "-2px"}}>
      {name === "star" ? <path d={d} fill="currentColor" stroke="none"/> : <path d={d}/>}
    </svg>
  );
};

// Tiny flag chip — stripes and a country code label
const FLAGS = {
  PT: ["#006600", "#FF0000"],
  BR: ["#009c3b", "#ffdf00"],
  ES: ["#aa151b", "#f1bf00"],
  GR: ["#0d5eaf", "#ffffff"],
  US: ["#b22234", "#3c3b6e"],
  FR: ["#002654", "#ed2939"],
  RS: ["#c6363c", "#0c4076"],
  PL: ["#ffffff", "#dc143c"],
  DE: ["#000000", "#dd0000"],
  UK: ["#012169", "#c8102e"],
};

const Flag = ({ code }) => {
  const c = FLAGS[code] || ["#888", "#ccc"];
  return (
    <span style={{
      display: "inline-block", width: 16, height: 11, borderRadius: 2, overflow: "hidden",
      background: `linear-gradient(90deg, ${c[0]} 50%, ${c[1]} 50%)`, flexShrink: 0,
      border: "1px solid rgba(0,0,0,0.1)", verticalAlign: "middle"
    }} aria-label={code} title={code}/>
  );
};

Object.assign(window, { Icon, Flag });