// shared/icons.jsx
// React icon components. 24x24 viewBox, currentColor stroke, 1.7 sw.
// Exposed as window.Icons for both variants.

(function () {
  const e = React.createElement;
  function makeIcon(paths) {
    return function Icon(props) {
      const { size = 22, sw = 1.7, fill = 'none', ...rest } = props || {};
      return e('svg', {
        width: size, height: size, viewBox: '0 0 24 24',
        fill, stroke: 'currentColor', strokeWidth: sw,
        strokeLinecap: 'round', strokeLinejoin: 'round',
        ...rest,
      }, paths);
    };
  }

  // Each entry is the inner JSX (returned as React elements via React.createElement).
  // Using fragments keeps things tidy.
  const I = {
    home:    e(React.Fragment, null, e('path', { d: 'M3 11l9-7 9 7v9a2 2 0 0 1-2 2h-3v-7H10v7H6a2 2 0 0 1-2-2v-9z' })),
    litter:  e(React.Fragment, null,
      e('path', { d: 'M4 18V9l8-5 8 5v9' }),
      e('path', { d: 'M4 18h16' }),
      e('path', { d: 'M9 18v-5h6v5' }),
      e('path', { d: 'M12 8v3' })),
    gift:    e(React.Fragment, null,
      e('rect', { x: 3, y: 8, width: 18, height: 13, rx: 1.5 }),
      e('path', { d: 'M3 12h18M12 8v13M8 8c0-2 1-3.5 4-3.5S16 6 16 8' })),
    mail:    e(React.Fragment, null,
      e('rect', { x: 3, y: 5, width: 18, height: 14, rx: 2 }),
      e('path', { d: 'M3 7l9 7 9-7' })),
    chat:    e(React.Fragment, null,
      e('path', { d: 'M5 4h14a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-8l-5 4v-4H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z' }),
      e('path', { d: 'M9.3 8.3c0-1.3 1.1-2.3 2.7-2.3s2.7 1 2.7 2.3c0 1.6-2 1.5-2 3.2M12 14v.4' })),
    heart:   e('path', { d: 'M12 20.5s-7-4.5-7-10A4 4 0 0 1 12 7a4 4 0 0 1 7 3.5c0 5.5-7 10-7 10z' }),
    menu:    e('path', { d: 'M4 6h16M4 12h16M4 18h16' }),
    close:   e('path', { d: 'M6 6l12 12M6 18L18 6' }),
    left:    e('path', { d: 'M15 18l-6-6 6-6' }),
    right:   e('path', { d: 'M9 6l6 6-6 6' }),
    zoom:    e(React.Fragment, null,
      e('circle', { cx: 11, cy: 11, r: 7 }),
      e('path', { d: 'M21 21l-4.5-4.5M11 8v6M8 11h6' })),
    check:   e('path', { d: 'M5 12l4 4 10-10' }),
    female:  e(React.Fragment, null,
      e('circle', { cx: 12, cy: 9, r: 5 }),
      e('path', { d: 'M12 14v7M9 18h6' })),
    male:    e(React.Fragment, null,
      e('circle', { cx: 10, cy: 14, r: 5 }),
      e('path', { d: 'M14 10l6-6M15 4h5v5' })),
    shield:  e('path', { d: 'M12 3l8 3v6c0 5-4 8-8 9-4-1-8-4-8-9V6l8-3z' }),
    cal:     e(React.Fragment, null,
      e('rect', { x: 3, y: 5, width: 18, height: 16, rx: 2 }),
      e('path', { d: 'M3 9h18M8 3v4M16 3v4' })),
    syringe: e('path', { d: 'M18 2l4 4M16 4l4 4M11 9l4 4M8 12l-5 5v4h4l5-5M13 7l4 4' }),
    blanket: e(React.Fragment, null,
      e('rect', { x: 4, y: 4, width: 16, height: 16, rx: 1.5 }),
      e('path', { d: 'M4 10h16M4 16h16M10 4v16M16 4v16' })),
    food:    e(React.Fragment, null,
      e('path', { d: 'M5 9c0-3 3-5 7-5s7 2 7 5' }),
      e('path', { d: 'M4 9h16l-2 11H6L4 9z' }),
      e('path', { d: 'M9 13v3M15 13v3' })),
    toy:     e(React.Fragment, null,
      e('circle', { cx: 7, cy: 12, r: 4 }),
      e('circle', { cx: 17, cy: 12, r: 4 }),
      e('path', { d: 'M11 12h2' })),
    folder:  e(React.Fragment, null,
      e('path', { d: 'M3 7c0-1 1-2 2-2h4l2 2h8c1 0 2 1 2 2v9c0 1-1 2-2 2H5c-1 0-2-1-2-2V7z' }),
      e('path', { d: 'M3 11h18' })),
    leash:   e(React.Fragment, null,
      e('circle', { cx: 6, cy: 6, r: 2.5 }),
      e('path', { d: 'M8 7c1 1 3 5 8 5 3 0 5 2 5 4M21 16v3M19 17h4' })),
    book:    e(React.Fragment, null,
      e('path', { d: 'M4 5c0-1 1-2 2-2h12v18H6c-1 0-2-1-2-2V5z' }),
      e('path', { d: 'M4 5v14c0 1 1 2 2 2M8 7h6M8 11h6' })),
    support: e(React.Fragment, null,
      e('circle', { cx: 12, cy: 12, r: 9 }),
      e('path', { d: 'M9 10c0-1.5 1-2.5 3-2.5s3 1 3 2.5c0 2.5-3 1.5-3 4M12 17v.5' })),
    loc:     e(React.Fragment, null,
      e('path', { d: 'M12 22s7-7 7-12a7 7 0 0 0-14 0c0 5 7 12 7 12z' }),
      e('circle', { cx: 12, cy: 10, r: 2.5 })),
    spark:   e('path', { d: 'M12 3v4M12 17v4M3 12h4M17 12h4M5.5 5.5l2.5 2.5M16 16l2.5 2.5M5.5 18.5L8 16M16 8l2.5-2.5' }),
    star:    e('path', { d: 'M12 3l2.7 5.5 6 .9-4.4 4.3 1 6L12 17l-5.4 2.7 1-6L3.3 9.4l6-.9L12 3z', fill: 'currentColor', stroke: 'none' }),
    arrow:   e('path', { d: 'M5 12h14M13 6l6 6-6 6' }),
    sun:     e(React.Fragment, null,
      e('circle', { cx: 12, cy: 12, r: 4 }),
      e('path', { d: 'M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6l1.4 1.4M17 17l1.4 1.4M5.6 18.4L7 17M17 7l1.4-1.4' })),
    paw:     e(React.Fragment, null,
      e('ellipse', { cx: 6, cy: 11, rx: 2, ry: 2.5 }),
      e('ellipse', { cx: 10, cy: 7, rx: 1.8, ry: 2.5 }),
      e('ellipse', { cx: 14, cy: 7, rx: 1.8, ry: 2.5 }),
      e('ellipse', { cx: 18, cy: 11, rx: 2, ry: 2.5 }),
      e('path', { d: 'M8 17.5c0-2.5 1.8-4.5 4-4.5s4 2 4 4.5c0 2-1.5 3-4 3s-4-1-4-3z' })),
  };

  const out = {};
  Object.keys(I).forEach(k => out[k] = makeIcon(I[k]));
  window.Icons = out;
})();