// Lightweight inline SVG icons. Stroke-based, SF Symbol-ish proportions.
// Pass `color` and `size`; default to currentColor/22.

const _ico = (paths, vb = '0 0 24 24', strokeProps = {}) =>
  function Icon({ color = 'currentColor', size = 22, fill = 'none', sw = 1.8, style }) {
    return (
      <svg width={size} height={size} viewBox={vb} fill={fill} style={style}
           stroke={fill === 'none' ? color : 'none'}
           strokeWidth={sw} strokeLinecap="round" strokeLinejoin="round" {...strokeProps}>
        {paths}
      </svg>
    );
  };

const IconHouse    = _ico(<><path d="M3 11l9-7 9 7v9a1 1 0 0 1-1 1h-5v-6h-6v6H4a1 1 0 0 1-1-1z"/></>);
const IconChat     = _ico(<><path d="M21 12c0 4.4-4 8-9 8-1.4 0-2.7-.3-3.9-.8L3 21l1.4-4.4C3.5 15.3 3 13.7 3 12c0-4.4 4-8 9-8s9 3.6 9 8z"/></>);
const IconRadar    = _ico(<><circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="5.5"/><circle cx="12" cy="12" r="2"/><path d="M12 3v18M3 12h18"/></>);
const IconHeart    = _ico(<><path d="M3.5 8.5L8.5 13.5L12 10L15.5 13.5L8.5 20.5L3.5 15.5z M14 4l3 3 3-3M17 7v12"/></>, '0 0 24 24', { strokeLinejoin: 'round' });
const IconPulse    = _ico(<><path d="M3 12h4l2-6 4 12 2-6h6"/></>);
const IconInbox    = _ico(<><path d="M3 13l3-8h12l3 8v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z M3 13h5l1.5 2.5h5L16 13h5"/></>);
const IconPlus     = _ico(<><path d="M12 5v14M5 12h14"/></>, '0 0 24 24', { strokeWidth: 2.2 });
const IconChevR    = _ico(<><path d="M9 6l6 6-6 6"/></>, '0 0 24 24', { strokeWidth: 2.2 });
const IconChevL    = _ico(<><path d="M15 6l-6 6 6 6"/></>, '0 0 24 24', { strokeWidth: 2.2 });
const IconChevDown = _ico(<><path d="M6 9l6 6 6-6"/></>, '0 0 24 24', { strokeWidth: 2.2 });
const IconClose    = _ico(<><path d="M6 6l12 12M18 6l-12 12"/></>, '0 0 24 24', { strokeWidth: 2 });
const IconSun      = _ico(<><circle cx="12" cy="12" r="4"/><path d="M12 2v3M12 19v3M4.2 4.2l2.1 2.1M17.7 17.7l2.1 2.1M2 12h3M19 12h3M4.2 19.8l2.1-2.1M17.7 6.3l2.1-2.1"/></>);
const IconMoon     = _ico(<><path d="M20 14.5A8 8 0 1 1 9.5 4a6.5 6.5 0 0 0 10.5 10.5z"/></>);
const IconBolt     = _ico(<><path d="M13 2L4 14h7l-1 8 9-12h-7l1-8z"/></>);
const IconBill     = _ico(<><rect x="4" y="3" width="16" height="18" rx="2"/><path d="M8 8h8M8 12h8M8 16h5"/></>);
const IconCart     = _ico(<><circle cx="9" cy="20" r="1.5"/><circle cx="18" cy="20" r="1.5"/><path d="M2 3h3l3 12h12l2-8H6"/></>);
const IconReply    = _ico(<><path d="M9 17l-5-5 5-5M4 12h11a5 5 0 0 1 5 5v3"/></>);
const IconCamera   = _ico(<><path d="M4 8h3l2-3h6l2 3h3a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z"/><circle cx="12" cy="13" r="3.5"/></>);
const IconMic      = _ico(<><rect x="9" y="2" width="6" height="13" rx="3"/><path d="M5 11a7 7 0 0 0 14 0M12 18v3"/></>);
const IconBookmark = _ico(<><path d="M6 3h12v18l-6-4-6 4z"/></>);
const IconNote     = _ico(<><path d="M5 3h11l4 4v13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z M14 3v5h5M8 12h8M8 16h6"/></>);
const IconCheck    = _ico(<><path d="M5 12l5 5L20 7"/></>, '0 0 24 24', { strokeWidth: 2.4 });
const IconPin      = _ico(<><path d="M12 2a6 6 0 0 1 6 6c0 4-6 13-6 13S6 12 6 8a6 6 0 0 1 6-6z"/><circle cx="12" cy="8" r="2"/></>);
const IconCloud    = _ico(<><path d="M7 18a4 4 0 1 1 1-7.9 5 5 0 0 1 9.7 1.4A3.5 3.5 0 0 1 17 18z"/></>);
const IconMusic    = _ico(<><path d="M9 18V5l11-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="17" cy="16" r="3"/></>);
const IconBed      = _ico(<><path d="M3 18V8M3 12h14a3 3 0 0 1 3 3v3M7 12V9a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v3"/></>);
const IconBrain    = _ico(<><path d="M9 4a3 3 0 0 0-3 3v.5a3 3 0 0 0-2 5.5 3 3 0 0 0 2 5v.5a3 3 0 0 0 6 0V4 M15 4a3 3 0 0 1 3 3v.5a3 3 0 0 1 2 5.5 3 3 0 0 1-2 5v.5a3 3 0 0 1-6 0"/></>);
const IconGhost    = _ico(<><path d="M5 20V10a7 7 0 0 1 14 0v10l-2-2-2 2-2-2-2 2-2-2-2 2-2-2z"/><circle cx="10" cy="11" r="1" fill="currentColor" stroke="none"/><circle cx="14" cy="11" r="1" fill="currentColor" stroke="none"/></>);
const IconLink     = _ico(<><path d="M10 14a4 4 0 0 0 5.7 0l3-3a4 4 0 1 0-5.7-5.7l-1.4 1.4M14 10a4 4 0 0 0-5.7 0l-3 3a4 4 0 1 0 5.7 5.7l1.4-1.4"/></>);
const IconDots     = _ico(<><circle cx="5" cy="12" r="1.5" fill="currentColor" stroke="none"/><circle cx="12" cy="12" r="1.5" fill="currentColor" stroke="none"/><circle cx="19" cy="12" r="1.5" fill="currentColor" stroke="none"/></>);
const IconSearch   = _ico(<><circle cx="11" cy="11" r="7"/><path d="M20 20l-3.5-3.5"/></>);
const IconArrowUp  = _ico(<><path d="M5 12l7-7 7 7M12 5v15"/></>, '0 0 24 24', { strokeWidth: 2.2 });
const IconCal      = _ico(<><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4"/></>);
const IconShield   = _ico(<><path d="M12 3l8 3v6c0 4.4-3.4 8.2-8 9-4.6-.8-8-4.6-8-9V6z"/></>);
const IconSparkle  = _ico(<><path d="M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8z M19 4l.7 1.8L21.5 6.5l-1.8.7L19 9l-.7-1.8L16.5 6.5l1.8-.7z"/></>);
const IconPeople   = _ico(<><circle cx="9" cy="7" r="3"/><path d="M3 20c0-3.3 2.7-6 6-6s6 2.7 6 6"/><circle cx="18" cy="8" r="2.5"/><path d="M22 20c0-2.8-1.8-5-4-5.5"/></>);

Object.assign(window, {
  IconHouse, IconChat, IconRadar, IconHeart, IconPulse, IconInbox,
  IconPlus, IconChevR, IconChevL, IconChevDown, IconClose,
  IconSun, IconMoon, IconBolt, IconBill, IconCart, IconReply,
  IconCamera, IconMic, IconBookmark, IconNote, IconCheck, IconPin,
  IconCloud, IconMusic, IconBed, IconBrain, IconGhost, IconLink,
  IconDots, IconSearch, IconArrowUp, IconCal, IconShield, IconSparkle,
  IconPeople,
});
