// Agent avatar — EMOJI variant (experiment).
// Emoji centered inside a dept-tinted rounded-square. The colored background unifies
// the otherwise multi-color emoji; master agents get a crown badge.
// Per-DEPARTMENT color (cohesion) + per-AGENT emoji (uniqueness).

// ── Per-agent emoji mapping (agent id → emoji) ──
const NX_AGENT_EMOJI = {
  // Finance
  'fin-master': '💰', 'fin-spend': '📊', 'fin-budget': '⚖️',
  'fin-ap': '🧾', 'fin-treasury': '🏦', 'fin-fpa': '📈',
  // Procurement
  'proc-master': '🛒', 'proc-cmp': '🆚', 'proc-risk': '📜',
  'proc-po': '📋', 'proc-mav': '⚡', 'proc-source': '✍️',
  // Risk
  'risk-master': '🛡️', 'risk-vel': '🚦', 'risk-dev': '📱',
  'risk-mer': '🏪', 'risk-aml': '🔍', 'risk-cb': '💳',
  // Compliance
  'comp-master': '✅', 'comp-soc2': '🔐', 'comp-access': '🗓️',
  'comp-dpa': '🔒', 'comp-policy': '📖', 'comp-reg': '🌐',
  // People
  'ppl-master': '👥', 'ppl-hiring': '🧲', 'ppl-attr': '💓',
  'ppl-comp': '💵', 'ppl-train': '🎓', 'ppl-org': '🕸️',
  // IT
  'it-master': '🖥️', 'it-prov': '📦', 'it-sso': '🔑',
  'it-req': '🎫', 'it-tools': '🧰', 'it-inc': '🚨',
  // Master orchestrator
  'nalar': '✨',
};

// Dept fallback emoji (when an agent id isn't mapped)
const NX_DEPT_EMOJI = {
  finance: '💰', procurement: '🛒', risk: '🛡️',
  compliance: '✅', people: '👥', it: '🖥️',
};

const NXRobotAvatar = ({ agent = {}, size = 36, badge = true }) => {
  const tone = agent.tone || 'var(--ink)';
  const accent = agent.accent || 'var(--bg-sunken)';
  const emoji = NX_AGENT_EMOJI[agent.id]
    || NX_DEPT_EMOJI[agent.dept]
    || '✨';
  const radius = Math.max(6, Math.round(size * 0.26));

  return (
    <div style={{
      position: 'relative',
      width: size, height: size,
      borderRadius: radius,
      background: accent,
      border: '0.5px solid ' + tone,
      display: 'flex', alignItems: 'center', justifyContent: 'center',
      flexShrink: 0,
      lineHeight: 1,
      userSelect: 'none',
    }}>
      <span style={{
        fontSize: Math.round(size * 0.52),
        lineHeight: 1,
        // keep emoji crisp + centered across platforms
        fontFamily: '"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif',
      }}>{emoji}</span>

      {/* Master crown badge */}
      {agent.master && badge && (
        <span style={{
          position: 'absolute',
          top: Math.round(-size * 0.14),
          right: Math.round(-size * 0.14),
          width: Math.round(size * 0.44),
          height: Math.round(size * 0.44),
          borderRadius: '50%',
          background: 'oklch(0.82 0.13 85)',
          border: '1.5px solid var(--bg-elev)',
          display: 'flex', alignItems: 'center', justifyContent: 'center',
          boxShadow: '0 1px 3px oklch(0.5 0.1 85 / 0.4)',
          fontSize: Math.round(size * 0.22),
          lineHeight: 1,
        }}>👑</span>
      )}
    </div>
  );
};

window.NXRobotAvatar = NXRobotAvatar;