// Icons.jsx — inline Lucide-style SVG icons used throughout the page.

function Icon({ name, size = 24, stroke = 1.75, className = "", style = {} }) {
  const props = {
    width: size,
    height: size,
    viewBox: "0 0 24 24",
    fill: "none",
    stroke: "currentColor",
    strokeWidth: stroke,
    strokeLinecap: "round",
    strokeLinejoin: "round",
    className,
    style,
  };
  const paths = {
    scissors: (
      <>
        <circle cx="6" cy="6" r="3" />
        <circle cx="6" cy="18" r="3" />
        <line x1="20" y1="4" x2="8.12" y2="15.88" />
        <line x1="14.47" y1="14.48" x2="20" y2="20" />
        <line x1="8.12" y1="8.12" x2="12" y2="12" />
      </>
    ),
    shield: (
      <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
    ),
    "shield-check": (
      <>
        <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
        <path d="m9 12 2 2 4-4" />
      </>
    ),
    leaf: (
      <path d="M11 20A7 7 0 0 1 4 13a7 7 0 0 1 7-7c5 0 9 4 9 9 0 5-4 9-9 9z" />
    ),
    truck: (
      <>
        <path d="M1 3h15v13H1z" />
        <path d="M16 8h4l3 3v5h-7" />
        <circle cx="5.5" cy="18.5" r="2.5" />
        <circle cx="18.5" cy="18.5" r="2.5" />
      </>
    ),
    flame: (
      <path d="M8.5 14.5A2.5 2.5 0 0 0 11 17c1.5 0 2.5-1.5 2.5-3 0-1.5-1-3-3-4 0 0 1 4-1 4s-1-1-1-2 1-3.5 0-5c-2 1.5-4 4-4 7a6 6 0 0 0 12 0c0-4-3-7-6-10C8 5 7 8 8.5 14.5z" />
    ),
    armchair: (
      <>
        <path d="M19 9V7a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" />
        <path d="M4 13v3a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3v-3" />
        <path d="M5 13a2 2 0 1 1 4 0v3h6v-3a2 2 0 1 1 4 0" />
        <path d="M7 19v2M17 19v2" />
      </>
    ),
    gauge: (
      <>
        <path d="M12 14l4-4" />
        <path d="M3.34 19a10 10 0 1 1 17.32 0" />
      </>
    ),
    "arrow-up-down": (
      <>
        <path d="m7 15 5 5 5-5" />
        <path d="m7 9 5-5 5 5" />
      </>
    ),
    layers: (
      <>
        <path d="m12 2 9 5-9 5-9-5 9-5z" />
        <path d="m3 17 9 5 9-5" />
        <path d="m3 12 9 5 9-5" />
      </>
    ),
    award: (
      <>
        <circle cx="12" cy="8" r="6" />
        <path d="m9 13-1.5 8L12 18l4.5 3L15 13" />
      </>
    ),
    star: (
      <path d="m12 2 3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.56 5.82 22 7 14.14 2 9.27l6.91-1.01L12 2z" fill="currentColor" stroke="none" />
    ),
    "arrow-right": (
      <>
        <line x1="5" y1="12" x2="19" y2="12" />
        <polyline points="12 5 19 12 12 19" />
      </>
    ),
    play: (
      <polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none" />
    ),
    instagram: (
      <>
        <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.5" fill="currentColor" />
      </>
    ),
    youtube: (
      <>
        <path d="M22 8s-.2-1.4-.8-2c-.8-.9-1.7-.9-2.1-1C16 4.7 12 4.7 12 4.7s-4 0-7.1.3c-.4.1-1.3.1-2.1 1-.6.6-.8 2-.8 2S2 9.6 2 11.2v1.6c0 1.6.2 3.2.2 3.2s.2 1.4.8 2c.8.9 1.9.9 2.4 1 1.7.2 7.1.3 7.1.3s4 0 7.1-.3c.4-.1 1.3-.1 2.1-1 .6-.6.8-2 .8-2s.2-1.6.2-3.2v-1.6C22.2 9.6 22 8 22 8z" />
        <polygon points="10 9 15 12 10 15 10 9" fill="currentColor" stroke="none" />
      </>
    ),
    facebook: (
      <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
    ),
    x: (
      <>
        <path d="M4 4l16 16" />
        <path d="M20 4 4 20" />
      </>
    ),
    "map-pin": (
      <>
        <path d="M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z" />
        <circle cx="12" cy="10" r="3" />
      </>
    ),
    "chevron-right": (
      <polyline points="9 6 15 12 9 18" />
    ),
  };
  return <svg {...props}>{paths[name] || null}</svg>;
}

window.Icon = Icon;
