// Icons.jsx — hand-rolled SVG primitives matching production style: stroke 2, round caps.
const iconBase = {
  viewBox: "0 0 24 24",
  fill: "none",
  stroke: "currentColor",
  strokeWidth: 2,
  strokeLinecap: "round",
  strokeLinejoin: "round",
};

const Icon = {
  User: ({ size = 18, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <circle cx="12" cy="8" r="4" />
      <path d="M5 21a7 7 0 0114 0" />
    </svg>
  ),
  Bluetooth: ({ size = 22, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M7 7l10 10-5 5V2l5 5L7 17" />
    </svg>
  ),
  QR: ({ size = 22, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <rect x="3" y="3" width="7" height="7" rx="1" />
      <rect x="14" y="3" width="7" height="7" rx="1" />
      <rect x="3" y="14" width="7" height="7" rx="1" />
      <path d="M14 14h3M21 14v3M14 21h3M17 17h4v4" />
    </svg>
  ),
  Link: ({ size = 22, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M10 13a5 5 0 007.07 0l3-3a5 5 0 00-7.07-7.07L11.5 4.5" />
      <path d="M14 11a5 5 0 00-7.07 0l-3 3a5 5 0 007.07 7.07L12.5 19.5" />
    </svg>
  ),
  Radar: ({ size = 22, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <circle cx="12" cy="12" r="3" />
      <path d="M12 12L4 4" />
      <circle cx="12" cy="12" r="7" opacity="0.5" />
      <circle cx="12" cy="12" r="11" opacity="0.25" />
    </svg>
  ),
  Shield: ({ size = 22, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M12 2l8 4v6c0 5-3.5 8.5-8 10-4.5-1.5-8-5-8-10V6z" />
      <path d="M9 12l2 2 4-4" />
    </svg>
  ),
  Sparkle: ({ size = 22, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M12 3l1.5 5.5L19 10l-5.5 1.5L12 17l-1.5-5.5L5 10l5.5-1.5z" />
    </svg>
  ),
  Apple: ({ size = 18, ...p }) => (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="currentColor" {...p}>
      <path d="M17.5 12.5c0-2.6 2.1-3.9 2.2-3.9-1.2-1.8-3.1-2-3.7-2-1.6-.2-3.1.9-3.9.9s-2-.9-3.4-.9c-1.7 0-3.3 1-4.2 2.6-1.8 3.1-.5 7.7 1.3 10.2.9 1.2 1.9 2.6 3.3 2.5 1.3-.1 1.8-.8 3.4-.8s2 .8 3.4.8c1.4 0 2.3-1.2 3.1-2.5.7-1.1 1.4-2.5 1.4-2.5-2.2-.9-2.9-3.4-2.9-4.4zM14 5c.7-.9 1.2-2.1 1.1-3.3-1 0-2.3.7-3 1.6-.7.8-1.3 2-1.1 3.2 1.2.1 2.3-.6 3-1.5z" />
    </svg>
  ),
  ArrowRight: ({ size = 16, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M5 12h14M13 5l7 7-7 7" />
    </svg>
  ),
  Plus: ({ size = 16, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M12 5v14M5 12h14" />
    </svg>
  ),
  Globe: ({ size = 14, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <circle cx="12" cy="12" r="9" />
      <path d="M3 12h18M12 3a13 13 0 010 18M12 3a13 13 0 000 18" />
    </svg>
  ),
  Instagram: ({ size = 14, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <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="0.6" fill="currentColor" />
    </svg>
  ),
  LinkedIn: ({ size = 14, ...p }) => (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="currentColor" {...p}>
      <path d="M4 4h4v4H4zM4 10h4v10H4zM10 10h4v2c.7-1.3 2.2-2.3 4-2.3 3 0 4 2 4 5V20h-4v-4.7c0-1.3-.5-2.3-1.8-2.3S14 14 14 15.5V20h-4z" />
    </svg>
  ),
  Github: ({ size = 14, ...p }) => (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="currentColor" {...p}>
      <path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.46-1.16-1.11-1.47-1.11-1.47-.91-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.53 2.34 1.09 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.99 1.03-2.69-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.6 1.03 2.69 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z" />
    </svg>
  ),
  X: ({ size = 14, ...p }) => (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="currentColor" {...p}>
      <path d="M17.5 3h3l-7.3 8.4L22 21h-6.6l-5.2-6.3L4 21H1l7.8-9L1.4 3H8l4.7 5.8L17.5 3zm-1.1 16h1.7L7.7 5h-1.8l10.5 14z" />
    </svg>
  ),
  NFC: ({ size = 16, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M5 9c2-2.5 4-3 7-3s5 .5 7 3" opacity="0.45" />
      <path d="M7 12c1.5-1.7 3-2 5-2s3.5.3 5 2" opacity="0.7" />
      <path d="M9 15c.8-1 1.7-1.2 3-1.2s2.2.2 3 1.2" />
      <circle cx="12" cy="18" r="0.8" fill="currentColor" />
    </svg>
  ),
  Verified: ({ size = 14, ...p }) => (
    <svg width={size} height={size} {...iconBase} {...p}>
      <path d="M12 2l2.4 1.6L17 3l1 2.4 2.4 1L20 9l1.4 2.4L19 13l-1 2.4-2.6-.6L13 17l-2-2-2.4 1L7 13l-2.4-1L6 9l-2-2.4 2.6-.6L8 4l2-1.4L12 2z" />
      <path d="M9 12l2 2 4-4" />
    </svg>
  ),
};

window.Icon = Icon;
