// Inline SVG icons for PersonalFit landing page
// Minimal, geometric set (line + fill where needed)

const Icon = ({ children, size = 24, className = "" }) => (
  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" className={className} aria-hidden="true">
    {children}
  </svg>
);

const IconDumbbell = (p) => (
  <Icon {...p}>
    <path d="M6 8v8M3 10v4M9 6v12M15 6v12M18 8v8M21 10v4" />
    <path d="M9 12h6" />
  </Icon>
);

const IconUsers = (p) => (
  <Icon {...p}>
    <path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" />
    <circle cx="9" cy="7" r="4" />
    <path d="M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75" />
  </Icon>
);

const IconWallet = (p) => (
  <Icon {...p}>
    <path d="M19 7H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2Z" />
    <path d="M16 14h2M18 7V5a2 2 0 0 0-2-2H7a2 2 0 0 0-2 2v2" />
  </Icon>
);

const IconBook = (p) => (
  <Icon {...p}>
    <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20V3H6.5A2.5 2.5 0 0 0 4 5.5v14Z" />
    <path d="M4 19.5V21h16" />
  </Icon>
);

const IconSparkles = (p) => (
  <Icon {...p}>
    <path d="M9 4 10.5 8.5 15 10 10.5 11.5 9 16 7.5 11.5 3 10 7.5 8.5 9 4Z" />
    <path d="M18 4v4M16 6h4M18 16v4M16 18h4" />
  </Icon>
);

const IconGlobe = (p) => (
  <Icon {...p}>
    <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" />
  </Icon>
);

const IconClipboard = (p) => (
  <Icon {...p}>
    <rect x="8" y="3" width="8" height="4" rx="1" />
    <path d="M16 5h3v15a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V5h3" />
    <path d="M9 12h6M9 16h4" />
  </Icon>
);

const IconShield = (p) => (
  <Icon {...p}>
    <path d="M12 22s8-3.5 8-10V5l-8-3-8 3v7c0 6.5 8 10 8 10Z" />
    <path d="m9 12 2 2 4-4" />
  </Icon>
);

const IconCheck = (p) => (
  <Icon {...p}>
    <path d="m20 6-11 11L4 12" />
  </Icon>
);

const IconArrow = (p) => (
  <Icon {...p}>
    <path d="M5 12h14M13 5l7 7-7 7" />
  </Icon>
);

const IconPlay = (p) => (
  <Icon {...p}>
    <path d="m6 4 14 8L6 20V4Z" fill="currentColor" stroke="none" />
  </Icon>
);

const IconLightning = (p) => (
  <Icon {...p}>
    <path d="M13 2 4 14h7l-1 8 9-12h-7l1-8Z" />
  </Icon>
);

const IconChartUp = (p) => (
  <Icon {...p}>
    <path d="M3 17 9 11l4 4 8-8M15 7h6v6" />
  </Icon>
);

const IconBolt = (p) => (
  <Icon {...p}>
    <path d="M13 2 4 14h7l-1 8 9-12h-7l1-8Z" fill="currentColor" stroke="none" />
  </Icon>
);

const IconPlus = (p) => (
  <Icon {...p}>
    <path d="M12 5v14M5 12h14" />
  </Icon>
);

const IconMessageMissed = (p) => (
  <Icon {...p}>
    <path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5Z" />
  </Icon>
);

const IconTimer = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="13" r="8" />
    <path d="M12 9v4l2 2M9 2h6" />
  </Icon>
);

const IconLock = (p) => (
  <Icon {...p}>
    <rect x="3" y="11" width="18" height="11" rx="2" />
    <path d="M7 11V7a5 5 0 0 1 10 0v4" />
  </Icon>
);

const IconHelp = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="12" r="9" />
    <path d="M9.1 9a3 3 0 1 1 5.7 1c0 2-3 3-3 3M12 17h.01" />
  </Icon>
);

Object.assign(window, {
  Icon, IconDumbbell, IconUsers, IconWallet, IconBook, IconSparkles, IconGlobe,
  IconClipboard, IconShield, IconCheck, IconArrow, IconPlay, IconLightning,
  IconChartUp, IconBolt, IconPlus, IconMessageMissed, IconTimer, IconLock, IconHelp,
});
