/* Icons — minimal stroke style */
const Icon = ({ name, size = 14, ...rest }) => {
  const props = {
    width: size, height: size,
    viewBox: "0 0 24 24",
    fill: "none",
    stroke: "currentColor",
    strokeWidth: 1.7,
    strokeLinecap: "round",
    strokeLinejoin: "round",
    ...rest,
  };
  switch (name) {
    case "plus":     return <svg {...props}><path d="M12 5v14M5 12h14"/></svg>;
    case "minus":    return <svg {...props}><path d="M5 12h14"/></svg>;
    case "x":        return <svg {...props}><path d="M6 6l12 12M18 6L6 18"/></svg>;
    case "check":    return <svg {...props}><path d="M5 12l5 5L20 7"/></svg>;
    case "tree":     return <svg {...props}><circle cx="12" cy="5" r="2"/><circle cx="6" cy="19" r="2"/><circle cx="18" cy="19" r="2"/><path d="M12 7v4M12 11l-6 6M12 11l6 6"/></svg>;
    case "trash":    return <svg {...props}><path d="M4 7h16M9 7V5a2 2 0 012-2h2a2 2 0 012 2v2M6 7l1 13a2 2 0 002 2h6a2 2 0 002-2l1-13M10 11v6M14 11v6"/></svg>;
    case "download": return <svg {...props}><path d="M12 4v12M6 12l6 6 6-6M5 20h14"/></svg>;
    case "upload":   return <svg {...props}><path d="M12 20V8M6 12l6-6 6 6M5 4h14"/></svg>;
    case "fit":      return <svg {...props}><path d="M4 9V5a1 1 0 011-1h4M20 9V5a1 1 0 00-1-1h-4M4 15v4a1 1 0 001 1h4M20 15v4a1 1 0 01-1 1h-4"/></svg>;
    case "zoomIn":   return <svg {...props}><circle cx="11" cy="11" r="6"/><path d="M11 8v6M8 11h6M20 20l-4.5-4.5"/></svg>;
    case "zoomOut":  return <svg {...props}><circle cx="11" cy="11" r="6"/><path d="M8 11h6M20 20l-4.5-4.5"/></svg>;
    case "circle":   return <svg {...props}><rect x="4" y="9" width="16" height="6" rx="3"/></svg>;
    case "rect":     return <svg {...props}><rect x="4" y="7" width="16" height="10" rx="2"/></svg>;
    case "card":     return <svg {...props}><rect x="4" y="5" width="16" height="14" rx="2"/><path d="M7 9h10M7 13h6"/></svg>;
    case "link":     return <svg {...props}><path d="M10 14a4 4 0 005.66 0l3-3a4 4 0 00-5.66-5.66l-1 1M14 10a4 4 0 00-5.66 0l-3 3a4 4 0 005.66 5.66l1-1"/></svg>;
    case "tag":      return <svg {...props}><path d="M3 12V5a2 2 0 012-2h7l9 9-9 9-9-9z"/><circle cx="8" cy="8" r="1.2" fill="currentColor"/></svg>;
    case "duplicate":return <svg {...props}><rect x="9" y="9" width="11" height="11" rx="2"/><path d="M5 15V5a2 2 0 012-2h8"/></svg>;
    case "child":    return <svg {...props}><circle cx="12" cy="5" r="2"/><circle cx="12" cy="19" r="2"/><path d="M12 7v10"/></svg>;
    case "menu":     return <svg {...props}><circle cx="5" cy="12" r="1.4" fill="currentColor"/><circle cx="12" cy="12" r="1.4" fill="currentColor"/><circle cx="19" cy="12" r="1.4" fill="currentColor"/></svg>;
    case "bars":     return <svg {...props}><path d="M4 7h16M4 12h16M4 17h16"/></svg>;
    case "search":   return <svg {...props}><circle cx="11" cy="11" r="6"/><path d="M20 20l-4.5-4.5"/></svg>;
    case "bullet":   return <svg {...props}><circle cx="12" cy="12" r="3" fill="currentColor"/></svg>;
    case "logo":     return <svg {...props} viewBox="0 0 16 16" strokeWidth="1.4"><circle cx="8" cy="3.5" r="1.7"/><circle cx="3.5" cy="12.5" r="1.7"/><circle cx="12.5" cy="12.5" r="1.7"/><path d="M8 5.2v3M8 8.2L4 11M8 8.2L12 11"/></svg>;
    case "cloud":    return <svg {...props}><path d="M7 18a4 4 0 010-8 5 5 0 019.6-1.3A4 4 0 0117 18H7z"/></svg>;
    case "cloud-off":return <svg {...props}><path d="M7 18a4 4 0 01-1.3-7.8M9.7 7.5A5 5 0 0116.6 8.7 4 4 0 0119 13.7M3 3l18 18"/></svg>;
    case "google":   return <svg {...props} fill="currentColor" stroke="none"><path d="M21.6 12.227c0-.708-.064-1.39-.182-2.045H12v3.868h5.382a4.6 4.6 0 01-1.995 3.018v2.51h3.232c1.891-1.74 2.981-4.305 2.981-7.351z"/><path d="M12 22c2.7 0 4.964-.895 6.619-2.422l-3.232-2.51c-.896.6-2.04.955-3.387.955-2.605 0-4.81-1.76-5.595-4.123H3.064v2.59A9.996 9.996 0 0012 22z"/><path d="M6.405 13.9a6.01 6.01 0 010-3.8V7.51H3.064a10 10 0 000 8.98l3.341-2.59z"/><path d="M12 5.977c1.47 0 2.787.505 3.823 1.495l2.868-2.868C16.96 3.013 14.696 2 12 2A9.996 9.996 0 003.064 7.51l3.34 2.59C7.19 7.737 9.396 5.977 12 5.977z"/></svg>;
    case "apple":    return <svg {...props} fill="currentColor" stroke="none"><path d="M17.05 12.04c-.03-2.7 2.21-4 2.31-4.06-1.26-1.84-3.22-2.1-3.92-2.13-1.66-.17-3.25 1-4.1 1-.86 0-2.16-.98-3.55-.95-1.82.03-3.51 1.06-4.45 2.7-1.9 3.29-.48 8.16 1.37 10.83.9 1.31 1.98 2.78 3.4 2.73 1.37-.05 1.89-.88 3.54-.88 1.66 0 2.13.88 3.58.85 1.48-.03 2.41-1.33 3.31-2.65 1.05-1.52 1.48-2.99 1.5-3.07-.03-.01-2.86-1.1-2.89-4.37zM14.55 4.18c.74-.9 1.24-2.14 1.1-3.38-1.07.04-2.36.71-3.13 1.61-.68.79-1.28 2.06-1.12 3.27 1.19.09 2.41-.61 3.15-1.5z"/></svg>;
    default: return null;
  }
};

window.Icon = Icon;