/* Icons — simple line icons matching sharp/regular style used throughout Cralux design */
const Icon = ({ name, size = 20, stroke = "currentColor", strokeWidth = 1.5, fill = "none", style = {} }) => {
  const s = size;
  const common = { width: s, height: s, viewBox: "0 0 24 24", fill, stroke, strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", style, "aria-hidden": true };
  switch (name) {
    case "arrow-right":
      return <svg {...common}><path d="M5 12h14M13 6l6 6-6 6" /></svg>;
    case "arrow-long-right":
      return <svg {...common}><path d="M2 12h20M16 6l6 6-6 6" /></svg>;
    case "arrow-long-left":
      return <svg {...common}><path d="M22 12H2M8 6l-6 6 6 6" /></svg>;
    case "arrow-up-right":
      return <svg {...common}><path d="M7 17L17 7M8 7h9v9" /></svg>;
    case "arrow-down":
      return <svg {...common}><path d="M12 5v14M6 13l6 6 6-6" /></svg>;
    case "plus":
      return <svg {...common}><path d="M12 5v14M5 12h14" /></svg>;
    case "minus":
      return <svg {...common}><path d="M5 12h14" /></svg>;
    case "check":
      return <svg {...common}><path d="M5 12l5 5L20 7" /></svg>;
    case "star":
      return <svg {...common} fill={stroke} stroke="none"><path d="M12 2l2.9 6.5 7.1.7-5.3 4.8 1.6 7L12 17.3 5.7 21l1.6-7L2 9.2l7.1-.7L12 2z" /></svg>;
    case "star-half":
      return (<svg {...common} fill={stroke} stroke="none">
        <path d="M12 2v15.3L5.7 21l1.6-7L2 9.2l7.1-.7L12 2z" />
        <path d="M12 2l2.9 6.5 7.1.7-5.3 4.8 1.6 7L12 17.3V2z" fill={stroke} opacity="0.3" />
      </svg>);
    case "menu":
      return <svg {...common}><path d="M3 6h18M3 12h18M3 18h18" /></svg>;
    case "close":
      return <svg {...common}><path d="M6 6l12 12M6 18L18 6" /></svg>;
    case "phone":
      return <svg {...common}><path d="M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6 19.8 19.8 0 0 1-3.1-8.7A2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.3 1.7.6 2.5a2 2 0 0 1-.5 2.1L8 9.5a16 16 0 0 0 6 6l1.2-1.2a2 2 0 0 1 2.1-.5c.8.3 1.6.5 2.5.6a2 2 0 0 1 1.7 2z" /></svg>;
    case "mail":
      return <svg {...common}><path d="M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z" /><path d="M22 6l-10 7L2 6" /></svg>;
    case "calc":
      return <svg {...common}><rect x="4" y="3" width="16" height="18" rx="2" /><path d="M8 7h8M8 12h.01M12 12h.01M16 12h.01M8 16h.01M12 16h.01M16 16h.01" /></svg>;
    case "home":
      return <svg {...common}><path d="M3 10l9-7 9 7v10a2 2 0 0 1-2 2h-4v-7h-6v7H5a2 2 0 0 1-2-2z" /></svg>;
    case "roof":
      return <svg {...common}><path d="M2 12L12 4l10 8M4 12v8h16v-8M9 20v-6h6v6" /></svg>;
    case "window":
      return <svg {...common}><rect x="4" y="3" width="16" height="18" rx="1" /><path d="M12 3v18M4 12h16" /></svg>;
    case "facade":
      return <svg {...common}><rect x="3" y="3" width="18" height="18" /><path d="M3 9h18M3 15h18M9 3v18M15 3v18" /></svg>;
    case "leaf":
      return <svg {...common}><path d="M21 3c-2 10-8 16-18 18 0-10 8-18 18-18zM3 21c6-2 10-6 12-12" /></svg>;
    case "shield":
      return <svg {...common}><path d="M12 2l9 4v6c0 5.5-3.8 10.7-9 12-5.2-1.3-9-6.5-9-12V6l9-4z" /></svg>;
    case "ruler":
      return <svg {...common}><path d="M2 12l10-10 10 10-10 10z" /><path d="M7 12l1.5 1.5M10 9l1.5 1.5M13 6l1.5 1.5M12 17l-1.5-1.5M15 14l-1.5-1.5M18 11l-1.5-1.5" /></svg>;
    case "compass":
      return <svg {...common}><circle cx="12" cy="12" r="10" /><path d="M16 8l-2 6-6 2 2-6 6-2z" /></svg>;
    case "spark":
      return <svg {...common}><path d="M12 2l2 6 6 2-6 2-2 6-2-6-6-2 6-2 2-6zM19 15l1 2 2 1-2 1-1 2-1-2-2-1 2-1 1-2zM5 4l.8 1.5L7.5 6.3 6 7l-.7 1.5L4.5 7 3 6.3l1.5-.8L5 4z" /></svg>;
    case "zap":
      return <svg {...common}><path d="M13 2L4 14h7l-1 8 9-12h-7l1-8z" /></svg>;
    case "camera":
      return <svg {...common}><path d="M3 8a2 2 0 0 1 2-2h2.5l1.5-2h6l1.5 2H19a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><circle cx="12" cy="13" r="3.5"/></svg>;
    case "layers":
      return <svg {...common}><path d="M12 2l10 5-10 5L2 7l10-5zM2 12l10 5 10-5M2 17l10 5 10-5"/></svg>;
    case "fb":
      return <svg width={size} height={size} viewBox="0 0 24 24" fill={stroke}><path d="M14 9h3V5h-3a4 4 0 0 0-4 4v2H7v4h3v8h4v-8h3l1-4h-4V9a1 1 0 0 1 1-1z"/></svg>;
    case "ig":
      return <svg {...common}><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=".5" fill={stroke}/></svg>;
    case "li":
      return <svg width={size} height={size} viewBox="0 0 24 24" fill={stroke}><path d="M4 4h4v4H4zM4 10h4v10H4zM10 10h4v1.5c.6-1 2-1.8 3.5-1.8 3 0 4.5 2 4.5 5V20h-4v-5c0-1.3-.5-2.2-1.7-2.2-1.5 0-2.3 1-2.3 2.5V20h-4z"/></svg>;
    case "yt":
      return <svg width={size} height={size} viewBox="0 0 24 24" fill={stroke}><path d="M22 7.5c-.2-1.5-.8-2.5-2.3-2.7C17.2 4.5 12 4.5 12 4.5s-5.2 0-7.7.3C2.8 5 2.2 6 2 7.5 1.8 9 1.8 12 1.8 12s0 3 .2 4.5c.2 1.5.8 2.5 2.3 2.7 2.5.3 7.7.3 7.7.3s5.2 0 7.7-.3c1.5-.2 2.1-1.2 2.3-2.7.2-1.5.2-4.5.2-4.5s0-3-.2-4.5zM10 15.5v-7l6 3.5-6 3.5z"/></svg>;
    default:
      return <svg {...common}><circle cx="12" cy="12" r="9" /></svg>;
  }
};

window.Icon = Icon;