// Icon set — single-stroke line icons, 1.5px stroke
const Icon = ({ name, size = 20, stroke = 'currentColor', className = '', strokeWidth = 1.6 }) => {
  const paths = {
    arrow: <path d="M5 12h14M13 6l6 6-6 6" />,
    arrowRight: <path d="M5 12h14M13 6l6 6-6 6" />,
    check: <path d="M5 12l4 4 10-10" />,
    checkSmall: <path d="M5 12l4 4 10-10" />,
    badge: (
      <>
        <path d="M12 2l2.6 2 3.2-.4.4 3.2 2 2.6-2 2.6.4 3.2-3.2.4L12 18l-2.6-2-3.2.4-.4-3.2-2-2.6 2-2.6-.4-3.2L8.4 4 11 2z" transform="translate(1,2)" />
        <path d="M9 12l2 2 4-4" />
      </>
    ),
    shield: <path d="M12 3l8 3v6c0 5-3.5 8.5-8 9-4.5-.5-8-4-8-9V6l8-3z" />,
    clock: <><circle cx="12" cy="12" r="9" /><path d="M12 7v5l3 2" /></>,
    bolt: <path d="M13 2L4 14h7l-1 8 9-12h-7l1-8z" />,
    chat: <path d="M21 12c0 4.4-4 8-9 8-1.4 0-2.7-.3-3.9-.8L3 21l1.5-4.3C3.6 15.4 3 13.8 3 12c0-4.4 4-8 9-8s9 3.6 9 8z" />,
    sparkle: <path d="M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8" />,
    globe: <><circle cx="12" cy="12" r="9" /><path d="M3 12h18M12 3a14 14 0 010 18M12 3a14 14 0 000 18" /></>,
    chart: <><path d="M4 20V8M10 20V4M16 20v-7M22 20H2" /></>,
    laptop: <><rect x="3" y="5" width="18" height="12" rx="2" /><path d="M2 20h20" /></>,
    refresh: <path d="M3 12a9 9 0 0115.5-6.3L21 8M21 3v5h-5M21 12a9 9 0 01-15.5 6.3L3 16M3 21v-5h5" />,
    pin: <><path d="M12 21s7-6.5 7-12a7 7 0 10-14 0c0 5.5 7 12 7 12z" /><circle cx="12" cy="9" r="2.5" /></>,
    cart: <><circle cx="9" cy="20" r="1.5" /><circle cx="18" cy="20" r="1.5" /><path d="M3 4h2l2.5 12h11l2-8H6" /></>,
    star: <path d="M12 3l2.9 5.9 6.5.9-4.7 4.6 1.1 6.5L12 18l-5.8 3 1.1-6.5L2.6 9.8l6.5-.9L12 3z" fill="currentColor" stroke="none" />,
    play: <path d="M8 5l12 7-12 7V5z" fill="currentColor" stroke="none" />,
    menu: <path d="M4 7h16M4 12h16M4 17h16" />,
    close: <path d="M5 5l14 14M19 5L5 19" />,
    phone: <path d="M5 4h4l2 5-2.5 1.5a11 11 0 005 5L15 13l5 2v4a2 2 0 01-2 2A16 16 0 013 6a2 2 0 012-2z" />,
    mail: <><rect x="3" y="5" width="18" height="14" rx="2" /><path d="M3 7l9 6 9-6" /></>,
    instagram: <><rect x="3" y="3" width="18" height="18" rx="5" /><circle cx="12" cy="12" r="4" /><circle cx="17.5" cy="6.5" r="1" fill="currentColor" /></>,
    linkedin: <><rect x="3" y="3" width="18" height="18" rx="3" /><path d="M8 10v8M8 7v.01M12 18v-5a2 2 0 014 0v5M12 10v8" /></>,
    twitter: <path d="M22 5.8a8 8 0 01-2.4.7 4 4 0 001.8-2.2 8 8 0 01-2.6 1A4 4 0 0012 9c0 .3 0 .6.1.9A11 11 0 013 4s-4 9 5 13a12 12 0 01-7 2c9 5 20 0 20-11.5v-.5A8 8 0 0022 5.8z" />,
    whatsapp: <><path d="M21 12a9 9 0 01-13.4 7.8L3 21l1.3-4.5A9 9 0 1121 12z" /><path d="M8.5 8.5c0 4 3 7 7 7l1.5-1.5-2-1-1.2.5-1.8-1.8.5-1.2-1-2L10 8.5" /></>,
    lock: <><rect x="5" y="11" width="14" height="9" rx="2" /><path d="M8 11V8a4 4 0 018 0v3" /></>,
    gbp: <path d="M16 6.5A4 4 0 008 8c0 2.5 1 4 1 6.5C9 17 7 18 7 18h10M7 13h7" />,
    seo: <><circle cx="11" cy="11" r="6" /><path d="M16 16l4 4M9 11h4M11 9v4" /></>,
    rss: <><path d="M5 5a14 14 0 0114 14M5 11a8 8 0 018 8" /><circle cx="6" cy="18" r="1.5" fill="currentColor" /></>,
  };
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="none"
      stroke={stroke} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"
      className={className} aria-hidden="true">
      {paths[name]}
    </svg>
  );
};

window.Icon = Icon;