// icons.jsx — Inline SVG icons. Keep stroke-based, currentColor.

function Icon({ name, size = 18, stroke = 1.8, ...rest }) {
  const s = { width: size, height: size, ...rest.style };
  const common = {
    viewBox: "0 0 24 24",
    fill: "none",
    stroke: "currentColor",
    strokeWidth: stroke,
    strokeLinecap: "round",
    strokeLinejoin: "round",
    style: s,
    "aria-hidden": true,
  };
  switch (name) {
    case "arrow-right": return (
      <svg {...common}><path d="M5 12h14M13 5l7 7-7 7" /></svg>
    );
    case "check": return (
      <svg {...common}><path d="M5 12.5l4.5 4.5L19 7.5" /></svg>
    );
    case "plus": return (
      <svg {...common}><path d="M12 5v14M5 12h14" /></svg>
    );
    case "x": return (
      <svg {...common}><path d="M6 6l12 12M6 18L18 6" /></svg>
    );
    case "shield": return (
      <svg {...common}><path d="M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6l8-3z" /><path d="M9 12l2 2 4-4" /></svg>
    );
    case "clock": return (
      <svg {...common}><circle cx="12" cy="12" r="9" /><path d="M12 7v5l3 2" /></svg>
    );
    case "bolt": return (
      <svg {...common}><path d="M13 3L4 14h7l-1 7 9-11h-7l1-7z" /></svg>
    );
    case "phone": return (
      <svg {...common}><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.37 1.9.72 2.79a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.29-1.29a2 2 0 0 1 2.11-.45c.89.35 1.83.6 2.79.72A2 2 0 0 1 22 16.92z"/></svg>
    );
    case "mail": return (
      <svg {...common}><rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 7l9 6 9-6"/></svg>
    );
    case "chat": return (
      <svg {...common}><path d="M21 12c0 4.4-4 8-9 8-1.2 0-2.4-.2-3.4-.6L3 21l1.6-4.6C3.6 15 3 13.6 3 12c0-4.4 4-8 9-8s9 3.6 9 8z"/></svg>
    );
    case "calendar": return (
      <svg {...common}><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M16 3v4M8 3v4M3 9h18"/></svg>
    );
    case "filter": return (
      <svg {...common}><path d="M3 5h18M6 12h12M10 19h4"/></svg>
    );
    case "user": return (
      <svg {...common}><circle cx="12" cy="8" r="4"/><path d="M4 21c0-4 4-7 8-7s8 3 8 7"/></svg>
    );
    case "globe": return (
      <svg {...common}><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18"/></svg>
    );
    case "spark": return (
      <svg {...common}><path d="M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8L12 3z"/></svg>
    );
    case "lock": return (
      <svg {...common}><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V8a4 4 0 0 1 8 0v3"/></svg>
    );
    case "chev-left": return (
      <svg {...common}><path d="M15 6l-6 6 6 6"/></svg>
    );
    case "chev-right": return (
      <svg {...common}><path d="M9 6l6 6-6 6"/></svg>
    );
    case "play": return (
      <svg {...common} fill="currentColor" stroke="none"><path d="M7 4v16l13-8z"/></svg>
    );
    case "pause": return (
      <svg {...common} fill="currentColor" stroke="none"><rect x="6" y="4" width="4" height="16" rx="1"/><rect x="14" y="4" width="4" height="16" rx="1"/></svg>
    );
    case "video": return (
      <svg {...common}><rect x="3" y="6" width="14" height="12" rx="2"/><path d="M17 10l4-3v10l-4-3z"/></svg>
    );
    case "home": return (
      <svg {...common}><path d="M3 11l9-8 9 8v9a2 2 0 0 1-2 2h-4v-7h-6v7H5a2 2 0 0 1-2-2v-9z"/></svg>
    );
    case "key": return (
      <svg {...common}><circle cx="8" cy="15" r="4"/><path d="M11 12l9-9M16 7l3 3"/></svg>
    );
    case "alert": return (
      <svg {...common}><path d="M10.3 3.7L1.7 18a2 2 0 0 0 1.7 3h17.2a2 2 0 0 0 1.7-3L13.7 3.7a2 2 0 0 0-3.4 0z"/><path d="M12 9v4M12 17h.01"/></svg>
    );
    case "infinity": return (
      <svg {...common}><path d="M18 12c0-2.5-2-4.5-4.5-4.5S9 9.5 9 12s2 4.5 4.5 4.5S18 14.5 18 12z" /><path d="M5 12c0 2.5 2 4.5 4.5 4.5"/></svg>
    );
    case "target": return (
      <svg {...common}><circle cx="12" cy="12" r="9"/><path d="M8.5 12l2.5 2.5L16 9"/></svg>
    );
    case "sliders": return (
      <svg {...common}><path d="M4 7h9M17 7h3M4 17h3M11 17h9"/><circle cx="15" cy="7" r="2.2"/><circle cx="9" cy="17" r="2.2"/></svg>
    );
    case "headset": return (
      <svg {...common}><path d="M5 13v-1a7 7 0 0 1 14 0v1"/><rect x="3.5" y="12.5" width="3.5" height="6" rx="1.5"/><rect x="17" y="12.5" width="3.5" height="6" rx="1.5"/><path d="M19 18.5v.5a3 3 0 0 1-3 3h-2.5"/></svg>
    );
    case "bulb": return (
      <svg {...common}><path d="M9.5 18h5M10 21h4"/><path d="M12 3a6 6 0 0 0-3.8 10.6c.7.6 1.3 1.4 1.3 2.4h5c0-1 .6-1.8 1.3-2.4A6 6 0 0 0 12 3z"/></svg>
    );
    case "heart": return (
      <svg {...common}><path d="M12 20.5l-1.4-1.3C5.4 14.7 3 12.2 3 9.2 3 6.9 4.8 5 7 5c1.4 0 2.7.7 3.5 1.8L12 8l1.5-1.2C14.3 5.7 15.6 5 17 5c2.2 0 4 1.9 4 4.2 0 3-2.4 5.5-9 11.3z"/></svg>
    );
    case "trophy": return (
      <svg {...common}><path d="M7 4h10v5a5 5 0 0 1-10 0V4z"/><path d="M7 6H4.5v1A3 3 0 0 0 7 10M17 6h2.5v1a3 3 0 0 1-2.5 3"/><path d="M12 14v3M8.5 20h7M9.5 17h5l.5 3h-6z"/></svg>
    );
    case "users": return (
      <svg {...common}><circle cx="9" cy="8" r="3.2"/><path d="M3.5 19.5c0-3 2.5-4.8 5.5-4.8s5.5 1.8 5.5 4.8"/><path d="M16 5.3a3.2 3.2 0 0 1 0 5.4M17 14.9c2.3.4 4 2 4 4.6"/></svg>
    );
    case "trend": return (
      <svg {...common}><path d="M3 16.5l5.5-5.5 3.5 3.5L21 6"/><path d="M21 11V6h-5"/></svg>
    );
    default: return null;
  }
}

window.Icon = Icon;