// Minimal icon set (Lucide-style, 16/18px stroke). No emoji.
const Icon = ({ name, size = 16, stroke = 1.6, className = "" }) => {
  const p = (d, extra) => (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="none"
      stroke="currentColor" strokeWidth={stroke} strokeLinecap="round" strokeLinejoin="round"
      className={className} {...extra}>
      {d}
    </svg>
  );
  switch(name){
    case "dashboard": return p(<><rect x="3" y="3" width="8" height="10" rx="1.5"/><rect x="13" y="3" width="8" height="6" rx="1.5"/><rect x="13" y="11" width="8" height="10" rx="1.5"/><rect x="3" y="15" width="8" height="6" rx="1.5"/></>);
    case "accounts": return p(<><rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 10h18"/><path d="M8 14h4"/></>);
    case "feed": return p(<><path d="M4 4v16"/><path d="M9 7h11"/><path d="M9 12h11"/><path d="M9 17h7"/></>);
    case "alerts": return p(<><path d="M12 3a7 7 0 0 0-7 7v4l-2 3h18l-2-3v-4a7 7 0 0 0-7-7Z"/><path d="M10 20a2 2 0 0 0 4 0"/></>);
    case "settings": return p(<><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.5-1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3h0a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8v0a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1Z"/></>);
    case "search": return p(<><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></>);
    case "chevron-right": return p(<path d="m9 6 6 6-6 6"/>);
    case "chevron-down": return p(<path d="m6 9 6 6 6-6"/>);
    case "chevron-up": return p(<path d="m6 15 6-6 6 6"/>);
    case "chevron-left": return p(<path d="m15 6-6 6 6 6"/>);
    case "arrow-right": return p(<><path d="M5 12h14"/><path d="m13 6 6 6-6 6"/></>);
    case "arrow-up-right": return p(<><path d="M7 17 17 7"/><path d="M8 7h9v9"/></>);
    case "x": return p(<><path d="M18 6 6 18"/><path d="m6 6 12 12"/></>);
    case "filter": return p(<path d="M3 5h18l-7 9v6l-4-2v-4Z"/>);
    case "download": return p(<><path d="M12 3v13"/><path d="m7 12 5 5 5-5"/><path d="M5 21h14"/></>);
    case "external": return p(<><path d="M14 5h5v5"/><path d="M19 5 10 14"/><path d="M19 13v6H5V5h6"/></>);
    case "refresh": return p(<><path d="M20 4v5h-5"/><path d="M4 20v-5h5"/><path d="M20 9a8 8 0 0 0-14.6-2.6"/><path d="M4 15a8 8 0 0 0 14.6 2.6"/></>);
    case "dot": return p(<circle cx="12" cy="12" r="4"/>);
    case "info": return p(<><circle cx="12" cy="12" r="9"/><path d="M12 8v.01"/><path d="M12 12v4"/></>);
    case "clock": return p(<><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></>);
    case "user": return p(<><circle cx="12" cy="8" r="4"/><path d="M4 21a8 8 0 0 1 16 0"/></>);
    case "copy": return p(<><rect x="8" y="8" width="12" height="12" rx="2"/><path d="M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2"/></>);
    case "sheet": return p(<><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 10h18"/><path d="M3 16h18"/><path d="M10 3v18"/></>);
    case "link": return p(<><path d="M10 14a4 4 0 0 1 0-5.7l3-3a4 4 0 0 1 5.7 5.7l-1.5 1.5"/><path d="M14 10a4 4 0 0 1 0 5.7l-3 3a4 4 0 0 1-5.7-5.7l1.5-1.5"/></>);
    case "money": return p(<><rect x="2" y="6" width="20" height="12" rx="2"/><circle cx="12" cy="12" r="3"/><path d="M6 10v4"/><path d="M18 10v4"/></>);
    case "zap": return p(<path d="m13 2-8 12h7l-2 8 9-13h-7Z"/>);
    case "layers": return p(<><path d="m12 3 9 5-9 5-9-5Z"/><path d="m3 13 9 5 9-5"/><path d="m3 17 9 5 9-5"/></>);
    case "image": return p(<><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-5-5-8 8"/></>);
    case "shield": return p(<path d="M12 3 4 6v6c0 5 3.5 8 8 9 4.5-1 8-4 8-9V6Z"/>);
    case "flag": return p(<><path d="M4 21V4"/><path d="M4 4h14l-3 4 3 4H4"/></>);
    case "globe": return p(<><circle cx="12" cy="12" r="9"/><path d="M3 12h18"/><path d="M12 3a14 14 0 0 1 0 18"/><path d="M12 3a14 14 0 0 0 0 18"/></>);
    case "tree": return p(<><path d="M5 5h6M5 12h8M5 19h10"/><path d="M5 5v14"/></>);
    case "sort": return p(<><path d="M7 4v16"/><path d="m3 8 4-4 4 4"/><path d="M17 20V4"/><path d="m13 16 4 4 4-4"/></>);
    case "plus": return p(<><path d="M12 5v14"/><path d="M5 12h14"/></>);
    case "check": return p(<path d="m5 12 5 5 10-12"/>);
    case "pause": return p(<><rect x="6" y="5" width="4" height="14" rx="1"/><rect x="14" y="5" width="4" height="14" rx="1"/></>);
    case "play": return p(<path d="M6 5v14l13-7Z"/>);
    case "target": return p(<><circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="5"/><circle cx="12" cy="12" r="1.5" fill="currentColor"/></>);
    case "logo":
      // Fabcom placeholder mark — stacked chevrons forming an F
      return (
        <svg width={size} height={size} viewBox="0 0 24 24" className={className}>
          <rect x="1" y="1" width="22" height="22" rx="6" fill="var(--navy-600)"/>
          <path d="M6 6h12v3H9v3h7v3H9v3H6Z" fill="var(--accent-500)"/>
          <circle cx="18" cy="18" r="1.6" fill="var(--accent-400)"/>
        </svg>
      );
    default: return null;
  }
};

window.Icon = Icon;