// Stroke-based icons (no emoji), one consistent stroke weight (1.6).
const Icon = ({ name, className = "w-5 h-5", strokeWidth = 1.6 }) => {
  const common = {
    viewBox: "0 0 24 24",
    fill: "none",
    stroke: "currentColor",
    strokeWidth,
    strokeLinecap: "round",
    strokeLinejoin: "round",
    className,
  };
  switch (name) {
    case "arrow-right":
      return (<svg {...common}><path d="M5 12h14M13 5l7 7-7 7" /></svg>);
    case "arrow-up-right":
      return (<svg {...common}><path d="M7 17 17 7M8 7h9v9" /></svg>);
    case "check":
      return (<svg {...common}><path d="m5 12 5 5L20 7" /></svg>);
    case "x":
      return (<svg {...common}><path d="M6 6l12 12M18 6 6 18" /></svg>);
    case "spark":
      return (<svg {...common}><path d="M12 3v6M12 15v6M3 12h6M15 12h6M6 6l3.5 3.5M14.5 14.5 18 18M6 18l3.5-3.5M14.5 9.5 18 6" /></svg>);
    case "bolt":
      return (<svg {...common}><path d="M13 3 4 14h7l-1 7 9-11h-7l1-7z" /></svg>);
    case "layers":
      return (<svg {...common}><path d="m12 3 9 5-9 5-9-5 9-5zM3 13l9 5 9-5M3 18l9 5 9-5" /></svg>);
    case "shield":
      return (<svg {...common}><path d="M12 3 4 6v6c0 5 3.5 8.5 8 9 4.5-.5 8-4 8-9V6l-8-3z" /></svg>);
    case "circuit":
      return (<svg {...common}><circle cx="6" cy="6" r="2" /><circle cx="18" cy="18" r="2" /><circle cx="18" cy="6" r="2" /><path d="M8 6h8M6 8v8a2 2 0 0 0 2 2h8" /></svg>);
    case "flow":
      return (<svg {...common}><path d="M3 7h6l3 5 3-5h6M3 17h6l3-5 3 5h6" /></svg>);
    case "doc":
      return (<svg {...common}><path d="M7 3h7l4 4v14H7zM14 3v4h4M9 12h7M9 16h5" /></svg>);
    case "card":
      return (<svg {...common}><rect x="3" y="6" width="18" height="13" rx="2" /><path d="M3 10h18M7 15h3" /></svg>);
    case "people":
      return (<svg {...common}><circle cx="9" cy="8" r="3.5" /><path d="M3 20c.8-3.6 3.4-5.5 6-5.5s5.2 1.9 6 5.5" /><circle cx="17" cy="9" r="2.5" /><path d="M15.5 14c2.6.3 4.7 2.2 5.5 5.5" /></svg>);
    case "calc":
      return (<svg {...common}><rect x="5" y="3" width="14" height="18" rx="2" /><path d="M9 7h6M9 11h.01M12 11h.01M15 11h.01M9 15h.01M12 15h.01M15 15h.01M9 19h6" /></svg>);
    case "headset":
      return (<svg {...common}><path d="M4 13a8 8 0 0 1 16 0v4a3 3 0 0 1-3 3h-1v-7h4M4 13v4a3 3 0 0 0 3 3h1v-7H4" /></svg>);
    case "globe":
      return (<svg {...common}><circle cx="12" cy="12" r="9" /><path d="M3 12h18M12 3c2.5 3 4 6 4 9s-1.5 6-4 9c-2.5-3-4-6-4-9s1.5-6 4-9z" /></svg>);
    case "sun":
      return (<svg {...common}><circle cx="12" cy="12" r="4" /><path d="M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6l1.4 1.4M17 17l1.4 1.4M5.6 18.4 7 17M17 7l1.4-1.4" /></svg>);
    case "moon":
      return (<svg {...common}><path d="M20 14.5A8 8 0 1 1 9.5 4a7 7 0 0 0 10.5 10.5z" /></svg>);
    case "menu":
      return (<svg {...common}><path d="M4 7h16M4 12h16M4 17h16" /></svg>);
    case "chevron-down":
      return (<svg {...common}><path d="m6 9 6 6 6-6" /></svg>);
    case "chevron-right":
      return (<svg {...common}><path d="m9 6 6 6-6 6" /></svg>);
    case "lock":
      return (<svg {...common}><rect x="5" y="11" width="14" height="9" rx="2" /><path d="M8 11V8a4 4 0 0 1 8 0v3" /></svg>);
    case "graph":
      return (<svg {...common}><path d="M4 19V5M4 19h16M8 15l3-4 3 2 5-6" /></svg>);
    case "plug":
      return (<svg {...common}><path d="M9 3v6M15 3v6M6 9h12v3a6 6 0 0 1-12 0V9zM12 18v3" /></svg>);
    case "warehouse":
      return (<svg {...common}><path d="M3 10 12 4l9 6v10H3zM7 14h10v6H7z" /></svg>);
    case "robot":
      return (<svg {...common}><rect x="5" y="8" width="14" height="11" rx="2"/><circle cx="9.5" cy="13" r="1"/><circle cx="14.5" cy="13" r="1"/><path d="M12 4v4M9 19v2M15 19v2"/></svg>);
    default:
      return null;
  }
};
window.Icon = Icon;